@12-apps/ui 6.24.8 → 6.26.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/dist/_internal/components/data-display/Alert/Alert.helpers.js +5 -1
- package/dist/_internal/components/data-display/Alert/Alert.js +3 -3
- package/dist/_internal/components/data-display/Alert/Alert.styles.js +2 -2
- package/dist/_internal/components/data-display/CardKit/card-actions-context.js +4 -4
- package/dist/_internal/components/data-display/CardKit/use-remove-confirm.js +5 -5
- package/dist/_internal/components/data-display/DataViews/DataViewsGrid.js +19 -19
- package/dist/_internal/components/data-display/DataViews/DataViewsTableBase.js +24 -24
- package/dist/_internal/components/data-display/DataViews/data-views-category-pill.js +15 -15
- package/dist/_internal/components/data-display/DataViews/data-views-filter-panel.js +16 -16
- package/dist/_internal/components/data-display/DataViews/data-views-grid-parts.js +18 -18
- package/dist/_internal/components/data-display/DataViews/data-views-inline-bar.js +16 -16
- package/dist/_internal/components/data-display/DataViews/data-views-table-parts.js +4 -4
- package/dist/_internal/components/data-display/index.js +3 -3
- package/dist/_internal/components/form/CategorySelect/CategoryPanel.js +8 -8
- package/dist/_internal/components/form/CategorySelect/CategoryPanelFoot.js +2 -2
- package/dist/_internal/components/form/CategorySelect/CategoryPanelHead.js +2 -2
- package/dist/_internal/components/form/CategorySelect/CategoryPanelList.js +4 -4
- package/dist/_internal/components/form/CategorySelect/CategoryQuickActions.js +2 -2
- package/dist/_internal/components/form/CategorySelect/CategoryRows.js +7 -9
- package/dist/_internal/components/form/CategorySelect/CategorySelect.js +14 -14
- package/dist/_internal/components/form/CategorySelect/CategorySelect.styles.js +3 -1
- package/dist/_internal/components/form/CategorySelect/CategoryTrigger.js +2 -2
- package/dist/_internal/components/form/CategorySelect/category-keyboard.js +2 -2
- package/dist/_internal/components/form/CategorySelect/category-tree.js +11 -3
- package/dist/_internal/components/form/CategorySelect/useCategoryCommit.js +2 -2
- package/dist/_internal/components/form/CategorySelect/useCategoryKeyHandler.js +3 -3
- package/dist/_internal/components/form/CategorySelect/useCategorySelect.js +2 -2
- package/dist/_internal/components/form/total-form/Fields/CategoryField.js +15 -15
- package/dist/_internal/components/form/total-form/Fields/index.js +16 -16
- package/dist/_internal/components/index.js +3 -3
- package/dist/{chunk-WNMYWQ7D.js → chunk-4Y6SPFKW.js} +10 -8
- package/dist/chunk-4Y6SPFKW.js.map +1 -0
- package/dist/{chunk-KM5O4ICK.js → chunk-7LCXGJN5.js} +2 -2
- package/dist/{chunk-NLJV4CPF.js → chunk-7MN6I5NK.js} +2 -2
- package/dist/{chunk-PN5CQKA2.js → chunk-AXTLFK4T.js} +2 -2
- package/dist/{chunk-4TXIZ5WI.js → chunk-CJUOBTLL.js} +2 -2
- package/dist/{chunk-57Z2ND3N.js → chunk-CXLAJZSE.js} +2 -2
- package/dist/{chunk-E3PUH5IF.js → chunk-EQ7PWGBN.js} +2 -2
- package/dist/{chunk-EJQW2IYW.js → chunk-FPFUXRD2.js} +2 -2
- package/dist/{chunk-KIHQE5YA.js → chunk-GVDJQMFI.js} +2 -2
- package/dist/{chunk-N3QUEBNS.js → chunk-L7VH6IMR.js} +14 -1
- package/dist/chunk-L7VH6IMR.js.map +1 -0
- package/dist/{chunk-OFOYMZRY.js → chunk-NPN7JTRM.js} +22 -47
- package/dist/chunk-NPN7JTRM.js.map +1 -0
- package/dist/{chunk-OVLNF4AZ.js → chunk-P7IVAMAU.js} +24 -35
- package/dist/chunk-P7IVAMAU.js.map +1 -0
- package/dist/chunk-PN4HVM43.js +160 -0
- package/dist/chunk-PN4HVM43.js.map +1 -0
- package/dist/{chunk-WWM2YTW4.js → chunk-R2AZOWEZ.js} +21 -27
- package/dist/chunk-R2AZOWEZ.js.map +1 -0
- package/dist/{chunk-2GB5CIN6.js → chunk-RZVUY2MO.js} +8 -4
- package/dist/chunk-RZVUY2MO.js.map +1 -0
- package/dist/{chunk-FBI6QB3O.js → chunk-TVPPA4RD.js} +3 -3
- package/dist/{chunk-KFWIOFMS.js → chunk-TWY5FOBY.js} +3 -3
- package/dist/{chunk-6ZY5XU4J.js → chunk-UIZH4DAE.js} +2 -2
- package/dist/{chunk-ISH42UC7.js → chunk-USJPZ5Q7.js} +2 -2
- package/dist/{chunk-ZUIJ3N7N.js → chunk-V6Z4XS3I.js} +5 -3
- package/dist/chunk-V6Z4XS3I.js.map +1 -0
- package/dist/{chunk-SYJMI2NP.js → chunk-VNTOBLIB.js} +2 -2
- package/dist/{chunk-JM64OEU6.js → chunk-WAPJ2DL3.js} +10 -13
- package/dist/chunk-WAPJ2DL3.js.map +1 -0
- package/dist/{chunk-ZAB65STX.js → chunk-XHHR6G35.js} +2 -2
- package/dist/{chunk-WIT3Y7JT.js → chunk-Y2B3I3IH.js} +2 -2
- package/dist/{chunk-R6SNYC3D.js → chunk-Y3KRUT7O.js} +2 -2
- package/dist/{chunk-TPLKJHNN.js → chunk-ZC7RQDZ5.js} +8 -7
- package/dist/chunk-ZC7RQDZ5.js.map +1 -0
- package/dist/{chunk-TFO6GBW7.js → chunk-ZS44PY7T.js} +5 -1
- package/dist/chunk-ZS44PY7T.js.map +1 -0
- package/dist/{chunk-AJ6XEO4E.js → chunk-ZUY65MFH.js} +2 -2
- package/dist/data-display/Alert.js +3 -3
- package/dist/data-display/CardKit.js +5 -5
- package/dist/data-display/DataViews.js +24 -24
- package/dist/form/CategorySelect.js +24 -16
- package/dist/form/total-form.js +16 -16
- package/dist/native/data-display/Alert.js +18 -3
- package/dist/native/data-display/Alert.js.map +1 -1
- package/dist/types/components/data-display/Alert/Alert.base.d.ts +28 -2
- package/dist/types/components/data-display/Alert/Alert.base.d.ts.map +1 -1
- package/dist/types/components/data-display/Alert/Alert.helpers.d.ts +39 -0
- package/dist/types/components/data-display/Alert/Alert.helpers.d.ts.map +1 -1
- package/dist/types/components/form/CategorySelect/CategoryPanel.d.ts.map +1 -1
- package/dist/types/components/form/CategorySelect/CategoryPanelList.d.ts +6 -0
- package/dist/types/components/form/CategorySelect/CategoryPanelList.d.ts.map +1 -1
- package/dist/types/components/form/CategorySelect/CategoryQuickActions.d.ts.map +1 -1
- package/dist/types/components/form/CategorySelect/CategoryRows.d.ts +12 -24
- package/dist/types/components/form/CategorySelect/CategoryRows.d.ts.map +1 -1
- package/dist/types/components/form/CategorySelect/CategorySelect.d.ts +10 -7
- package/dist/types/components/form/CategorySelect/CategorySelect.d.ts.map +1 -1
- package/dist/types/components/form/CategorySelect/CategorySelect.styles.d.ts +11 -0
- package/dist/types/components/form/CategorySelect/CategorySelect.styles.d.ts.map +1 -1
- package/dist/types/components/form/CategorySelect/CategorySelect.types.d.ts +10 -2
- package/dist/types/components/form/CategorySelect/CategorySelect.types.d.ts.map +1 -1
- package/dist/types/components/form/CategorySelect/category-keyboard.d.ts.map +1 -1
- package/dist/types/components/form/CategorySelect/category-tree.d.ts +52 -20
- package/dist/types/components/form/CategorySelect/category-tree.d.ts.map +1 -1
- package/dist/types/components/form/CategorySelect/index.d.ts +1 -1
- package/dist/types/components/form/CategorySelect/index.d.ts.map +1 -1
- package/dist/types/components/form/CategorySelect/useCategorySelect.d.ts +2 -0
- package/dist/types/components/form/CategorySelect/useCategorySelect.d.ts.map +1 -1
- package/dist/types-native/components/data-display/Alert/Alert.base.d.ts +28 -2
- package/dist/types-native/components/data-display/Alert/Alert.base.d.ts.map +1 -1
- package/dist/types-native/components/data-display/Alert/Alert.helpers.d.ts +39 -0
- package/dist/types-native/components/data-display/Alert/Alert.helpers.d.ts.map +1 -1
- package/dist/types-native/components/data-display/Alert/Alert.native.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/components/data-display/Alert/Alert.base.ts +29 -2
- package/src/components/data-display/Alert/Alert.helpers.ts +50 -0
- package/src/components/data-display/Alert/Alert.md +29 -1
- package/src/components/data-display/Alert/Alert.native.tsx +8 -4
- package/src/components/data-display/Alert/Alert.tsx +5 -5
- package/src/components/form/CategorySelect/CategoryPanel.tsx +1 -0
- package/src/components/form/CategorySelect/CategoryPanelList.tsx +42 -34
- package/src/components/form/CategorySelect/CategoryQuickActions.tsx +6 -4
- package/src/components/form/CategorySelect/CategoryRows.tsx +45 -81
- package/src/components/form/CategorySelect/CategorySelect.md +47 -13
- package/src/components/form/CategorySelect/CategorySelect.styles.ts +13 -0
- package/src/components/form/CategorySelect/CategorySelect.tsx +16 -14
- package/src/components/form/CategorySelect/CategorySelect.types.ts +10 -2
- package/src/components/form/CategorySelect/category-keyboard.ts +27 -31
- package/src/components/form/CategorySelect/category-tree.ts +143 -63
- package/src/components/form/CategorySelect/index.ts +4 -0
- package/src/components/form/CategorySelect/useCategorySelect.ts +15 -1
- package/dist/chunk-2GB5CIN6.js.map +0 -1
- package/dist/chunk-JM64OEU6.js.map +0 -1
- package/dist/chunk-LR6MSKTT.js +0 -124
- package/dist/chunk-LR6MSKTT.js.map +0 -1
- package/dist/chunk-N3QUEBNS.js.map +0 -1
- package/dist/chunk-OFOYMZRY.js.map +0 -1
- package/dist/chunk-OVLNF4AZ.js.map +0 -1
- package/dist/chunk-TFO6GBW7.js.map +0 -1
- package/dist/chunk-TPLKJHNN.js.map +0 -1
- package/dist/chunk-WNMYWQ7D.js.map +0 -1
- package/dist/chunk-WWM2YTW4.js.map +0 -1
- package/dist/chunk-ZUIJ3N7N.js.map +0 -1
- /package/dist/{chunk-KM5O4ICK.js.map → chunk-7LCXGJN5.js.map} +0 -0
- /package/dist/{chunk-NLJV4CPF.js.map → chunk-7MN6I5NK.js.map} +0 -0
- /package/dist/{chunk-PN5CQKA2.js.map → chunk-AXTLFK4T.js.map} +0 -0
- /package/dist/{chunk-4TXIZ5WI.js.map → chunk-CJUOBTLL.js.map} +0 -0
- /package/dist/{chunk-57Z2ND3N.js.map → chunk-CXLAJZSE.js.map} +0 -0
- /package/dist/{chunk-E3PUH5IF.js.map → chunk-EQ7PWGBN.js.map} +0 -0
- /package/dist/{chunk-EJQW2IYW.js.map → chunk-FPFUXRD2.js.map} +0 -0
- /package/dist/{chunk-KIHQE5YA.js.map → chunk-GVDJQMFI.js.map} +0 -0
- /package/dist/{chunk-FBI6QB3O.js.map → chunk-TVPPA4RD.js.map} +0 -0
- /package/dist/{chunk-KFWIOFMS.js.map → chunk-TWY5FOBY.js.map} +0 -0
- /package/dist/{chunk-6ZY5XU4J.js.map → chunk-UIZH4DAE.js.map} +0 -0
- /package/dist/{chunk-ISH42UC7.js.map → chunk-USJPZ5Q7.js.map} +0 -0
- /package/dist/{chunk-SYJMI2NP.js.map → chunk-VNTOBLIB.js.map} +0 -0
- /package/dist/{chunk-ZAB65STX.js.map → chunk-XHHR6G35.js.map} +0 -0
- /package/dist/{chunk-WIT3Y7JT.js.map → chunk-Y2B3I3IH.js.map} +0 -0
- /package/dist/{chunk-R6SNYC3D.js.map → chunk-Y3KRUT7O.js.map} +0 -0
- /package/dist/{chunk-AJ6XEO4E.js.map → chunk-ZUY65MFH.js.map} +0 -0
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/form/CategorySelect/category-tree.ts"],"sourcesContent":["import type {\n CategoryGroup,\n CategorySelectionChip,\n CategorySelectOption,\n} from './CategorySelect.types';\n\n/**\n * Fold a string to its comparison form: no diacritics, lower case.\n *\n * Portuguese category names are full of them (\"Águas\", \"Cápsulas\", \"Grãos\"), and\n * an admin typing \"agua\" or \"graos\" on a hurried phone keyboard means the same\n * thing. Comparing folded forms on both sides makes the search accent-blind in\n * both directions.\n */\nexport function foldText(text: string): string {\n return text\n .normalize('NFD')\n .replace(/[\\u0300-\\u036f]/g, '')\n .toLowerCase();\n}\n\n/**\n * Group a flat `parentId` list into top level + children, preserving input order.\n *\n * An option whose `parentId` names no top-level row is promoted to top level\n * rather than dropped — a category is never invisible just because its parent\n * was filtered out of the payload, or because the tree is deeper than two levels.\n */\nexport function buildCategoryGroups(options: CategorySelectOption[]): CategoryGroup[] {\n const roots = options.filter((option) => !option.parentId);\n const rootIds = new Set(roots.map((root) => root.id));\n const groups = new Map<string, CategoryGroup>(\n roots.map((root) => [root.id, { category: root, subcategories: [] }]),\n );\n const orphans: CategoryGroup[] = [];\n\n options.forEach((option) => {\n if (!option.parentId) return;\n const parent = groups.get(option.parentId);\n if (parent) {\n parent.subcategories.push(option);\n return;\n }\n if (!rootIds.has(option.id)) orphans.push({ category: option, subcategories: [] });\n });\n\n return [...groups.values(), ...orphans];\n}\n\n/**\n * Whether this category IS the leaf, because nothing sits under it.\n *\n * The leaf-only default makes a category a heading and the subcategory the thing\n * you pick — but a childless category has no subcategory to offer instead, so\n * that reading leaves it unpickable and the row does nothing at all. It is the\n * leaf, so it is selectable in its own right, whatever `allowParentSelection`\n * says. Everything below already agreed; only the rows and the activation did\n * not, which is what made a childless category unselectable on the estoque\n * filter while `Marcar tudo` could still select it.\n */\nexport function isLeafCategory(group: CategoryGroup): boolean {\n return group.subcategories.length === 0;\n}\n\n/** Every selectable leaf id across all groups, in display order. */\nexport function collectLeafIds(groups: CategoryGroup[]): string[] {\n return groups.flatMap((group) => leavesOf(group));\n}\n\n/** The leaves a category stands for — its subcategories, or itself when childless. */\nexport function leavesOf(group: CategoryGroup): string[] {\n return isLeafCategory(group) ? [group.category.id] : group.subcategories.map((sub) => sub.id);\n}\n\nexport type CategoryCheckState = 'off' | 'partial' | 'on';\n\n/** Whether none, some, or all of a category's leaves are selected. */\nexport function categoryCheckState(\n group: CategoryGroup,\n selected: ReadonlySet<string>,\n): CategoryCheckState {\n const leaves = leavesOf(group);\n const hits = leaves.filter((id) => selected.has(id)).length;\n if (hits === 0) return 'off';\n return hits === leaves.length ? 'on' : 'partial';\n}\n\n/** Select every leaf of a category, or clear them all when already complete. */\nexport function toggleCategoryLeaves(\n group: CategoryGroup,\n selected: ReadonlySet<string>,\n): Set<string> {\n const next = new Set(selected);\n const leaves = leavesOf(group);\n const turningOff = categoryCheckState(group, selected) === 'on';\n leaves.forEach((id) => (turningOff ? next.delete(id) : next.add(id)));\n return next;\n}\n\n/** Add an id when absent, remove it when present. */\nexport function toggleLeaf(id: string, selected: ReadonlySet<string>): Set<string> {\n const next = new Set(selected);\n if (!next.delete(id)) next.add(id);\n return next;\n}\n\n/**\n * Collapse a raw id set into the chips a human reads: a category that is fully\n * selected becomes ONE chip bearing the category's name, rather than one chip\n * per subcategory — \"Bebidas\" instead of six drinks.\n */\nexport function summarizeSelection(\n groups: CategoryGroup[],\n selected: ReadonlySet<string>,\n): CategorySelectionChip[] {\n return groups.flatMap((group): CategorySelectionChip[] => {\n const state = categoryCheckState(group, selected);\n if (state === 'off') return [];\n if (state === 'on') {\n return [{ id: group.category.id, label: group.category.name, whole: true }];\n }\n return group.subcategories\n .filter((sub) => selected.has(sub.id))\n .map((sub) => ({ id: sub.id, label: sub.name, whole: false }));\n });\n}\n\n/**\n * Drop the leaves a chip stands for. A `whole` chip removes the whole category;\n * any other chip removes just that leaf.\n */\nexport function removeChip(\n groups: CategoryGroup[],\n chipId: string,\n selected: ReadonlySet<string>,\n): Set<string> {\n const next = new Set(selected);\n const group = groups.find((candidate) => candidate.category.id === chipId);\n if (group) {\n leavesOf(group).forEach((id) => next.delete(id));\n return next;\n }\n next.delete(chipId);\n return next;\n}\n\n/**\n * Search across BOTH levels, keeping every hit under its parent.\n *\n * A category that matches keeps all of its subcategories, so \"Bebidas\" shows the\n * whole group. A category that does not match keeps only the subcategories that\n * do — the hit still arrives with its parent visible above it, which is the\n * context that tells \"Massas\" (mercearia) from \"Massas\" (pratos principais).\n */\nexport function filterCategoryGroups(groups: CategoryGroup[], query: string): CategoryGroup[] {\n const needle = foldText(query.trim());\n if (!needle) return groups;\n return groups.flatMap((group) => {\n if (foldText(group.category.name).includes(needle)) return [group];\n const subcategories = group.subcategories.filter((sub) =>\n foldText(sub.name).includes(needle),\n );\n return subcategories.length > 0 ? [{ category: group.category, subcategories }] : [];\n });\n}\n\n/** A run of text, flagged when it is the part that matched the query. */\ninterface HighlightSegment {\n text: string;\n match: boolean;\n}\n\n/**\n * Split a label around the query hit so the view can mark it.\n *\n * Slicing uses indices from the FOLDED text but cuts the ORIGINAL, which is safe\n * because folding is per-character here: NFD-stripping combining marks and\n * lower-casing both preserve offsets for the scripts these names use.\n */\nexport function highlightSegments(text: string, query: string): HighlightSegment[] {\n const needle = foldText(query.trim());\n if (!needle) return [{ text, match: false }];\n const at = foldText(text).indexOf(needle);\n if (at < 0) return [{ text, match: false }];\n return [\n { text: text.slice(0, at), match: false },\n { text: text.slice(at, at + needle.length), match: true },\n { text: text.slice(at + needle.length), match: false },\n ].filter((segment) => segment.text.length > 0);\n}\n\n/** A flattened row, so keyboard navigation can walk what is actually on screen. */\nexport interface CategoryRowRef {\n kind: 'category' | 'subcategory';\n id: string;\n /** Owning category id — lets ← jump from a subcategory back to its parent. */\n parentId?: string;\n}\n\n/** The visible rows, in order, honouring which categories are expanded. */\nexport function flattenRows(\n groups: CategoryGroup[],\n isExpanded: (categoryId: string) => boolean,\n): CategoryRowRef[] {\n return groups.flatMap((group) => {\n const head: CategoryRowRef = { kind: 'category', id: group.category.id };\n if (!isExpanded(group.category.id)) return [head];\n return [\n head,\n ...group.subcategories.map(\n (sub): CategoryRowRef => ({\n kind: 'subcategory',\n id: sub.id,\n parentId: group.category.id,\n }),\n ),\n ];\n });\n}\n"],"mappings":"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","names":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/data-display/Alert/Alert.helpers.ts"],"sourcesContent":["import type { AlertBaseFields, AlertVariant } from './Alert.base';\nimport type { IconName } from '../../../icons/Icon.types';\n\ntype AlertDefaultedKeys = 'variant' | 'glow' | 'pulse' | 'showIcon' | 'animate' | 'role' | 'aria-atomic';\n\nexport const ALERT_DEFAULTS: Required<Pick<AlertBaseFields, AlertDefaultedKeys>> & { closable: false } = {\n variant: 'info',\n glow: false,\n pulse: false,\n showIcon: true,\n closable: false,\n animate: true,\n role: 'alert',\n 'aria-atomic': 'true',\n};\n\n/**\n * Generic over the renderer's own props: the web and the native `Alert` pass\n * different extras through, and both come back out untouched.\n */\nexport type ResolvedAlertProps<P extends AlertBaseFields> = P &\n Required<Pick<AlertBaseFields, AlertDefaultedKeys>>;\n\n// Strips explicitly-undefined props before the merge so `prop={undefined}` still\n// falls back to the default, the way a destructuring default would.\nconst definedProps = <P extends AlertBaseFields>(props: P): Partial<P> =>\n Object.fromEntries(\n Object.entries(props).filter(([, value]) => value !== undefined),\n ) as Partial<P>;\n\n// Through `unknown`: `closable: false` in the defaults belongs to the dismiss\n// union rather than to `AlertBaseFields`, so TypeScript cannot see the merge as\n// comparable to `P` although every field of `P` survives it untouched.\nexport const resolveAlertProps = <P extends AlertBaseFields>(props: P): ResolvedAlertProps<P> =>\n ({ ...ALERT_DEFAULTS, ...definedProps(props) }) as unknown as ResolvedAlertProps<P>;\n\n/** `danger` announces itself; everything else waits its turn. */\nexport const defaultAriaLive = (variant: AlertVariant): 'polite' | 'assertive' =>\n variant === 'danger' ? 'assertive' : 'polite';\n\nexport const testIdFor = (base: string | undefined, suffix: string): string =>\n base ? `${base}-${suffix}` : `alert-${suffix}`;\n\n/**\n * The glyph each semantic variant carries, by the shared icon set's name.\n * `glass` and `gradient` carry none of their own: the web renders an empty\n * icon slot for them unless the caller passes an `icon`, and so does native.\n */\nexport const VARIANT_ICON: Partial<Record<AlertVariant, IconName>> = {\n info: 'Info',\n success: 'CheckCircle',\n warning: 'Warning',\n danger: 'Error',\n};\n"],"mappings":";AAKO,IAAM,iBAA4F;AAAA,EACvG,SAAS;AAAA,EACT,MAAM;AAAA,EACN,OAAO;AAAA,EACP,UAAU;AAAA,EACV,UAAU;AAAA,EACV,SAAS;AAAA,EACT,MAAM;AAAA,EACN,eAAe;AACjB;AAWA,IAAM,eAAe,CAA4B,UAC/C,OAAO;AAAA,EACL,OAAO,QAAQ,KAAK,EAAE,OAAO,CAAC,CAAC,EAAE,KAAK,MAAM,UAAU,MAAS;AACjE;AAKK,IAAM,oBAAoB,CAA4B,WAC1D,EAAE,GAAG,gBAAgB,GAAG,aAAa,KAAK,EAAE;AAGxC,IAAM,kBAAkB,CAAC,YAC9B,YAAY,WAAW,cAAc;AAEhC,IAAM,YAAY,CAAC,MAA0B,WAClD,OAAO,GAAG,IAAI,IAAI,MAAM,KAAK,SAAS,MAAM;AAOvC,IAAM,eAAwD;AAAA,EACnE,MAAM;AAAA,EACN,SAAS;AAAA,EACT,SAAS;AAAA,EACT,QAAQ;AACV;","names":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/form/CategorySelect/CategoryRows.tsx"],"sourcesContent":["'use client';\n\nimport Box from '@mui/material/Box/index.js';\n\nimport type { CategorySelectCopy } from '../../../copy';\nimport { CheckGlyph, DisclosureGlyph } from './CategoryIcons';\nimport { highlightSegments, type CategoryCheckState } from './category-tree';\nimport {\n checkboxBarSx,\n checkboxSx,\n chevronButtonSx,\n markSx,\n METRICS,\n radioSx,\n rowMetaSx,\n rowNameSx,\n rowSx,\n sectionHeadSx,\n} from './CategorySelect.styles';\nimport type { CategorySelectOption } from './CategorySelect.types';\n\n/** A label with the search hit marked. */\nexport function HighlightedName({\n text,\n query,\n}: {\n text: string;\n query: string;\n}): React.JSX.Element {\n const segments = highlightSegments(text, query);\n return (\n <>\n {segments.map((segment, index) =>\n segment.match ? (\n <Box component=\"mark\" key={`${segment.text}-${index}`} sx={markSx}>\n {segment.text}\n </Box>\n ) : (\n <span key={`${segment.text}-${index}`}>{segment.text}</span>\n ),\n )}\n </>\n );\n}\n\n/** Tri-state checkbox. `partial` draws the bar the prototype uses for \"some\". */\nexport function CategoryCheckbox({ state }: { state: CategoryCheckState }): React.JSX.Element {\n return (\n <Box sx={(theme) => checkboxSx(theme, state)} aria-hidden=\"true\">\n {state === 'on' && <CheckGlyph />}\n {state === 'partial' && <Box sx={checkboxBarSx} />}\n </Box>\n );\n}\n\nexport function CategoryRadio({ on }: { on: boolean }): React.JSX.Element {\n return <Box sx={(theme) => radioSx(theme, on)} aria-hidden=\"true\" />;\n}\n\ninterface CategoryHeadRowProps {\n option: CategorySelectOption;\n query: string;\n expanded: boolean;\n active: boolean;\n sheet: boolean;\n /** Absent in leaf-only mode, where the category is a heading with no checkbox. */\n checkState?: CategoryCheckState;\n /** Single-select draws a radio for the control: choosing a row is exclusive. */\n single: boolean;\n /** False for a childless category — there is nothing under it to disclose. */\n expandable: boolean;\n selectedCount: number;\n showCounts: boolean;\n onToggleExpanded: () => void;\n onActivate: () => void;\n dataTestId: string;\n copy: CategorySelectCopy;\n}\n\n/** The trailing number: how many children are picked, else the item count. */\nfunction rowMeta(\n selectedCount: number,\n showCounts: boolean,\n count: number | undefined,\n): { text: string; selected: boolean } | null {\n if (selectedCount > 0) return { text: String(selectedCount), selected: true };\n if (showCounts && count !== undefined) return { text: String(count), selected: false };\n return null;\n}\n\n/** The disclosure chevron, or the space it would have taken on a childless row. */\nfunction HeadRowDisclosure({\n option,\n expanded,\n expandable,\n onToggleExpanded,\n dataTestId,\n copy,\n}: Pick<\n CategoryHeadRowProps,\n 'option' | 'expanded' | 'expandable' | 'onToggleExpanded' | 'dataTestId' | 'copy'\n>): React.JSX.Element {\n if (!expandable) {\n return <Box sx={{ width: METRICS.chevronButton, flex: '0 0 auto' }} />;\n }\n return (\n <Box\n component=\"button\"\n type=\"button\"\n tabIndex={-1}\n aria-label={expanded ? copy.collapseCategory(option.name) : copy.expandCategory(option.name)}\n data-testid={`${dataTestId}-expand-${option.id}`}\n sx={(theme) => chevronButtonSx(theme, expanded)}\n onClick={(event: React.MouseEvent) => {\n event.stopPropagation();\n onToggleExpanded();\n }}\n >\n <DisclosureGlyph />\n </Box>\n );\n}\n\n/** The row's selection control, or the space it would have taken on a heading. */\nfunction HeadRowControl({\n checkState,\n single,\n}: Pick<CategoryHeadRowProps, 'checkState' | 'single'>): React.JSX.Element {\n if (!checkState) return <Box sx={{ width: METRICS.boxSize, flex: '0 0 auto' }} />;\n // Single-select commits the moment a row is chosen, so the control is a radio\n // there: a checkbox would promise the accumulation this mode does not do.\n if (single) return <CategoryRadio on={checkState === 'on'} />;\n return <CategoryCheckbox state={checkState} />;\n}\n\n/**\n * A top-level category row: disclosure chevron, optional checkbox, name, meta.\n *\n * The chevron is its OWN button inside the row button — clicking it only folds,\n * while clicking the row does the row's job (expand as a heading, or tick when\n * the category is selectable). A CHILDLESS category has neither a fold nor a\n * heading to be: it draws no chevron, and it carries the control, because it is\n * itself the leaf.\n */\nexport function CategoryHeadRow({\n option,\n query,\n expanded,\n active,\n sheet,\n checkState,\n single,\n expandable,\n selectedCount,\n showCounts,\n onToggleExpanded,\n onActivate,\n dataTestId,\n copy,\n}: CategoryHeadRowProps): React.JSX.Element {\n const meta = rowMeta(selectedCount, showCounts, option.count);\n return (\n <Box\n component=\"div\"\n role={checkState ? 'option' : 'button'}\n aria-selected={checkState ? checkState === 'on' : undefined}\n aria-expanded={expandable ? expanded : undefined}\n data-testid={`${dataTestId}-category-${option.id}`}\n sx={(theme) => rowSx(theme, active, sheet)}\n onClick={onActivate}\n >\n <HeadRowDisclosure\n option={option}\n expanded={expanded}\n expandable={expandable}\n onToggleExpanded={onToggleExpanded}\n dataTestId={dataTestId}\n copy={copy}\n />\n <HeadRowControl checkState={checkState} single={single} />\n <Box component=\"span\" sx={(theme) => rowNameSx(theme, true)}>\n <HighlightedName text={option.name} query={query} />\n </Box>\n {meta && (\n <Box component=\"span\" sx={(theme) => rowMetaSx(theme, meta.selected)}>\n {meta.text}\n </Box>\n )}\n </Box>\n );\n}\n\ninterface SubcategoryRowProps {\n option: CategorySelectOption;\n query: string;\n selected: boolean;\n active: boolean;\n sheet: boolean;\n /** Single-select mode draws a radio; multi-select draws a checkbox. */\n single: boolean;\n showCounts: boolean;\n onActivate: () => void;\n dataTestId: string;\n}\n\nexport function SubcategoryRow({\n option,\n query,\n selected,\n active,\n sheet,\n single,\n showCounts,\n onActivate,\n dataTestId,\n}: SubcategoryRowProps): React.JSX.Element {\n return (\n <Box\n component=\"div\"\n role=\"option\"\n aria-selected={selected}\n data-testid={`${dataTestId}-option-${option.id}`}\n sx={(theme) => ({ ...rowSx(theme, active, sheet), paddingLeft: '14px' })}\n onClick={onActivate}\n >\n <Box sx={{ width: METRICS.chevronButton, flex: '0 0 auto' }} />\n {single ? (\n <CategoryRadio on={selected} />\n ) : (\n <CategoryCheckbox state={selected ? 'on' : 'off'} />\n )}\n <Box component=\"span\" sx={(theme) => rowNameSx(theme, false)}>\n <HighlightedName text={option.name} query={query} />\n </Box>\n {showCounts && option.count !== undefined && (\n <Box component=\"span\" sx={(theme) => rowMetaSx(theme, false)}>\n {option.count}\n </Box>\n )}\n </Box>\n );\n}\n\n/** The category as a non-interactive heading (single-select, leaf-only). */\nexport function CategorySectionHeading({\n option,\n query,\n}: {\n option: CategorySelectOption;\n query: string;\n}): React.JSX.Element {\n return (\n <Box sx={sectionHeadSx}>\n <HighlightedName text={option.name} query={query} />\n </Box>\n );\n}\n"],"mappings":"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","names":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/form/CategorySelect/CategoryPanelList.tsx"],"sourcesContent":["'use client';\n\nimport type { CategorySelectCopy } from \"../../../copy\";\nimport Box from '@mui/material/Box/index.js';\nimport Button from '@mui/material/Button/index.js';\nimport Skeleton from '@mui/material/Skeleton/index.js';\n\nimport { categoryCheckState, isLeafCategory } from './category-tree';\nimport {\n CategoryHeadRow,\n CategorySectionHeading,\n SubcategoryRow,\n} from './CategoryRows';\nimport { emptySx, listSx, skeletonSx } from './CategorySelect.styles';\nimport type { CategoryGroup } from './CategorySelect.types';\n\n/** The design sets these labels in sentence case, not MUI's default caps. */\nconst SENTENCE_CASE = { textTransform: 'none' } as const;\n\n/** How many skeleton rows stand in for the catalogue while it loads. */\nconst SKELETON_ROWS = 6;\n\ninterface PanelListProps {\n /** The words this panel renders. REQUIRED — no default copy. */\n copy: CategorySelectCopy;\n groups: CategoryGroup[];\n query: string;\n draft: ReadonlySet<string>;\n rowIds: string[];\n activeIndex: number;\n sheet: boolean;\n single: boolean;\n loading: boolean;\n showCounts: boolean;\n allowParentSelection: boolean;\n isExpanded: (categoryId: string) => boolean;\n onToggleExpanded: (categoryId: string) => void;\n onActivateCategory: (group: CategoryGroup) => void;\n onActivateSubcategory: (id: string) => void;\n onClearQuery: () => void;\n onCreateCategory?: (name?: string) => void;\n listRef: React.RefObject<HTMLDivElement | null>;\n dataTestId: string;\n}\n\nfunction LoadingRows(): React.JSX.Element {\n return (\n <>\n {Array.from({ length: SKELETON_ROWS }, (_unused, index) => (\n <Skeleton key={index} variant=\"rounded\" sx={skeletonSx} />\n ))}\n </>\n );\n}\n\n/** No categories exist at all — an onboarding moment, not an error. */\nfunction EmptyCatalogue({\n onCreateCategory,\n dataTestId,\n copy,\n}: {\n onCreateCategory?: (name?: string) => void;\n dataTestId: string;\n copy: CategorySelectCopy;\n}): React.JSX.Element {\n return (\n <Box sx={emptySx} data-testid={`${dataTestId}-empty-catalogue`}>\n <strong>{copy.emptyTitle}</strong>\n <p>{copy.purpose}</p>\n {onCreateCategory && (\n <Button variant=\"contained\" size=\"small\" sx={SENTENCE_CASE} onClick={() => onCreateCategory()}>\n {copy.createCategory}\n </Button>\n )}\n </Box>\n );\n}\n\n/** The search found nothing — offer creation, or the way back. */\nfunction NoResults({\n query,\n onClearQuery,\n onCreateCategory,\n dataTestId,\n copy,\n}: {\n query: string;\n onClearQuery: () => void;\n onCreateCategory?: (name?: string) => void;\n dataTestId: string;\n copy: CategorySelectCopy;\n}): React.JSX.Element {\n return (\n <Box sx={emptySx} data-testid={`${dataTestId}-no-results`}>\n <strong>{copy.noResults.title(query)}</strong>\n <p>{copy.noResults.hint}</p>\n <Box sx={{ display: 'flex', gap: '6px', justifyContent: 'center' }}>\n <Button variant=\"outlined\" size=\"small\" sx={SENTENCE_CASE} onClick={onClearQuery}>\n {copy.noResults.clearSearch}\n </Button>\n {onCreateCategory && (\n <Button\n variant=\"contained\"\n size=\"small\"\n sx={SENTENCE_CASE}\n data-testid={`${dataTestId}-create`}\n onClick={() => onCreateCategory(query.trim())}\n >\n {copy.noResults.create(query.trim())}\n </Button>\n )}\n </Box>\n </Box>\n );\n}\n\n/** One group: its heading or head row, then whichever children are visible. */\nfunction CategoryGroupRows({\n group,\n props,\n}: {\n group: CategoryGroup;\n props: PanelListProps;\n}): React.JSX.Element {\n const { draft, query, single, allowParentSelection, rowIds, activeIndex, sheet } = props;\n const categoryId = group.category.id;\n const expanded = props.isExpanded(categoryId);\n // A childless category is the leaf, so it is selectable whatever the mode says\n // — the heading reading has no subcategory to point at, and would leave the\n // row inert.\n const selectable = allowParentSelection || isLeafCategory(group);\n const asHeading = single && !selectable;\n const selectedCount = group.subcategories.filter((sub) => draft.has(sub.id)).length;\n\n return (\n <>\n {asHeading ? (\n <CategorySectionHeading option={group.category} query={query} />\n ) : (\n <CategoryHeadRow\n option={group.category}\n query={query}\n expanded={expanded}\n active={rowIds[activeIndex] === categoryId}\n sheet={sheet}\n checkState={selectable ? categoryCheckState(group, draft) : undefined}\n single={single}\n expandable={!isLeafCategory(group)}\n selectedCount={selectedCount}\n showCounts={props.showCounts}\n onToggleExpanded={() => props.onToggleExpanded(categoryId)}\n onActivate={() => props.onActivateCategory(group)}\n dataTestId={props.dataTestId}\n copy={props.copy}\n />\n )}\n {(expanded || asHeading) &&\n group.subcategories.map((sub) => (\n <SubcategoryRow\n key={sub.id}\n option={sub}\n query={query}\n selected={draft.has(sub.id)}\n active={rowIds[activeIndex] === sub.id}\n sheet={sheet}\n single={single}\n showCounts={props.showCounts}\n onActivate={() => props.onActivateSubcategory(sub.id)}\n dataTestId={props.dataTestId}\n />\n ))}\n </>\n );\n}\n\n/** The scrolling body of the panel, including its three non-list states. */\nexport function CategoryPanelList(props: PanelListProps): React.JSX.Element {\n const { groups, loading, query, listRef, sheet, dataTestId, copy } = props;\n\n const body = (): React.JSX.Element => {\n if (loading) return <LoadingRows />;\n if (groups.length === 0 && query.trim().length > 0) {\n return (\n <NoResults copy={copy}\n query={query}\n onClearQuery={props.onClearQuery}\n onCreateCategory={props.onCreateCategory}\n dataTestId={dataTestId}\n />\n );\n }\n if (groups.length === 0) {\n return (\n <EmptyCatalogue copy={copy}\n onCreateCategory={props.onCreateCategory}\n dataTestId={dataTestId}\n />\n );\n }\n return (\n <>\n {groups.map((group) => (\n <CategoryGroupRows key={group.category.id} group={group} props={props} />\n ))}\n </>\n );\n };\n\n return (\n <Box\n ref={listRef}\n role=\"listbox\"\n aria-multiselectable={props.single ? undefined : true}\n tabIndex={-1}\n data-testid={`${dataTestId}-list`}\n sx={listSx(sheet)}\n >\n {body()}\n </Box>\n );\n}\n"],"mappings":"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","names":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/form/CategorySelect/CategorySelect.styles.ts"],"sourcesContent":["import { alpha, type CSSObject, type Theme } from '@mui/material/styles/index.js';\n\nimport { fieldEdge } from '../../../tokens/field-edge';\n\n/**\n * The prototype's METRICS, verbatim.\n *\n * Every number here is lifted from the approved design and is intentionally\n * absolute rather than derived from `theme.spacing`: the design is specified on\n * a half-pixel type scale (13.5px rows, 1.5px checkbox borders) that an 8px\n * spacing grid cannot express without rounding the look away.\n *\n * COLOURS are the deliberate exception — they come from the theme, because a\n * tenant can white-label the palette (a hard-coded indigo would survive the\n * rebrand and the rest of the screen would not) and because the library ships a\n * dark mode. On the default light indigo theme the tokens below resolve to the\n * prototype's own values.\n */\nexport const METRICS = {\n triggerHeight: 38,\n triggerRadius: 10,\n panelWidth: 340,\n panelRadius: 14,\n listMaxHeight: 290,\n sheetListMaxHeight: 340,\n rowHeight: 36,\n sheetRowHeight: 42,\n rowRadius: 8,\n boxSize: 18,\n chevronButton: 22,\n footerButton: 32,\n sheetFooterButton: 38,\n /** Below this width the panel becomes a bottom sheet. */\n sheetBreakpoint: 480,\n} as const;\n\n/** Accent family, derived so a white-labelled palette carries through. */\nconst accent = (theme: Theme) => ({\n main: theme.palette.primary.main,\n ink: theme.palette.primary.dark,\n soft: alpha(theme.palette.primary.main, 0.08),\n edge: alpha(theme.palette.primary.main, 0.28),\n ring: alpha(theme.palette.primary.main, 0.15),\n});\n\n/** The closed control. `selected` swaps it to the accent-tinted \"has filter\" skin. */\nexport const triggerSx = (theme: Theme, selected: boolean, open: boolean): CSSObject => {\n const brand = accent(theme);\n return {\n display: 'flex',\n alignItems: 'center',\n gap: '8px',\n height: METRICS.triggerHeight,\n padding: '0 10px 0 12px',\n borderRadius: `${METRICS.triggerRadius}px`,\n border: `1px solid ${open || selected ? brand.edge : fieldEdge(theme)}`,\n background: selected ? brand.soft : theme.palette.background.paper,\n color: selected ? brand.ink : theme.palette.text.primary,\n font: 'inherit',\n fontSize: 13,\n cursor: 'pointer',\n maxWidth: '100%',\n transition: 'border-color .12s, box-shadow .12s',\n boxShadow: open ? `0 0 0 3px ${brand.ring}` : 'none',\n '&:hover': { borderColor: open || selected ? brand.edge : theme.palette.text.disabled },\n '&:focus-visible': {\n outline: 'none',\n borderColor: brand.main,\n boxShadow: `0 0 0 3px ${alpha(brand.main, 0.18)}`,\n },\n '&:disabled': { opacity: 0.5, cursor: 'default' },\n };\n};\n\n/** The count pill inside the trigger. */\nexport const triggerCountSx = (theme: Theme): CSSObject => ({\n fontWeight: 600,\n fontSize: 11,\n lineHeight: 1,\n background: theme.palette.primary.main,\n color: theme.palette.primary.contrastText,\n borderRadius: '999px',\n padding: '3px 6px',\n minWidth: 18,\n textAlign: 'center',\n});\n\n/** The trigger's inline clear (×) and the chevron. */\nexport const triggerClearSx: CSSObject = {\n width: 20,\n height: 20,\n flex: '0 0 auto',\n border: 0,\n background: 'transparent',\n borderRadius: '5px',\n display: 'grid',\n placeItems: 'center',\n cursor: 'pointer',\n color: 'inherit',\n opacity: 0.6,\n padding: 0,\n '&:hover': { background: alpha('#000', 0.08), opacity: 1 },\n};\n\nexport const triggerChevronSx = (open: boolean): CSSObject => ({\n width: 14,\n height: 14,\n flex: '0 0 auto',\n opacity: 0.55,\n transition: 'transform .15s',\n transform: open ? 'rotate(180deg)' : 'none',\n});\n\n/** The floating panel. */\nexport const panelSx = (theme: Theme): CSSObject => ({\n width: METRICS.panelWidth,\n maxWidth: '100%',\n background: theme.palette.background.paper,\n border: `1px solid ${theme.palette.divider}`,\n borderRadius: `${METRICS.panelRadius}px`,\n boxShadow: '0 1px 2px rgba(16,20,35,.05), 0 18px 40px -12px rgba(16,20,35,.28)',\n display: 'flex',\n flexDirection: 'column',\n overflow: 'hidden',\n});\n\n/** Bottom-sheet skin, applied under {@link METRICS.sheetBreakpoint}. */\nexport const sheetSx = (theme: Theme): CSSObject => ({\n width: '100%',\n maxWidth: 'none',\n borderRadius: '18px 18px 0 0',\n borderBottom: 0,\n position: 'relative',\n paddingTop: '4px',\n '&::before': {\n content: '\"\"',\n position: 'absolute',\n top: 7,\n left: '50%',\n transform: 'translateX(-50%)',\n width: 36,\n height: 4,\n borderRadius: '2px',\n background: theme.palette.divider,\n },\n});\n\nexport const panelHeadSx = (theme: Theme, sheet: boolean): CSSObject => ({\n padding: sheet ? '18px 10px 8px' : '10px 10px 8px',\n borderBottom: `1px solid ${theme.palette.divider}`,\n});\n\nexport const pinnedSx = (theme: Theme): CSSObject => ({\n padding: '9px 10px',\n borderBottom: `1px solid ${theme.palette.divider}`,\n background: alpha(theme.palette.primary.main, 0.03),\n});\n\nexport const pinnedLabelSx = (theme: Theme): CSSObject => ({\n fontWeight: 600,\n fontSize: 10,\n lineHeight: 1,\n letterSpacing: '.08em',\n textTransform: 'uppercase',\n color: theme.palette.text.secondary,\n marginBottom: '7px',\n});\n\nexport const chipWrapSx: CSSObject = {\n display: 'flex',\n flexWrap: 'wrap',\n gap: '5px',\n maxHeight: 74,\n overflow: 'auto',\n};\n\n/** A selected-category chip, in the pinned tray and the applied bar alike. */\nexport const chipSx = (theme: Theme): CSSObject => {\n const brand = accent(theme);\n return {\n display: 'inline-flex',\n alignItems: 'center',\n gap: '5px',\n fontSize: 12,\n background: brand.soft,\n color: brand.ink,\n border: `1px solid ${brand.edge}`,\n borderRadius: '7px',\n padding: '3px 4px 3px 8px',\n '& button': {\n border: 0,\n background: 'transparent',\n color: 'inherit',\n cursor: 'pointer',\n padding: 0,\n width: 16,\n height: 16,\n borderRadius: '4px',\n display: 'grid',\n placeItems: 'center',\n opacity: 0.65,\n fontSize: 13,\n lineHeight: 1,\n '&:hover': { background: alpha(theme.palette.primary.main, 0.16), opacity: 1 },\n },\n };\n};\n\nexport const listSx = (sheet: boolean): CSSObject => ({\n overflow: 'auto',\n maxHeight: sheet ? METRICS.sheetListMaxHeight : METRICS.listMaxHeight,\n padding: '6px 6px 8px',\n scrollPadding: '8px 0',\n overscrollBehavior: 'contain',\n});\n\n/** A row. `active` is the KEYBOARD cursor — deliberately distinct from hover. */\nexport const rowSx = (theme: Theme, active: boolean, sheet: boolean): CSSObject => ({\n display: 'flex',\n alignItems: 'center',\n gap: '8px',\n padding: '0 8px',\n height: sheet ? METRICS.sheetRowHeight : METRICS.rowHeight,\n borderRadius: `${METRICS.rowRadius}px`,\n cursor: 'pointer',\n userSelect: 'none',\n position: 'relative',\n width: '100%',\n border: 0,\n textAlign: 'left',\n font: 'inherit',\n background: active ? alpha(theme.palette.primary.main, 0.08) : 'transparent',\n boxShadow: active ? `inset 0 0 0 1px ${alpha(theme.palette.primary.main, 0.3)}` : 'none',\n '&:hover': {\n background: active\n ? alpha(theme.palette.primary.main, 0.08)\n : theme.palette.action.hover,\n },\n '&:focus-visible': { outline: `2px solid ${theme.palette.primary.main}`, outlineOffset: 1 },\n});\n\nexport const rowNameSx = (theme: Theme, isCategory: boolean): CSSObject => ({\n flex: 1,\n minWidth: 0,\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n fontSize: 13.5,\n fontWeight: isCategory ? 600 : 450,\n color: isCategory ? theme.palette.text.primary : theme.palette.text.secondary,\n});\n\nexport const rowMetaSx = (theme: Theme, selected: boolean): CSSObject => ({\n font: '500 11px/1 ui-monospace, SFMono-Regular, Menlo, monospace',\n color: selected ? theme.palette.primary.main : theme.palette.text.secondary,\n fontWeight: selected ? 600 : 500,\n flex: '0 0 auto',\n});\n\n/** The query hit inside a row label. */\nexport const markSx: CSSObject = {\n background: '#fff2a8',\n color: 'inherit',\n borderRadius: '2px',\n padding: '0 1px',\n};\n\nexport const chevronButtonSx = (theme: Theme, open: boolean): CSSObject => ({\n width: METRICS.chevronButton,\n height: METRICS.chevronButton,\n flex: '0 0 auto',\n border: 0,\n background: 'transparent',\n borderRadius: '6px',\n display: 'grid',\n placeItems: 'center',\n cursor: 'pointer',\n color: theme.palette.text.secondary,\n padding: 0,\n '&:hover': { background: theme.palette.action.hover, color: theme.palette.text.primary },\n '& svg': { width: 12, height: 12, transition: 'transform .15s', transform: open ? 'rotate(90deg)' : 'none' },\n});\n\n/** The tri-state checkbox: unchecked, checked, or the partial bar. */\nexport const checkboxSx = (theme: Theme, state: 'off' | 'partial' | 'on'): CSSObject => ({\n width: METRICS.boxSize,\n height: METRICS.boxSize,\n flex: '0 0 auto',\n border: `1.5px solid ${state === 'off' ? theme.palette.divider : theme.palette.primary.main}`,\n borderRadius: '5px',\n background: state === 'off' ? theme.palette.background.paper : theme.palette.primary.main,\n display: 'grid',\n placeItems: 'center',\n transition: 'background .1s, border-color .1s',\n '& svg': { width: 12, height: 12, color: theme.palette.primary.contrastText },\n});\n\n/** The partial bar drawn inside a half-selected checkbox. */\nexport const checkboxBarSx = (theme: Theme): CSSObject => ({\n width: 9,\n height: 2,\n background: theme.palette.primary.contrastText,\n borderRadius: '1px',\n});\n\nexport const radioSx = (theme: Theme, on: boolean): CSSObject => ({\n width: METRICS.boxSize,\n height: METRICS.boxSize,\n flex: '0 0 auto',\n borderRadius: '50%',\n background: theme.palette.background.paper,\n border: on\n ? `5.5px solid ${theme.palette.primary.main}`\n : `1.5px solid ${theme.palette.divider}`,\n boxSizing: 'border-box',\n});\n\nexport const sectionHeadSx = (theme: Theme): CSSObject => ({\n fontWeight: 600,\n fontSize: 10,\n lineHeight: 1,\n letterSpacing: '.08em',\n textTransform: 'uppercase',\n color: theme.palette.text.secondary,\n padding: '9px 8px 6px',\n});\n\nexport const footerSx = (theme: Theme): CSSObject => ({\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'space-between',\n gap: '8px',\n padding: '9px 10px',\n borderTop: `1px solid ${theme.palette.divider}`,\n background: theme.palette.action.hover,\n});\n\nexport const emptySx = (theme: Theme): CSSObject => ({\n padding: '26px 18px',\n textAlign: 'center',\n color: theme.palette.text.secondary,\n '& strong': {\n display: 'block',\n color: theme.palette.text.primary,\n fontSize: 13.5,\n marginBottom: '4px',\n },\n '& p': { margin: '0 0 12px', fontSize: 12.5, lineHeight: 1.5 },\n});\n\n/** Skeleton row used while the catalogue loads. */\nexport const skeletonSx: CSSObject = {\n height: METRICS.rowHeight,\n margin: '4px 6px',\n borderRadius: `${METRICS.rowRadius}px`,\n};\n"],"mappings":"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","names":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/form/CategorySelect/CategoryPanel.tsx"],"sourcesContent":["'use client';\n\nimport type { CategorySelectCopy } from \"../../../copy\";\nimport Box from '@mui/material/Box/index.js';\n\nimport { removeChip } from './category-tree';\nimport { CategoryMultiFoot, CategorySingleFoot } from './CategoryPanelFoot';\nimport { CategoryPanelHead, CategoryPinnedTray } from './CategoryPanelHead';\nimport { CategoryPanelList } from './CategoryPanelList';\nimport { CategoryQuickActions } from './CategoryQuickActions';\nimport { panelSx, sheetSx } from './CategorySelect.styles';\nimport type { CategoryGroup, CategorySelectionChip } from './CategorySelect.types';\nimport type { CategorySelectState } from './useCategorySelect';\n\nexport interface CategoryPanelProps {\n /** The words this panel renders. REQUIRED — no default copy. */\n copy: CategorySelectCopy;\n state: CategorySelectState;\n chips: CategorySelectionChip[];\n rowIds: string[];\n /** True when the applied selection differs from the draft. */\n changed: boolean;\n single: boolean;\n sheet: boolean;\n loading: boolean;\n showCounts: boolean;\n allowParentSelection: boolean;\n ariaLabel: string;\n onKeyDown: (event: React.KeyboardEvent) => void;\n onActivateCategory: (group: CategoryGroup) => void;\n onActivateSubcategory: (id: string) => void;\n onApply: () => void;\n onCancel: () => void;\n onCreateCategory?: () => void;\n searchInputRef: React.RefObject<HTMLInputElement | null>;\n listRef: React.RefObject<HTMLDivElement | null>;\n dataTestId: string;\n}\n\n/** Search + pinned selection + tree + footer, in the panel's own chrome. */\nexport function CategoryPanel({\n state,\n chips,\n rowIds,\n changed,\n single,\n sheet,\n loading,\n showCounts,\n allowParentSelection,\n ariaLabel,\n onKeyDown,\n onActivateCategory,\n onActivateSubcategory,\n onApply,\n onCancel,\n onCreateCategory,\n searchInputRef,\n listRef,\n dataTestId,\n copy,\n}: CategoryPanelProps): React.JSX.Element {\n return (\n <Box\n onKeyDown={onKeyDown}\n role=\"dialog\"\n aria-label={ariaLabel}\n data-testid={`${dataTestId}-panel`}\n sx={(theme) => ({ ...panelSx(theme), ...(sheet ? sheetSx(theme) : {}) })}\n >\n <CategoryPanelHead\n copy={copy}\n query={state.query}\n placeholder={single ? copy.search.placeholderSingle : copy.search.placeholderMulti}\n sheet={sheet}\n quickActions={\n single ? undefined : <CategoryQuickActions state={state} dataTestId={dataTestId} copy={copy} />\n }\n onQueryChange={state.setQuery}\n searchInputRef={searchInputRef}\n dataTestId={dataTestId}\n />\n {!single && !loading && (\n <PinnedTray state={state} chips={chips} dataTestId={dataTestId} copy={copy} />\n )}\n <CategoryPanelList copy={copy}\n groups={state.visibleGroups}\n query={state.query}\n draft={state.draft}\n rowIds={rowIds}\n activeIndex={state.activeIndex}\n sheet={sheet}\n single={single}\n loading={loading}\n showCounts={showCounts}\n allowParentSelection={allowParentSelection}\n isExpanded={state.isExpanded}\n onToggleExpanded={state.toggleExpanded}\n onActivateCategory={onActivateCategory}\n onActivateSubcategory={onActivateSubcategory}\n onClearQuery={() => state.setQuery('')}\n onCreateCategory={onCreateCategory}\n listRef={listRef}\n dataTestId={dataTestId}\n />\n <PanelFooter\n state={state}\n changed={changed}\n single={single}\n sheet={sheet}\n copy={copy}\n onApply={onApply}\n onCancel={onCancel}\n dataTestId={dataTestId}\n />\n </Box>\n );\n}\n\n/** The selected-category chips, wired to remove from the draft. */\nfunction PinnedTray({\n state,\n chips,\n dataTestId,\n copy,\n}: Pick<CategoryPanelProps, 'state' | 'chips' | 'dataTestId' | 'copy'>): React.JSX.Element {\n return (\n <CategoryPinnedTray\n copy={copy}\n chips={chips}\n onRemove={(chipId) => state.setDraft(removeChip(state.allGroups, chipId, state.draft))}\n dataTestId={dataTestId}\n />\n );\n}\n\n/** Whichever footer the mode calls for. */\nfunction PanelFooter({\n state,\n changed,\n single,\n sheet,\n onApply,\n onCancel,\n dataTestId,\n copy,\n}: Pick<\n CategoryPanelProps,\n 'state' | 'changed' | 'single' | 'sheet' | 'onApply' | 'onCancel' | 'dataTestId' | 'copy'\n>): React.JSX.Element {\n if (single) {\n return (\n <CategorySingleFoot sheet={sheet} onCancel={onCancel} dataTestId={dataTestId} copy={copy} />\n );\n }\n return (\n <CategoryMultiFoot\n count={state.draft.size}\n changed={changed}\n sheet={sheet}\n copy={copy}\n onClear={() => state.setDraft(new Set())}\n onApply={onApply}\n dataTestId={dataTestId}\n />\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAGA,OAAO,SAAS;AA4DZ,SAa2B,KAb3B;AAvBG,SAAS,cAAc;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA0C;AACxC,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,MAAK;AAAA,MACL,cAAY;AAAA,MACZ,eAAa,GAAG,UAAU;AAAA,MAC1B,IAAI,CAAC,WAAW,EAAE,GAAG,QAAQ,KAAK,GAAG,GAAI,QAAQ,QAAQ,KAAK,IAAI,CAAC,EAAG;AAAA,MAEtE;AAAA;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,OAAO,MAAM;AAAA,YACb,aAAa,SAAS,KAAK,OAAO,oBAAoB,KAAK,OAAO;AAAA,YAClE;AAAA,YACA,cACE,SAAS,SAAY,oBAAC,wBAAqB,OAAc,YAAwB,MAAY;AAAA,YAE/F,eAAe,MAAM;AAAA,YACrB;AAAA,YACA;AAAA;AAAA,QACF;AAAA,QACC,CAAC,UAAU,CAAC,WACX,oBAAC,cAAW,OAAc,OAAc,YAAwB,MAAY;AAAA,QAE9E;AAAA,UAAC;AAAA;AAAA,YAAkB;AAAA,YACjB,QAAQ,MAAM;AAAA,YACd,OAAO,MAAM;AAAA,YACb,OAAO,MAAM;AAAA,YACb;AAAA,YACA,aAAa,MAAM;AAAA,YACnB;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,YAAY,MAAM;AAAA,YAClB,kBAAkB,MAAM;AAAA,YACxB;AAAA,YACA;AAAA,YACA,cAAc,MAAM,MAAM,SAAS,EAAE;AAAA,YACrC;AAAA,YACA;AAAA,YACA;AAAA;AAAA,QACF;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA;AAAA,QACF;AAAA;AAAA;AAAA,EACF;AAEJ;AAGA,SAAS,WAAW;AAAA,EAClB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA2F;AACzF,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA,UAAU,CAAC,WAAW,MAAM,SAAS,WAAW,MAAM,WAAW,QAAQ,MAAM,KAAK,CAAC;AAAA,MACrF;AAAA;AAAA,EACF;AAEJ;AAGA,SAAS,YAAY;AAAA,EACnB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAGsB;AACpB,MAAI,QAAQ;AACV,WACE,oBAAC,sBAAmB,OAAc,UAAoB,YAAwB,MAAY;AAAA,EAE9F;AACA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO,MAAM,MAAM;AAAA,MACnB;AAAA,MACA;AAAA,MACA;AAAA,MACA,SAAS,MAAM,MAAM,SAAS,oBAAI,IAAI,CAAC;AAAA,MACvC;AAAA,MACA;AAAA;AAAA,EACF;AAEJ;","names":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/data-display/Alert/Alert.tsx"],"sourcesContent":["import Close from '@mui/icons-material/Close';\nimport MuiAlert from '@mui/material/Alert/index.js';\nimport AlertTitle from '@mui/material/AlertTitle/index.js';\nimport Box from '@mui/material/Box/index.js';\nimport Collapse from '@mui/material/Collapse/index.js';\nimport IconButton from '@mui/material/IconButton/index.js';\nimport { alpha, styled } from '@mui/material/styles/index.js';\nimport type { Theme } from '@mui/material/styles/index.js';\nimport React from 'react';\n\nimport { defaultAriaLive, resolveAlertProps, testIdFor } from './Alert.helpers';\nimport type { AlertPalette } from './Alert.metrics';\nimport {\n ACTIVE,\n GLOW,\n ALERT_EASING,\n ALERT_RADIUS_UNITS,\n ALERT_TRANSITION_MS,\n CLOSE_BUTTON,\n CLOSE_DELAY_MS,\n COLLAPSE_MS,\n DESCRIPTION,\n FADE_IN,\n FOCUS,\n HOVER,\n seconds,\n TITLE,\n} from './Alert.metrics';\nimport {\n alertEmphasisStyles,\n alertLayoutStyles,\n alertVariantStyles,\n fadeInScale,\n getColorFromTheme,\n getVariantIcon,\n} from './Alert.styles';\nimport type { AlertColor } from '@mui/material/Alert/index.js';\nimport type { AlertProps } from './Alert.types';\nimport { resolveTestId, withoutTestIdProps } from '../../../platform/test-id';\nimport { px } from '../../../tokens/theme';\n\nconst transition = `all ${seconds(ALERT_TRANSITION_MS)} ${ALERT_EASING}`;\n\n// Define animations\n/**\n * The pointer states' shadow: a flat tint, plus the glow when the alert has one.\n *\n * The tint is an inset spread at 100vmax, which always exceeds the element, so\n * it covers the surface edge to edge. It paints ABOVE the background and BELOW\n * the content, which is what keeps the ink's own contrast out of these states\n * entirely — see `ACTIVE` in `Alert.metrics.ts` for why a layer replaced the\n * opacity dip and the brightness multiplier that each preceded it.\n *\n * The glow is COMPOSED rather than replaced, so hovering a glowing alert keeps\n * its glow; `glowStyles` gave up its `!important` for this.\n */\nfunction pointerShadow(\n theme: Theme,\n colorPalette: AlertPalette,\n glow: boolean,\n variant: string | undefined,\n): (alpha_: number) => string {\n // The tint moves the surface AWAY from its own ink, which is why this reads\n // the variant and not only the mode.\n //\n // `gradient` is the one variant where the two disagree: it paints a\n // mid-lightness sweep (L* 42–61) under WHITE ink in BOTH modes, so the\n // mode-keyed answer tinted it white in dark mode — toward the text. Measured:\n // white-on-gradient fell to 2.90:1 on hover and 2.41:1 pressed, under the 3:1\n // floor and below its own idle. Every other variant's surface tracks the mode,\n // so for them the two rules agree.\n const ink = variant === 'gradient' || theme.palette.mode === 'light' ? '#000000' : '#ffffff';\n const glowShadow = glow\n ? `0 0 ${GLOW.blur}px ${GLOW.spread}px ${alpha(colorPalette.main, GLOW.alpha)}`\n : null;\n return (alpha_) =>\n [`inset 0 0 0 100vmax ${alpha(ink, alpha_)}`, glowShadow].filter(Boolean).join(', ');\n}\n\nconst StyledAlert = styled(MuiAlert, {\n shouldForwardProp: (prop) =>\n !['customVariant', 'customColor', 'glow', 'pulse', 'animate'].includes(prop as string),\n})<{\n customVariant?: string;\n customColor?: string;\n glow?: boolean;\n pulse?: boolean;\n animate?: boolean;\n}>(({ theme, customVariant, customColor, glow, pulse, animate }) => {\n const colorPalette = getColorFromTheme(theme, customColor || customVariant || 'info');\n\n const withTint = pointerShadow(theme, colorPalette, Boolean(glow), customVariant);\n\n return {\n borderRadius: theme.spacing(ALERT_RADIUS_UNITS),\n transition: `${transition}, box-shadow ${seconds(ACTIVE.ms)} ${ALERT_EASING}`,\n position: 'relative',\n overflow: 'hidden',\n animation: animate ? `${fadeInScale} ${seconds(FADE_IN.ms)} ease-out` : 'none',\n willChange: 'transform, opacity',\n\n ...alertLayoutStyles(theme, colorPalette, animate),\n\n // Hover: one tint step, and nothing that moves. An alert is a surface\n // rather than a control, so the pointer only needs telling it is here. The\n // icon keeps its own place for the same reason — it is the variant's\n // meaning, not an affordance to animate.\n '&:hover': {\n boxShadow: withTint(HOVER.tintAlpha),\n\n '&::before': {\n opacity: 1,\n },\n },\n\n // Press: a 20% tint, landing at once and easing back. Still no geometry.\n //\n // `transition: none` here is what makes the dip INSTANT: a click's\n // `:active` lasts about as long as the finger is down, so easing into it\n // would be cut off in its first tenth and read as a flicker. The ease is on\n // the way back, governed by the root.\n //\n // Neither `:hover` nor `:focus-visible` may declare `transition`, and that\n // is not a style preference. `:active` under a mouse ALWAYS implies\n // `:hover`, so a bare shorthand in the hover block outranks the root's\n // (0,2,0 beats 0,1,0) and silently resets the timing this state rests on.\n //\n // The `:not(:has(…))` names CONTROLS, not any descendant. `:active`\n // matches an ancestor of whatever is pressed, so dismissing an alert\n // dimmed the alert being dismissed and pressing a call to action dimmed\n // the message explaining it. Excluding `:has(:active)` wholesale does not\n // work and was the first attempt: pressing the TEXT makes that text\n // `:active` too, so the guard matched on every press and the state never\n // fired at all.\n '&:active:not(:has(button:active, a:active, [role=\"button\"]:active))': {\n boxShadow: withTint(ACTIVE.tintAlpha),\n transition: 'none',\n },\n\n // Focus: `:focus-visible`, not `:focus-within`.\n //\n // The alert carries `tabIndex={0}`, so a MOUSE CLICK focused it and painted\n // the ring — a keyboard affordance answering a pointer, which is what made\n // clicking one look like an error state. `:focus-visible` is the browser's\n // own answer to \"did this focus come from the keyboard\": the ring stays for\n // whoever tabs here and never fires on a click.\n //\n // One ring, not three. It was a 3px outline at 3px offset UNDER a 6px halo,\n // and stacking two rings on one edge is what read as unfinished rather than\n // as emphasis.\n // It declares no `transition`: `outline-style` is discrete, so the ring\n // arrives at full width with only its COLOUR easing — from `currentcolor`,\n // the near-black alert ink, to the blue. That is a visible dark flash on\n // every keyboard focus, and it would also outrank the root's opacity\n // transition the way the hover block did.\n '&:focus-visible': {\n outline: `${FOCUS.ringWidth}px solid ${alpha(colorPalette.main, FOCUS.ringAlpha)}`,\n outlineOffset: `${FOCUS.offset}px`,\n },\n\n ...alertVariantStyles(theme, customVariant, colorPalette),\n ...alertEmphasisStyles(colorPalette, Boolean(glow), Boolean(pulse)),\n };\n});\n\n// glass and gradient are our own looks with no MUI severity of their own; both\n// borrow info's. danger is MUI's error.\nconst MUI_SEVERITY: Record<string, AlertColor> = {\n danger: 'error',\n glass: 'info',\n gradient: 'info',\n};\n\nconst toMuiSeverity = (variant: string): AlertColor =>\n MUI_SEVERITY[variant] ?? (variant as AlertColor);\n\nconst AlertContent: React.FC<{\n title?: AlertProps['title'];\n description?: AlertProps['description'];\n dataTestId?: string;\n children?: React.ReactNode;\n}> = ({ title, description, dataTestId, children }) => (\n <>\n {title && (\n <AlertTitle\n data-testid={testIdFor(dataTestId, 'title')}\n sx={{\n fontWeight: TITLE.fontWeight,\n fontSize: px(TITLE.fontSize),\n marginBottom: description ? TITLE.marginBottomUnits : 0,\n wordWrap: 'break-word',\n overflowWrap: 'break-word',\n wordBreak: 'break-word',\n }}\n >\n {title}\n </AlertTitle>\n )}\n {description && (\n <Box\n component=\"div\"\n data-testid={testIdFor(dataTestId, 'message')}\n sx={{\n opacity: DESCRIPTION.opacity,\n fontSize: px(DESCRIPTION.fontSize),\n wordWrap: 'break-word',\n overflowWrap: 'break-word',\n wordBreak: 'break-word',\n }}\n >\n {description}\n </Box>\n )}\n {children}\n </>\n);\n\nconst AlertCloseButton: React.FC<{ dataTestId?: string; label: string; onClose: () => void }> = ({\n dataTestId,\n label,\n onClose,\n}) => (\n <IconButton\n data-testid={testIdFor(dataTestId, 'close')}\n aria-label={label}\n color=\"inherit\"\n size=\"small\"\n onClick={onClose}\n sx={(theme) => ({\n transition,\n opacity: CLOSE_BUTTON.opacity,\n // Opacity and a wash only: the button used to spin 90deg and grow 1.1,\n // which drew the eye to the dismiss rather than to the message.\n '&:hover': {\n opacity: 1,\n backgroundColor: alpha(theme.palette.action.hover, CLOSE_BUTTON.washAlpha),\n },\n // A REAL ring, on the keyboard-only selector.\n //\n // This used to be `&:focus` setting `outline: 'none'` over a\n // `rgba(0,0,0,0.1)` wash — 1.25:1 against the info surface, and MUI's\n // ButtonBase already sets `outline: 0`, so there was no UA fallback\n // either. It went unnoticed while the ROOT still matched `:focus-within`\n // and drew a ring around the whole alert; moving the root to\n // `:focus-visible` took that away and left this button with no visible\n // focus at all. `Banner`'s dismiss already draws its own outline, so\n // this is also what keeps the two surfaces telling a keyboard user the\n // same thing.\n '&:focus-visible': {\n opacity: 1,\n // `currentColor` is the alert's own ink, inherited through\n // `color=\"inherit\"`, so the ring is drawn in whatever colour was\n // already chosen to be READ on this surface. Measured 11.2:1 on the\n // semantic variants and 5.7:1 on `gradient`.\n //\n // That is a reasoned choice, not a test-backed one, and the difference\n // matters: `alert-contrast.test.tsx` covers the ink of the four\n // semantic variants only — its `glass` case asserts the pane's alpha\n // rather than its ink, and `gradient` it does not render at all. A\n // translucent surface's contrast depends on what sits behind it, which\n // is why that test stops where it does and why this comment does not\n // borrow a guarantee it never made.\n outline: `${FOCUS.ringWidth}px solid currentColor`,\n outlineOffset: `${FOCUS.offset}px`,\n backgroundColor: alpha(theme.palette.action.focus, CLOSE_BUTTON.washAlpha),\n },\n })}\n >\n <Close fontSize=\"inherit\" />\n </IconButton>\n);\n\n/**\n * The dismiss button, or nothing.\n *\n * Reads `closeLabel` straight off the props rather than through the\n * `definedProps` merge, which would widen it to `string | undefined` and hand\n * the button an empty name. The UNION in `AlertProps` guarantees the label\n * wherever `closable` is true — that narrowing is gone inside the component,\n * which is why the fallback below exists and why it is unreachable.\n */\nfunction dismissButton(\n props: AlertProps,\n dataTestId: string | undefined,\n onClose: () => void,\n): React.JSX.Element | null {\n if (!props.closable) return null;\n return <AlertCloseButton dataTestId={dataTestId} label={props.closeLabel} onClose={onClose} />;\n}\n\nexport const Alert = React.forwardRef<HTMLDivElement, AlertProps>((alertProps, ref) => {\n const {\n variant,\n color,\n glow,\n pulse,\n icon,\n showIcon,\n onClose,\n title,\n description,\n children,\n animate,\n role,\n 'aria-atomic': ariaAtomic,\n ...others\n } = resolveAlertProps(alertProps);\n\n // Every spelling of the test id the shared contract allows, mapped to the\n // one the DOM reads and defaulted to `alert`; the native Alert does the same.\n const dataTestId = resolveTestId(others, 'alert');\n // Then the dismiss union, which `dismissButton` reads off `alertProps` rather\n // than through this destructure — so without this strip it rides `...props`\n // onto the DOM. `ALERT_DEFAULTS` supplies `closable: false`, so that happened\n // on EVERY alert, not only the closable ones.\n const props = withoutAlertOnlyProps(withoutTestIdProps(others));\n\n // Depends on `variant`, so it cannot live in the static defaults above.\n const ariaLive = alertProps['aria-live'] ?? defaultAriaLive(variant);\n const [open, setOpen] = React.useState(true);\n const [isClosing, setIsClosing] = React.useState(false);\n\n const handleClose = () => {\n setIsClosing(true);\n window.setTimeout(() => {\n setOpen(false);\n onClose?.();\n }, CLOSE_DELAY_MS);\n };\n\n const severity = toMuiSeverity(variant);\n\n const displayIcon = showIcon ? (\n <Box component=\"span\" data-testid={testIdFor(dataTestId, 'icon')}>\n {icon || getVariantIcon(variant)}\n </Box>\n ) : (\n false\n );\n\n const content = (\n <AlertContent title={title} description={description} dataTestId={dataTestId}>\n {children}\n </AlertContent>\n );\n\n return (\n <Collapse in={open && !isClosing} timeout={COLLAPSE_MS}>\n <StyledAlert\n ref={ref}\n data-testid={dataTestId}\n severity={severity}\n customVariant={variant}\n customColor={color}\n glow={glow}\n pulse={pulse}\n animate={animate}\n icon={displayIcon}\n role={role}\n aria-live={ariaLive}\n aria-atomic={ariaAtomic}\n tabIndex={0}\n action={dismissButton(alertProps, dataTestId, handleClose)}\n {...props}\n >\n {content}\n </StyledAlert>\n </Collapse>\n );\n});\n\n/**\n * The props `Alert` OWNS, which must never reach the DOM.\n *\n * `AlertProps` extends MUI's, whose rest-spread is how a host's real HTML\n * attributes get onto the root — so the same spread carries the alert's own\n * configuration unless it is named here. Everything else the component consumes\n * leaves through the destructure above; these two do not, because\n * `dismissButton` reads them off the original props to keep the dismiss union's\n * narrowing intact.\n *\n * Exported so a test can render an alert carrying every name on it and assert\n * none reaches the DOM — the check that would have caught `closable`.\n */\nexport const ALERT_ONLY_PROPS = ['closable', 'closeLabel'] as const;\n\nfunction withoutAlertOnlyProps<P extends object>(rest: P): P {\n const html = { ...rest } as Record<string, unknown>;\n for (const key of ALERT_ONLY_PROPS) delete html[key];\n return html as P;\n}\n\nAlert.displayName = 'Alert';\n"],"mappings":"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","names":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/form/CategorySelect/category-keyboard.ts"],"sourcesContent":["import { isLeafCategory, type CategoryRowRef } from './category-tree';\nimport type { CategoryGroup } from './CategorySelect.types';\n\n/** What a key handler is allowed to do to the panel. */\nexport interface CategoryKeyContext {\n rows: CategoryRowRef[];\n activeIndex: number;\n groups: CategoryGroup[];\n /** Single-select mode picks on Enter/Space instead of toggling a draft. */\n single: boolean;\n /** Categories are headings, not checkboxes, unless parents are selectable. */\n allowParentSelection: boolean;\n setActiveIndex: (next: number) => void;\n toggleExpanded: (categoryId: string) => void;\n expand: (categoryId: string) => void;\n collapse: (categoryId: string) => void;\n toggleCategory: (group: CategoryGroup) => void;\n toggleSubcategory: (id: string) => void;\n commit: () => void;\n cancel: () => void;\n pick: (id: string) => void;\n}\n\n/** The row under the keyboard cursor, if the cursor is on one. */\nfunction activeRow(context: CategoryKeyContext): CategoryRowRef | undefined {\n return context.activeIndex >= 0 ? context.rows[context.activeIndex] : undefined;\n}\n\nfunction groupOf(context: CategoryKeyContext, id: string): CategoryGroup | undefined {\n return context.groups.find((group) => group.category.id === id);\n}\n\nfunction moveCursor(context: CategoryKeyContext, delta: number): void {\n const { rows, activeIndex } = context;\n if (rows.length === 0) return;\n const next =\n delta > 0\n ? Math.min(rows.length - 1, activeIndex + 1)\n : Math.max(0, activeIndex - 1);\n context.setActiveIndex(next);\n}\n\n/** → opens a category. On a subcategory it is a no-op: there is nothing deeper. */\nfunction handleRight(context: CategoryKeyContext): void {\n const row = activeRow(context);\n if (row?.kind === 'category') context.expand(row.id);\n}\n\n/** ← collapses a category, or walks a subcategory back up to its parent. */\nfunction handleLeft(context: CategoryKeyContext): void {\n const row = activeRow(context);\n if (!row) return;\n if (row.kind === 'category') {\n context.collapse(row.id);\n return;\n }\n if (!row.parentId) return;\n context.collapse(row.parentId);\n const parentIndex = context.rows.findIndex(\n (candidate) => candidate.kind === 'category' && candidate.id === row.parentId,\n );\n if (parentIndex >= 0) context.setActiveIndex(parentIndex);\n}\n\n/**\n * What a category row does when it is activated — the one answer the click, the\n * Space key and (in single-select) Enter all take, so the three cannot disagree\n * about a row the way they did over a childless category.\n *\n * A category that is only a HEADING expands instead of marking: the row has no\n * control, so \"mark\" has nothing to mean there. A childless category is not a\n * heading — it is the leaf — so it marks.\n */\nfunction activateCategoryRow(context: CategoryKeyContext, categoryId: string): void {\n const group = groupOf(context, categoryId);\n if (!group) return;\n if (!context.allowParentSelection && !isLeafCategory(group)) {\n context.toggleExpanded(categoryId);\n return;\n }\n if (context.single) {\n context.pick(categoryId);\n return;\n }\n context.toggleCategory(group);\n}\n\n/** Space marks the row under the cursor. */\nfunction handleSpace(context: CategoryKeyContext): void {\n const row = activeRow(context);\n if (!row) return;\n if (row.kind === 'subcategory') {\n if (context.single) context.pick(row.id);\n else context.toggleSubcategory(row.id);\n return;\n }\n activateCategoryRow(context, row.id);\n}\n\nfunction handleEnter(context: CategoryKeyContext): void {\n const row = activeRow(context);\n if (!context.single) {\n context.commit();\n return;\n }\n if (!row) return;\n if (row.kind === 'subcategory') {\n context.pick(row.id);\n return;\n }\n activateCategoryRow(context, row.id);\n}\n\n/** Key → behaviour. A map keeps this dispatch flat instead of a long if-chain. */\nconst HANDLERS: Record<string, (context: CategoryKeyContext) => void> = {\n ArrowDown: (context) => moveCursor(context, 1),\n ArrowUp: (context) => moveCursor(context, -1),\n ArrowRight: handleRight,\n ArrowLeft: handleLeft,\n ' ': handleSpace,\n Enter: handleEnter,\n Escape: (context) => context.cancel(),\n};\n\n/**\n * Keys the SEARCH BOX has a claim on: Space types a space, and the horizontal\n * arrows move the caret.\n *\n * They are only yielded while the field actually holds text. The panel opens\n * with focus in an EMPTY search box, so yielding unconditionally — as the\n * prototype does — would make Space and ←/→ dead on arrival for anyone driving\n * the tree from the keyboard, which is most of the point of having it. With no\n * text there is no caret to move and no word to space, so the tree takes them;\n * type one character and they revert to the field.\n */\nconst TEXT_ENTRY_KEYS = new Set([' ', 'ArrowLeft', 'ArrowRight']);\n\n/**\n * Drive the tree from the keyboard.\n *\n * Returns `true` when the key was consumed, so the caller can `preventDefault`\n * only for keys this actually handled — an unhandled key must still reach the\n * search input untouched.\n */\nexport function handleCategoryKeyDown(\n key: string,\n editingSearchText: boolean,\n context: CategoryKeyContext,\n): boolean {\n if (editingSearchText && TEXT_ENTRY_KEYS.has(key)) return false;\n const handler = HANDLERS[key];\n if (!handler) return false;\n handler(context);\n return true;\n}\n"],"mappings":";;;;;AAwBA,SAAS,UAAU,SAAyD;AAC1E,SAAO,QAAQ,eAAe,IAAI,QAAQ,KAAK,QAAQ,WAAW,IAAI;AACxE;AAEA,SAAS,QAAQ,SAA6B,IAAuC;AACnF,SAAO,QAAQ,OAAO,KAAK,CAAC,UAAU,MAAM,SAAS,OAAO,EAAE;AAChE;AAEA,SAAS,WAAW,SAA6B,OAAqB;AACpE,QAAM,EAAE,MAAM,YAAY,IAAI;AAC9B,MAAI,KAAK,WAAW,EAAG;AACvB,QAAM,OACJ,QAAQ,IACJ,KAAK,IAAI,KAAK,SAAS,GAAG,cAAc,CAAC,IACzC,KAAK,IAAI,GAAG,cAAc,CAAC;AACjC,UAAQ,eAAe,IAAI;AAC7B;AAGA,SAAS,YAAY,SAAmC;AACtD,QAAM,MAAM,UAAU,OAAO;AAC7B,MAAI,KAAK,SAAS,WAAY,SAAQ,OAAO,IAAI,EAAE;AACrD;AAGA,SAAS,WAAW,SAAmC;AACrD,QAAM,MAAM,UAAU,OAAO;AAC7B,MAAI,CAAC,IAAK;AACV,MAAI,IAAI,SAAS,YAAY;AAC3B,YAAQ,SAAS,IAAI,EAAE;AACvB;AAAA,EACF;AACA,MAAI,CAAC,IAAI,SAAU;AACnB,UAAQ,SAAS,IAAI,QAAQ;AAC7B,QAAM,cAAc,QAAQ,KAAK;AAAA,IAC/B,CAAC,cAAc,UAAU,SAAS,cAAc,UAAU,OAAO,IAAI;AAAA,EACvE;AACA,MAAI,eAAe,EAAG,SAAQ,eAAe,WAAW;AAC1D;AAWA,SAAS,oBAAoB,SAA6B,YAA0B;AAClF,QAAM,QAAQ,QAAQ,SAAS,UAAU;AACzC,MAAI,CAAC,MAAO;AACZ,MAAI,CAAC,QAAQ,wBAAwB,CAAC,eAAe,KAAK,GAAG;AAC3D,YAAQ,eAAe,UAAU;AACjC;AAAA,EACF;AACA,MAAI,QAAQ,QAAQ;AAClB,YAAQ,KAAK,UAAU;AACvB;AAAA,EACF;AACA,UAAQ,eAAe,KAAK;AAC9B;AAGA,SAAS,YAAY,SAAmC;AACtD,QAAM,MAAM,UAAU,OAAO;AAC7B,MAAI,CAAC,IAAK;AACV,MAAI,IAAI,SAAS,eAAe;AAC9B,QAAI,QAAQ,OAAQ,SAAQ,KAAK,IAAI,EAAE;AAAA,QAClC,SAAQ,kBAAkB,IAAI,EAAE;AACrC;AAAA,EACF;AACA,sBAAoB,SAAS,IAAI,EAAE;AACrC;AAEA,SAAS,YAAY,SAAmC;AACtD,QAAM,MAAM,UAAU,OAAO;AAC7B,MAAI,CAAC,QAAQ,QAAQ;AACnB,YAAQ,OAAO;AACf;AAAA,EACF;AACA,MAAI,CAAC,IAAK;AACV,MAAI,IAAI,SAAS,eAAe;AAC9B,YAAQ,KAAK,IAAI,EAAE;AACnB;AAAA,EACF;AACA,sBAAoB,SAAS,IAAI,EAAE;AACrC;AAGA,IAAM,WAAkE;AAAA,EACtE,WAAW,CAAC,YAAY,WAAW,SAAS,CAAC;AAAA,EAC7C,SAAS,CAAC,YAAY,WAAW,SAAS,EAAE;AAAA,EAC5C,YAAY;AAAA,EACZ,WAAW;AAAA,EACX,KAAK;AAAA,EACL,OAAO;AAAA,EACP,QAAQ,CAAC,YAAY,QAAQ,OAAO;AACtC;AAaA,IAAM,kBAAkB,oBAAI,IAAI,CAAC,KAAK,aAAa,YAAY,CAAC;AASzD,SAAS,sBACd,KACA,mBACA,SACS;AACT,MAAI,qBAAqB,gBAAgB,IAAI,GAAG,EAAG,QAAO;AAC1D,QAAM,UAAU,SAAS,GAAG;AAC5B,MAAI,CAAC,QAAS,QAAO;AACrB,UAAQ,OAAO;AACf,SAAO;AACT;","names":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/form/CategorySelect/CategoryQuickActions.tsx"],"sourcesContent":["'use client';\n\nimport Box from '@mui/material/Box/index.js';\nimport { useMemo } from 'react';\n\nimport type { CategorySelectCopy } from '../../../copy';\n\nimport { collectLeafIds } from './category-tree';\nimport type { CategorySelectState } from './useCategorySelect';\n\n/** The panel's text-button treatment. */\nconst linkButtonSx = {\n background: 'none',\n border: 0,\n padding: 0,\n font: 'inherit',\n fontSize: 12,\n color: 'primary.main',\n cursor: 'pointer',\n fontWeight: 550,\n '&:hover': { textDecoration: 'underline' },\n '&:disabled': { color: 'text.disabled', cursor: 'default', textDecoration: 'none' },\n} as const;\n\n/**\n * Bulk actions for multi-select: mark everything, and fold everything.\n *\n * Both labels flip to their inverse once the action is spent (\"Desmarcar tudo\",\n * \"Recolher tudo\"), so the control always says what pressing it will do rather\n * than what state the list is in.\n */\nexport function CategoryQuickActions({\n state,\n dataTestId,\n copy,\n}: {\n state: CategorySelectState;\n dataTestId: string;\n /** The words this control renders. REQUIRED — no default copy. */\n copy: CategorySelectCopy;\n}): React.JSX.Element {\n const allLeafIds = useMemo(() => collectLeafIds(state.allGroups), [state.allGroups]);\n const everythingPicked = allLeafIds.length > 0 && state.draft.size >= allLeafIds.length;\n const allExpanded =\n state.allGroups.length > 0 &&\n state.allGroups.every((group) => state.isExpanded(group.category.id));\n\n return (\n <>\n <Box\n component=\"button\"\n type=\"button\"\n disabled={allLeafIds.length === 0}\n data-testid={`${dataTestId}-select-all`}\n sx={linkButtonSx}\n onClick={() => state.setDraft(everythingPicked ? new Set() : new Set(allLeafIds))}\n >\n {everythingPicked ? copy.deselectAll : copy.selectAll}\n </Box>\n <Box component=\"span\" sx={{ color: 'divider' }}>\n ·\n </Box>\n <Box\n component=\"button\"\n type=\"button\"\n data-testid={`${dataTestId}-expand-all`}\n sx={linkButtonSx}\n onClick={() => state.setAllExpanded(!allExpanded)}\n >\n {allExpanded ? copy.collapseAll : copy.expandAll}\n </Box>\n </>\n );\n}\n"],"mappings":";;;;;AAEA,OAAO,SAAS;AAChB,SAAS,eAAe;AA6CpB,mBACE,KADF;AArCJ,IAAM,eAAe;AAAA,EACnB,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,MAAM;AAAA,EACN,UAAU;AAAA,EACV,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,YAAY;AAAA,EACZ,WAAW,EAAE,gBAAgB,YAAY;AAAA,EACzC,cAAc,EAAE,OAAO,iBAAiB,QAAQ,WAAW,gBAAgB,OAAO;AACpF;AASO,SAAS,qBAAqB;AAAA,EACnC;AAAA,EACA;AAAA,EACA;AACF,GAKsB;AACpB,QAAM,aAAa,QAAQ,MAAM,eAAe,MAAM,SAAS,GAAG,CAAC,MAAM,SAAS,CAAC;AACnF,QAAM,mBAAmB,WAAW,SAAS,KAAK,MAAM,MAAM,QAAQ,WAAW;AACjF,QAAM,cACJ,MAAM,UAAU,SAAS,KACzB,MAAM,UAAU,MAAM,CAAC,UAAU,MAAM,WAAW,MAAM,SAAS,EAAE,CAAC;AAEtE,SACE,iCACE;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,MAAK;AAAA,QACL,UAAU,WAAW,WAAW;AAAA,QAChC,eAAa,GAAG,UAAU;AAAA,QAC1B,IAAI;AAAA,QACJ,SAAS,MAAM,MAAM,SAAS,mBAAmB,oBAAI,IAAI,IAAI,IAAI,IAAI,UAAU,CAAC;AAAA,QAE/E,6BAAmB,KAAK,cAAc,KAAK;AAAA;AAAA,IAC9C;AAAA,IACA,oBAAC,OAAI,WAAU,QAAO,IAAI,EAAE,OAAO,UAAU,GAAG,kBAEhD;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,MAAK;AAAA,QACL,eAAa,GAAG,UAAU;AAAA,QAC1B,IAAI;AAAA,QACJ,SAAS,MAAM,MAAM,eAAe,CAAC,WAAW;AAAA,QAE/C,wBAAc,KAAK,cAAc,KAAK;AAAA;AAAA,IACzC;AAAA,KACF;AAEJ;","names":[]}
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|
|
File without changes
|