diff --git a/core/wiki/macros/tag-picker.tid b/core/wiki/macros/tag-picker.tid index 80086e4d3..4618285be 100644 --- a/core/wiki/macros/tag-picker.tid +++ b/core/wiki/macros/tag-picker.tid @@ -1,167 +1,182 @@ title: $:/core/macros/tag-picker -tags: $:/tags/Macro $:/tags/Global -first-search-filter: [tags[]!is[system]search:titlesort[]] -second-search-filter: [tags[]is[system]search:titlesort[]] +tags: tags: $:/tags/Macro $:/tags/Global +first-search-filter: [subfilter!is[system]search:titlesort[]] +second-search-filter: [subfilteris[system]search:titlesort[]] -\procedure get-tagpicker-focus-selector() -\function currentTiddlerCSSEscaped() [escapecss[]] -[data-tiddler-title=`$(currentTiddlerCSSEscaped)$`] .tc-add-tag-name input + + +\whitespace trim + + +\function tf.tagpicker-dropdown-id() + [] + [[$(saveTiddler)$-[$(tagField)$-$(tagListFilter)$]substitute[]sha256[]] +[join[/]] \end -\procedure delete-tag-state-tiddlers() <$action-deletetiddler $filter="[] [] []"/> +\function tf.tagpicker-dropdown-class() [sha256[]addprefix[tc-]] +\function tf.get-tagpicker-focus-selector() [addprefix[.]] .tc-popup-handle +[join[ ]] + + +\procedure delete-tag-state-tiddlers() +<$action-deletetiddler $filter="[] [] []"/> +\end + + \procedure add-tag-actions() -\whitespace trim -<$let tag=<>> -<$action-listops $tiddler=<> $field=<> $subfilter='+[toggletrim[]]'/> -<$list - filter="[] :intersection[getenlist-input[]]" - variable="ignore" - emptyMessage="<>" -/> - -<> -<$action-setfield $tiddler=<> text="yes"/> -\end - -\procedure clear-tags-actions-inner() -\whitespace trim -<$list - filter="[has[text]] ~[has[text]]" - variable="ignore" - emptyMessage="<>" -> +<$let tag=<<_tf.getTag>> > + <$action-listops $tiddler=<> $field=<> $subfilter='+[toggletrim[]]'/> + <% if [] :intersection[getenlist-input[]] %> + + <% else %> + <> + <% endif %> <> - + <$action-setfield $tiddler=<> text="yes"/> + +\end + + + +\procedure clear-tags-actions-inner() +<% if [has[text]] ~[has[text]] %> + <> +<% else %> + <> +<% endif %> \end + \procedure clear-tags-actions() -\whitespace trim -<$let userInput=<>> - <$list - filter="[get[text]!match]" - emptyMessage="<>" - > +<$let userInput=<<_tf.getUserInput>> > + + <$list filter="[get[text]!match]" > + <$list-empty> + <> + <$action-setfield $tiddler=<> text=<>/> <$action-setfield $tiddler=<> text="yes"/> \end + \procedure add-button-actions() <$action-listops $tiddler=<> $field=<> $subfilter="[trim[]]"/> <> <> -<$action-sendmessage $message="tm-focus-selector" $param=<>/> +<$action-sendmessage $message="tm-focus-selector" $param=<>/> \end + -\procedure list-tags(filter, suffix) -\whitespace trim -<$list - filter="[minlength{$:/config/Tags/MinLength}limit[1]]" - emptyMessage="
{{$:/language/Search/Search/TooShort}}
" variable="listItem" -> - <$list filter=<> variable="tag"> - <$let - button-classes=`tc-btn-invisible ${ [addsuffix] -[get[text]] :then[[]] ~tc-tag-button-selected }$` - currentTiddler=<> - > - {{||$:/core/ui/TagPickerTagTemplate}} - + +\procedure tag-picker-listTags(filter, suffix) +<$let userInput=<<_tf.getUserInput>> > + <$list filter="[minlength{$:/config/Tags/MinLength}limit[1]]" + emptyMessage="
{{$:/language/Search/Search/TooShort}}
" variable="listItem" + > + <$list filter=<> variable="tag"> + + + <$let currentTiddler=<> + button-classes=`tc-btn-invisible ${[addsuffix] -[get[text]] :then[[]] ~tc-tag-button-selected }$` + get-tagpicker-focus-selector=`${[]}$` + > + {{||$:/core/ui/TagPickerTagTemplate}} + + - + \end + \procedure tag-picker-inner() -\whitespace trim +
] +[join[ ]] }}}> +
+ + <$macrocall $name="keyboard-driven-input" + tiddler=<> + storeTitle=<> + refreshTitle=<> + selectionStateTitle=<> + inputAcceptActions=<> + inputCancelActions=<> + tag="input" + placeholder={{$:/language/EditTemplate/Tags/Add/Placeholder}} + focusPopup=<> + class="tc-edit-texteditor tc-popup-handle" + tabindex=<> + focus={{{ [{$:/config/AutoFocus}match[tags]then[true]] ~[[false]] }}} + filterMinLength={{$:/config/Tags/MinLength}} + cancelPopups=<> + configTiddlerFilter="[[$:/core/macros/tag-picker]]" + /> + + <$button popup=<> class="tc-btn-invisible tc-btn-dropdown" + tooltip={{$:/language/EditTemplate/Tags/Dropdown/Hint}} aria-label={{$:/language/EditTemplate/Tags/Dropdown/Caption}} + > + {{$:/core/images/down-arrow}} + + <% if [has[text]] %> + <$button actions=<> class="tc-btn-invisible tc-small-gap tc-btn-dropdown" + tooltip={{$:/language/EditTemplate/Tags/ClearInput/Hint}} aria-label={{$:/language/EditTemplate/Tags/ClearInput/Caption}} + > + {{$:/core/images/close-button}} + + <% endif %> + + <$let tag=<<_tf.getTag>>> + <$button set=<> actions=<> > + {{$:/language/EditTemplate/Tags/Add/Button}} + + + +
+
+ <% if [has[text]] %> +
+ <$macrocall $name="tag-picker-listTags" filter=<> suffix="-primaryList" /> +
+ <$macrocall $name="tag-picker-listTags" filter=<> suffix="-secondaryList" /> +
+ <% endif %> +
+
+\end + + +\procedure tag-picker(actions, tagField:"tags", tiddler, tagListFilter:"[tags[]]") + +\function _tf.getUserInput() [get[text]] +\function _tf.getTag() [get[text]] + + <$let - newTagNameInputTiddlerQualified=<> - newTagNameSelectionTiddlerQualified=<> - fallbackTarget={{{ [getindex[tag-background]] }}} + palette={{$:/palette}} colourA={{{ [getindex[foreground]] }}} colourB={{{ [getindex[background]] }}} + fallbackTarget={{{ [getindex[tag-background]] }}} - storeTitle={{{ [!match[]] ~[] }}} + saveTiddler={{{ [is[blank]thenelse] }}} + + newTagNameTiddler={{{ [[$:/temp/NewTagName]] [!match[tags]] +[join[/]] [] +[join[]] }}} + storeTitle={{{ [[$:/temp/NewTagName/input]] [!match[tags]] +[join[/]] [] +[join[]] }}} + + newTagNameSelectionTiddlerQualified=<> tagSelectionState={{{ [!match[]] ~[] }}} - tagAutoComplete=<> - refreshTitle=<> - nonSystemTagsFilter="[tags[]!is[system]search:titlesort[]]" - systemTagsFilter="[tags[]is[system]search:titlesort[]]" -> -
-
- - <$transclude - $variable="keyboard-driven-input" - tiddler=<> - storeTitle=<> - refreshTitle=<> - selectionStateTitle=<> - inputAcceptActions=<> - inputCancelActions=<> - tag="input" - placeholder={{$:/language/EditTemplate/Tags/Add/Placeholder}} - focusPopup=<> - class="tc-edit-texteditor tc-popup-handle" - tabindex=<> - focus={{{ [{$:/config/AutoFocus}match[tags]then[true]] ~[[false]] }}} - filterMinLength={{$:/config/Tags/MinLength}} - cancelPopups=<> - configTiddlerFilter="[[$:/core/macros/tag-picker]]" - /> - - <$button popup=<> - class="tc-btn-invisible tc-btn-dropdown" - tooltip={{$:/language/EditTemplate/Tags/Dropdown/Hint}} - aria-label={{$:/language/EditTemplate/Tags/Dropdown/Caption}} - > - {{$:/core/images/down-arrow}} - - <$reveal state=<> type="nomatch" text=""> - <$button actions=<> - class="tc-btn-invisible tc-small-gap tc-btn-dropdown" - tooltip={{$:/language/EditTemplate/Tags/ClearInput/Hint}} - aria-label={{$:/language/EditTemplate/Tags/ClearInput/Caption}} - > - {{$:/core/images/close-button}} - - - - <$let tag=<>> - <$button set=<> setTo="" - actions=<> - > - {{$:/language/EditTemplate/Tags/Add/Button}} - - - -
-
- <$reveal state=<> type="nomatch" text=""> -
- <$let userInput=<>> - <$transclude $variable="list-tags" filter=<> suffix="-primaryList" /> -
- <$transclude $variable="list-tags" filter=<> suffix="-secondaryList" /> - -
- -
-
- -\end + refreshTitle=<> -\procedure tag-picker(actions, tagField:"tags") -\function userInput() [get[text]] -\function tag() [get[text]] -\whitespace trim -<$let - saveTiddler=<> - palette={{$:/palette}} - qualified=<> - newTagNameTiddler={{{ [!match[]] ~[] }}} + nonSystemTagsFilter="[subfilter!is[system]search:titlesort[]]" + systemTagsFilter="[subfilteris[system]search:titlesort[]]" + + cancelPopups="yes" > - <$transclude $variable="tag-picker-inner" /> + <$macrocall $name="tag-picker-inner"/> -\end +\end \ No newline at end of file diff --git a/editions/tw5.com/tiddlers/macros/tag-picker_Macro.tid b/editions/tw5.com/tiddlers/macros/tag-picker_Macro.tid index bd67256c9..612b9365a 100644 --- a/editions/tw5.com/tiddlers/macros/tag-picker_Macro.tid +++ b/editions/tw5.com/tiddlers/macros/tag-picker_Macro.tid @@ -1,6 +1,6 @@ caption: tag-picker created: 20161128191316701 -modified: 20161128191435641 +modified: 20230616114543787 tags: Macros [[Core Macros]] title: tag-picker Macro type: text/vnd.tiddlywiki @@ -9,9 +9,17 @@ The <<.def tag-picker>> [[macro|Macros]] generates a combination of a text box a !! Parameters -;actions -: Action widgets to be triggered when the pill is clicked. Within the text, the variable ''tag'' contains the title of the selected tag. -;tagField -: <<.from-version 5.1.23>> The ''field'' that gets updated with the selected tag. Defaults to ''tags''. +; actions +: Action widgets to be triggered when the pill is clicked. Within the text, the variable <<.var tag>> contains the title of the selected tag. + +; tagField +: <<.from-version 5.1.23>> The specified ''field'' that gets updated with the selected tag. Defaults to `tags`. + +; tiddler +: <<.from-version 5.3.4>> Defines the target tiddler, which should be manipulated. Defaults to: <<.var currentTiddler>>. + +; tagListFilter +: <<.from-version 5.3.4>> This parameter defaults to: `[tags[]]` which creates a list of all existing tags. If the tag list should come from a different source the filter should look similar to eg: `[get[field-name]enlist-input[]]`. + <<.macro-examples "tag-picker">> diff --git a/editions/tw5.com/tiddlers/tag-picker Macro (Examples).tid b/editions/tw5.com/tiddlers/tag-picker Macro (Examples).tid new file mode 100644 index 000000000..1fc150dcc --- /dev/null +++ b/editions/tw5.com/tiddlers/tag-picker Macro (Examples).tid @@ -0,0 +1,69 @@ +created: 20230616104546608 +modified: 20240214174032498 +tags: [[tag-picker Macro]] [[Macro Examples]] +title: tag-picker Macro (Examples) +type: text/vnd.tiddlywiki + +<<.warning """The first example will set the tag of the <<.tid currentTiddler>> so you should copy / paste it to a new tiddler for testing. Otherwise you'll change "this tiddler" """>> + +<$macrocall $name=".example" n="1" +eg="""Use all existing tags and set the ''tags'' field here: <> +"""/> + +---- + +<$let transclusion=test> + +<<.tip """The following examples use a temporary tiddler: $:/temp/test/tag-picker. So this tiddler will not be changed """>> + + +<$macrocall $name=".example" n="2" +eg="""$:/temp/test/tag-picker ''tags'': <$text text={{{ [[$:/temp/test/tag-picker]get[tags]enlist-input[]join[, ]else[n/a]] }}}/> + +Use all existing tags and set the $:/temp/test/tag-picker ''tags'' field: <> +"""/> + +---- + +<<.tip """Use the following example to populate the $:/temp/test/tag-picker ''foo''-field, which are needed by some examples below """>> + +<$macrocall $name=".example" n="3" +eg="""$:/temp/test/tag-picker ''foo'': <$text text={{{ [[$:/temp/test/tag-picker]get[foo]enlist-input[]join[, ]else[n/a]] }}}/> + +Use all existing tags and set the $:/temp/test/tag-picker ''foo'' field: <> +"""/> + +---- + +<<.tip """The following example expects some values in the "foo" field of the tiddler $:/temp/test/tag-picker, which can be created by the example above.""">> + +<$macrocall $name=".example" n="4" eg="""\procedure listSource() $:/temp/test/tag-picker + +$:/temp/test/tag-picker foo: <$text text={{{ [[$:/temp/test/tag-picker]get[foo]enlist-input[]join[, ]else[n/a]] }}}/>
+$:/temp/test/tag-picker bar: <$text text={{{ [[$:/temp/test/tag-picker]get[bar]enlist-input[]join[, ]else[n/a]] }}}/> + +Use $:/temp/test/tag-picker ''foo'' field as source and set ''bar'': <get[foo]enlist-input[]]" tiddler:"$:/temp/test/tag-picker">> +"""/> + +---- + +<<.tip """The following example expects some values in the "foo" field of the tiddler $:/temp/test/tag-picker, which can be created by the example above.
+It will also add completely new tags to the bar-field and the source tiddlers foo-field. New tags can be entered by typing into the tag-name input +""">> + +<$macrocall $name=".example" n="5" eg=""" +\procedure listSource() $:/temp/test/tag-picker +\procedure listSourceField() foo + +\procedure addNewTagToSource() + <$action-listops $tiddler=<> $field=<> $subfilter='[getenlist-input[]] [trim[]]'/> +\end + +$:/temp/test/tag-picker foo: <$text text={{{ [[$:/temp/test/tag-picker]get[foo]enlist-input[]join[, ]else[n/a]] }}}/>
+$:/temp/test/tag-picker ''bar'': <$text text={{{ [[$:/temp/test/tag-picker]get[bar]enlist-input[]join[, ]else[n/a]] }}}/> + +Use $:/temp/test/tag-picker ''foo'' field as source and set ''bar'': <$macrocall $name="tag-picker" tagField="bar" tagListFilter="[getenlist-input[]]" tiddler="$:/temp/test/tag-picker" actions=<>/> + +"""/> + + \ No newline at end of file