@@ -137,42 +137,15 @@ const multiTags = (function () {
137
137
color: inherit;
138
138
` ;
139
139
140
- const TagIcon = styled . span `
141
- display: inline-flex;
142
- align-items: center;
143
- margin-right: 4px;
144
-
145
- &.icon-right {
146
- margin-right: 0;
147
- margin-left: 4px;
148
- }
149
- ` ;
150
-
151
- const TagContent = styled . span `
152
- display: inline-flex;
153
- align-items: center;
154
- ` ;
155
-
156
-
157
-
158
140
const childrenMap = {
159
- options : TagsCompOptionsControl , // initial tags (PropertyView)
141
+ options : TagsCompOptionsControl ,
160
142
style : styleControl ( InputLikeStyle , "style" ) ,
161
143
onEvent : ButtonEventHandlerControl ,
162
- editable : BoolControl , // editable switch field
163
- preventDuplicates : BoolCodeControl , // runtime de-dupe
164
- allowEmptyEdits : BoolCodeControl , // allow blank labels on edit
165
- maxTags : BoolCodeControl , // truthy => 50 (or provide number if your control supports)
166
- selectedTagIndex : stateComp < number > ( - 1 ) , // tracks which tag was clicked (-1 = none)
167
- runtimeOptions : stateComp < JSONValue > ( [ ] ) , // runtime tags array for CRUD and saving
144
+ editable : BoolControl ,
145
+ selectedTagIndex : stateComp < number > ( - 1 ) ,
146
+ runtimeOptions : stateComp < JSONValue > ( [ ] ) ,
168
147
} ;
169
148
170
- const toMax = ( val : any ) : number | undefined => {
171
- if ( val === false || val === undefined || val === null ) return undefined ;
172
- if ( typeof val === "number" && ! Number . isNaN ( val ) && val > 0 ) return val ;
173
- if ( val === true ) return 50 ;
174
- return undefined ;
175
- } ;
176
149
177
150
return new UICompBuilder ( childrenMap , ( props , dispatch ) => {
178
151
const { message } = App . useApp ?.( ) || { message : { warning : ( ) => { } } as any } ;
@@ -183,10 +156,7 @@ const multiTags = (function () {
183
156
const [ editValue , setEditValue ] = useState < string > ( "" ) ;
184
157
const [ draft , setDraft ] = useState < string > ( "" ) ; // typing buffer for creating a new tag
185
158
const containerRef = useRef < HTMLDivElement > ( null ) ;
186
-
187
- const preventDuplicates = ! ! props . preventDuplicates ;
188
- const allowEmptyEdits = ! ! props . allowEmptyEdits ;
189
- const maxTags = toMax ( props . maxTags ) ;
159
+
190
160
191
161
192
162
const displayOptions = ( props as any ) . runtimeOptions ?. length && props . editable
@@ -215,14 +185,6 @@ const multiTags = (function () {
215
185
const addTag = ( raw : string ) => {
216
186
const label = normalize ( raw ) ;
217
187
if ( ! label ) return ;
218
- if ( maxTags && displayOptions . length >= maxTags ) {
219
- message ?. warning ?.( `Maximum ${ maxTags } tags allowed.` ) ;
220
- return ;
221
- }
222
- if ( preventDuplicates && exists ( label ) ) {
223
- message ?. warning ?.( "Duplicate tag." ) ;
224
- return ;
225
- }
226
188
const newTag : TagOption = {
227
189
label,
228
190
colorType : "default" ,
@@ -250,14 +212,6 @@ const multiTags = (function () {
250
212
251
213
const confirmEdit = ( index : number ) => {
252
214
const val = normalize ( editValue ) ;
253
- if ( ! val && ! allowEmptyEdits ) {
254
- cancelEdit ( ) ;
255
- return ;
256
- }
257
- if ( preventDuplicates && exists ( val , index ) ) {
258
- message ?. warning ?.( "Duplicate tag." ) ;
259
- return ;
260
- }
261
215
const prev = displayOptions [ index ] ?. label ?? "" ;
262
216
const next = displayOptions . map ( ( t , i ) => ( i === index ? { ...t , label : val } : t ) ) ;
263
217
dispatch ( changeChildAction ( "runtimeOptions" , next , false ) ) ;
@@ -386,22 +340,12 @@ const multiTags = (function () {
386
340
< >
387
341
< Section name = { sectionNames . basic } >
388
342
{ children . options . propertyView ( { label : "Initial Tags (PropertyView)" } ) }
389
- { children . editable . propertyView ( { label : "Editable" } ) }
390
- { children . preventDuplicates . propertyView ( { label : "Prevent Duplicates (Runtime)" } ) }
391
- { children . allowEmptyEdits . propertyView ( { label : "Allow Empty Edit (Runtime)" } ) }
392
- { children . maxTags . propertyView ( { label : "Set Max Tags (Runtime) — true=50" } ) }
343
+ { children . editable . propertyView ( { label : "Editable" } ) }
393
344
</ Section >
394
345
395
346
{ [ "logic" , "both" ] . includes ( useContext ( EditorContext ) . editorModeStatus ) && (
396
347
< Section name = { sectionNames . interaction } >
397
- { children . onEvent . getPropertyView ( {
398
- // Events:
399
- // "change" (payload.value = TagOption[]),
400
- // "add" (label, value),
401
- // "edit" (from, to, index, value),
402
- // "delete" (removed, index, value),
403
- // "click" (tag, index, value)
404
- } ) }
348
+ { children . onEvent . getPropertyView ( ) }
405
349
{ hiddenPropertyView ( children ) }
406
350
{ showDataLoadingIndicatorsPropertyView ( children ) }
407
351
</ Section >
@@ -432,25 +376,6 @@ export const MultiTagsComp = withExposingConfigs(
432
376
return null ;
433
377
}
434
378
} ) ,
435
- depsConfig ( {
436
- name : "selectedTagIndex" ,
437
- desc : "Index of currently selected tag (-1 if none)" ,
438
- depKeys : [ "selectedTagIndex" ] ,
439
- func : ( input ) => input . selectedTagIndex
440
- } ) ,
441
- depsConfig ( {
442
- name : "selectedTagLabel" ,
443
- desc : "Label of currently selected tag" ,
444
- depKeys : [ "selectedTagIndex" , "runtimeOptions" ] ,
445
- func : ( input ) => {
446
- const index = input . selectedTagIndex ;
447
- const options = Array . isArray ( input . runtimeOptions ) ? ( input . runtimeOptions as any [ ] ) : [ ] ;
448
- if ( index >= 0 && index < options . length ) {
449
- return options [ index ] ?. label || "" ;
450
- }
451
- return "" ;
452
- }
453
- } ) ,
454
379
depsConfig ( {
455
380
name : "options" ,
456
381
desc : "Current tags array (updates based on editable prop)" ,
0 commit comments