@namroodinc/liquid-editorial 0.1.11 → 0.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/AGENTS.md +1 -1
- package/README.md +21 -15
- package/UPGRADING.md +30 -0
- package/dist/chunks/FormEditor-8bz3pOdP.cjs +2 -0
- package/dist/chunks/FormEditor-8bz3pOdP.cjs.map +1 -0
- package/dist/chunks/FormEditor-DuW8x78Y.js +330 -0
- package/dist/chunks/FormEditor-DuW8x78Y.js.map +1 -0
- package/dist/components/EntryPicker/index.cjs +1 -1
- package/dist/components/EntryPicker/index.cjs.map +1 -1
- package/dist/components/EntryPicker/index.d.cts +3 -1
- package/dist/components/EntryPicker/index.d.cts.map +1 -1
- package/dist/components/EntryPicker/index.d.ts +3 -1
- package/dist/components/EntryPicker/index.d.ts.map +1 -1
- package/dist/components/EntryPicker/index.js +45 -43
- package/dist/components/EntryPicker/index.js.map +1 -1
- package/dist/components/FormEditor/control.d.cts +15 -0
- package/dist/components/FormEditor/control.d.cts.map +1 -0
- package/dist/components/FormEditor/control.d.ts +15 -0
- package/dist/components/FormEditor/control.d.ts.map +1 -0
- package/dist/components/FormEditor/index.cjs +1 -0
- package/dist/components/FormEditor/index.d.cts +28 -0
- package/dist/components/FormEditor/index.d.cts.map +1 -0
- package/dist/components/FormEditor/index.d.ts +28 -0
- package/dist/components/FormEditor/index.d.ts.map +1 -0
- package/dist/components/FormEditor/index.js +2 -0
- package/dist/components/FormEditor/model.d.cts +86 -0
- package/dist/components/FormEditor/model.d.cts.map +1 -0
- package/dist/components/FormEditor/model.d.ts +86 -0
- package/dist/components/FormEditor/model.d.ts.map +1 -0
- package/dist/components/FormEditor/style.css +25 -0
- package/dist/components/NumberField/index.cjs +1 -1
- package/dist/components/NumberField/index.cjs.map +1 -1
- package/dist/components/NumberField/index.d.cts +3 -0
- package/dist/components/NumberField/index.d.cts.map +1 -1
- package/dist/components/NumberField/index.d.ts +3 -0
- package/dist/components/NumberField/index.d.ts.map +1 -1
- package/dist/components/NumberField/index.js +20 -20
- package/dist/components/NumberField/index.js.map +1 -1
- package/dist/components/RichTextEditor/index.cjs +1 -1
- package/dist/components/RichTextEditor/index.js +0 -1
- package/dist/index.cjs +1 -1
- package/dist/index.d.cts +2 -2
- package/dist/index.d.cts.map +1 -1
- package/dist/index.d.ts +2 -2
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +20 -20
- package/dist/styles.css +1 -1
- package/package.json +1 -1
- package/dist/chunks/EntryEditor-CcyYtH74.js +0 -191
- package/dist/chunks/EntryEditor-CcyYtH74.js.map +0 -1
- package/dist/chunks/EntryEditor-DIpc1iPF.cjs +0 -2
- package/dist/chunks/EntryEditor-DIpc1iPF.cjs.map +0 -1
- package/dist/components/EntryEditor/index.cjs +0 -1
- package/dist/components/EntryEditor/index.d.cts +0 -21
- package/dist/components/EntryEditor/index.d.cts.map +0 -1
- package/dist/components/EntryEditor/index.d.ts +0 -21
- package/dist/components/EntryEditor/index.d.ts.map +0 -1
- package/dist/components/EntryEditor/index.js +0 -6
- package/dist/components/EntryEditor/model.d.cts +0 -33
- package/dist/components/EntryEditor/model.d.cts.map +0 -1
- package/dist/components/EntryEditor/model.d.ts +0 -33
- package/dist/components/EntryEditor/model.d.ts.map +0 -1
- package/dist/components/EntryEditor/style.css +0 -8
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../chunks/Icon-CWsA1W83.cjs"),t=require("../Button/index.cjs"),n=require("../Modal/index.cjs"),r=require("../Badge/index.cjs"),i=require("../SearchField/index.cjs"),a=require("../SortableList/index.cjs");let o=require("react"),s=require("react/jsx-runtime");function c(...e){return e.filter(Boolean).join(` `)}function l(e,t){return!t||[e.title,e.subtitle,...e.keywords??[]].filter(Boolean).join(` `).toLowerCase().includes(t.toLowerCase())}function u({item:t}){return(0,s.jsx)(`span`,{className:`ds-entry__thumb`,children:t.imageUrl?(0,s.jsx)(`img`,{src:t.imageUrl,alt:``,loading:`lazy`}):(0,s.jsx)(e.t,{name:`file-text`,size:20})})}function d({items:d,value:f,defaultValue:p=[],onValueChange:m,mode:h=`multiple`,max:g,label:_=`Entries`,emptyLabel:v=`Nothing selected yet.`,addLabel:y=`Choose entries`,isReorderable:
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../../chunks/Icon-CWsA1W83.cjs"),t=require("../Button/index.cjs"),n=require("../Modal/index.cjs"),r=require("../Badge/index.cjs"),i=require("../SearchField/index.cjs"),a=require("../SortableList/index.cjs");let o=require("react"),s=require("react/jsx-runtime");function c(...e){return e.filter(Boolean).join(` `)}function l(e,t){return!t||[e.title,e.subtitle,...e.keywords??[]].filter(Boolean).join(` `).toLowerCase().includes(t.toLowerCase())}function u({item:t}){return(0,s.jsx)(`span`,{className:`ds-entry__thumb`,children:t.imageUrl?(0,s.jsx)(`img`,{src:t.imageUrl,alt:``,loading:`lazy`}):(0,s.jsx)(e.t,{name:`file-text`,size:20})})}function d({items:d,value:f,defaultValue:p=[],onValueChange:m,mode:h=`multiple`,max:g,label:_=`Entries`,emptyLabel:v=`Nothing selected yet.`,addLabel:y=`Choose entries`,itemLabel:b=`entry`,itemsLabel:x=`entries`,isReorderable:S=!0,isDisabled:C=!1,className:w}){let[T,E]=(0,o.useState)(p),D=f??T,[O,k]=(0,o.useState)(!1),[A,j]=(0,o.useState)(``),M=(0,o.useMemo)(()=>new Map(d.map(e=>[e.id,e])),[d]),N=(0,o.useMemo)(()=>d.filter(e=>l(e,A)),[d,A]),P=h===`multiple`&&g!==void 0&&D.length>=g,F=e=>{C||(f===void 0&&E(e),m?.(e))},I=e=>{h===`single`?(F(D[0]===e?[]:[e]),k(!1)):D.includes(e)?F(D.filter(t=>t!==e)):P||F([...D,e])},L=D.map(e=>M.get(e)??{id:e,title:e}),R=!C&&S&&h===`multiple`&&L.length>1,z=e=>(0,s.jsxs)(s.Fragment,{children:[(0,s.jsx)(u,{item:e}),(0,s.jsxs)(`span`,{className:`ds-entry__body`,children:[(0,s.jsx)(`span`,{className:`ds-entry__title`,children:e.title}),e.subtitle&&(0,s.jsx)(`span`,{className:`ds-entry__subtitle`,children:e.subtitle})]})]});return(0,s.jsxs)(`div`,{className:c(`ds-entry-picker`,w),children:[(0,s.jsxs)(`div`,{className:`ds-entry-picker__head`,children:[(0,s.jsx)(`span`,{className:`ds-entry-picker__label`,children:_}),(0,s.jsx)(r.Badge,{shape:`count`,children:D.length})]}),L.length===0?(0,s.jsx)(`p`,{className:`ds-entry-picker__empty`,children:v}):R?(0,s.jsx)(a.SortableList,{items:D,onReorder:F,renderDragOverlay:e=>{let t=M.get(e);return t?(0,s.jsx)(`div`,{className:`ds-entry`,children:z(t)}):null},children:L.map(e=>(0,s.jsx)(a.SortableListItem,{id:e.id,label:e.title,action:(0,s.jsx)(t.Button,{variant:`simple`,size:`sm`,isIconOnly:!0,iconStart:`x`,"aria-label":`Remove ${e.title}`,isDisabled:C,onClick:()=>F(D.filter(t=>t!==e.id))}),children:(0,s.jsx)(`div`,{className:`ds-entry`,children:z(e)})},e.id))}):(0,s.jsx)(`ul`,{className:`ds-entry-picker__list`,children:L.map(e=>(0,s.jsxs)(`li`,{className:`ds-entry-picker__row`,children:[(0,s.jsx)(`div`,{className:`ds-entry`,children:z(e)}),(0,s.jsx)(t.Button,{variant:`simple`,size:`sm`,isIconOnly:!0,iconStart:`x`,"aria-label":`Remove ${e.title}`,isDisabled:C,onClick:()=>F(D.filter(t=>t!==e.id))})]},e.id))}),(0,s.jsxs)(`div`,{className:`ds-entry-picker__actions`,children:[(0,s.jsx)(t.Button,{variant:`neutral`,size:`sm`,iconStart:`plus`,isDisabled:C,onClick:()=>k(!0),children:y}),D.length>0&&(0,s.jsx)(t.Button,{variant:`simple`,size:`sm`,isDisabled:C,onClick:()=>F([]),children:`Clear`})]}),(0,s.jsxs)(n.Modal,{isOpen:O,onClose:()=>k(!1),title:y,description:h===`single`?`Choose one ${b}.`:g===void 0?`Choose as many ${x} as you need.`:`Choose up to ${g} ${x}.`,footer:(0,s.jsx)(t.Button,{variant:`primary`,onClick:()=>k(!1),children:`Done`}),children:[(0,s.jsx)(`div`,{className:`ds-entry-picker__search`,children:(0,s.jsx)(i.SearchField,{value:A,placeholder:`Search ${x}`,onChange:e=>j(e.target.value),onClear:()=>j(``)})}),(0,s.jsxs)(`ul`,{className:`ds-entry-picker__results`,children:[N.map(n=>{let r=D.includes(n.id),i=C||n.isDisabled||!r&&P;return(0,s.jsx)(`li`,{children:(0,s.jsxs)(t.Button,{variant:r?`active`:`simple`,size:`lg`,className:`ds-entry-picker__result`,"aria-pressed":r,isDisabled:!!i,onClick:()=>I(n.id),children:[(0,s.jsx)(`span`,{className:`ds-entry`,children:z(n)}),r&&(0,s.jsx)(e.t,{name:`check`,size:20})]})},n.id)}),N.length===0&&(0,s.jsxs)(`li`,{className:`ds-entry-picker__no-results`,children:[`No `,x,` match “`,A,`”.`]})]})]})]})}exports.EntryPicker=d;
|
|
2
2
|
//# sourceMappingURL=index.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","names":["Icon","useState","useMemo","_Fragment","Badge","SortableList","SortableListItem","Button","Modal","SearchField","require_Icon","require_components_Button_index","require_components_Modal_index","require_components_Badge_index","require_components_SearchField_index","require_components_SortableList_index","react","react_jsx_runtime","cx","parts","matches","query","item","Thumb","EntryPicker","internal","setInternal","defaultValue","selected","value","isOpen","setOpen","setQuery","byId","items","results","atMax","mode","max","commit","isDisabled","next","onValueChange","toggle","id","chosen","canReorder","isReorderable","row","className","label","emptyLabel","addLabel","event","isSelected","isBlocked"],"sources":["../../../src/components/EntryPicker/index.tsx"],"sourcesContent":["import { useMemo, useState, type ReactNode } from \"react\";\nimport { Badge } from \"../Badge\";\nimport { Button } from \"../Button\";\nimport { Icon } from \"../Icon\";\nimport { Modal } from \"../Modal\";\nimport { SearchField } from \"../SearchField\";\nimport { SortableList, SortableListItem } from \"../SortableList\";\nimport \"./style.css\";\n\nfunction cx(...parts: (string | undefined | false)[]) {\n return parts.filter(Boolean).join(\" \");\n}\n\nexport interface EntryItem {\n id: string;\n title: string;\n /** Second line — a content type, a path, a file size. */\n subtitle?: string;\n /** Main image: an asset thumbnail, or the entry's hero. */\n imageUrl?: string;\n /** Words the search matches on top of the title and subtitle. */\n keywords?: string[];\n isDisabled?: boolean;\n}\n\nexport type EntryPickerMode = \"single\" | \"multiple\";\n\nexport interface EntryPickerProps {\n items: EntryItem[];\n /** Selected ids, in the order they will be stored. */\n value?: string[];\n defaultValue?: string[];\n onValueChange?: (value: string[]) => void;\n mode?: EntryPickerMode;\n /** Cap a multiple selection. Reaching it disables the unpicked rows. */\n max?: number;\n label?: string;\n /** Copy shown when nothing is picked yet. */\n emptyLabel?: string;\n addLabel?: string;\n /** Multiple selections are reorderable by default — the stored order is the shown order. */\n isReorderable?: boolean;\n isDisabled?: boolean;\n className?: string;\n}\n\nfunction matches(item: EntryItem, query: string) {\n if (!query) return true;\n const haystack = [item.title, item.subtitle, ...(item.keywords ?? [])]\n .filter(Boolean)\n .join(\" \")\n .toLowerCase();\n return haystack.includes(query.toLowerCase());\n}\n\nfunction Thumb({ item }: { item: EntryItem }) {\n return (\n <span className=\"ds-entry__thumb\">\n {item.imageUrl ? (\n <img src={item.imageUrl} alt=\"\" loading=\"lazy\" />\n ) : (\n <Icon name=\"file-text\" size={20} />\n )}\n </span>\n );\n}\n\n/**\n * Pick entries or assets out of a list. Search narrows it, a row toggles,\n * and a multiple selection keeps — and reorders — the order you chose.\n */\nexport function EntryPicker({\n items,\n value,\n defaultValue = [],\n onValueChange,\n mode = \"multiple\",\n max,\n label = \"Entries\",\n emptyLabel = \"Nothing selected yet.\",\n addLabel = \"Choose entries\",\n isReorderable = true,\n isDisabled = false,\n className,\n}: EntryPickerProps) {\n const [internal, setInternal] = useState<string[]>(defaultValue);\n const selected = value ?? internal;\n const [isOpen, setOpen] = useState(false);\n const [query, setQuery] = useState(\"\");\n\n const byId = useMemo(() => new Map(items.map((item) => [item.id, item])), [items]);\n const results = useMemo(() => items.filter((item) => matches(item, query)), [items, query]);\n const atMax = mode === \"multiple\" && max !== undefined && selected.length >= max;\n\n const commit = (next: string[]) => {\n if (isDisabled) return;\n if (value === undefined) setInternal(next);\n onValueChange?.(next);\n };\n\n const toggle = (id: string) => {\n if (mode === \"single\") {\n commit(selected[0] === id ? [] : [id]);\n setOpen(false);\n return;\n }\n if (selected.includes(id)) commit(selected.filter((item) => item !== id));\n else if (!atMax) commit([...selected, id]);\n };\n\n const chosen = selected.map((id) => byId.get(id) ?? { id, title: id });\n const canReorder = !isDisabled && isReorderable && mode === \"multiple\" && chosen.length > 1;\n\n const row = (item: EntryItem): ReactNode => (\n <>\n <Thumb item={item} />\n <span className=\"ds-entry__body\">\n <span className=\"ds-entry__title\">{item.title}</span>\n {item.subtitle && <span className=\"ds-entry__subtitle\">{item.subtitle}</span>}\n </span>\n </>\n );\n\n return (\n <div className={cx(\"ds-entry-picker\", className)}>\n <div className=\"ds-entry-picker__head\">\n <span className=\"ds-entry-picker__label\">{label}</span>\n <Badge shape=\"count\">{selected.length}</Badge>\n </div>\n\n {chosen.length === 0 ? (\n <p className=\"ds-entry-picker__empty\">{emptyLabel}</p>\n ) : canReorder ? (\n <SortableList\n items={selected}\n onReorder={commit}\n renderDragOverlay={(id) => {\n const item = byId.get(id);\n return item ? <div className=\"ds-entry\">{row(item)}</div> : null;\n }}\n >\n {chosen.map((item) => (\n <SortableListItem\n key={item.id}\n id={item.id}\n label={item.title}\n action={\n <Button\n variant=\"simple\"\n size=\"sm\"\n isIconOnly\n iconStart=\"x\"\n aria-label={`Remove ${item.title}`}\n isDisabled={isDisabled}\n onClick={() => commit(selected.filter((id) => id !== item.id))}\n />\n }\n >\n <div className=\"ds-entry\">{row(item)}</div>\n </SortableListItem>\n ))}\n </SortableList>\n ) : (\n <ul className=\"ds-entry-picker__list\">\n {chosen.map((item) => (\n <li key={item.id} className=\"ds-entry-picker__row\">\n <div className=\"ds-entry\">{row(item)}</div>\n <Button\n variant=\"simple\"\n size=\"sm\"\n isIconOnly\n iconStart=\"x\"\n aria-label={`Remove ${item.title}`}\n isDisabled={isDisabled}\n onClick={() => commit(selected.filter((id) => id !== item.id))}\n />\n </li>\n ))}\n </ul>\n )}\n\n <div className=\"ds-entry-picker__actions\">\n <Button\n variant=\"neutral\"\n size=\"sm\"\n iconStart=\"plus\"\n isDisabled={isDisabled}\n onClick={() => setOpen(true)}\n >\n {addLabel}\n </Button>\n {selected.length > 0 && (\n <Button variant=\"simple\" size=\"sm\" isDisabled={isDisabled} onClick={() => commit([])}>\n Clear\n </Button>\n )}\n </div>\n\n <Modal\n isOpen={isOpen}\n onClose={() => setOpen(false)}\n title={addLabel}\n description={\n mode === \"single\"\n ? \"Choose one entry.\"\n : max !== undefined\n ? `Choose up to ${max} entries.`\n : \"Choose as many entries as you need.\"\n }\n footer={\n <Button variant=\"primary\" onClick={() => setOpen(false)}>\n Done\n </Button>\n }\n >\n <div className=\"ds-entry-picker__search\">\n <SearchField\n value={query}\n placeholder=\"Search entries\"\n onChange={(event) => setQuery(event.target.value)}\n onClear={() => setQuery(\"\")}\n />\n </div>\n <ul className=\"ds-entry-picker__results\">\n {results.map((item) => {\n const isSelected = selected.includes(item.id);\n const isBlocked = isDisabled || item.isDisabled || (!isSelected && atMax);\n return (\n <li key={item.id}>\n <Button\n variant={isSelected ? \"active\" : \"simple\"}\n size=\"lg\"\n className=\"ds-entry-picker__result\"\n aria-pressed={isSelected}\n isDisabled={Boolean(isBlocked)}\n onClick={() => toggle(item.id)}\n >\n <span className=\"ds-entry\">{row(item)}</span>\n {isSelected && <Icon name=\"check\" size={20} />}\n </Button>\n </li>\n );\n })}\n {results.length === 0 && (\n <li className=\"ds-entry-picker__no-results\">No entries match “{query}”.</li>\n )}\n </ul>\n </Modal>\n </div>\n );\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.cjs","names":["Icon","useState","useMemo","_Fragment","Badge","SortableList","SortableListItem","Button","Modal","SearchField","require_Icon","require_components_Button_index","require_components_Modal_index","require_components_Badge_index","require_components_SearchField_index","require_components_SortableList_index","react","react_jsx_runtime","cx","parts","matches","query","item","Thumb","EntryPicker","internal","setInternal","defaultValue","selected","value","isOpen","setOpen","setQuery","byId","items","results","atMax","mode","max","commit","isDisabled","next","onValueChange","toggle","id","chosen","canReorder","isReorderable","row","className","label","emptyLabel","addLabel","itemLabel","itemsLabel","event","isSelected","isBlocked"],"sources":["../../../src/components/EntryPicker/index.tsx"],"sourcesContent":["import { useMemo, useState, type ReactNode } from \"react\";\nimport { Badge } from \"../Badge\";\nimport { Button } from \"../Button\";\nimport { Icon } from \"../Icon\";\nimport { Modal } from \"../Modal\";\nimport { SearchField } from \"../SearchField\";\nimport { SortableList, SortableListItem } from \"../SortableList\";\nimport \"./style.css\";\n\nfunction cx(...parts: (string | undefined | false)[]) {\n return parts.filter(Boolean).join(\" \");\n}\n\nexport interface EntryItem {\n id: string;\n title: string;\n /** Second line — a content type, a path, a file size. */\n subtitle?: string;\n /** Main image: an asset thumbnail, or the entry's hero. */\n imageUrl?: string;\n /** Words the search matches on top of the title and subtitle. */\n keywords?: string[];\n isDisabled?: boolean;\n}\n\nexport type EntryPickerMode = \"single\" | \"multiple\";\n\nexport interface EntryPickerProps {\n items: EntryItem[];\n /** Selected ids, in the order they will be stored. */\n value?: string[];\n defaultValue?: string[];\n onValueChange?: (value: string[]) => void;\n mode?: EntryPickerMode;\n /** Cap a multiple selection. Reaching it disables the unpicked rows. */\n max?: number;\n label?: string;\n /** Copy shown when nothing is picked yet. */\n emptyLabel?: string;\n addLabel?: string;\n itemLabel?: string;\n itemsLabel?: string;\n /** Multiple selections are reorderable by default — the stored order is the shown order. */\n isReorderable?: boolean;\n isDisabled?: boolean;\n className?: string;\n}\n\nfunction matches(item: EntryItem, query: string) {\n if (!query) return true;\n const haystack = [item.title, item.subtitle, ...(item.keywords ?? [])]\n .filter(Boolean)\n .join(\" \")\n .toLowerCase();\n return haystack.includes(query.toLowerCase());\n}\n\nfunction Thumb({ item }: { item: EntryItem }) {\n return (\n <span className=\"ds-entry__thumb\">\n {item.imageUrl ? (\n <img src={item.imageUrl} alt=\"\" loading=\"lazy\" />\n ) : (\n <Icon name=\"file-text\" size={20} />\n )}\n </span>\n );\n}\n\n/**\n * Pick entries or assets out of a list. Search narrows it, a row toggles,\n * and a multiple selection keeps — and reorders — the order you chose.\n */\nexport function EntryPicker({\n items,\n value,\n defaultValue = [],\n onValueChange,\n mode = \"multiple\",\n max,\n label = \"Entries\",\n emptyLabel = \"Nothing selected yet.\",\n addLabel = \"Choose entries\",\n itemLabel = \"entry\",\n itemsLabel = \"entries\",\n isReorderable = true,\n isDisabled = false,\n className,\n}: EntryPickerProps) {\n const [internal, setInternal] = useState<string[]>(defaultValue);\n const selected = value ?? internal;\n const [isOpen, setOpen] = useState(false);\n const [query, setQuery] = useState(\"\");\n\n const byId = useMemo(() => new Map(items.map((item) => [item.id, item])), [items]);\n const results = useMemo(() => items.filter((item) => matches(item, query)), [items, query]);\n const atMax = mode === \"multiple\" && max !== undefined && selected.length >= max;\n\n const commit = (next: string[]) => {\n if (isDisabled) return;\n if (value === undefined) setInternal(next);\n onValueChange?.(next);\n };\n\n const toggle = (id: string) => {\n if (mode === \"single\") {\n commit(selected[0] === id ? [] : [id]);\n setOpen(false);\n return;\n }\n if (selected.includes(id)) commit(selected.filter((item) => item !== id));\n else if (!atMax) commit([...selected, id]);\n };\n\n const chosen = selected.map((id) => byId.get(id) ?? { id, title: id });\n const canReorder = !isDisabled && isReorderable && mode === \"multiple\" && chosen.length > 1;\n\n const row = (item: EntryItem): ReactNode => (\n <>\n <Thumb item={item} />\n <span className=\"ds-entry__body\">\n <span className=\"ds-entry__title\">{item.title}</span>\n {item.subtitle && <span className=\"ds-entry__subtitle\">{item.subtitle}</span>}\n </span>\n </>\n );\n\n return (\n <div className={cx(\"ds-entry-picker\", className)}>\n <div className=\"ds-entry-picker__head\">\n <span className=\"ds-entry-picker__label\">{label}</span>\n <Badge shape=\"count\">{selected.length}</Badge>\n </div>\n\n {chosen.length === 0 ? (\n <p className=\"ds-entry-picker__empty\">{emptyLabel}</p>\n ) : canReorder ? (\n <SortableList\n items={selected}\n onReorder={commit}\n renderDragOverlay={(id) => {\n const item = byId.get(id);\n return item ? <div className=\"ds-entry\">{row(item)}</div> : null;\n }}\n >\n {chosen.map((item) => (\n <SortableListItem\n key={item.id}\n id={item.id}\n label={item.title}\n action={\n <Button\n variant=\"simple\"\n size=\"sm\"\n isIconOnly\n iconStart=\"x\"\n aria-label={`Remove ${item.title}`}\n isDisabled={isDisabled}\n onClick={() => commit(selected.filter((id) => id !== item.id))}\n />\n }\n >\n <div className=\"ds-entry\">{row(item)}</div>\n </SortableListItem>\n ))}\n </SortableList>\n ) : (\n <ul className=\"ds-entry-picker__list\">\n {chosen.map((item) => (\n <li key={item.id} className=\"ds-entry-picker__row\">\n <div className=\"ds-entry\">{row(item)}</div>\n <Button\n variant=\"simple\"\n size=\"sm\"\n isIconOnly\n iconStart=\"x\"\n aria-label={`Remove ${item.title}`}\n isDisabled={isDisabled}\n onClick={() => commit(selected.filter((id) => id !== item.id))}\n />\n </li>\n ))}\n </ul>\n )}\n\n <div className=\"ds-entry-picker__actions\">\n <Button\n variant=\"neutral\"\n size=\"sm\"\n iconStart=\"plus\"\n isDisabled={isDisabled}\n onClick={() => setOpen(true)}\n >\n {addLabel}\n </Button>\n {selected.length > 0 && (\n <Button variant=\"simple\" size=\"sm\" isDisabled={isDisabled} onClick={() => commit([])}>\n Clear\n </Button>\n )}\n </div>\n\n <Modal\n isOpen={isOpen}\n onClose={() => setOpen(false)}\n title={addLabel}\n description={\n mode === \"single\"\n ? `Choose one ${itemLabel}.`\n : max !== undefined\n ? `Choose up to ${max} ${itemsLabel}.`\n : `Choose as many ${itemsLabel} as you need.`\n }\n footer={\n <Button variant=\"primary\" onClick={() => setOpen(false)}>\n Done\n </Button>\n }\n >\n <div className=\"ds-entry-picker__search\">\n <SearchField\n value={query}\n placeholder={`Search ${itemsLabel}`}\n onChange={(event) => setQuery(event.target.value)}\n onClear={() => setQuery(\"\")}\n />\n </div>\n <ul className=\"ds-entry-picker__results\">\n {results.map((item) => {\n const isSelected = selected.includes(item.id);\n const isBlocked = isDisabled || item.isDisabled || (!isSelected && atMax);\n return (\n <li key={item.id}>\n <Button\n variant={isSelected ? \"active\" : \"simple\"}\n size=\"lg\"\n className=\"ds-entry-picker__result\"\n aria-pressed={isSelected}\n isDisabled={Boolean(isBlocked)}\n onClick={() => toggle(item.id)}\n >\n <span className=\"ds-entry\">{row(item)}</span>\n {isSelected && <Icon name=\"check\" size={20} />}\n </Button>\n </li>\n );\n })}\n {results.length === 0 && (\n <li className=\"ds-entry-picker__no-results\">No {itemsLabel} match “{query}”.</li>\n )}\n </ul>\n </Modal>\n </div>\n );\n}\n"],"mappings":"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"}
|
|
@@ -23,6 +23,8 @@ export interface EntryPickerProps {
|
|
|
23
23
|
/** Copy shown when nothing is picked yet. */
|
|
24
24
|
emptyLabel?: string;
|
|
25
25
|
addLabel?: string;
|
|
26
|
+
itemLabel?: string;
|
|
27
|
+
itemsLabel?: string;
|
|
26
28
|
/** Multiple selections are reorderable by default — the stored order is the shown order. */
|
|
27
29
|
isReorderable?: boolean;
|
|
28
30
|
isDisabled?: boolean;
|
|
@@ -32,5 +34,5 @@ export interface EntryPickerProps {
|
|
|
32
34
|
* Pick entries or assets out of a list. Search narrows it, a row toggles,
|
|
33
35
|
* and a multiple selection keeps — and reorders — the order you chose.
|
|
34
36
|
*/
|
|
35
|
-
export declare function EntryPicker({ items, value, defaultValue, onValueChange, mode, max, label, emptyLabel, addLabel, isReorderable, isDisabled, className, }: EntryPickerProps): import("react").JSX.Element;
|
|
37
|
+
export declare function EntryPicker({ items, value, defaultValue, onValueChange, mode, max, label, emptyLabel, addLabel, itemLabel, itemsLabel, isReorderable, isDisabled, className, }: EntryPickerProps): import("react").JSX.Element;
|
|
36
38
|
//# sourceMappingURL=index.d.cts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/EntryPicker/index.tsx"],"names":[],"mappings":"AAOA,OAAO,aAAa,CAAC;AAMrB,MAAM,WAAW,SAAS;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,yDAAyD;IACzD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iEAAiE;IACjE,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,MAAM,eAAe,GAAG,QAAQ,GAAG,UAAU,CAAC;AAEpD,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,SAAS,EAAE,CAAC;IACnB,sDAAsD;IACtD,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC1C,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,wEAAwE;IACxE,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,6CAA6C;IAC7C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,4FAA4F;IAC5F,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAuBD;;;GAGG;AACH,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,KAAK,EACL,YAAiB,EACjB,aAAa,EACb,IAAiB,EACjB,GAAG,EACH,KAAiB,EACjB,UAAoC,EACpC,QAA2B,EAC3B,aAAoB,EACpB,UAAkB,EAClB,SAAS,GACV,EAAE,gBAAgB,+BAsKlB"}
|
|
1
|
+
{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/EntryPicker/index.tsx"],"names":[],"mappings":"AAOA,OAAO,aAAa,CAAC;AAMrB,MAAM,WAAW,SAAS;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,yDAAyD;IACzD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iEAAiE;IACjE,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,MAAM,eAAe,GAAG,QAAQ,GAAG,UAAU,CAAC;AAEpD,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,SAAS,EAAE,CAAC;IACnB,sDAAsD;IACtD,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC1C,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,wEAAwE;IACxE,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,6CAA6C;IAC7C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,4FAA4F;IAC5F,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAuBD;;;GAGG;AACH,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,KAAK,EACL,YAAiB,EACjB,aAAa,EACb,IAAiB,EACjB,GAAG,EACH,KAAiB,EACjB,UAAoC,EACpC,QAA2B,EAC3B,SAAmB,EACnB,UAAsB,EACtB,aAAoB,EACpB,UAAkB,EAClB,SAAS,GACV,EAAE,gBAAgB,+BAsKlB"}
|
|
@@ -23,6 +23,8 @@ export interface EntryPickerProps {
|
|
|
23
23
|
/** Copy shown when nothing is picked yet. */
|
|
24
24
|
emptyLabel?: string;
|
|
25
25
|
addLabel?: string;
|
|
26
|
+
itemLabel?: string;
|
|
27
|
+
itemsLabel?: string;
|
|
26
28
|
/** Multiple selections are reorderable by default — the stored order is the shown order. */
|
|
27
29
|
isReorderable?: boolean;
|
|
28
30
|
isDisabled?: boolean;
|
|
@@ -32,5 +34,5 @@ export interface EntryPickerProps {
|
|
|
32
34
|
* Pick entries or assets out of a list. Search narrows it, a row toggles,
|
|
33
35
|
* and a multiple selection keeps — and reorders — the order you chose.
|
|
34
36
|
*/
|
|
35
|
-
export declare function EntryPicker({ items, value, defaultValue, onValueChange, mode, max, label, emptyLabel, addLabel, isReorderable, isDisabled, className, }: EntryPickerProps): import("react").JSX.Element;
|
|
37
|
+
export declare function EntryPicker({ items, value, defaultValue, onValueChange, mode, max, label, emptyLabel, addLabel, itemLabel, itemsLabel, isReorderable, isDisabled, className, }: EntryPickerProps): import("react").JSX.Element;
|
|
36
38
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/EntryPicker/index.tsx"],"names":[],"mappings":"AAOA,OAAO,aAAa,CAAC;AAMrB,MAAM,WAAW,SAAS;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,yDAAyD;IACzD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iEAAiE;IACjE,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,MAAM,eAAe,GAAG,QAAQ,GAAG,UAAU,CAAC;AAEpD,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,SAAS,EAAE,CAAC;IACnB,sDAAsD;IACtD,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC1C,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,wEAAwE;IACxE,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,6CAA6C;IAC7C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,4FAA4F;IAC5F,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAuBD;;;GAGG;AACH,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,KAAK,EACL,YAAiB,EACjB,aAAa,EACb,IAAiB,EACjB,GAAG,EACH,KAAiB,EACjB,UAAoC,EACpC,QAA2B,EAC3B,aAAoB,EACpB,UAAkB,EAClB,SAAS,GACV,EAAE,gBAAgB,+BAsKlB"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/EntryPicker/index.tsx"],"names":[],"mappings":"AAOA,OAAO,aAAa,CAAC;AAMrB,MAAM,WAAW,SAAS;IACxB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,yDAAyD;IACzD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iEAAiE;IACjE,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,MAAM,MAAM,eAAe,GAAG,QAAQ,GAAG,UAAU,CAAC;AAEpD,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,SAAS,EAAE,CAAC;IACnB,sDAAsD;IACtD,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IAC1C,IAAI,CAAC,EAAE,eAAe,CAAC;IACvB,wEAAwE;IACxE,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,6CAA6C;IAC7C,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,4FAA4F;IAC5F,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAuBD;;;GAGG;AACH,wBAAgB,WAAW,CAAC,EAC1B,KAAK,EACL,KAAK,EACL,YAAiB,EACjB,aAAa,EACb,IAAiB,EACjB,GAAG,EACH,KAAiB,EACjB,UAAoC,EACpC,QAA2B,EAC3B,SAAmB,EACnB,UAAsB,EACtB,aAAoB,EACpB,UAAkB,EAClB,SAAS,GACV,EAAE,gBAAgB,+BAsKlB"}
|
|
@@ -30,15 +30,15 @@ function m({ item: t }) {
|
|
|
30
30
|
})
|
|
31
31
|
});
|
|
32
32
|
}
|
|
33
|
-
function h({ items: h, value: g, defaultValue: _ = [], onValueChange: v, mode: y = "multiple", max: b, label: x = "Entries", emptyLabel: S = "Nothing selected yet.", addLabel: C = "Choose entries",
|
|
34
|
-
let [
|
|
35
|
-
|
|
36
|
-
},
|
|
37
|
-
y === "single" ? (
|
|
38
|
-
},
|
|
33
|
+
function h({ items: h, value: g, defaultValue: _ = [], onValueChange: v, mode: y = "multiple", max: b, label: x = "Entries", emptyLabel: S = "Nothing selected yet.", addLabel: C = "Choose entries", itemLabel: w = "entry", itemsLabel: T = "entries", isReorderable: E = !0, isDisabled: D = !1, className: O }) {
|
|
34
|
+
let [k, A] = c(_), j = g ?? k, [M, N] = c(!1), [P, F] = c(""), I = s(() => new Map(h.map((e) => [e.id, e])), [h]), L = s(() => h.filter((e) => p(e, P)), [h, P]), R = y === "multiple" && b !== void 0 && j.length >= b, z = (e) => {
|
|
35
|
+
D || (g === void 0 && A(e), v?.(e));
|
|
36
|
+
}, B = (e) => {
|
|
37
|
+
y === "single" ? (z(j[0] === e ? [] : [e]), N(!1)) : j.includes(e) ? z(j.filter((t) => t !== e)) : R || z([...j, e]);
|
|
38
|
+
}, V = j.map((e) => I.get(e) ?? {
|
|
39
39
|
id: e,
|
|
40
40
|
title: e
|
|
41
|
-
}),
|
|
41
|
+
}), H = !D && E && y === "multiple" && V.length > 1, U = (e) => /* @__PURE__ */ d(l, { children: [/* @__PURE__ */ u(m, { item: e }), /* @__PURE__ */ d("span", {
|
|
42
42
|
className: "ds-entry__body",
|
|
43
43
|
children: [/* @__PURE__ */ u("span", {
|
|
44
44
|
className: "ds-entry__title",
|
|
@@ -49,7 +49,7 @@ function h({ items: h, value: g, defaultValue: _ = [], onValueChange: v, mode: y
|
|
|
49
49
|
})]
|
|
50
50
|
})] });
|
|
51
51
|
return /* @__PURE__ */ d("div", {
|
|
52
|
-
className: f("ds-entry-picker",
|
|
52
|
+
className: f("ds-entry-picker", O),
|
|
53
53
|
children: [
|
|
54
54
|
/* @__PURE__ */ d("div", {
|
|
55
55
|
className: "ds-entry-picker__head",
|
|
@@ -58,23 +58,23 @@ function h({ items: h, value: g, defaultValue: _ = [], onValueChange: v, mode: y
|
|
|
58
58
|
children: x
|
|
59
59
|
}), /* @__PURE__ */ u(r, {
|
|
60
60
|
shape: "count",
|
|
61
|
-
children:
|
|
61
|
+
children: j.length
|
|
62
62
|
})]
|
|
63
63
|
}),
|
|
64
|
-
|
|
64
|
+
V.length === 0 ? /* @__PURE__ */ u("p", {
|
|
65
65
|
className: "ds-entry-picker__empty",
|
|
66
66
|
children: S
|
|
67
|
-
}) :
|
|
68
|
-
items:
|
|
69
|
-
onReorder:
|
|
67
|
+
}) : H ? /* @__PURE__ */ u(a, {
|
|
68
|
+
items: j,
|
|
69
|
+
onReorder: z,
|
|
70
70
|
renderDragOverlay: (e) => {
|
|
71
|
-
let t =
|
|
71
|
+
let t = I.get(e);
|
|
72
72
|
return t ? /* @__PURE__ */ u("div", {
|
|
73
73
|
className: "ds-entry",
|
|
74
|
-
children:
|
|
74
|
+
children: U(t)
|
|
75
75
|
}) : null;
|
|
76
76
|
},
|
|
77
|
-
children:
|
|
77
|
+
children: V.map((e) => /* @__PURE__ */ u(o, {
|
|
78
78
|
id: e.id,
|
|
79
79
|
label: e.title,
|
|
80
80
|
action: /* @__PURE__ */ u(t, {
|
|
@@ -83,29 +83,29 @@ function h({ items: h, value: g, defaultValue: _ = [], onValueChange: v, mode: y
|
|
|
83
83
|
isIconOnly: !0,
|
|
84
84
|
iconStart: "x",
|
|
85
85
|
"aria-label": `Remove ${e.title}`,
|
|
86
|
-
isDisabled:
|
|
87
|
-
onClick: () =>
|
|
86
|
+
isDisabled: D,
|
|
87
|
+
onClick: () => z(j.filter((t) => t !== e.id))
|
|
88
88
|
}),
|
|
89
89
|
children: /* @__PURE__ */ u("div", {
|
|
90
90
|
className: "ds-entry",
|
|
91
|
-
children:
|
|
91
|
+
children: U(e)
|
|
92
92
|
})
|
|
93
93
|
}, e.id))
|
|
94
94
|
}) : /* @__PURE__ */ u("ul", {
|
|
95
95
|
className: "ds-entry-picker__list",
|
|
96
|
-
children:
|
|
96
|
+
children: V.map((e) => /* @__PURE__ */ d("li", {
|
|
97
97
|
className: "ds-entry-picker__row",
|
|
98
98
|
children: [/* @__PURE__ */ u("div", {
|
|
99
99
|
className: "ds-entry",
|
|
100
|
-
children:
|
|
100
|
+
children: U(e)
|
|
101
101
|
}), /* @__PURE__ */ u(t, {
|
|
102
102
|
variant: "simple",
|
|
103
103
|
size: "sm",
|
|
104
104
|
isIconOnly: !0,
|
|
105
105
|
iconStart: "x",
|
|
106
106
|
"aria-label": `Remove ${e.title}`,
|
|
107
|
-
isDisabled:
|
|
108
|
-
onClick: () =>
|
|
107
|
+
isDisabled: D,
|
|
108
|
+
onClick: () => z(j.filter((t) => t !== e.id))
|
|
109
109
|
})]
|
|
110
110
|
}, e.id))
|
|
111
111
|
}),
|
|
@@ -115,59 +115,61 @@ function h({ items: h, value: g, defaultValue: _ = [], onValueChange: v, mode: y
|
|
|
115
115
|
variant: "neutral",
|
|
116
116
|
size: "sm",
|
|
117
117
|
iconStart: "plus",
|
|
118
|
-
isDisabled:
|
|
119
|
-
onClick: () =>
|
|
118
|
+
isDisabled: D,
|
|
119
|
+
onClick: () => N(!0),
|
|
120
120
|
children: C
|
|
121
|
-
}),
|
|
121
|
+
}), j.length > 0 && /* @__PURE__ */ u(t, {
|
|
122
122
|
variant: "simple",
|
|
123
123
|
size: "sm",
|
|
124
|
-
isDisabled:
|
|
125
|
-
onClick: () =>
|
|
124
|
+
isDisabled: D,
|
|
125
|
+
onClick: () => z([]),
|
|
126
126
|
children: "Clear"
|
|
127
127
|
})]
|
|
128
128
|
}),
|
|
129
129
|
/* @__PURE__ */ d(n, {
|
|
130
|
-
isOpen:
|
|
131
|
-
onClose: () =>
|
|
130
|
+
isOpen: M,
|
|
131
|
+
onClose: () => N(!1),
|
|
132
132
|
title: C,
|
|
133
|
-
description: y === "single" ?
|
|
133
|
+
description: y === "single" ? `Choose one ${w}.` : b === void 0 ? `Choose as many ${T} as you need.` : `Choose up to ${b} ${T}.`,
|
|
134
134
|
footer: /* @__PURE__ */ u(t, {
|
|
135
135
|
variant: "primary",
|
|
136
|
-
onClick: () =>
|
|
136
|
+
onClick: () => N(!1),
|
|
137
137
|
children: "Done"
|
|
138
138
|
}),
|
|
139
139
|
children: [/* @__PURE__ */ u("div", {
|
|
140
140
|
className: "ds-entry-picker__search",
|
|
141
141
|
children: /* @__PURE__ */ u(i, {
|
|
142
|
-
value:
|
|
143
|
-
placeholder:
|
|
144
|
-
onChange: (e) =>
|
|
145
|
-
onClear: () =>
|
|
142
|
+
value: P,
|
|
143
|
+
placeholder: `Search ${T}`,
|
|
144
|
+
onChange: (e) => F(e.target.value),
|
|
145
|
+
onClear: () => F("")
|
|
146
146
|
})
|
|
147
147
|
}), /* @__PURE__ */ d("ul", {
|
|
148
148
|
className: "ds-entry-picker__results",
|
|
149
|
-
children: [
|
|
150
|
-
let r =
|
|
149
|
+
children: [L.map((n) => {
|
|
150
|
+
let r = j.includes(n.id), i = D || n.isDisabled || !r && R;
|
|
151
151
|
return /* @__PURE__ */ u("li", { children: /* @__PURE__ */ d(t, {
|
|
152
152
|
variant: r ? "active" : "simple",
|
|
153
153
|
size: "lg",
|
|
154
154
|
className: "ds-entry-picker__result",
|
|
155
155
|
"aria-pressed": r,
|
|
156
156
|
isDisabled: !!i,
|
|
157
|
-
onClick: () =>
|
|
157
|
+
onClick: () => B(n.id),
|
|
158
158
|
children: [/* @__PURE__ */ u("span", {
|
|
159
159
|
className: "ds-entry",
|
|
160
|
-
children:
|
|
160
|
+
children: U(n)
|
|
161
161
|
}), r && /* @__PURE__ */ u(e, {
|
|
162
162
|
name: "check",
|
|
163
163
|
size: 20
|
|
164
164
|
})]
|
|
165
165
|
}) }, n.id);
|
|
166
|
-
}),
|
|
166
|
+
}), L.length === 0 && /* @__PURE__ */ d("li", {
|
|
167
167
|
className: "ds-entry-picker__no-results",
|
|
168
168
|
children: [
|
|
169
|
-
"No
|
|
170
|
-
|
|
169
|
+
"No ",
|
|
170
|
+
T,
|
|
171
|
+
" match “",
|
|
172
|
+
P,
|
|
171
173
|
"”."
|
|
172
174
|
]
|
|
173
175
|
})]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["_Fragment","Icon","Fragment$1","cx","parts","matches","query","item","Thumb","EntryPicker","internal","setInternal","useState","defaultValue","selected","value","isOpen","setOpen","setQuery","byId","useMemo","items","results","atMax","mode","max","commit","isDisabled","next","onValueChange","toggle","id","chosen","canReorder","isReorderable","row","className","label","Badge","emptyLabel","SortableList","SortableListItem","Button","addLabel","Modal","SearchField","event","isSelected","isBlocked"],"sources":["../../../src/components/EntryPicker/index.tsx"],"sourcesContent":["import { useMemo, useState, type ReactNode } from \"react\";\nimport { Badge } from \"../Badge\";\nimport { Button } from \"../Button\";\nimport { Icon } from \"../Icon\";\nimport { Modal } from \"../Modal\";\nimport { SearchField } from \"../SearchField\";\nimport { SortableList, SortableListItem } from \"../SortableList\";\nimport \"./style.css\";\n\nfunction cx(...parts: (string | undefined | false)[]) {\n return parts.filter(Boolean).join(\" \");\n}\n\nexport interface EntryItem {\n id: string;\n title: string;\n /** Second line — a content type, a path, a file size. */\n subtitle?: string;\n /** Main image: an asset thumbnail, or the entry's hero. */\n imageUrl?: string;\n /** Words the search matches on top of the title and subtitle. */\n keywords?: string[];\n isDisabled?: boolean;\n}\n\nexport type EntryPickerMode = \"single\" | \"multiple\";\n\nexport interface EntryPickerProps {\n items: EntryItem[];\n /** Selected ids, in the order they will be stored. */\n value?: string[];\n defaultValue?: string[];\n onValueChange?: (value: string[]) => void;\n mode?: EntryPickerMode;\n /** Cap a multiple selection. Reaching it disables the unpicked rows. */\n max?: number;\n label?: string;\n /** Copy shown when nothing is picked yet. */\n emptyLabel?: string;\n addLabel?: string;\n /** Multiple selections are reorderable by default — the stored order is the shown order. */\n isReorderable?: boolean;\n isDisabled?: boolean;\n className?: string;\n}\n\nfunction matches(item: EntryItem, query: string) {\n if (!query) return true;\n const haystack = [item.title, item.subtitle, ...(item.keywords ?? [])]\n .filter(Boolean)\n .join(\" \")\n .toLowerCase();\n return haystack.includes(query.toLowerCase());\n}\n\nfunction Thumb({ item }: { item: EntryItem }) {\n return (\n <span className=\"ds-entry__thumb\">\n {item.imageUrl ? (\n <img src={item.imageUrl} alt=\"\" loading=\"lazy\" />\n ) : (\n <Icon name=\"file-text\" size={20} />\n )}\n </span>\n );\n}\n\n/**\n * Pick entries or assets out of a list. Search narrows it, a row toggles,\n * and a multiple selection keeps — and reorders — the order you chose.\n */\nexport function EntryPicker({\n items,\n value,\n defaultValue = [],\n onValueChange,\n mode = \"multiple\",\n max,\n label = \"Entries\",\n emptyLabel = \"Nothing selected yet.\",\n addLabel = \"Choose entries\",\n isReorderable = true,\n isDisabled = false,\n className,\n}: EntryPickerProps) {\n const [internal, setInternal] = useState<string[]>(defaultValue);\n const selected = value ?? internal;\n const [isOpen, setOpen] = useState(false);\n const [query, setQuery] = useState(\"\");\n\n const byId = useMemo(() => new Map(items.map((item) => [item.id, item])), [items]);\n const results = useMemo(() => items.filter((item) => matches(item, query)), [items, query]);\n const atMax = mode === \"multiple\" && max !== undefined && selected.length >= max;\n\n const commit = (next: string[]) => {\n if (isDisabled) return;\n if (value === undefined) setInternal(next);\n onValueChange?.(next);\n };\n\n const toggle = (id: string) => {\n if (mode === \"single\") {\n commit(selected[0] === id ? [] : [id]);\n setOpen(false);\n return;\n }\n if (selected.includes(id)) commit(selected.filter((item) => item !== id));\n else if (!atMax) commit([...selected, id]);\n };\n\n const chosen = selected.map((id) => byId.get(id) ?? { id, title: id });\n const canReorder = !isDisabled && isReorderable && mode === \"multiple\" && chosen.length > 1;\n\n const row = (item: EntryItem): ReactNode => (\n <>\n <Thumb item={item} />\n <span className=\"ds-entry__body\">\n <span className=\"ds-entry__title\">{item.title}</span>\n {item.subtitle && <span className=\"ds-entry__subtitle\">{item.subtitle}</span>}\n </span>\n </>\n );\n\n return (\n <div className={cx(\"ds-entry-picker\", className)}>\n <div className=\"ds-entry-picker__head\">\n <span className=\"ds-entry-picker__label\">{label}</span>\n <Badge shape=\"count\">{selected.length}</Badge>\n </div>\n\n {chosen.length === 0 ? (\n <p className=\"ds-entry-picker__empty\">{emptyLabel}</p>\n ) : canReorder ? (\n <SortableList\n items={selected}\n onReorder={commit}\n renderDragOverlay={(id) => {\n const item = byId.get(id);\n return item ? <div className=\"ds-entry\">{row(item)}</div> : null;\n }}\n >\n {chosen.map((item) => (\n <SortableListItem\n key={item.id}\n id={item.id}\n label={item.title}\n action={\n <Button\n variant=\"simple\"\n size=\"sm\"\n isIconOnly\n iconStart=\"x\"\n aria-label={`Remove ${item.title}`}\n isDisabled={isDisabled}\n onClick={() => commit(selected.filter((id) => id !== item.id))}\n />\n }\n >\n <div className=\"ds-entry\">{row(item)}</div>\n </SortableListItem>\n ))}\n </SortableList>\n ) : (\n <ul className=\"ds-entry-picker__list\">\n {chosen.map((item) => (\n <li key={item.id} className=\"ds-entry-picker__row\">\n <div className=\"ds-entry\">{row(item)}</div>\n <Button\n variant=\"simple\"\n size=\"sm\"\n isIconOnly\n iconStart=\"x\"\n aria-label={`Remove ${item.title}`}\n isDisabled={isDisabled}\n onClick={() => commit(selected.filter((id) => id !== item.id))}\n />\n </li>\n ))}\n </ul>\n )}\n\n <div className=\"ds-entry-picker__actions\">\n <Button\n variant=\"neutral\"\n size=\"sm\"\n iconStart=\"plus\"\n isDisabled={isDisabled}\n onClick={() => setOpen(true)}\n >\n {addLabel}\n </Button>\n {selected.length > 0 && (\n <Button variant=\"simple\" size=\"sm\" isDisabled={isDisabled} onClick={() => commit([])}>\n Clear\n </Button>\n )}\n </div>\n\n <Modal\n isOpen={isOpen}\n onClose={() => setOpen(false)}\n title={addLabel}\n description={\n mode === \"single\"\n ? \"Choose one entry.\"\n : max !== undefined\n ? `Choose up to ${max} entries.`\n : \"Choose as many entries as you need.\"\n }\n footer={\n <Button variant=\"primary\" onClick={() => setOpen(false)}>\n Done\n </Button>\n }\n >\n <div className=\"ds-entry-picker__search\">\n <SearchField\n value={query}\n placeholder=\"Search entries\"\n onChange={(event) => setQuery(event.target.value)}\n onClear={() => setQuery(\"\")}\n />\n </div>\n <ul className=\"ds-entry-picker__results\">\n {results.map((item) => {\n const isSelected = selected.includes(item.id);\n const isBlocked = isDisabled || item.isDisabled || (!isSelected && atMax);\n return (\n <li key={item.id}>\n <Button\n variant={isSelected ? \"active\" : \"simple\"}\n size=\"lg\"\n className=\"ds-entry-picker__result\"\n aria-pressed={isSelected}\n isDisabled={Boolean(isBlocked)}\n onClick={() => toggle(item.id)}\n >\n <span className=\"ds-entry\">{row(item)}</span>\n {isSelected && <Icon name=\"check\" size={20} />}\n </Button>\n </li>\n );\n })}\n {results.length === 0 && (\n <li className=\"ds-entry-picker__no-results\">No entries match “{query}”.</li>\n )}\n </ul>\n </Modal>\n </div>\n );\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","names":["_Fragment","Icon","Fragment$1","cx","parts","matches","query","item","Thumb","EntryPicker","internal","setInternal","useState","defaultValue","selected","value","isOpen","setOpen","setQuery","byId","useMemo","items","results","atMax","mode","max","commit","isDisabled","next","onValueChange","toggle","id","chosen","canReorder","isReorderable","row","className","label","Badge","emptyLabel","SortableList","SortableListItem","Button","addLabel","Modal","itemLabel","itemsLabel","SearchField","event","isSelected","isBlocked"],"sources":["../../../src/components/EntryPicker/index.tsx"],"sourcesContent":["import { useMemo, useState, type ReactNode } from \"react\";\nimport { Badge } from \"../Badge\";\nimport { Button } from \"../Button\";\nimport { Icon } from \"../Icon\";\nimport { Modal } from \"../Modal\";\nimport { SearchField } from \"../SearchField\";\nimport { SortableList, SortableListItem } from \"../SortableList\";\nimport \"./style.css\";\n\nfunction cx(...parts: (string | undefined | false)[]) {\n return parts.filter(Boolean).join(\" \");\n}\n\nexport interface EntryItem {\n id: string;\n title: string;\n /** Second line — a content type, a path, a file size. */\n subtitle?: string;\n /** Main image: an asset thumbnail, or the entry's hero. */\n imageUrl?: string;\n /** Words the search matches on top of the title and subtitle. */\n keywords?: string[];\n isDisabled?: boolean;\n}\n\nexport type EntryPickerMode = \"single\" | \"multiple\";\n\nexport interface EntryPickerProps {\n items: EntryItem[];\n /** Selected ids, in the order they will be stored. */\n value?: string[];\n defaultValue?: string[];\n onValueChange?: (value: string[]) => void;\n mode?: EntryPickerMode;\n /** Cap a multiple selection. Reaching it disables the unpicked rows. */\n max?: number;\n label?: string;\n /** Copy shown when nothing is picked yet. */\n emptyLabel?: string;\n addLabel?: string;\n itemLabel?: string;\n itemsLabel?: string;\n /** Multiple selections are reorderable by default — the stored order is the shown order. */\n isReorderable?: boolean;\n isDisabled?: boolean;\n className?: string;\n}\n\nfunction matches(item: EntryItem, query: string) {\n if (!query) return true;\n const haystack = [item.title, item.subtitle, ...(item.keywords ?? [])]\n .filter(Boolean)\n .join(\" \")\n .toLowerCase();\n return haystack.includes(query.toLowerCase());\n}\n\nfunction Thumb({ item }: { item: EntryItem }) {\n return (\n <span className=\"ds-entry__thumb\">\n {item.imageUrl ? (\n <img src={item.imageUrl} alt=\"\" loading=\"lazy\" />\n ) : (\n <Icon name=\"file-text\" size={20} />\n )}\n </span>\n );\n}\n\n/**\n * Pick entries or assets out of a list. Search narrows it, a row toggles,\n * and a multiple selection keeps — and reorders — the order you chose.\n */\nexport function EntryPicker({\n items,\n value,\n defaultValue = [],\n onValueChange,\n mode = \"multiple\",\n max,\n label = \"Entries\",\n emptyLabel = \"Nothing selected yet.\",\n addLabel = \"Choose entries\",\n itemLabel = \"entry\",\n itemsLabel = \"entries\",\n isReorderable = true,\n isDisabled = false,\n className,\n}: EntryPickerProps) {\n const [internal, setInternal] = useState<string[]>(defaultValue);\n const selected = value ?? internal;\n const [isOpen, setOpen] = useState(false);\n const [query, setQuery] = useState(\"\");\n\n const byId = useMemo(() => new Map(items.map((item) => [item.id, item])), [items]);\n const results = useMemo(() => items.filter((item) => matches(item, query)), [items, query]);\n const atMax = mode === \"multiple\" && max !== undefined && selected.length >= max;\n\n const commit = (next: string[]) => {\n if (isDisabled) return;\n if (value === undefined) setInternal(next);\n onValueChange?.(next);\n };\n\n const toggle = (id: string) => {\n if (mode === \"single\") {\n commit(selected[0] === id ? [] : [id]);\n setOpen(false);\n return;\n }\n if (selected.includes(id)) commit(selected.filter((item) => item !== id));\n else if (!atMax) commit([...selected, id]);\n };\n\n const chosen = selected.map((id) => byId.get(id) ?? { id, title: id });\n const canReorder = !isDisabled && isReorderable && mode === \"multiple\" && chosen.length > 1;\n\n const row = (item: EntryItem): ReactNode => (\n <>\n <Thumb item={item} />\n <span className=\"ds-entry__body\">\n <span className=\"ds-entry__title\">{item.title}</span>\n {item.subtitle && <span className=\"ds-entry__subtitle\">{item.subtitle}</span>}\n </span>\n </>\n );\n\n return (\n <div className={cx(\"ds-entry-picker\", className)}>\n <div className=\"ds-entry-picker__head\">\n <span className=\"ds-entry-picker__label\">{label}</span>\n <Badge shape=\"count\">{selected.length}</Badge>\n </div>\n\n {chosen.length === 0 ? (\n <p className=\"ds-entry-picker__empty\">{emptyLabel}</p>\n ) : canReorder ? (\n <SortableList\n items={selected}\n onReorder={commit}\n renderDragOverlay={(id) => {\n const item = byId.get(id);\n return item ? <div className=\"ds-entry\">{row(item)}</div> : null;\n }}\n >\n {chosen.map((item) => (\n <SortableListItem\n key={item.id}\n id={item.id}\n label={item.title}\n action={\n <Button\n variant=\"simple\"\n size=\"sm\"\n isIconOnly\n iconStart=\"x\"\n aria-label={`Remove ${item.title}`}\n isDisabled={isDisabled}\n onClick={() => commit(selected.filter((id) => id !== item.id))}\n />\n }\n >\n <div className=\"ds-entry\">{row(item)}</div>\n </SortableListItem>\n ))}\n </SortableList>\n ) : (\n <ul className=\"ds-entry-picker__list\">\n {chosen.map((item) => (\n <li key={item.id} className=\"ds-entry-picker__row\">\n <div className=\"ds-entry\">{row(item)}</div>\n <Button\n variant=\"simple\"\n size=\"sm\"\n isIconOnly\n iconStart=\"x\"\n aria-label={`Remove ${item.title}`}\n isDisabled={isDisabled}\n onClick={() => commit(selected.filter((id) => id !== item.id))}\n />\n </li>\n ))}\n </ul>\n )}\n\n <div className=\"ds-entry-picker__actions\">\n <Button\n variant=\"neutral\"\n size=\"sm\"\n iconStart=\"plus\"\n isDisabled={isDisabled}\n onClick={() => setOpen(true)}\n >\n {addLabel}\n </Button>\n {selected.length > 0 && (\n <Button variant=\"simple\" size=\"sm\" isDisabled={isDisabled} onClick={() => commit([])}>\n Clear\n </Button>\n )}\n </div>\n\n <Modal\n isOpen={isOpen}\n onClose={() => setOpen(false)}\n title={addLabel}\n description={\n mode === \"single\"\n ? `Choose one ${itemLabel}.`\n : max !== undefined\n ? `Choose up to ${max} ${itemsLabel}.`\n : `Choose as many ${itemsLabel} as you need.`\n }\n footer={\n <Button variant=\"primary\" onClick={() => setOpen(false)}>\n Done\n </Button>\n }\n >\n <div className=\"ds-entry-picker__search\">\n <SearchField\n value={query}\n placeholder={`Search ${itemsLabel}`}\n onChange={(event) => setQuery(event.target.value)}\n onClear={() => setQuery(\"\")}\n />\n </div>\n <ul className=\"ds-entry-picker__results\">\n {results.map((item) => {\n const isSelected = selected.includes(item.id);\n const isBlocked = isDisabled || item.isDisabled || (!isSelected && atMax);\n return (\n <li key={item.id}>\n <Button\n variant={isSelected ? \"active\" : \"simple\"}\n size=\"lg\"\n className=\"ds-entry-picker__result\"\n aria-pressed={isSelected}\n isDisabled={Boolean(isBlocked)}\n onClick={() => toggle(item.id)}\n >\n <span className=\"ds-entry\">{row(item)}</span>\n {isSelected && <Icon name=\"check\" size={20} />}\n </Button>\n </li>\n );\n })}\n {results.length === 0 && (\n <li className=\"ds-entry-picker__no-results\">No {itemsLabel} match “{query}”.</li>\n )}\n </ul>\n </Modal>\n </div>\n );\n}\n"],"mappings":"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"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { type EntryItem } from "../EntryPicker/index.cjs";
|
|
2
|
+
import type { FieldProps } from "../Field/index.cjs";
|
|
3
|
+
import { type FormField, type FormFieldValue } from "./model.cjs";
|
|
4
|
+
type Accessibility = Parameters<FieldProps["children"]>[0];
|
|
5
|
+
interface FormControlProps {
|
|
6
|
+
field: FormField;
|
|
7
|
+
stored: FormFieldValue | undefined;
|
|
8
|
+
items: EntryItem[];
|
|
9
|
+
isDisabled: boolean;
|
|
10
|
+
accessibility: Accessibility;
|
|
11
|
+
onChange: (value: FormFieldValue | undefined) => void;
|
|
12
|
+
}
|
|
13
|
+
export declare function FormControl({ field, stored, items, isDisabled, accessibility: { required, ...accessibility }, onChange }: FormControlProps): import("react").JSX.Element;
|
|
14
|
+
export {};
|
|
15
|
+
//# sourceMappingURL=control.d.cts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"control.d.cts","sourceRoot":"","sources":["../../../src/components/FormEditor/control.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,KAAK,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC7D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAO3C,OAAO,EAA8C,KAAK,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,SAAS,CAAC;AAqB1G,KAAK,aAAa,GAAG,UAAU,CAAC,UAAU,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AAoC3D,UAAU,gBAAgB;IACxB,KAAK,EAAE,SAAS,CAAC;IACjB,MAAM,EAAE,cAAc,GAAG,SAAS,CAAC;IACnC,KAAK,EAAE,SAAS,EAAE,CAAC;IACnB,UAAU,EAAE,OAAO,CAAC;IACpB,aAAa,EAAE,aAAa,CAAC;IAC7B,QAAQ,EAAE,CAAC,KAAK,EAAE,cAAc,GAAG,SAAS,KAAK,IAAI,CAAC;CACvD;AAED,wBAAgB,WAAW,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,aAAa,EAAE,EAAE,QAAQ,EAAE,GAAG,aAAa,EAAE,EAAE,QAAQ,EAAE,EAAE,gBAAgB,+BA6B1I"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { type EntryItem } from "../EntryPicker/index.js";
|
|
2
|
+
import type { FieldProps } from "../Field/index.js";
|
|
3
|
+
import { type FormField, type FormFieldValue } from "./model.js";
|
|
4
|
+
type Accessibility = Parameters<FieldProps["children"]>[0];
|
|
5
|
+
interface FormControlProps {
|
|
6
|
+
field: FormField;
|
|
7
|
+
stored: FormFieldValue | undefined;
|
|
8
|
+
items: EntryItem[];
|
|
9
|
+
isDisabled: boolean;
|
|
10
|
+
accessibility: Accessibility;
|
|
11
|
+
onChange: (value: FormFieldValue | undefined) => void;
|
|
12
|
+
}
|
|
13
|
+
export declare function FormControl({ field, stored, items, isDisabled, accessibility: { required, ...accessibility }, onChange }: FormControlProps): import("react").JSX.Element;
|
|
14
|
+
export {};
|
|
15
|
+
//# sourceMappingURL=control.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"control.d.ts","sourceRoot":"","sources":["../../../src/components/FormEditor/control.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,KAAK,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAC7D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAO3C,OAAO,EAA8C,KAAK,SAAS,EAAE,KAAK,cAAc,EAAE,MAAM,SAAS,CAAC;AAqB1G,KAAK,aAAa,GAAG,UAAU,CAAC,UAAU,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;AAoC3D,UAAU,gBAAgB;IACxB,KAAK,EAAE,SAAS,CAAC;IACjB,MAAM,EAAE,cAAc,GAAG,SAAS,CAAC;IACnC,KAAK,EAAE,SAAS,EAAE,CAAC;IACnB,UAAU,EAAE,OAAO,CAAC;IACpB,aAAa,EAAE,aAAa,CAAC;IAC7B,QAAQ,EAAE,CAAC,KAAK,EAAE,cAAc,GAAG,SAAS,KAAK,IAAI,CAAC;CACvD;AAED,wBAAgB,WAAW,CAAC,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,aAAa,EAAE,EAAE,QAAQ,EAAE,GAAG,aAAa,EAAE,EAAE,QAAQ,EAAE,EAAE,gBAAgB,+BA6B1I"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require("../Field/index.cjs");const e=require("../../chunks/FormEditor-8bz3pOdP.cjs");exports.FormEditor=e.t,exports.validateFormValues=e.n;
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { type HTMLAttributes } from "react";
|
|
2
|
+
import type { EntryItem } from "../EntryPicker/index.cjs";
|
|
3
|
+
import type { GridColumns } from "../Grid/index.cjs";
|
|
4
|
+
import { type FormSchema, type FormErrors, type FormValues } from "./model.cjs";
|
|
5
|
+
export { validateFormValues } from "./model.cjs";
|
|
6
|
+
export type { AssetValue, FormField, FormSchema, FormErrors, FormFieldValue, FormValues, ReferenceValue } from "./model.cjs";
|
|
7
|
+
export interface FormChange {
|
|
8
|
+
fieldId: string;
|
|
9
|
+
}
|
|
10
|
+
export interface FormEditorProps extends Omit<HTMLAttributes<HTMLDivElement>, "defaultValue" | "onChange"> {
|
|
11
|
+
schema: FormSchema;
|
|
12
|
+
value?: FormValues;
|
|
13
|
+
defaultValue?: FormValues;
|
|
14
|
+
onValueChange?: (values: FormValues, change: FormChange) => void;
|
|
15
|
+
/** Available assets or entries, keyed by field ID. Loading belongs to the app. */
|
|
16
|
+
pickerItems?: Record<string, EntryItem[]>;
|
|
17
|
+
/** App-provided messages take precedence over built-in validation. */
|
|
18
|
+
errors?: FormErrors;
|
|
19
|
+
isDisabled?: boolean;
|
|
20
|
+
showAllErrors?: boolean;
|
|
21
|
+
/** Columns at the widest. The form drops one whenever a field would be narrower than `minColumnWidth`. */
|
|
22
|
+
columns?: GridColumns;
|
|
23
|
+
/** Narrowest a field may get before the form drops a column. */
|
|
24
|
+
minColumnWidth?: string;
|
|
25
|
+
}
|
|
26
|
+
/** Ordered form controls. Loading, submission, and persistence belong to the app. */
|
|
27
|
+
export declare function FormEditor({ schema, value, defaultValue, onValueChange, pickerItems, errors, isDisabled, showAllErrors, columns, minColumnWidth, className, style, ...rest }: FormEditorProps): import("react").JSX.Element;
|
|
28
|
+
//# sourceMappingURL=index.d.cts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.cts","sourceRoot":"","sources":["../../../src/components/FormEditor/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAyC,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AACnF,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAEhD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE3C,OAAO,EAA2C,KAAK,UAAU,EAAE,KAAK,UAAU,EAAuB,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAC1I,OAAO,aAAa,CAAC;AAErB,OAAO,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAC7C,YAAY,EAAE,UAAU,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,EAAE,cAAc,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAEzH,MAAM,WAAW,UAAU;IAAG,OAAO,EAAE,MAAM,CAAA;CAAE;AAE/C,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,cAAc,GAAG,UAAU,CAAC;IACxG,MAAM,EAAE,UAAU,CAAC;IACnB,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,YAAY,CAAC,EAAE,UAAU,CAAC;IAC1B,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,UAAU,KAAK,IAAI,CAAC;IACjE,kFAAkF;IAClF,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,EAAE,CAAC,CAAC;IAC1C,sEAAsE;IACtE,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,0GAA0G;IAC1G,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,gEAAgE;IAChE,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AA0BD,qFAAqF;AACrF,wBAAgB,UAAU,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,YAAiB,EAAE,aAAa,EAAE,WAAgB,EAAE,MAAW,EACzG,UAAkB,EAAE,aAAqB,EAAE,OAAW,EAAE,cAAwB,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,IAAI,EAAE,EAAE,eAAe,+BAkC/H"}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { type HTMLAttributes } from "react";
|
|
2
|
+
import type { EntryItem } from "../EntryPicker/index.js";
|
|
3
|
+
import type { GridColumns } from "../Grid/index.js";
|
|
4
|
+
import { type FormSchema, type FormErrors, type FormValues } from "./model.js";
|
|
5
|
+
export { validateFormValues } from "./model.js";
|
|
6
|
+
export type { AssetValue, FormField, FormSchema, FormErrors, FormFieldValue, FormValues, ReferenceValue } from "./model.js";
|
|
7
|
+
export interface FormChange {
|
|
8
|
+
fieldId: string;
|
|
9
|
+
}
|
|
10
|
+
export interface FormEditorProps extends Omit<HTMLAttributes<HTMLDivElement>, "defaultValue" | "onChange"> {
|
|
11
|
+
schema: FormSchema;
|
|
12
|
+
value?: FormValues;
|
|
13
|
+
defaultValue?: FormValues;
|
|
14
|
+
onValueChange?: (values: FormValues, change: FormChange) => void;
|
|
15
|
+
/** Available assets or entries, keyed by field ID. Loading belongs to the app. */
|
|
16
|
+
pickerItems?: Record<string, EntryItem[]>;
|
|
17
|
+
/** App-provided messages take precedence over built-in validation. */
|
|
18
|
+
errors?: FormErrors;
|
|
19
|
+
isDisabled?: boolean;
|
|
20
|
+
showAllErrors?: boolean;
|
|
21
|
+
/** Columns at the widest. The form drops one whenever a field would be narrower than `minColumnWidth`. */
|
|
22
|
+
columns?: GridColumns;
|
|
23
|
+
/** Narrowest a field may get before the form drops a column. */
|
|
24
|
+
minColumnWidth?: string;
|
|
25
|
+
}
|
|
26
|
+
/** Ordered form controls. Loading, submission, and persistence belong to the app. */
|
|
27
|
+
export declare function FormEditor({ schema, value, defaultValue, onValueChange, pickerItems, errors, isDisabled, showAllErrors, columns, minColumnWidth, className, style, ...rest }: FormEditorProps): import("react").JSX.Element;
|
|
28
|
+
//# sourceMappingURL=index.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/FormEditor/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAyC,KAAK,cAAc,EAAE,MAAM,OAAO,CAAC;AACnF,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAEhD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAE3C,OAAO,EAA2C,KAAK,UAAU,EAAE,KAAK,UAAU,EAAuB,KAAK,UAAU,EAAE,MAAM,SAAS,CAAC;AAC1I,OAAO,aAAa,CAAC;AAErB,OAAO,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAC7C,YAAY,EAAE,UAAU,EAAE,SAAS,EAAE,UAAU,EAAE,UAAU,EAAE,cAAc,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAEzH,MAAM,WAAW,UAAU;IAAG,OAAO,EAAE,MAAM,CAAA;CAAE;AAE/C,MAAM,WAAW,eAAgB,SAAQ,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,cAAc,GAAG,UAAU,CAAC;IACxG,MAAM,EAAE,UAAU,CAAC;IACnB,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,YAAY,CAAC,EAAE,UAAU,CAAC;IAC1B,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,UAAU,KAAK,IAAI,CAAC;IACjE,kFAAkF;IAClF,WAAW,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,SAAS,EAAE,CAAC,CAAC;IAC1C,sEAAsE;IACtE,MAAM,CAAC,EAAE,UAAU,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,0GAA0G;IAC1G,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,gEAAgE;IAChE,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AA0BD,qFAAqF;AACrF,wBAAgB,UAAU,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,YAAiB,EAAE,aAAa,EAAE,WAAgB,EAAE,MAAW,EACzG,UAAkB,EAAE,aAAqB,EAAE,OAAW,EAAE,cAAwB,EAAE,SAAS,EAAE,KAAK,EAAE,GAAG,IAAI,EAAE,EAAE,eAAe,+BAkC/H"}
|
|
@@ -0,0 +1,86 @@
|
|
|
1
|
+
import type { ReactNode } from "react";
|
|
2
|
+
import type { SelectOption } from "../Select/index.cjs";
|
|
3
|
+
import type { EntryPickerProps } from "../EntryPicker/index.cjs";
|
|
4
|
+
import type { RichTextDocument } from "../RichTextEditor/index.cjs";
|
|
5
|
+
interface FormFieldBase {
|
|
6
|
+
id: string;
|
|
7
|
+
label: string;
|
|
8
|
+
hint?: ReactNode;
|
|
9
|
+
placeholder?: string;
|
|
10
|
+
required?: boolean;
|
|
11
|
+
isDisabled?: boolean;
|
|
12
|
+
}
|
|
13
|
+
export type FormField = FormFieldBase & ({
|
|
14
|
+
type: "shortText";
|
|
15
|
+
inputType?: "text" | "email";
|
|
16
|
+
maxLength?: number;
|
|
17
|
+
readOnly?: boolean;
|
|
18
|
+
autoFocus?: boolean;
|
|
19
|
+
multiple?: never;
|
|
20
|
+
} | {
|
|
21
|
+
type: "longText";
|
|
22
|
+
rows?: number;
|
|
23
|
+
maxLength?: number;
|
|
24
|
+
readOnly?: boolean;
|
|
25
|
+
autoFocus?: boolean;
|
|
26
|
+
multiple?: never;
|
|
27
|
+
} | {
|
|
28
|
+
type: "boolean" | "dateTime";
|
|
29
|
+
autoFocus?: boolean;
|
|
30
|
+
multiple?: never;
|
|
31
|
+
} | {
|
|
32
|
+
type: "richText";
|
|
33
|
+
autoFocus?: never;
|
|
34
|
+
multiple?: never;
|
|
35
|
+
} | {
|
|
36
|
+
type: "number";
|
|
37
|
+
min?: number;
|
|
38
|
+
max?: number;
|
|
39
|
+
step?: number | "any";
|
|
40
|
+
hasSteppers?: boolean;
|
|
41
|
+
autoFocus?: boolean;
|
|
42
|
+
multiple?: never;
|
|
43
|
+
} | {
|
|
44
|
+
type: "select";
|
|
45
|
+
options: SelectOption[];
|
|
46
|
+
autoFocus?: boolean;
|
|
47
|
+
multiple?: never;
|
|
48
|
+
} | {
|
|
49
|
+
type: "asset" | "reference";
|
|
50
|
+
multiple?: boolean;
|
|
51
|
+
autoFocus?: never;
|
|
52
|
+
picker?: Pick<EntryPickerProps, "label" | "addLabel" | "emptyLabel" | "itemLabel" | "itemsLabel" | "max" | "isReorderable">;
|
|
53
|
+
});
|
|
54
|
+
export type FieldOf<T extends FormField["type"]> = Extract<FormField, {
|
|
55
|
+
type: T;
|
|
56
|
+
}>;
|
|
57
|
+
export interface FormSchema {
|
|
58
|
+
fields: readonly FormField[];
|
|
59
|
+
}
|
|
60
|
+
export interface AssetValue {
|
|
61
|
+
assetId: string;
|
|
62
|
+
}
|
|
63
|
+
export interface ReferenceValue {
|
|
64
|
+
entryId: string;
|
|
65
|
+
}
|
|
66
|
+
export type FormFieldValue = string | number | boolean | RichTextDocument | AssetValue | ReferenceValue | AssetValue[] | ReferenceValue[];
|
|
67
|
+
export type FormValues = Record<string, FormFieldValue | undefined>;
|
|
68
|
+
export type FormErrors = Partial<Record<string, string>>;
|
|
69
|
+
export declare function assertModel(model: FormSchema): void;
|
|
70
|
+
/** Picker copy, with asset or entry wording for any option the field leaves out or sets to undefined. */
|
|
71
|
+
export declare function pickerCopy(field: FieldOf<"asset" | "reference">): {
|
|
72
|
+
label: string;
|
|
73
|
+
addLabel: string;
|
|
74
|
+
itemLabel: string;
|
|
75
|
+
itemsLabel: string;
|
|
76
|
+
max?: number | undefined;
|
|
77
|
+
emptyLabel?: string | undefined;
|
|
78
|
+
isReorderable?: boolean | undefined;
|
|
79
|
+
};
|
|
80
|
+
/** Accept UTC ISO strings without rolling invalid dates into the next month. */
|
|
81
|
+
export declare function parseUtcDateTime(value: unknown): string | undefined;
|
|
82
|
+
export declare function fieldError(field: FormField, value: unknown): string | undefined;
|
|
83
|
+
/** Validate data loaded from JSON as well as values emitted by FormEditor. */
|
|
84
|
+
export declare function validateFormValues(model: FormSchema, values: Record<string, unknown>): FormErrors;
|
|
85
|
+
export {};
|
|
86
|
+
//# sourceMappingURL=model.d.cts.map
|