npm - @salt-ds/lab - Versions diffs - 1.0.0-alpha.73 → 1.0.0-alpha.75 - Mend

@salt-ds/lab 1.0.0-alpha.73 → 1.0.0-alpha.75

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.

Files changed (454) hide show

package/dist-es/common-hooks/utils/collection-item-utils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"collection-item-utils.js","sources":["../src/common-hooks/utils/collection-item-utils.ts"],"sourcesContent":["import {\n Children,\n isValidElement,\n type ReactElement,\n type ReactNode,\n} from \"react\";\n\n// TODO how do we configure these\nimport { ListItemGroup } from \"../../list/ListItemGroup\";\nimport { ListItemHeader } from \"../../list/ListItemHeader\";\nimport type {\n CollectionItem,\n CollectionOptions,\n SourceGroup,\n} from \"../collectionTypes\";\nimport { itemToString as defaultItemToString } from \"../itemToString\";\n\ntype NonFocusableElement = ReactElement<{ focusable: false }>;\ntype DisablableElement = ReactElement<{ disabled: boolean }>;\ntype SelectableElement = ReactElement<{ selectable: boolean }>;\n\nexport const sourceItemHasProp = (\n item: unknown,\n propertyName: string,\n): boolean => {\n return (\n item !== null &&\n typeof item === \"object\" &&\n Object.hasOwn(item, propertyName)\n );\n};\n\nexport const isHeader = (item: unknown): boolean =>\n sourceItemHasProp(item, \"header\");\n\nexport const isGroupNode = (item: unknown): boolean =>\n sourceItemHasProp(item, \"childNodes\");\n\nconst childItemHasProp = (item: ReactElement, propertyName: string) => {\n return item && Object.hasOwn(item.props, propertyName);\n};\n\nexport const isDisabled = (item: unknown): boolean => {\n if (isValidElement(item as DisablableElement)) {\n if (childItemHasProp(item as DisablableElement, \"disabled\")) {\n return (item as DisablableElement).props.disabled === true;\n }\n } else if (sourceItemHasProp(item, \"disabled\")) {\n return (item as { disabled: boolean }).disabled === true;\n }\n\n return false;\n};\n\nexport const isFocusable = (item: unknown): boolean => {\n if (isValidElement(item as NonFocusableElement)) {\n if (childItemHasProp(item as NonFocusableElement, \"focusable\")) {\n return (item as NonFocusableElement).props.focusable;\n }\n }\n return true;\n};\n\nexport const countChildItems = <Item>(\n item: CollectionItem<Item>,\n items: CollectionItem<Item>[],\n idx: number,\n): number => {\n if (item.childNodes) {\n return item.childNodes.length;\n }\n if (item.header) {\n let i = idx + 1;\n let count = 0;\n while (i < items.length && !items[i].header) {\n count++;\n i++;\n }\n return count;\n }\n return 0;\n};\n\nexport const getChildLabel = (\n element: ReactElement<{\n children?: ReactNode;\n label?: string;\n title?: string;\n }>,\n): string \| undefined => {\n if (typeof element.props.children === \"string\") {\n return element.props.children;\n }\n if (element.props.title) {\n return element.props.title;\n }\n if (element.props.label) {\n return element.props.label;\n }\n};\n\nconst childIsHeader = (child: ReactElement) =>\n child.type === ListItemHeader \|\| childItemHasProp(child, \"data-header\");\n\nexport const childIsGroup = (child: ReactElement): boolean =>\n child.type === ListItemGroup \|\| childItemHasProp(child, \"data-group\");\n\nconst childIsSelectable = (child: ReactElement) => {\n if (childItemHasProp(child, \"selectable\")) {\n return (child as SelectableElement).props.selectable === true;\n }\n return !childIsGroup(child) && !childIsHeader(child);\n};\n\nexport const getChildNodes = (\n element: ReactElement,\n): CollectionItem<ReactElement>[] \| undefined => {\n if (childIsGroup(element)) {\n const {\n props: { children },\n } = element as ReactElement<{ children?: ReactNode }>;\n if (typeof children !== \"string\") {\n return childItems(children);\n }\n }\n};\n\nconst mapReactElementChildren = (\n children: ReactNode,\n fn: (el: ReactElement) => CollectionItem<ReactElement>,\n): CollectionItem<ReactElement>[] => {\n const childElements: CollectionItem<ReactElement>[] = [];\n Children.forEach(children, (child) => {\n if (isValidElement(child)) {\n childElements.push(fn(child));\n }\n });\n return childElements;\n};\n\ntype ListItemElementProps = {\n \"data-id\"?: string;\n disabled?: boolean;\n id?: string;\n \"data-expanded\"?: boolean;\n expanded?: boolean;\n};\n\ntype CollectionItemWithoutId<T> = Omit<CollectionItem<T>, \"id\">;\n\nexport const sourceItems = <T>(\n source?: ReadonlyArray<T>,\n options?: CollectionOptions<T>,\n): CollectionItemWithoutId<T>[] \| undefined => {\n if (Array.isArray(source)) {\n if (source.length === 0 && options?.noChildrenLabel) {\n return [\n {\n label: options.noChildrenLabel,\n value: null,\n },\n ];\n }\n return source.map(\n (item: { description?: string; expanded?: boolean }, index) =>\n ({\n childNodes: sourceItems(\n (item as unknown as SourceGroup<T>).childNodes,\n options,\n ),\n description: item.description,\n expanded: item.expanded,\n value: item,\n label:\n options?.itemToString?.(item as T) ?? defaultItemToString(item),\n }) as CollectionItemWithoutId<T>,\n );\n }\n if (source) {\n throw Error(\"list-child-items expects source to be an array\");\n }\n};\n\nexport const childItems = (\n children: ReactNode,\n): CollectionItem<ReactElement>[] \| undefined => {\n if (children) {\n return mapReactElementChildren(children, (child) => {\n const {\n \"data-id\": dataId,\n disabled,\n id = dataId,\n \"data-expanded\": dataExpanded,\n expanded = dataExpanded,\n } = (child as ReactElement<ListItemElementProps>).props;\n return {\n childNodes: getChildNodes(child),\n disabled,\n expanded,\n header: childIsHeader(child),\n id,\n label: getChildLabel(child),\n selectable: childIsSelectable(child),\n value: child,\n } as CollectionItem<ReactElement>;\n });\n }\n};\n\nconst PathSeparators = new Set<string>([\"/\", \"-\", \".\"]);\n// TODO where do we define or identify separators\nconst isPathSeparator = (char: string) => PathSeparators.has(char);\n\nexport const isParentPath = (parentPath: string, childPath: string): boolean =>\n childPath.startsWith(parentPath) &&\n isPathSeparator(childPath[parentPath.length]);\n\nconst PATH_SEPARATORS = new Set([\".\", \"/\"]);\n\nfunction isDescendantOf(basePath: string, targetPath: string) {\n if (!targetPath.startsWith(basePath)) {\n return false;\n }\n return PATH_SEPARATORS.has(targetPath.charAt(basePath.length));\n}\n\nexport function replaceCollectionItem<Item>(\n nodes: CollectionItem<Item>[],\n id: string,\n props: Partial<CollectionItem<Item>>,\n): CollectionItem<Item>[] {\n let childNodes: CollectionItem<Item>[];\n const newNodes: CollectionItem<Item>[] = nodes.map((node) => {\n if (node.id === id) {\n return {\n ...node,\n ...props,\n };\n }\n if (isDescendantOf(node.id, id) && node.childNodes) {\n childNodes = replaceCollectionItem<Item>(node.childNodes, id, props);\n return {\n ...node,\n childNodes,\n };\n }\n return node;\n });\n\n return newNodes;\n}\n"],"names":["defaultItemToString"],"mappings":"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"}
1	+ {"version":3,"file":"collection-item-utils.js","sources":["../src/common-hooks/utils/collection-item-utils.ts"],"sourcesContent":["import {\n Children,\n isValidElement,\n type ReactElement,\n type ReactNode,\n} from \"react\";\n\n// TODO how do we configure these\nimport { ListItemGroup } from \"../../list/ListItemGroup\";\nimport { ListItemHeader } from \"../../list/ListItemHeader\";\nimport type {\n CollectionItem,\n CollectionOptions,\n SourceGroup,\n} from \"../collectionTypes\";\nimport { itemToString as defaultItemToString } from \"../itemToString\";\n\ntype NonFocusableElement = ReactElement<{ focusable: false }>;\ntype DisablableElement = ReactElement<{ disabled: boolean }>;\ntype SelectableElement = ReactElement<{ selectable: boolean }>;\n\nexport const sourceItemHasProp = (\n item: unknown,\n propertyName: string,\n): boolean => {\n return (\n item !== null &&\n typeof item === \"object\" &&\n Object.hasOwn(item, propertyName)\n );\n};\n\nexport const isHeader = (item: unknown): boolean =>\n sourceItemHasProp(item, \"header\");\n\nexport const isGroupNode = (item: unknown): boolean =>\n sourceItemHasProp(item, \"childNodes\");\n\nconst childItemHasProp = (item: ReactElement, propertyName: string) => {\n return item && Object.hasOwn(item.props, propertyName);\n};\n\nexport const isDisabled = (item: unknown): boolean => {\n if (isValidElement(item as DisablableElement)) {\n if (childItemHasProp(item as DisablableElement, \"disabled\")) {\n return (item as DisablableElement).props.disabled === true;\n }\n } else if (sourceItemHasProp(item, \"disabled\")) {\n return (item as { disabled: boolean }).disabled === true;\n }\n\n return false;\n};\n\nexport const isFocusable = (item: unknown): boolean => {\n if (isValidElement(item as NonFocusableElement)) {\n if (childItemHasProp(item as NonFocusableElement, \"focusable\")) {\n return (item as NonFocusableElement).props.focusable;\n }\n }\n return true;\n};\n\nexport const countChildItems = <Item>(\n item: CollectionItem<Item>,\n items: CollectionItem<Item>[],\n idx: number,\n): number => {\n if (item.childNodes) {\n return item.childNodes.length;\n }\n if (item.header) {\n let i = idx + 1;\n let count = 0;\n while (i < items.length && !items[i].header) {\n count++;\n i++;\n }\n return count;\n }\n return 0;\n};\n\nexport const getChildLabel = (\n element: ReactElement<{\n children?: ReactNode;\n label?: string;\n title?: string;\n }>,\n): string \| undefined => {\n if (typeof element.props.children === \"string\") {\n return element.props.children;\n }\n if (element.props.title) {\n return element.props.title;\n }\n if (element.props.label) {\n return element.props.label;\n }\n};\n\nconst childIsHeader = (child: ReactElement) =>\n child.type === ListItemHeader \|\| childItemHasProp(child, \"data-header\");\n\nexport const childIsGroup = (child: ReactElement): boolean =>\n child.type === ListItemGroup \|\| childItemHasProp(child, \"data-group\");\n\nconst childIsSelectable = (child: ReactElement) => {\n if (childItemHasProp(child, \"selectable\")) {\n return (child as SelectableElement).props.selectable === true;\n }\n return !childIsGroup(child) && !childIsHeader(child);\n};\n\nexport const getChildNodes = (\n element: ReactElement,\n): CollectionItem<ReactElement>[] \| undefined => {\n if (childIsGroup(element)) {\n const {\n props: { children },\n } = element as ReactElement<{ children?: ReactNode }>;\n if (typeof children !== \"string\") {\n return childItems(children);\n }\n }\n};\n\nconst mapReactElementChildren = (\n children: ReactNode,\n fn: (el: ReactElement) => CollectionItem<ReactElement>,\n): CollectionItem<ReactElement>[] => {\n const childElements: CollectionItem<ReactElement>[] = [];\n Children.forEach(children, (child) => {\n if (isValidElement(child)) {\n childElements.push(fn(child));\n }\n });\n return childElements;\n};\n\ntype ListItemElementProps = {\n \"data-id\"?: string;\n disabled?: boolean;\n id?: string;\n \"data-expanded\"?: boolean;\n expanded?: boolean;\n};\n\ntype CollectionItemWithoutId<T> = Omit<CollectionItem<T>, \"id\">;\n\nexport const sourceItems = <T>(\n source?: ReadonlyArray<T>,\n options?: CollectionOptions<T>,\n): CollectionItemWithoutId<T>[] \| undefined => {\n if (Array.isArray(source)) {\n if (source.length === 0 && options?.noChildrenLabel) {\n return [\n {\n label: options.noChildrenLabel,\n value: null,\n },\n ];\n }\n return source.map(\n (item: { description?: string; expanded?: boolean }) =>\n ({\n childNodes: sourceItems(\n (item as unknown as SourceGroup<T>).childNodes,\n options,\n ),\n description: item.description,\n expanded: item.expanded,\n value: item,\n label:\n options?.itemToString?.(item as T) ?? defaultItemToString(item),\n }) as CollectionItemWithoutId<T>,\n );\n }\n if (source) {\n throw Error(\"list-child-items expects source to be an array\");\n }\n};\n\nexport const childItems = (\n children: ReactNode,\n): CollectionItem<ReactElement>[] \| undefined => {\n if (children) {\n return mapReactElementChildren(children, (child) => {\n const {\n \"data-id\": dataId,\n disabled,\n id = dataId,\n \"data-expanded\": dataExpanded,\n expanded = dataExpanded,\n } = (child as ReactElement<ListItemElementProps>).props;\n return {\n childNodes: getChildNodes(child),\n disabled,\n expanded,\n header: childIsHeader(child),\n id,\n label: getChildLabel(child),\n selectable: childIsSelectable(child),\n value: child,\n } as CollectionItem<ReactElement>;\n });\n }\n};\n\nconst PathSeparators = new Set<string>([\"/\", \"-\", \".\"]);\n// TODO where do we define or identify separators\nconst isPathSeparator = (char: string) => PathSeparators.has(char);\n\nexport const isParentPath = (parentPath: string, childPath: string): boolean =>\n childPath.startsWith(parentPath) &&\n isPathSeparator(childPath[parentPath.length]);\n\nconst PATH_SEPARATORS = new Set([\".\", \"/\"]);\n\nfunction isDescendantOf(basePath: string, targetPath: string) {\n if (!targetPath.startsWith(basePath)) {\n return false;\n }\n return PATH_SEPARATORS.has(targetPath.charAt(basePath.length));\n}\n\nexport function replaceCollectionItem<Item>(\n nodes: CollectionItem<Item>[],\n id: string,\n props: Partial<CollectionItem<Item>>,\n): CollectionItem<Item>[] {\n let childNodes: CollectionItem<Item>[];\n const newNodes: CollectionItem<Item>[] = nodes.map((node) => {\n if (node.id === id) {\n return {\n ...node,\n ...props,\n };\n }\n if (isDescendantOf(node.id, id) && node.childNodes) {\n childNodes = replaceCollectionItem<Item>(node.childNodes, id, props);\n return {\n ...node,\n childNodes,\n };\n }\n return node;\n });\n\n return newNodes;\n}\n"],"names":["defaultItemToString"],"mappings":"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"}

package/dist-es/contact-details/ContactAction.js CHANGED Viewed

@@ -12,6 +12,7 @@ const ContactAction = forwardRef(
         placement: "top",
         disabled: !accessibleText,
         content: accessibleText,
+        ...tooltipProps,
         children: /* @__PURE__ */ jsx(Button, { variant: "secondary", ref, ...restProps, children: label ? label : Icon ? /* @__PURE__ */ jsx(Icon, {}) : null })
       }
     );

package/dist-es/contact-details/ContactAction.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ContactAction.js","sources":["../src/contact-details/ContactAction.tsx"],"sourcesContent":["import {\n Button,\n type ButtonProps,\n Tooltip,\n type TooltipProps,\n} from \"@salt-ds/core\";\nimport type { IconProps } from \"@salt-ds/icons\";\nimport { type ComponentType, forwardRef } from \"react\";\n\nexport type ContactActionProps = ButtonProps & {\n accessibleText?: string;\n tooltipProps?: TooltipProps;\n} & (\n \| {\n label: string;\n icon?: ComponentType<IconProps>;\n }\n \| {\n label?: string;\n icon: ComponentType<IconProps>;\n }\n );\n\nexport const ContactAction = forwardRef<HTMLButtonElement, ContactActionProps>(\n function ContactAction(props, ref) {\n const { label, icon, accessibleText, tooltipProps, ...restProps } = props;\n\n const Icon = icon;\n\n return (\n <Tooltip\n placement=\"top\"\n disabled={!accessibleText}\n content={accessibleText}\n >\n <Button variant=\"secondary\" ref={ref} {...restProps}>\n {label ? label : Icon ? <Icon /> : null}\n </Button>\n </Tooltip>\n );\n },\n);\n"],"names":["ContactAction"],"mappings":";;;;AAuBO,MAAM,aAAgB,GAAA,UAAA;AAAA,EAC3B,SAASA,cAAc,CAAA,KAAA,EAAO,GAAK,EAAA;AACjC,IAAA,MAAM,EAAE,KAAO,EAAA,IAAA,EAAM,gBAAgB,YAAc,EAAA,GAAG,WAAc,GAAA,KAAA;AAEpE,IAAA,MAAM,IAAO,GAAA,IAAA;AAEb,IACE,uBAAA,GAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACC,SAAU,EAAA,KAAA;AAAA,QACV,UAAU,CAAC,cAAA;AAAA,QACX,OAAS,EAAA,cAAA;AAAA,~~QAET~~,QAAC,kBAAA,GAAA,CAAA,MAAA,EAAA,EAAO,OAAQ,EAAA,WAAA,EAAY,GAAW,EAAA,GAAG,SACvC,EAAA,QAAA,EAAA,KAAA,GAAQ,KAAQ,GAAA,IAAA,mBAAQ,GAAA,CAAA,IAAA,EAAA,EAAK,IAAK,IACrC,EAAA;AAAA;AAAA,KACF;AAAA;AAGN;;;;"}
1	+ {"version":3,"file":"ContactAction.js","sources":["../src/contact-details/ContactAction.tsx"],"sourcesContent":["import {\n Button,\n type ButtonProps,\n Tooltip,\n type TooltipProps,\n} from \"@salt-ds/core\";\nimport type { IconProps } from \"@salt-ds/icons\";\nimport { type ComponentType, forwardRef } from \"react\";\n\nexport type ContactActionProps = ButtonProps & {\n accessibleText?: string;\n tooltipProps?: TooltipProps;\n} & (\n \| {\n label: string;\n icon?: ComponentType<IconProps>;\n }\n \| {\n label?: string;\n icon: ComponentType<IconProps>;\n }\n );\n\nexport const ContactAction = forwardRef<HTMLButtonElement, ContactActionProps>(\n function ContactAction(props, ref) {\n const { label, icon, accessibleText, tooltipProps, ...restProps } = props;\n\n const Icon = icon;\n\n return (\n <Tooltip\n placement=\"top\"\n disabled={!accessibleText}\n content={accessibleText}\n {...tooltipProps}\n >\n <Button variant=\"secondary\" ref={ref} {...restProps}>\n {label ? label : Icon ? <Icon /> : null}\n </Button>\n </Tooltip>\n );\n },\n);\n"],"names":["ContactAction"],"mappings":";;;;AAuBO,MAAM,aAAgB,GAAA,UAAA;AAAA,EAC3B,SAASA,cAAc,CAAA,KAAA,EAAO,GAAK,EAAA;AACjC,IAAA,MAAM,EAAE,KAAO,EAAA,IAAA,EAAM,gBAAgB,YAAc,EAAA,GAAG,WAAc,GAAA,KAAA;AAEpE,IAAA,MAAM,IAAO,GAAA,IAAA;AAEb,IACE,uBAAA,GAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACC,SAAU,EAAA,KAAA;AAAA,QACV,UAAU,CAAC,cAAA;AAAA,QACX,OAAS,EAAA,cAAA;AAAA,QACR,GAAG,YAAA;AAAA,QAEJ,QAAC,kBAAA,GAAA,CAAA,MAAA,EAAA,EAAO,OAAQ,EAAA,WAAA,EAAY,GAAW,EAAA,GAAG,SACvC,EAAA,QAAA,EAAA,KAAA,GAAQ,KAAQ,GAAA,IAAA,mBAAQ,GAAA,CAAA,IAAA,EAAA,EAAK,IAAK,IACrC,EAAA;AAAA;AAAA,KACF;AAAA;AAGN;;;;"}

package/dist-es/contact-details/ContactSecondaryInfo.js CHANGED Viewed

@@ -12,7 +12,7 @@ const ContactSecondaryInfo = forwardRef(function ContactSecondaryInfo2(props, re
     text,
     icon: Icon,
     className,
-    ValueComponent,
+    ValueComponent: _ValueComponent,
     ...restProps
   } = props;
   const { setSecondary, setSecondaryId, variant } = useContactDetailsContext();

package/dist-es/contact-details/ContactSecondaryInfo.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ContactSecondaryInfo.js","sources":["../src/contact-details/ContactSecondaryInfo.tsx"],"sourcesContent":["import { makePrefixer, Text, useId } from \"@salt-ds/core\";\nimport type { IconProps } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentType,\n forwardRef,\n type HTMLAttributes,\n useEffect,\n} from \"react\";\nimport { useContactDetailsContext } from \"./internal\";\nimport type { ValueComponentProps } from \"./types\";\n\nconst withBaseName = makePrefixer(\"saltContactSecondaryInfo\");\n\nexport interface ContactSecondaryInfoProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"color\"> {\n icon?: ComponentType<IconProps>;\n text: string;\n ValueComponent?: ComponentType<ValueComponentProps>;\n}\n\nexport const ContactSecondaryInfo = forwardRef<\n HTMLDivElement,\n ContactSecondaryInfoProps\n>(function ContactSecondaryInfo(props, ref) {\n const {\n id: idProp,\n text,\n icon: Icon,\n className,\n ValueComponent,\n ...restProps\n } = props;\n const { setSecondary, setSecondaryId, variant } = useContactDetailsContext();\n const id = useId(idProp);\n\n useEffect(() => {\n setSecondary(text \|\| \"\");\n setSecondaryId(id);\n return () => {\n setSecondary(undefined);\n setSecondaryId(undefined);\n };\n }, [id, text, setSecondary, setSecondaryId]);\n\n return (\n <Text\n styleAs={variant === \"default\" ? \"h4\" : undefined}\n maxRows={1}\n {...restProps}\n id={id}\n ref={ref}\n className={clsx(withBaseName(), className)}\n data-testid=\"secondary\"\n >\n {Icon ? <Icon className={withBaseName(\"icon\")} /> : null}\n {text}\n </Text>\n );\n});\n"],"names":["ContactSecondaryInfo"],"mappings":";;;;;;;AAYA,MAAM,YAAA,GAAe,aAAa,0BAA0B,CAAA;AASrD,MAAM,oBAAuB,GAAA,UAAA,CAGlC,SAASA,qBAAAA,CAAqB,OAAO,GAAK,EAAA;AAC1C,EAAM,MAAA;AAAA,IACJ,EAAI,EAAA,MAAA;AAAA,IACJ,IAAA;AAAA,IACA,IAAM,EAAA,IAAA;AAAA,IACN,SAAA;AAAA,IACA,~~cAAA~~;AAAA,~~IACA~~,GAAG;AAAA,GACD,GAAA,KAAA;AACJ,EAAA,MAAM,EAAE,YAAA,EAAc,cAAgB,EAAA,OAAA,KAAY,wBAAyB,EAAA;AAC3E,EAAM,MAAA,EAAA,GAAK,MAAM,MAAM,CAAA;AAEvB,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,YAAA,CAAa,QAAQ,EAAE,CAAA;AACvB,IAAA,cAAA,CAAe,EAAE,CAAA;AACjB,IAAA,OAAO,MAAM;AACX,MAAA,YAAA,CAAa,MAAS,CAAA;AACtB,MAAA,cAAA,CAAe,MAAS,CAAA;AAAA,KAC1B;AAAA,KACC,CAAC,EAAA,EAAI,IAAM,EAAA,YAAA,EAAc,cAAc,CAAC,CAAA;AAE3C,EACE,uBAAA,IAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,OAAA,EAAS,OAAY,KAAA,SAAA,GAAY,IAAO,GAAA,MAAA;AAAA,MACxC,OAAS,EAAA,CAAA;AAAA,MACR,GAAG,SAAA;AAAA,MACJ,EAAA;AAAA,MACA,GAAA;AAAA,MACA,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,aAAY,EAAA,WAAA;AAAA,MAEX,QAAA,EAAA;AAAA,QAAA,IAAA,uBAAQ,IAAK,EAAA,EAAA,SAAA,EAAW,YAAa,CAAA,MAAM,GAAG,CAAK,GAAA,IAAA;AAAA,QACnD;AAAA;AAAA;AAAA,GACH;AAEJ,CAAC;;;;"}
1	+ {"version":3,"file":"ContactSecondaryInfo.js","sources":["../src/contact-details/ContactSecondaryInfo.tsx"],"sourcesContent":["import { makePrefixer, Text, useId } from \"@salt-ds/core\";\nimport type { IconProps } from \"@salt-ds/icons\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentType,\n forwardRef,\n type HTMLAttributes,\n useEffect,\n} from \"react\";\nimport { useContactDetailsContext } from \"./internal\";\nimport type { ValueComponentProps } from \"./types\";\n\nconst withBaseName = makePrefixer(\"saltContactSecondaryInfo\");\n\nexport interface ContactSecondaryInfoProps\n extends Omit<HTMLAttributes<HTMLDivElement>, \"color\"> {\n icon?: ComponentType<IconProps>;\n text: string;\n ValueComponent?: ComponentType<ValueComponentProps>;\n}\n\nexport const ContactSecondaryInfo = forwardRef<\n HTMLDivElement,\n ContactSecondaryInfoProps\n>(function ContactSecondaryInfo(props, ref) {\n const {\n id: idProp,\n text,\n icon: Icon,\n className,\n ValueComponent: _ValueComponent,\n ...restProps\n } = props;\n const { setSecondary, setSecondaryId, variant } = useContactDetailsContext();\n const id = useId(idProp);\n\n useEffect(() => {\n setSecondary(text \|\| \"\");\n setSecondaryId(id);\n return () => {\n setSecondary(undefined);\n setSecondaryId(undefined);\n };\n }, [id, text, setSecondary, setSecondaryId]);\n\n return (\n <Text\n styleAs={variant === \"default\" ? \"h4\" : undefined}\n maxRows={1}\n {...restProps}\n id={id}\n ref={ref}\n className={clsx(withBaseName(), className)}\n data-testid=\"secondary\"\n >\n {Icon ? <Icon className={withBaseName(\"icon\")} /> : null}\n {text}\n </Text>\n );\n});\n"],"names":["ContactSecondaryInfo"],"mappings":";;;;;;;AAYA,MAAM,YAAA,GAAe,aAAa,0BAA0B,CAAA;AASrD,MAAM,oBAAuB,GAAA,UAAA,CAGlC,SAASA,qBAAAA,CAAqB,OAAO,GAAK,EAAA;AAC1C,EAAM,MAAA;AAAA,IACJ,EAAI,EAAA,MAAA;AAAA,IACJ,IAAA;AAAA,IACA,IAAM,EAAA,IAAA;AAAA,IACN,SAAA;AAAA,IACA,cAAgB,EAAA,eAAA;AAAA,IAChB,GAAG;AAAA,GACD,GAAA,KAAA;AACJ,EAAA,MAAM,EAAE,YAAA,EAAc,cAAgB,EAAA,OAAA,KAAY,wBAAyB,EAAA;AAC3E,EAAM,MAAA,EAAA,GAAK,MAAM,MAAM,CAAA;AAEvB,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,YAAA,CAAa,QAAQ,EAAE,CAAA;AACvB,IAAA,cAAA,CAAe,EAAE,CAAA;AACjB,IAAA,OAAO,MAAM;AACX,MAAA,YAAA,CAAa,MAAS,CAAA;AACtB,MAAA,cAAA,CAAe,MAAS,CAAA;AAAA,KAC1B;AAAA,KACC,CAAC,EAAA,EAAI,IAAM,EAAA,YAAA,EAAc,cAAc,CAAC,CAAA;AAE3C,EACE,uBAAA,IAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,OAAA,EAAS,OAAY,KAAA,SAAA,GAAY,IAAO,GAAA,MAAA;AAAA,MACxC,OAAS,EAAA,CAAA;AAAA,MACR,GAAG,SAAA;AAAA,MACJ,EAAA;AAAA,MACA,GAAA;AAAA,MACA,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,aAAY,EAAA,WAAA;AAAA,MAEX,QAAA,EAAA;AAAA,QAAA,IAAA,uBAAQ,IAAK,EAAA,EAAA,SAAA,EAAW,YAAa,CAAA,MAAM,GAAG,CAAK,GAAA,IAAA;AAAA,QACnD;AAAA;AAAA;AAAA,GACH;AAEJ,CAAC;;;;"}

package/dist-es/contact-details/internal/ContactDetailsContext.js CHANGED Viewed

@@ -3,8 +3,8 @@ import { createContext, useContext } from 'react';
 const ContactDetailsContext = createContext(void 0);
 const useContactDetailsContext = () => {
   const context = useContext(ContactDetailsContext);
-  if (!context && process.env.NODE_ENV !== "production") {
-    console.error(
+  if (!context) {
+    throw new Error(
       "useContactDetailsContext should be used inside of ContactDetails"
     );
   }

package/dist-es/contact-details/internal/ContactDetailsContext.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ContactDetailsContext.js","sources":["../src/contact-details/internal/ContactDetailsContext.tsx"],"sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { ContactDetailsVariant } from \"../ContactDetails\";\n\nexport interface ContactDetailsContext {\n variant: ContactDetailsVariant;\n\n primary?: string;\n setPrimary: (primary?: string) => void;\n primaryId?: string;\n setPrimaryId: (primaryId?: string) => void;\n\n secondary?: string;\n setSecondary: (secondary?: string) => void;\n secondaryId?: string;\n setSecondaryId: (secondaryId?: string) => void;\n\n tertiary?: string;\n setTertiary: (tertiary?: string) => void;\n tertiaryId?: string;\n setTertiaryId: (tertiaryId?: string) => void;\n\n hasAvatar?: boolean;\n setHasAvatar: (hasAvatar: boolean) => void;\n\n isStacked?: boolean;\n}\n\nexport const ContactDetailsContext = createContext<\n ContactDetailsContext \| undefined\n>(undefined);\n\nexport const useContactDetailsContext = (): ContactDetailsContext => {\n const context = useContext(ContactDetailsContext);\n if (!context ~~&& process.env.NODE_ENV !== \"production\"~~) {\n ~~console.error~~(\n \"useContactDetailsContext should be used inside of ContactDetails\",\n );\n }\n return context~~!;\~~n};\n"],"names":[],"mappings":";;AA2Ba,MAAA,qBAAA,GAAwB,cAEnC,MAAS;AAEJ,MAAM,2BAA2B,MAA6B;AACnE,EAAM,MAAA,OAAA,GAAU,WAAW,qBAAqB,CAAA;AAChD,EAAA,IAAI,CAAC,~~OAAA~~,~~IAAW,OAAQ,CAAA,GAAA,CAAI,aAAa,YAAc,~~EAAA;~~AACrD~~,~~IAAQ~~,~~OAAA~~,~~CAAA~~,KAAA;AAAA,~~MACN~~;AAAA,KACF;AAAA;AAEF,EAAO,OAAA,OAAA;AACT;;;;"}
1	+ {"version":3,"file":"ContactDetailsContext.js","sources":["../src/contact-details/internal/ContactDetailsContext.tsx"],"sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { ContactDetailsVariant } from \"../ContactDetails\";\n\nexport interface ContactDetailsContext {\n variant: ContactDetailsVariant;\n\n primary?: string;\n setPrimary: (primary?: string) => void;\n primaryId?: string;\n setPrimaryId: (primaryId?: string) => void;\n\n secondary?: string;\n setSecondary: (secondary?: string) => void;\n secondaryId?: string;\n setSecondaryId: (secondaryId?: string) => void;\n\n tertiary?: string;\n setTertiary: (tertiary?: string) => void;\n tertiaryId?: string;\n setTertiaryId: (tertiaryId?: string) => void;\n\n hasAvatar?: boolean;\n setHasAvatar: (hasAvatar: boolean) => void;\n\n isStacked?: boolean;\n}\n\nexport const ContactDetailsContext = createContext<\n ContactDetailsContext \| undefined\n>(undefined);\n\nexport const useContactDetailsContext = (): ContactDetailsContext => {\n const context = useContext(ContactDetailsContext);\n if (!context) {\n throw new Error(\n \"useContactDetailsContext should be used inside of ContactDetails\",\n );\n }\n return context;\n};\n"],"names":[],"mappings":";;AA2Ba,MAAA,qBAAA,GAAwB,cAEnC,MAAS;AAEJ,MAAM,2BAA2B,MAA6B;AACnE,EAAM,MAAA,OAAA,GAAU,WAAW,qBAAqB,CAAA;AAChD,EAAA,IAAI,CAAC,OAAS,EAAA;AACZ,IAAA,MAAM,IAAI,KAAA;AAAA,MACR;AAAA,KACF;AAAA;AAEF,EAAO,OAAA,OAAA;AACT;;;;"}

package/dist-es/contact-details/internal/FavoriteToggleWithTooltip.js CHANGED Viewed

@@ -9,7 +9,16 @@ const FavoriteToggleWithTooltip = forwardRef(function FavoriteToggleWithTooltip2
     tooltipProps,
     ...restProps
   } = props;
-  return /* @__PURE__ */ jsx(Tooltip, { enterDelay: 1500, placement: "bottom", content: tooltipTitle, children: /* @__PURE__ */ jsx(FavoriteToggle, { ref, ...restProps }) });
+  return /* @__PURE__ */ jsx(
+    Tooltip,
+    {
+      enterDelay: 1500,
+      placement: "bottom",
+      content: tooltipTitle,
+      ...tooltipProps,
+      children: /* @__PURE__ */ jsx(FavoriteToggle, { ref, ...restProps })
+    }
+  );
 });
 export { FavoriteToggleWithTooltip };

package/dist-es/contact-details/internal/FavoriteToggleWithTooltip.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"FavoriteToggleWithTooltip.js","sources":["../src/contact-details/internal/FavoriteToggleWithTooltip.tsx"],"sourcesContent":["import { Tooltip, type TooltipProps } from \"@salt-ds/core\";\nimport { forwardRef } from \"react\";\nimport { FavoriteToggle, type FavoriteToggleProps } from \"./FavoriteToggle\";\n\nexport interface FavoriteToggleWithTooltipProps extends FavoriteToggleProps {\n tooltipProps?: TooltipProps;\n tooltipTitle?: string;\n}\n\nexport const FavoriteToggleWithTooltip = forwardRef<\n HTMLSpanElement,\n FavoriteToggleWithTooltipProps\n>(function FavoriteToggleWithTooltip(props, ref) {\n const {\n tooltipTitle = \"Toggle favorite\",\n tooltipProps,\n ...restProps\n } = props;\n\n return (\n <Tooltip enterDelay={1500} placement=\"bottom\" content={tooltipTitle}>\n <FavoriteToggle ref={ref} {...restProps} />\n </Tooltip>\n );\n});\n"],"names":["FavoriteToggleWithTooltip"],"mappings":";;;;;AASO,MAAM,yBAA4B,GAAA,UAAA,CAGvC,SAASA,0BAAAA,CAA0B,OAAO,GAAK,EAAA;AAC/C,EAAM,MAAA;AAAA,IACJ,YAAe,GAAA,iBAAA;AAAA,IACf,YAAA;AAAA,IACA,GAAG;AAAA,GACD,GAAA,KAAA;AAEJ,~~EAAA~~,~~uBACG~~,GAAA,~~CAAA~~,OAAA,~~EAAA~~,~~EAAQ~~,UAAY,EAAA,IAAA,~~EAAM~~,SAAU,EAAA,QAAA,~~EAAS~~,OAAS,EAAA,YAAA,~~EACrD~~,QAAC,kBAAA,GAAA,CAAA,cAAA,EAAA,EAAe,GAAW,EAAA,GAAG,~~WAAW~~,~~CAC3C,~~EAAA,~~CAAA~~;AAEJ,CAAC;;;;"}
1	+ {"version":3,"file":"FavoriteToggleWithTooltip.js","sources":["../src/contact-details/internal/FavoriteToggleWithTooltip.tsx"],"sourcesContent":["import { Tooltip, type TooltipProps } from \"@salt-ds/core\";\nimport { forwardRef } from \"react\";\nimport { FavoriteToggle, type FavoriteToggleProps } from \"./FavoriteToggle\";\n\nexport interface FavoriteToggleWithTooltipProps extends FavoriteToggleProps {\n tooltipProps?: TooltipProps;\n tooltipTitle?: string;\n}\n\nexport const FavoriteToggleWithTooltip = forwardRef<\n HTMLSpanElement,\n FavoriteToggleWithTooltipProps\n>(function FavoriteToggleWithTooltip(props, ref) {\n const {\n tooltipTitle = \"Toggle favorite\",\n tooltipProps,\n ...restProps\n } = props;\n\n return (\n <Tooltip\n enterDelay={1500}\n placement=\"bottom\"\n content={tooltipTitle}\n {...tooltipProps}\n >\n <FavoriteToggle ref={ref} {...restProps} />\n </Tooltip>\n );\n});\n"],"names":["FavoriteToggleWithTooltip"],"mappings":";;;;;AASO,MAAM,yBAA4B,GAAA,UAAA,CAGvC,SAASA,0BAAAA,CAA0B,OAAO,GAAK,EAAA;AAC/C,EAAM,MAAA;AAAA,IACJ,YAAe,GAAA,iBAAA;AAAA,IACf,YAAA;AAAA,IACA,GAAG;AAAA,GACD,GAAA,KAAA;AAEJ,EACE,uBAAA,GAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACC,UAAY,EAAA,IAAA;AAAA,MACZ,SAAU,EAAA,QAAA;AAAA,MACV,OAAS,EAAA,YAAA;AAAA,MACR,GAAG,YAAA;AAAA,MAEJ,QAAC,kBAAA,GAAA,CAAA,cAAA,EAAA,EAAe,GAAW,EAAA,GAAG,SAAW,EAAA;AAAA;AAAA,GAC3C;AAEJ,CAAC;;;;"}

package/dist-es/content-status/ContentStatus.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ContentStatus.js","sources":["../src/content-status/ContentStatus.tsx"],"sourcesContent":["import {\n Button,\n makePrefixer,\n Text,\n useAriaAnnouncer,\n useId,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n forwardRef,\n type HTMLAttributes,\n type MouseEvent,\n type Ref,\n useEffect,\n} from \"react\";\nimport contentStatusCss from \"./ContentStatus.css\";\nimport {\n StatusIndicator,\n type StatusIndicatorProps,\n} from \"./internal/StatusIndicator\";\n\nconst withBaseName = makePrefixer(\"saltContentStatus\");\n\nexport interface ContentStatusProps\n extends HTMLAttributes<HTMLDivElement>,\n StatusIndicatorProps {\n actionLabel?: string;\n buttonRef?: Ref<~~any~~>;\n onActionClick?: (evt: MouseEvent<HTMLButtonElement>) => void;\n}\n\nexport const ContentStatus = forwardRef<HTMLDivElement, ContentStatusProps>(\n function ContentStatus(\n {\n CircularProgressProps,\n SpinnerProps,\n actionLabel,\n buttonRef,\n className,\n children,\n disableAnnouncer,\n message,\n onActionClick,\n status = \"info\",\n title,\n value,\n ...rest\n },\n ref,\n ) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-content-status\",\n css: contentStatusCss,\n window: targetWindow,\n });\n\n const id = useId();\n\n const hasDefaultActionContent = actionLabel && onActionClick;\n const hasActions = children \|\| hasDefaultActionContent;\n const hasContent = title \|\| message \|\| hasActions;\n\n const { announce } = useAriaAnnouncer();\n\n useEffect(() => {\n if (disableAnnouncer) return;\n\n const toBeAnnounced = [];\n if (title) {\n toBeAnnounced.push(title);\n }\n if (message) {\n toBeAnnounced.push(message);\n }\n // Loading is announced by the spinner\n if (status !== \"loading\") {\n toBeAnnounced.push(status);\n }\n if (toBeAnnounced.length > 0) {\n announce(toBeAnnounced.join(\" \"));\n }\n }, [announce, disableAnnouncer, message, status, title]);\n\n return (\n <div className={clsx(withBaseName(), className)} ref={ref} {...rest}>\n <StatusIndicator\n CircularProgressProps={CircularProgressProps}\n SpinnerProps={SpinnerProps}\n disableAnnouncer={disableAnnouncer}\n id={id}\n message={message}\n status={status}\n title={title}\n value={value}\n {...rest}\n />\n {hasContent && (\n <div\n // `aria-labelledby` to itself so that children of this div will show up in screen reader, and we don't need to join to aria-label\n aria-labelledby={id}\n className={clsx(withBaseName(\"content\"))}\n id={id}\n role=\"region\"\n >\n {title && (\n <Text className={clsx(withBaseName(\"title\"))}>{title}</Text>\n )}\n {message && (\n <Text className={clsx(withBaseName(\"message\"))}>{message}</Text>\n )}\n {hasActions && (\n <div className={clsx(withBaseName(\"actions\"))}>\n {children \|\| (\n <Button onClick={onActionClick} ref={buttonRef}>\n {actionLabel}\n </Button>\n )}\n </div>\n )}\n </div>\n )}\n </div>\n );\n },\n);\n"],"names":["ContentStatus","contentStatusCss"],"mappings":";;;;;;;;;AAuBA,MAAM,YAAA,GAAe,aAAa,mBAAmB,CAAA;AAU9C,MAAM,aAAgB,GAAA,UAAA;AAAA,EAC3B,SAASA,cACP,CAAA;AAAA,IACE,qBAAA;AAAA,IACA,YAAA;AAAA,IACA,WAAA;AAAA,IACA,SAAA;AAAA,IACA,SAAA;AAAA,IACA,QAAA;AAAA,IACA,gBAAA;AAAA,IACA,OAAA;AAAA,IACA,aAAA;AAAA,IACA,MAAS,GAAA,MAAA;AAAA,IACT,KAAA;AAAA,IACA,KAAA;AAAA,IACA,GAAG;AAAA,KAEL,GACA,EAAA;AACA,IAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,qBAAA;AAAA,MACR,GAAK,EAAAC,QAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IAAA,MAAM,KAAK,KAAM,EAAA;AAEjB,IAAA,MAAM,0BAA0B,WAAe,IAAA,aAAA;AAC/C,IAAA,MAAM,aAAa,QAAY,IAAA,uBAAA;AAC/B,IAAM,MAAA,UAAA,GAAa,SAAS,OAAW,IAAA,UAAA;AAEvC,IAAM,MAAA,EAAE,QAAS,EAAA,GAAI,gBAAiB,EAAA;AAEtC,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,gBAAkB,EAAA;AAEtB,MAAA,MAAM,gBAAgB,EAAC;AACvB,MAAA,IAAI,KAAO,EAAA;AACT,QAAA,aAAA,CAAc,KAAK,KAAK,CAAA;AAAA;AAE1B,MAAA,IAAI,OAAS,EAAA;AACX,QAAA,aAAA,CAAc,KAAK,OAAO,CAAA;AAAA;AAG5B,MAAA,IAAI,WAAW,SAAW,EAAA;AACxB,QAAA,aAAA,CAAc,KAAK,MAAM,CAAA;AAAA;AAE3B,MAAI,IAAA,aAAA,CAAc,SAAS,CAAG,EAAA;AAC5B,QAAS,QAAA,CAAA,aAAA,CAAc,IAAK,CAAA,GAAG,CAAC,CAAA;AAAA;AAClC,OACC,CAAC,QAAA,EAAU,kBAAkB,OAAS,EAAA,MAAA,EAAQ,KAAK,CAAC,CAAA;AAEvD,IACE,uBAAA,IAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAW,IAAK,CAAA,YAAA,IAAgB,SAAS,CAAA,EAAG,GAAW,EAAA,GAAG,IAC7D,EAAA,QAAA,EAAA;AAAA,sBAAA,GAAA;AAAA,QAAC,eAAA;AAAA,QAAA;AAAA,UACC,qBAAA;AAAA,UACA,YAAA;AAAA,UACA,gBAAA;AAAA,UACA,EAAA;AAAA,UACA,OAAA;AAAA,UACA,MAAA;AAAA,UACA,KAAA;AAAA,UACA,KAAA;AAAA,UACC,GAAG;AAAA;AAAA,OACN;AAAA,MACC,UACC,oBAAA,IAAA;AAAA,QAAC,KAAA;AAAA,QAAA;AAAA,UAEC,iBAAiB,EAAA,EAAA;AAAA,UACjB,SAAW,EAAA,IAAA,CAAK,YAAa,CAAA,SAAS,CAAC,CAAA;AAAA,UACvC,EAAA;AAAA,UACA,IAAK,EAAA,QAAA;AAAA,UAEJ,QAAA,EAAA;AAAA,YACC,KAAA,oBAAA,GAAA,CAAC,QAAK,SAAW,EAAA,IAAA,CAAK,aAAa,OAAO,CAAC,GAAI,QAAM,EAAA,KAAA,EAAA,CAAA;AAAA,YAEtD,OAAA,wBACE,IAAK,EAAA,EAAA,SAAA,EAAW,KAAK,YAAa,CAAA,SAAS,CAAC,CAAA,EAAI,QAAQ,EAAA,OAAA,EAAA,CAAA;AAAA,YAE1D,8BACE,GAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,IAAA,CAAK,aAAa,SAAS,CAAC,CACzC,EAAA,QAAA,EAAA,QAAA,wBACE,MAAO,EAAA,EAAA,OAAA,EAAS,eAAe,GAAK,EAAA,SAAA,EAClC,uBACH,CAEJ,EAAA;AAAA;AAAA;AAAA;AAEJ,KAEJ,EAAA,CAAA;AAAA;AAGN;;;;"}
1	+ {"version":3,"file":"ContentStatus.js","sources":["../src/content-status/ContentStatus.tsx"],"sourcesContent":["import {\n Button,\n makePrefixer,\n Text,\n useAriaAnnouncer,\n useId,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n forwardRef,\n type HTMLAttributes,\n type MouseEvent,\n type Ref,\n useEffect,\n} from \"react\";\nimport contentStatusCss from \"./ContentStatus.css\";\nimport {\n StatusIndicator,\n type StatusIndicatorProps,\n} from \"./internal/StatusIndicator\";\n\nconst withBaseName = makePrefixer(\"saltContentStatus\");\n\nexport interface ContentStatusProps\n extends HTMLAttributes<HTMLDivElement>,\n StatusIndicatorProps {\n actionLabel?: string;\n buttonRef?: Ref<HTMLButtonElement>;\n onActionClick?: (evt: MouseEvent<HTMLButtonElement>) => void;\n}\n\nexport const ContentStatus = forwardRef<HTMLDivElement, ContentStatusProps>(\n function ContentStatus(\n {\n CircularProgressProps,\n SpinnerProps,\n actionLabel,\n buttonRef,\n className,\n children,\n disableAnnouncer,\n message,\n onActionClick,\n status = \"info\",\n title,\n value,\n ...rest\n },\n ref,\n ) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-content-status\",\n css: contentStatusCss,\n window: targetWindow,\n });\n\n const id = useId();\n\n const hasDefaultActionContent = actionLabel && onActionClick;\n const hasActions = children \|\| hasDefaultActionContent;\n const hasContent = title \|\| message \|\| hasActions;\n\n const { announce } = useAriaAnnouncer();\n\n useEffect(() => {\n if (disableAnnouncer) return;\n\n const toBeAnnounced = [];\n if (title) {\n toBeAnnounced.push(title);\n }\n if (message) {\n toBeAnnounced.push(message);\n }\n // Loading is announced by the spinner\n if (status !== \"loading\") {\n toBeAnnounced.push(status);\n }\n if (toBeAnnounced.length > 0) {\n announce(toBeAnnounced.join(\" \"));\n }\n }, [announce, disableAnnouncer, message, status, title]);\n\n return (\n <div className={clsx(withBaseName(), className)} ref={ref} {...rest}>\n <StatusIndicator\n CircularProgressProps={CircularProgressProps}\n SpinnerProps={SpinnerProps}\n disableAnnouncer={disableAnnouncer}\n id={id}\n message={message}\n status={status}\n title={title}\n value={value}\n {...rest}\n />\n {hasContent && (\n <div\n // `aria-labelledby` to itself so that children of this div will show up in screen reader, and we don't need to join to aria-label\n aria-labelledby={id}\n className={clsx(withBaseName(\"content\"))}\n id={id}\n role=\"region\"\n >\n {title && (\n <Text className={clsx(withBaseName(\"title\"))}>{title}</Text>\n )}\n {message && (\n <Text className={clsx(withBaseName(\"message\"))}>{message}</Text>\n )}\n {hasActions && (\n <div className={clsx(withBaseName(\"actions\"))}>\n {children \|\| (\n <Button onClick={onActionClick} ref={buttonRef}>\n {actionLabel}\n </Button>\n )}\n </div>\n )}\n </div>\n )}\n </div>\n );\n },\n);\n"],"names":["ContentStatus","contentStatusCss"],"mappings":"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"}

package/dist-es/content-status/internal/StatusIndicator.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StatusIndicator.js","sources":["../src/content-status/internal/StatusIndicator.tsx"],"sourcesContent":["import {\n StatusIndicator as BaseStatusIndicator,\n type StatusIndicatorProps as BaseStatusIndicatorProps,\n CircularProgress,\n type CircularProgressProps,\n makePrefixer,\n Spinner,\n type SpinnerProps,\n} from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport type { ReactElement } from \"react\";\n\nexport interface StatusIndicatorProps\n extends Pick<SpinnerProps, \"disableAnnouncer\">,\n Pick<CircularProgressProps, \"value\"> {\n title?: string;\n message?: string;\n CircularProgressProps?: Partial<CircularProgressProps>;\n SpinnerProps?: Partial<SpinnerProps>;\n id?: string;\n status?: BaseStatusIndicatorProps[\"status\"] \| \"loading\";\n}\n\nconst withBaseName = makePrefixer(\"saltContentStatus\");\n\nexport function StatusIndicator({\n status = \"info\",\n disableAnnouncer,\n value,\n title,\n message,\n CircularProgressProps: {\n className: circularProgressClassName,\n ...restCircularProgressProps\n } = {},\n SpinnerProps: { className: spinnerClassName, ...restSpinnerProps } = {},\n id,\n}: StatusIndicatorProps): ReactElement {\n if (status === \"loading\") {\n if (value !== undefined) {\n return (\n <CircularProgress\n aria-label={title \|\| message}\n className={clsx(\n withBaseName(\"determinateLoading\"),\n circularProgressClassName,\n )}\n value={value}\n {...restCircularProgressProps}\n />\n );\n }\n return (\n <Spinner\n className={clsx(withBaseName(\"indeterminateLoading\"), spinnerClassName)}\n // Announcement of the content status is more useful than completion announcement from spinner\n completionAnnouncement={null}\n data-testid={`spinner-${id!}`}\n disableAnnouncer={disableAnnouncer}\n {...restSpinnerProps}\n />\n );\n }\n\n return (\n <BaseStatusIndicator\n status={status}\n data-jpmui-test={`icon-${status}-${id!}`}\n size={2}\n />\n );\n}\n"],"names":["BaseStatusIndicator"],"mappings":";;;;AAuBA,MAAM,YAAA,GAAe,aAAa,mBAAmB,CAAA;AAE9C,SAAS,eAAgB,CAAA;AAAA,EAC9B,MAAS,GAAA,MAAA;AAAA,EACT,gBAAA;AAAA,EACA,KAAA;AAAA,EACA,KAAA;AAAA,EACA,OAAA;AAAA,EACA,qBAAuB,EAAA;AAAA,IACrB,SAAW,EAAA,yBAAA;AAAA,IACX,GAAG;AAAA,MACD,EAAC;AAAA,EACL,cAAc,EAAE,SAAA,EAAW,kBAAkB,GAAG,gBAAA,KAAqB,EAAC;AAAA,EACtE;AACF,CAAuC,EAAA;AACrC,EAAA,IAAI,WAAW,SAAW,EAAA;AACxB,IAAA,IAAI,UAAU,MAAW,EAAA;AACvB,MACE,uBAAA,GAAA;AAAA,QAAC,gBAAA;AAAA,QAAA;AAAA,UACC,cAAY,KAAS,IAAA,OAAA;AAAA,UACrB,SAAW,EAAA,IAAA;AAAA,YACT,aAAa,oBAAoB,CAAA;AAAA,YACjC;AAAA,WACF;AAAA,UACA,KAAA;AAAA,UACC,GAAG;AAAA;AAAA,OACN;AAAA;AAGJ,IACE,uBAAA,GAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACC,SAAW,EAAA,IAAA,CAAK,YAAa,CAAA,sBAAsB,GAAG,gBAAgB,CAAA;AAAA,QAEtE,sBAAwB,EAAA,IAAA;AAAA,QACxB,aAAA,EAAa,WAAW,~~EAAG~~,CAAA,CAAA;AAAA,~~QAC3B~~,gBAAA;AAAA,QACC,GAAG;AAAA;AAAA,KACN;AAAA;AAIJ,EACE,uBAAA,GAAA;AAAA,IAACA,iBAAA;AAAA,IAAA;AAAA,MACC,MAAA;AAAA,MACA,iBAAiB,EAAA,CAAA,KAAA,EAAQ,MAAM,CAAA,CAAA,EAAI,~~EAAG~~,CAAA,CAAA;AAAA,~~MACtC~~,IAAM,EAAA;AAAA;AAAA,GACR;AAEJ;;;;"}
1	+ {"version":3,"file":"StatusIndicator.js","sources":["../src/content-status/internal/StatusIndicator.tsx"],"sourcesContent":["import {\n StatusIndicator as BaseStatusIndicator,\n type StatusIndicatorProps as BaseStatusIndicatorProps,\n CircularProgress,\n type CircularProgressProps,\n makePrefixer,\n Spinner,\n type SpinnerProps,\n} from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport type { ReactElement } from \"react\";\n\nexport interface StatusIndicatorProps\n extends Pick<SpinnerProps, \"disableAnnouncer\">,\n Pick<CircularProgressProps, \"value\"> {\n title?: string;\n message?: string;\n CircularProgressProps?: Partial<CircularProgressProps>;\n SpinnerProps?: Partial<SpinnerProps>;\n id?: string;\n status?: BaseStatusIndicatorProps[\"status\"] \| \"loading\";\n}\n\nconst withBaseName = makePrefixer(\"saltContentStatus\");\n\nexport function StatusIndicator({\n status = \"info\",\n disableAnnouncer,\n value,\n title,\n message,\n CircularProgressProps: {\n className: circularProgressClassName,\n ...restCircularProgressProps\n } = {},\n SpinnerProps: { className: spinnerClassName, ...restSpinnerProps } = {},\n id,\n}: StatusIndicatorProps): ReactElement {\n if (status === \"loading\") {\n if (value !== undefined) {\n return (\n <CircularProgress\n aria-label={title \|\| message}\n className={clsx(\n withBaseName(\"determinateLoading\"),\n circularProgressClassName,\n )}\n value={value}\n {...restCircularProgressProps}\n />\n );\n }\n return (\n <Spinner\n className={clsx(withBaseName(\"indeterminateLoading\"), spinnerClassName)}\n // Announcement of the content status is more useful than completion announcement from spinner\n completionAnnouncement={null}\n data-testid={`spinner-${id}`}\n disableAnnouncer={disableAnnouncer}\n {...restSpinnerProps}\n />\n );\n }\n\n return (\n <BaseStatusIndicator\n status={status}\n data-jpmui-test={`icon-${status}-${id}`}\n size={2}\n />\n );\n}\n"],"names":["BaseStatusIndicator"],"mappings":";;;;AAuBA,MAAM,YAAA,GAAe,aAAa,mBAAmB,CAAA;AAE9C,SAAS,eAAgB,CAAA;AAAA,EAC9B,MAAS,GAAA,MAAA;AAAA,EACT,gBAAA;AAAA,EACA,KAAA;AAAA,EACA,KAAA;AAAA,EACA,OAAA;AAAA,EACA,qBAAuB,EAAA;AAAA,IACrB,SAAW,EAAA,yBAAA;AAAA,IACX,GAAG;AAAA,MACD,EAAC;AAAA,EACL,cAAc,EAAE,SAAA,EAAW,kBAAkB,GAAG,gBAAA,KAAqB,EAAC;AAAA,EACtE;AACF,CAAuC,EAAA;AACrC,EAAA,IAAI,WAAW,SAAW,EAAA;AACxB,IAAA,IAAI,UAAU,MAAW,EAAA;AACvB,MACE,uBAAA,GAAA;AAAA,QAAC,gBAAA;AAAA,QAAA;AAAA,UACC,cAAY,KAAS,IAAA,OAAA;AAAA,UACrB,SAAW,EAAA,IAAA;AAAA,YACT,aAAa,oBAAoB,CAAA;AAAA,YACjC;AAAA,WACF;AAAA,UACA,KAAA;AAAA,UACC,GAAG;AAAA;AAAA,OACN;AAAA;AAGJ,IACE,uBAAA,GAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACC,SAAW,EAAA,IAAA,CAAK,YAAa,CAAA,sBAAsB,GAAG,gBAAgB,CAAA;AAAA,QAEtE,sBAAwB,EAAA,IAAA;AAAA,QACxB,aAAA,EAAa,WAAW,EAAE,CAAA,CAAA;AAAA,QAC1B,gBAAA;AAAA,QACC,GAAG;AAAA;AAAA,KACN;AAAA;AAIJ,EACE,uBAAA,GAAA;AAAA,IAACA,iBAAA;AAAA,IAAA;AAAA,MACC,MAAA;AAAA,MACA,iBAAiB,EAAA,CAAA,KAAA,EAAQ,MAAM,CAAA,CAAA,EAAI,EAAE,CAAA,CAAA;AAAA,MACrC,IAAM,EAAA;AAAA;AAAA,GACR;AAEJ;;;;"}

package/dist-es/date-input/DateInput.css.js CHANGED Viewed

@@ -1,4 +1,4 @@
-var css_248z = "/* Style applied to the root element */\n.saltDateInput {\n  align-items: center;\n  background: var(--saltDateInput-background, var(--input-background));\n  border-radius: var(--salt-palette-corner-weak, 0);\n  color: var(--saltDateInput-color, var(--salt-content-primary-foreground));\n  display: inline-flex;\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--saltDateInput-fontSize, var(--salt-text-fontSize));\n  line-height: var(--saltDateInput-lineHeight, var(--salt-text-lineHeight));\n  letter-spacing: var(--salt-text-letterSpacing);\n  height: var(--saltDateInput-height, var(--salt-size-base));\n  min-height: var(--saltDateInput-minHeight, var(--salt-size-base));\n  min-width: var(--saltDateInput-minWidth, 4em);\n  padding-left: var(--saltDateInput-paddingLeft, var(--salt-spacing-100));\n  padding-right: var(--saltDateInput-paddingRight, var(--salt-spacing-100));\n  position: relative;\n  box-sizing: border-box;\n  overflow: hidden;\n  width: 100%;\n}\n\n.saltDateInput:hover {\n  background: var(--saltDateInput-background-hover, var(--input-background-hover));\n  cursor: var(--salt-cursor-text);\n}\n\n/* Style applied if `bordered={true}` */\n.saltDateInput-bordered.saltDateInput {\n  border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--input-borderColor);\n}\n\n.saltDateInput-bordered.saltDateInput:hover {\n  border-style: var(--salt-borderStyle-solid);\n  border-color: var(--input-borderColor-hover);\n}\n\n.saltDateInput-bordered.saltDateInput-focused,\n.saltDateInput-bordered.saltDateInput-focused:hover {\n  border-style: var(--salt-borderStyle-solid);\n  border-color: var(--input-borderColor-active);\n}\n\n.saltDateInput-bordered.saltDateInput-readOnly,\n.saltDateInput-bordered.saltDateInput-readOnly:hover {\n  border-style: var(--salt-borderStyle-solid);\n  border-color: var(--salt-editable-borderColor-readonly);\n}\n\n.saltDateInput-bordered.saltDateInput-disabled,\n.saltDateInput-bordered.saltDateInput-disabled:hover {\n  border-style: var(--salt-borderStyle-solid);\n  border-color: var(--salt-editable-borderColor-disabled);\n}\n\n.saltDateInput-activationIndicator {\n  left: 0;\n  bottom: 0;\n  width: 100%;\n  position: absolute;\n  border-bottom: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--input-borderColor);\n}\n\n.saltDateInput:hover .saltDateInput-activationIndicator {\n  border-bottom-style: var(--salt-borderStyle-solid);\n  border-bottom-color: var(--input-borderColor-hover);\n}\n\n.saltDateInput-focused .saltDateInput-activationIndicator,\n.saltDateInput-focused:hover .saltDateInput-activationIndicator {\n  border-bottom: var(--salt-size-fixed-200) var(--salt-borderStyle-solid) var(--input-borderColor-active);\n}\n\n.saltDateInput-readOnly .saltDateInput-activationIndicator,\n.saltDateInput-readOnly:hover .saltDateInput-activationIndicator {\n  border-bottom-style: var(--salt-borderStyle-solid);\n  border-bottom-color: var(--salt-editable-borderColor-readonly);\n}\n\n.saltDateInput-disabled .saltDateInput-activationIndicator,\n.saltDateInput-disabled:hover .saltDateInput-activationIndicator {\n  border-bottom-style: var(--salt-borderStyle-solid);\n  border-bottom-color: var(--salt-editable-borderColor-disabled);\n}\n\n.saltDateInput-bordered .saltDateInput-activationIndicator,\n.saltDateInput-bordered.saltDateInput-readOnly .saltDateInput-activationIndicator,\n.saltDateInput-bordered.saltDateInput-disabled:hover .saltDateInput-activationIndicator {\n  border-bottom-width: 0;\n}\n\n.saltDateInput-bordered.saltDateInput-focused .saltDateInput-activationIndicator {\n  /* Activation indicator width minus the border from the input. */\n  border-bottom-width: var(--salt-size-fixed-100);\n}\n\n/* Class applied if `variant=\"primary\"` */\n.saltDateInput-primary {\n  --input-background: var(--salt-editable-primary-background);\n  --input-background-active: var(--salt-editable-primary-background-active);\n  --input-background-hover: var(--salt-editable-primary-background-hover);\n  --input-background-disabled: var(--salt-editable-primary-background-disabled);\n  --input-background-readonly: var(--salt-editable-primary-background-readonly);\n  --input-borderColor: var(--salt-editable-borderColor);\n  --input-borderColor-active: var(--salt-editable-borderColor-active);\n  --input-borderColor-hover: var(--salt-editable-borderColor-hover);\n  --input-outlineColor: var(--salt-focused-outlineColor);\n}\n\n/* Class applied if `variant=\"secondary\"` */\n.saltDateInput-secondary {\n  --input-background: var(--salt-editable-secondary-background);\n  --input-background-active: var(--salt-editable-secondary-background-active);\n  --input-background-hover: var(--salt-editable-secondary-background-active);\n  --input-background-disabled: var(--salt-editable-secondary-background-disabled);\n  --input-background-readonly: var(--salt-editable-secondary-background-readonly);\n  --input-borderColor: var(--salt-editable-borderColor);\n  --input-borderColor-active: var(--salt-editable-borderColor-active);\n  --input-borderColor-hover: var(--salt-editable-borderColor-hover);\n  --input-outlineColor: var(--salt-focused-outlineColor);\n}\n\n/* Style applied to input if `validationState=\"error\"` */\n.saltDateInput-error {\n  --input-background: var(--salt-status-error-background);\n  --input-background-active: var(--salt-status-error-background);\n  --input-background-hover: var(--salt-status-error-background);\n  --input-background-readonly: var(--salt-status-error-background);\n  --input-borderColor: var(--salt-status-error-borderColor);\n  --input-borderColor-active: var(--salt-status-error-borderColor);\n  --input-borderColor-hover: var(--salt-status-error-borderColor);\n  --input-outlineColor: var(--salt-status-error-borderColor);\n}\n\n/* Style applied to input if `validationState=\"warning\"` */\n.saltDateInput-warning {\n  --input-background: var(--salt-status-warning-background);\n  --input-background-active: var(--salt-status-warning-background);\n  --input-background-hover: var(--salt-status-warning-background);\n  --input-background-readonly: var(--salt-status-warning-background);\n  --input-borderColor: var(--salt-status-warning-borderColor);\n  --input-borderColor-active: var(--salt-status-warning-borderColor);\n  --input-borderColor-hover: var(--salt-status-warning-borderColor);\n  --input-outlineColor: var(--salt-status-warning-borderColor);\n}\n\n/* Style applied to input if `validationState=\"success\"` */\n.saltDateInput-success {\n  --input-background: var(--salt-status-success-background);\n  --input-background-active: var(--salt-status-success-background);\n  --input-background-hover: var(--salt-status-success-background);\n  --input-background-readonly: var(--salt-status-success-background);\n  --input-borderColor: var(--salt-status-success-borderColor);\n  --input-borderColor-active: var(--salt-status-success-borderColor);\n  --input-borderColor-hover: var(--salt-status-success-borderColor);\n  --input-outlineColor: var(--salt-status-success-borderColor);\n}\n\n/* Styling when focused */\n.saltDateInput-focused,\n.saltDateInput-focused:hover {\n  background: var(--saltDateInput-background-active, var(--input-background-active));\n  cursor: var(--salt-cursor-text);\n  outline: var(--saltDateInput-outline, var(--salt-focused-outlineWidth) var(--salt-focused-outlineStyle) var(--input-outlineColor));\n}\n\n/* Style applied if `readOnly={true}` */\n.saltDateInput.saltDateInput-readOnly {\n  background: var(--input-background-readonly);\n  cursor: var(--salt-cursor-readonly);\n}\n\n/* Styling when focused if `disabled={true}` */\n.saltDateInput-disabled,\n.saltDateInput-disabled:hover {\n  background: var(--input-background-disabled);\n  cursor: var(--salt-cursor-disabled);\n  color: var(--saltDateInput-color-disabled, var(--salt-content-primary-foreground-disabled));\n}\n\n/* Style applied to start adornments */\n.saltDateInput-startAdornmentContainer {\n  align-items: center;\n  display: inline-flex;\n  padding-right: var(--salt-spacing-100);\n  column-gap: var(--salt-spacing-100);\n}\n\n/* Style applied to end adornments */\n.saltDateInput-endAdornmentContainer {\n  display: inline-flex;\n  column-gap: var(--salt-spacing-50);\n  align-items: flex-end;\n}\n\n.saltDateInput-endAdornmentContainer .saltButton ~ .saltButton {\n  margin-left: calc(-1 * var(--salt-spacing-50));\n}\n\n.saltDateInput-endAdornmentContainer .saltButton:last-child {\n  margin-right: calc(var(--salt-spacing-50) * -1);\n}\n\n.saltDateInput-startAdornmentContainer > .saltButton,\n.saltDateInput-endAdornmentContainer > .saltButton {\n  --saltButton-padding: calc(var(--salt-spacing-50) - var(--button-borderWidth));\n  --saltButton-height: calc(var(--salt-size-base) - var(--salt-spacing-100));\n  --saltButton-borderRadius: var(--salt-palette-corner-weaker);\n}\n\n/* Style applied to inner input component */\n.saltDateInput-input {\n  background: none;\n  border: none;\n  box-sizing: content-box;\n  color: inherit;\n  cursor: inherit;\n  display: block;\n  font: inherit;\n  height: 100%;\n  letter-spacing: var(--saltDateInput-letterSpacing, 0);\n  margin: 0;\n  min-width: 0;\n  overflow: hidden;\n  padding: 0;\n  text-align: left;\n  width: 100%;\n}\n\n/* Reset in the  class */\n.saltDateInput-input:focus {\n  outline: none;\n}\n\n/* Style applied to selected input */\n.saltDateInput-input::selection {\n  background: var(--salt-content-foreground-highlight);\n}\n\n/* Style applied to selected input if `disabled={true}` */\n.saltDateInput-disabled .saltDateInput-input::selection {\n  background: none;\n}\n\n/* Style applied to placeholder text */\n.saltDateInput-input::placeholder {\n  color: var(--salt-content-secondary-foreground);\n  font-weight: var(--salt-text-fontWeight-small);\n}\n\n/* Style applied to the dash between two inputs in range date input */\n.saltDateInput-dash {\n  margin: 0 var(--salt-spacing-50);\n}\n";
+var css_248z = "/* Style applied to the root element */\n.saltDateInput {\n  align-items: center;\n  background: var(--saltDateInput-background, var(--input-background));\n  border-radius: var(--salt-palette-corner-weak, 0);\n  color: var(--saltDateInput-color, var(--salt-content-primary-foreground));\n  display: inline-flex;\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--saltDateInput-fontSize, var(--salt-text-fontSize));\n  line-height: var(--saltDateInput-lineHeight, var(--salt-text-lineHeight));\n  letter-spacing: var(--salt-text-letterSpacing);\n  height: var(--saltDateInput-height, var(--salt-size-base));\n  min-height: var(--saltDateInput-minHeight, var(--salt-size-base));\n  min-width: var(--saltDateInput-minWidth, 4em);\n  padding-left: var(--saltDateInput-paddingLeft, var(--salt-spacing-100));\n  padding-right: var(--saltDateInput-paddingRight, var(--salt-spacing-100));\n  position: relative;\n  box-sizing: border-box;\n  overflow: hidden;\n  width: 100%;\n}\n\n.saltDateInput:hover {\n  background: var(--saltDateInput-background-hover, var(--input-background-hover));\n  cursor: var(--salt-cursor-text);\n}\n\n/* Style applied if `bordered={true}` */\n.saltDateInput-bordered.saltDateInput {\n  border: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--input-borderColor);\n}\n\n.saltDateInput-bordered.saltDateInput:hover {\n  border-style: var(--salt-borderStyle-solid);\n  border-color: var(--input-borderColor-hover);\n}\n\n.saltDateInput-bordered.saltDateInput-focused,\n.saltDateInput-bordered.saltDateInput-focused:hover {\n  border-style: var(--salt-borderStyle-solid);\n  border-color: var(--input-borderColor-active);\n}\n\n.saltDateInput-bordered.saltDateInput-readOnly,\n.saltDateInput-bordered.saltDateInput-readOnly:hover {\n  border-style: var(--salt-borderStyle-solid);\n  border-color: var(--salt-editable-borderColor-readonly);\n}\n\n.saltDateInput-bordered.saltDateInput-disabled,\n.saltDateInput-bordered.saltDateInput-disabled:hover {\n  border-style: var(--salt-borderStyle-solid);\n  border-color: var(--salt-editable-borderColor-disabled);\n}\n\n.saltDateInput-activationIndicator {\n  left: 0;\n  bottom: 0;\n  width: 100%;\n  position: absolute;\n  border-bottom: var(--salt-size-fixed-100) var(--salt-borderStyle-solid) var(--input-borderColor);\n}\n\n.saltDateInput:hover .saltDateInput-activationIndicator {\n  border-bottom-style: var(--salt-borderStyle-solid);\n  border-bottom-color: var(--input-borderColor-hover);\n}\n\n.saltDateInput-focused .saltDateInput-activationIndicator,\n.saltDateInput-focused:hover .saltDateInput-activationIndicator {\n  border-bottom: var(--salt-size-fixed-200) var(--salt-borderStyle-solid) var(--input-borderColor-active);\n}\n\n.saltDateInput-readOnly .saltDateInput-activationIndicator,\n.saltDateInput-readOnly:hover .saltDateInput-activationIndicator {\n  border-bottom-style: var(--salt-borderStyle-solid);\n  border-bottom-color: var(--salt-editable-borderColor-readonly);\n}\n\n.saltDateInput-disabled .saltDateInput-activationIndicator,\n.saltDateInput-disabled:hover .saltDateInput-activationIndicator {\n  border-bottom-style: var(--salt-borderStyle-solid);\n  border-bottom-color: var(--salt-editable-borderColor-disabled);\n}\n\n.saltDateInput-bordered .saltDateInput-activationIndicator,\n.saltDateInput-bordered.saltDateInput-readOnly .saltDateInput-activationIndicator,\n.saltDateInput-bordered.saltDateInput-disabled:hover .saltDateInput-activationIndicator {\n  border-bottom-width: 0;\n}\n\n.saltDateInput-bordered.saltDateInput-focused .saltDateInput-activationIndicator {\n  /* Activation indicator width minus the border from the input. */\n  border-bottom-width: var(--salt-size-fixed-100);\n}\n\n/* Class applied if `variant=\"primary\"` */\n.saltDateInput-primary {\n  --input-background: var(--salt-editable-primary-background);\n  --input-background-active: var(--salt-editable-primary-background-active);\n  --input-background-hover: var(--salt-editable-primary-background-hover);\n  --input-background-disabled: var(--salt-editable-primary-background-disabled);\n  --input-background-readonly: var(--salt-editable-primary-background-readonly);\n  --input-borderColor: var(--salt-editable-borderColor);\n  --input-borderColor-active: var(--salt-editable-borderColor-active);\n  --input-borderColor-hover: var(--salt-editable-borderColor-hover);\n  --input-outlineColor: var(--salt-focused-outlineColor);\n}\n\n/* Class applied if `variant=\"secondary\"` */\n.saltDateInput-secondary {\n  --input-background: var(--salt-editable-secondary-background);\n  --input-background-active: var(--salt-editable-secondary-background-active);\n  --input-background-hover: var(--salt-editable-secondary-background-active);\n  --input-background-disabled: var(--salt-editable-secondary-background-disabled);\n  --input-background-readonly: var(--salt-editable-secondary-background-readonly);\n  --input-borderColor: var(--salt-editable-borderColor);\n  --input-borderColor-active: var(--salt-editable-borderColor-active);\n  --input-borderColor-hover: var(--salt-editable-borderColor-hover);\n  --input-outlineColor: var(--salt-focused-outlineColor);\n}\n\n/* Style applied to input if `validationState=\"error\"` */\n.saltDateInput-error {\n  --input-background: var(--salt-status-error-background);\n  --input-background-active: var(--salt-status-error-background);\n  --input-background-hover: var(--salt-status-error-background);\n  --input-background-readonly: var(--salt-status-error-background);\n  --input-borderColor: var(--salt-status-error-borderColor);\n  --input-borderColor-active: var(--salt-status-error-borderColor);\n  --input-borderColor-hover: var(--salt-status-error-borderColor);\n  --input-outlineColor: var(--salt-status-error-borderColor);\n}\n\n/* Style applied to input if `validationState=\"warning\"` */\n.saltDateInput-warning {\n  --input-background: var(--salt-status-warning-background);\n  --input-background-active: var(--salt-status-warning-background);\n  --input-background-hover: var(--salt-status-warning-background);\n  --input-background-readonly: var(--salt-status-warning-background);\n  --input-borderColor: var(--salt-status-warning-borderColor);\n  --input-borderColor-active: var(--salt-status-warning-borderColor);\n  --input-borderColor-hover: var(--salt-status-warning-borderColor);\n  --input-outlineColor: var(--salt-status-warning-borderColor);\n}\n\n/* Style applied to input if `validationState=\"success\"` */\n.saltDateInput-success {\n  --input-background: var(--salt-status-success-background);\n  --input-background-active: var(--salt-status-success-background);\n  --input-background-hover: var(--salt-status-success-background);\n  --input-background-readonly: var(--salt-status-success-background);\n  --input-borderColor: var(--salt-status-success-borderColor);\n  --input-borderColor-active: var(--salt-status-success-borderColor);\n  --input-borderColor-hover: var(--salt-status-success-borderColor);\n  --input-outlineColor: var(--salt-status-success-borderColor);\n}\n\n/* Styling when focused */\n.saltDateInput-focused,\n.saltDateInput-focused:hover {\n  background: var(--saltDateInput-background-active, var(--input-background-active));\n  cursor: var(--salt-cursor-text);\n  outline: var(--saltDateInput-outline, var(--salt-focused-outlineWidth) var(--salt-focused-outlineStyle) var(--input-outlineColor));\n}\n\n/* Style applied if `readOnly={true}` */\n.saltDateInput.saltDateInput-readOnly {\n  background: var(--input-background-readonly);\n  cursor: var(--salt-cursor-readonly);\n}\n\n/* Styling when focused if `disabled={true}` */\n.saltDateInput-disabled,\n.saltDateInput-disabled:hover {\n  background: var(--input-background-disabled);\n  cursor: var(--salt-cursor-disabled);\n  color: var(--saltDateInput-color-disabled, var(--salt-content-primary-foreground-disabled));\n}\n\n/* Style applied to start adornments */\n.saltDateInput-startAdornmentContainer {\n  align-items: center;\n  display: inline-flex;\n  padding-right: var(--salt-spacing-100);\n  column-gap: var(--salt-spacing-100);\n}\n\n/* Style applied to end adornments */\n.saltDateInput-endAdornmentContainer {\n  display: inline-flex;\n  column-gap: var(--salt-spacing-50);\n  align-items: flex-end;\n}\n\n.saltDateInput-endAdornmentContainer .saltButton ~ .saltButton {\n  margin-left: calc(-1 * var(--salt-spacing-50));\n}\n\n.saltDateInput-endAdornmentContainer .saltButton:last-child {\n  margin-right: calc(var(--salt-spacing-50) * -1);\n}\n\n.saltDateInput-startAdornmentContainer > .saltButton,\n.saltDateInput-endAdornmentContainer > .saltButton {\n  --saltButton-padding: calc(var(--salt-spacing-50) - var(--button-borderWidth));\n  --saltButton-height: calc(var(--salt-size-base) - var(--salt-spacing-100));\n  --saltButton-borderRadius: var(--salt-palette-corner-weaker);\n}\n\n/* Style applied to inner input component */\n.saltDateInput-input {\n  background: none;\n  border: none;\n  box-sizing: content-box;\n  color: inherit;\n  cursor: inherit;\n  display: block;\n  font: inherit;\n  height: 100%;\n  letter-spacing: var(--saltDateInput-letterSpacing, 0);\n  margin: 0;\n  min-width: 0;\n  overflow: hidden;\n  padding: 0;\n  text-align: left;\n  width: 100%;\n}\n\n/* Reset in the  class */\n.saltDateInput-input:focus {\n  outline: none;\n}\n\n/* Style applied to selected input if `disabled={true}` */\n.saltDateInput-disabled .saltDateInput-input::selection {\n  background: none;\n}\n\n/* Style applied to placeholder text */\n.saltDateInput-input::placeholder {\n  color: var(--salt-content-secondary-foreground);\n  font-weight: var(--salt-text-fontWeight-small);\n}\n\n/* Style applied to the dash between two inputs in range date input */\n.saltDateInput-dash {\n  margin: 0 var(--salt-spacing-50);\n}\n";
 export { css_248z as default };
 //# sourceMappingURL=DateInput.css.js.map

package/dist-es/date-picker/useFocusOut.js CHANGED Viewed

@@ -14,7 +14,7 @@ function getTabbableElements(parent) {
   );
 }
 function useFocusOut(context, props) {
-  const { onOpenChange} = context;
+  const { onOpenChange } = context;
   const { enabled = true } = props;
   const reference = useMemo(() => {
     const referenceElement = context.elements.reference;

package/dist-es/date-picker/useFocusOut.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useFocusOut.js","sources":["../src/date-picker/useFocusOut.ts"],"sourcesContent":["import type { ElementProps, FloatingContext } from \"@floating-ui/react\";\nimport { useMemo } from \"react\";\n\nexport interface UseFocusOutProps {\n /*\n Whether the hook is enabled\n * @default true\n */\n enabled?: boolean;\n}\n\nfunction getTabbableElements(parent: Element): HTMLElement[] {\n const focusableSelectors = [\n \"button:not([disabled])\",\n \"input:not([disabled])\",\n '[tabindex]:not([tabindex=\"-1\"])',\n ];\n const tabbableElements = parent.querySelectorAll<HTMLElement>(\n focusableSelectors.join(\",\"),\n );\n return Array.from(tabbableElements).filter(\n (element) => !element.hasAttribute(\"disabled\") && element.tabIndex >= 0,\n );\n}\n//\n// This hook is needed to close the overlay, when,\n// 1. the floating element is opened\n// 2. the user re-focuses into the reference element with the mouse\n// 3. the user tabs out of the reference element\n// Without this hook, the floating element can re-receive focus\nexport function useFocusOut(\n context: FloatingContext,\n props: UseFocusOutProps,\n): ElementProps {\n const { onOpenChange, ~~open~~ } = context;\n const { enabled = true } = props;\n\n const reference: ElementProps[\"reference\"] = useMemo~~<\n React.HTMLProps<Element>\n >~~(() => {\n const referenceElement = context.elements.reference as Element \| undefined;\n\n if (!referenceElement) {\n return {};\n }\n\n return {\n onKeyDown(event: React.KeyboardEvent<Element>) {\n if (event.key === \"Tab\") {\n const tabbableElements = getTabbableElements(referenceElement);\n const tabbedBeforeFirstElement =\n event.shiftKey && document.activeElement === tabbableElements[0];\n const tabbedAfterLastElement =\n document.activeElement ===\n tabbableElements[tabbableElements.length - 1];\n if (tabbedBeforeFirstElement \|\| tabbedAfterLastElement) {\n onOpenChange(false, event.nativeEvent, \"focus-out\");\n }\n }\n },\n };\n }, [onOpenChange, context.elements.reference]);\n\n return useMemo(() => (enabled ? { reference } : {}), [enabled, reference]);\n}\n"],"names":[],"mappings":";;AAWA,SAAS,oBAAoB,MAAgC,EAAA;AAC3D,EAAA,MAAM,kBAAqB,GAAA;AAAA,IACzB,wBAAA;AAAA,IACA,uBAAA;AAAA,IACA;AAAA,GACF;AACA,EAAA,MAAM,mBAAmB,MAAO,CAAA,gBAAA;AAAA,IAC9B,kBAAA,CAAmB,KAAK,GAAG;AAAA,GAC7B;AACA,EAAO,OAAA,KAAA,CAAM,IAAK,CAAA,gBAAgB,CAAE,CAAA,MAAA;AAAA,IAClC,CAAC,YAAY,CAAC,OAAA,CAAQ,aAAa,UAAU,CAAA,IAAK,QAAQ,QAAY,IAAA;AAAA,GACxE;AACF;AAOgB,SAAA,WAAA,CACd,SACA,KACc,EAAA;AACd,EAAM,MAAA,EAAE,~~YAAmB~~,~~CAAI,~~GAAA,OAAA;~~AAC/B~~,EAAM,MAAA,EAAE,OAAU,GAAA,IAAA,EAAS,GAAA,KAAA;AAE3B,EAAM,MAAA,SAAA,GAAuC,~~QAE3C~~,MAAM;~~AACN~~,IAAM,MAAA,gBAAA,GAAmB,QAAQ,QAAS,CAAA,SAAA;AAE1C,IAAA,IAAI,CAAC,gBAAkB,EAAA;AACrB,MAAA,OAAO,EAAC;AAAA;AAGV,IAAO,OAAA;AAAA,MACL,UAAU,KAAqC,EAAA;AAC7C,QAAI,IAAA,KAAA,CAAM,QAAQ,KAAO,EAAA;AACvB,UAAM,MAAA,gBAAA,GAAmB,oBAAoB,gBAAgB,CAAA;AAC7D,UAAA,MAAM,2BACJ,KAAM,CAAA,QAAA,IAAY,QAAS,CAAA,aAAA,KAAkB,iBAAiB,CAAC,CAAA;AACjE,UAAA,MAAM,yBACJ,QAAS,CAAA,aAAA,KACT,gBAAiB,CAAA,gBAAA,CAAiB,SAAS,CAAC,CAAA;AAC9C,UAAA,IAAI,4BAA4B,sBAAwB,EAAA;AACtD,YAAa,YAAA,CAAA,KAAA,EAAO,KAAM,CAAA,WAAA,EAAa,WAAW,CAAA;AAAA;AACpD;AACF;AACF,KACF;AAAA,KACC,CAAC,YAAA,EAAc,OAAQ,CAAA,QAAA,CAAS,SAAS,CAAC,CAAA;AAE7C,EAAO,OAAA,OAAA,CAAQ,MAAO,OAAA,GAAU,EAAE,SAAA,EAAc,GAAA,EAAK,EAAA,CAAC,OAAS,EAAA,SAAS,CAAC,CAAA;AAC3E;;;;"}
1	+ {"version":3,"file":"useFocusOut.js","sources":["../src/date-picker/useFocusOut.ts"],"sourcesContent":["import type { ElementProps, FloatingContext } from \"@floating-ui/react\";\nimport { useMemo } from \"react\";\n\nexport interface UseFocusOutProps {\n /*\n Whether the hook is enabled\n * @default true\n */\n enabled?: boolean;\n}\n\nfunction getTabbableElements(parent: Element): HTMLElement[] {\n const focusableSelectors = [\n \"button:not([disabled])\",\n \"input:not([disabled])\",\n '[tabindex]:not([tabindex=\"-1\"])',\n ];\n const tabbableElements = parent.querySelectorAll<HTMLElement>(\n focusableSelectors.join(\",\"),\n );\n return Array.from(tabbableElements).filter(\n (element) => !element.hasAttribute(\"disabled\") && element.tabIndex >= 0,\n );\n}\n//\n// This hook is needed to close the overlay, when,\n// 1. the floating element is opened\n// 2. the user re-focuses into the reference element with the mouse\n// 3. the user tabs out of the reference element\n// Without this hook, the floating element can re-receive focus\nexport function useFocusOut(\n context: FloatingContext,\n props: UseFocusOutProps,\n): ElementProps {\n const { onOpenChange } = context;\n const { enabled = true } = props;\n\n const reference: ElementProps[\"reference\"] = useMemo(() => {\n const referenceElement = context.elements.reference as Element \| undefined;\n\n if (!referenceElement) {\n return {};\n }\n\n return {\n onKeyDown(event: React.KeyboardEvent<Element>) {\n if (event.key === \"Tab\") {\n const tabbableElements = getTabbableElements(referenceElement);\n const tabbedBeforeFirstElement =\n event.shiftKey && document.activeElement === tabbableElements[0];\n const tabbedAfterLastElement =\n document.activeElement ===\n tabbableElements[tabbableElements.length - 1];\n if (tabbedBeforeFirstElement \|\| tabbedAfterLastElement) {\n onOpenChange(false, event.nativeEvent, \"focus-out\");\n }\n }\n },\n };\n }, [onOpenChange, context.elements.reference]);\n\n return useMemo(() => (enabled ? { reference } : {}), [enabled, reference]);\n}\n"],"names":[],"mappings":";;AAWA,SAAS,oBAAoB,MAAgC,EAAA;AAC3D,EAAA,MAAM,kBAAqB,GAAA;AAAA,IACzB,wBAAA;AAAA,IACA,uBAAA;AAAA,IACA;AAAA,GACF;AACA,EAAA,MAAM,mBAAmB,MAAO,CAAA,gBAAA;AAAA,IAC9B,kBAAA,CAAmB,KAAK,GAAG;AAAA,GAC7B;AACA,EAAO,OAAA,KAAA,CAAM,IAAK,CAAA,gBAAgB,CAAE,CAAA,MAAA;AAAA,IAClC,CAAC,YAAY,CAAC,OAAA,CAAQ,aAAa,UAAU,CAAA,IAAK,QAAQ,QAAY,IAAA;AAAA,GACxE;AACF;AAOgB,SAAA,WAAA,CACd,SACA,KACc,EAAA;AACd,EAAM,MAAA,EAAE,cAAiB,GAAA,OAAA;AACzB,EAAM,MAAA,EAAE,OAAU,GAAA,IAAA,EAAS,GAAA,KAAA;AAE3B,EAAM,MAAA,SAAA,GAAuC,QAAQ,MAAM;AACzD,IAAM,MAAA,gBAAA,GAAmB,QAAQ,QAAS,CAAA,SAAA;AAE1C,IAAA,IAAI,CAAC,gBAAkB,EAAA;AACrB,MAAA,OAAO,EAAC;AAAA;AAGV,IAAO,OAAA;AAAA,MACL,UAAU,KAAqC,EAAA;AAC7C,QAAI,IAAA,KAAA,CAAM,QAAQ,KAAO,EAAA;AACvB,UAAM,MAAA,gBAAA,GAAmB,oBAAoB,gBAAgB,CAAA;AAC7D,UAAA,MAAM,2BACJ,KAAM,CAAA,QAAA,IAAY,QAAS,CAAA,aAAA,KAAkB,iBAAiB,CAAC,CAAA;AACjE,UAAA,MAAM,yBACJ,QAAS,CAAA,aAAA,KACT,gBAAiB,CAAA,gBAAA,CAAiB,SAAS,CAAC,CAAA;AAC9C,UAAA,IAAI,4BAA4B,sBAAwB,EAAA;AACtD,YAAa,YAAA,CAAA,KAAA,EAAO,KAAM,CAAA,WAAA,EAAa,WAAW,CAAA;AAAA;AACpD;AACF;AACF,KACF;AAAA,KACC,CAAC,YAAA,EAAc,OAAQ,CAAA,QAAA,CAAS,SAAS,CAAC,CAAA;AAE7C,EAAO,OAAA,OAAA,CAAQ,MAAO,OAAA,GAAU,EAAE,SAAA,EAAc,GAAA,EAAK,EAAA,CAAC,OAAS,EAAA,SAAS,CAAC,CAAA;AAC3E;;;;"}

package/dist-es/dropdown/DropdownButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DropdownButton.js","sources":["../src/dropdown/DropdownButton.tsx"],"sourcesContent":["import { Button, type ButtonProps, makePrefixer, useIcon } from \"@salt-ds/core\";\nimport { DEFAULT_ICON_SIZE, type IconProps } from \"@salt-ds/icons\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type AriaAttributes,\n type ComponentType,\n type ForwardedRef,\n forwardRef,\n} from \"react\";\nimport { useFormFieldLegacyProps } from \"../form-field-context-legacy\";\n\nimport dropdownButtonCss from \"./DropdownButton.css\";\n\nexport interface DropdownButtonProps extends ButtonProps {\n /*\n Replace the default Icon component\n /\n IconComponent?: ComponentType<~~any~~>;\n /\n Whether the dropdown button should hide role='option' via 'aria-hidden'\n /\n ariaHideOptionRole?: boolean;\n /\n If, `true`, the Dropdown button will occupy the full width of it's container\n /\n fullWidth?: boolean;\n /\n Sets the size of the down arrow icon. If this is not specified, a default size based on density is used.\n /\n iconSize?: IconProps[\"size\"];\n /\n Is the dropdown list open\n /\n isOpen?: boolean;\n /\n Label for the dropdown button\n /\n label?: string;\n /\n Id for the label. This is needed for ARIA attributes.\n /\n labelId?: string;\n /\n When the dropdown is collapsed this value is set as aria-posinset on the span containing the selected value\n * /\n posInSet?: number;\n /\n * When the dropdown is collapsed this value is set as aria-setsize on the span containing the selected value\n * /\n setSize?: number;\n /\n \n **/\n labelAriaAttributes?: Pick<\n AriaAttributes,\n \"aria-posinset\" \| \"aria-setsize\" \| \"aria-selected\"\n >;\n}\n\nconst withBaseName = makePrefixer(\"saltDropdownButton\");\n\nexport const DropdownButton = forwardRef(function DropdownButton(\n {\n IconComponent,\n ariaHideOptionRole,\n className,\n disabled,\n iconSize = DEFAULT_ICON_SIZE,\n isOpen,\n label,\n labelId,\n fullWidth,\n posInSet,\n setSize,\n labelAriaAttributes,\n ...rest\n }: DropdownButtonProps,\n ref: ForwardedRef<HTMLButtonElement>,\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-dropdown-button\",\n css: dropdownButtonCss,\n window: targetWindow,\n });\n const { ExpandIcon } = useIcon();\n const Icon = IconComponent === undefined ? ExpandIcon : IconComponent;\n const { inFormField } = useFormFieldLegacyProps();\n // FIXME: use polymorphic button\n // We don't want the 'button' tag to be shown in the DOM to trigger some accessibility testing\n // tool's false alarm on role of 'listbox'\n return (\n <Button\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"fullwidth\")]: fullWidth,\n [withBaseName(\"formField\")]: inFormField,\n },\n className,\n )}\n data-testid=\"dropdown-button\"\n disabled={disabled}\n variant=\"secondary\"\n {...rest}\n ref={ref}\n >\n <div className={withBaseName(\"content\")}>\n <span\n // 'hidden' so that screen reader won't be confused the additional 'option' which is just a label\n aria-hidden={ariaHideOptionRole ? \"true\" : undefined}\n {...labelAriaAttributes}\n className={withBaseName(\"buttonLabel\")}\n id={labelId}\n ~~// biome-ignore lint/a11y/useAriaPropsForRole: 'option'~~ role ~~here is to suppress accessibility testing tool warning about 'listbox' missing children role\n role~~=\"option\"\n >\n {label}\n </span>\n <Icon\n className={withBaseName(\"icon\")}\n size={iconSize}\n aria-label={null}\n aria-hidden=\"true\"\n />\n </div>\n </Button>\n );\n});\n"],"names":["DropdownButton","dropdownButtonCss"],"mappings":";;;;;;;;;;;AA6DA,MAAM,YAAA,GAAe,aAAa,oBAAoB,CAAA;AAEzC,MAAA,cAAA,GAAiB,UAAW,CAAA,SAASA,eAChD,CAAA;AAAA,EACE,aAAA;AAAA,EACA,kBAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAW,GAAA,iBAAA;AAAA,EACX,MAAA;AAAA,EACA,KAAA;AAAA,EACA,OAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA;AAAA,EACA,OAAA;AAAA,EACA,mBAAA;AAAA,EACA,GAAG;AACL,CAAA,EACA,GACA,EAAA;AACA,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,sBAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AACD,EAAM,MAAA,EAAE,UAAW,EAAA,GAAI,OAAQ,EAAA;AAC/B,EAAM,MAAA,IAAA,GAAO,aAAkB,KAAA,MAAA,GAAY,UAAa,GAAA,aAAA;AACxD,EAAM,MAAA,EAAE,WAAY,EAAA,GAAI,uBAAwB,EAAA;AAIhD,EACE,uBAAA,GAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb;AAAA,UACE,CAAC,YAAA,CAAa,WAAW,CAAC,GAAG,SAAA;AAAA,UAC7B,CAAC,YAAA,CAAa,WAAW,CAAC,GAAG;AAAA,SAC/B;AAAA,QACA;AAAA,OACF;AAAA,MACA,aAAY,EAAA,iBAAA;AAAA,MACZ,QAAA;AAAA,MACA,OAAQ,EAAA,WAAA;AAAA,MACP,GAAG,IAAA;AAAA,MACJ,GAAA;AAAA,MAEA,QAAC,kBAAA,IAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,YAAA,CAAa,SAAS,CACpC,EAAA,QAAA,EAAA;AAAA,wBAAA,GAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YAEC,aAAA,EAAa,qBAAqB,MAAS,GAAA,MAAA;AAAA,YAC1C,GAAG,mBAAA;AAAA,YACJ,SAAA,EAAW,aAAa,aAAa,CAAA;AAAA,YACrC,EAAI,EAAA,OAAA;AAAA,~~YAEJ~~,IAAK,EAAA,QAAA;AAAA,YAEJ,QAAA,EAAA;AAAA;AAAA,SACH;AAAA,wBACA,GAAA;AAAA,UAAC,IAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,aAAa,MAAM,CAAA;AAAA,YAC9B,IAAM,EAAA,QAAA;AAAA,YACN,YAAY,EAAA,IAAA;AAAA,YACZ,aAAY,EAAA;AAAA;AAAA;AACd,OACF,EAAA;AAAA;AAAA,GACF;AAEJ,CAAC;;;;"}
1	+ {"version":3,"file":"DropdownButton.js","sources":["../src/dropdown/DropdownButton.tsx"],"sourcesContent":["import { Button, type ButtonProps, makePrefixer, useIcon } from \"@salt-ds/core\";\nimport { DEFAULT_ICON_SIZE, type IconProps } from \"@salt-ds/icons\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type AriaAttributes,\n type ComponentType,\n type ForwardedRef,\n forwardRef,\n} from \"react\";\nimport { useFormFieldLegacyProps } from \"../form-field-context-legacy\";\n\nimport dropdownButtonCss from \"./DropdownButton.css\";\n\nexport interface DropdownButtonProps extends ButtonProps {\n /*\n Replace the default Icon component\n /\n IconComponent?: ComponentType<IconProps>;\n /\n Whether the dropdown button should hide role='option' via 'aria-hidden'\n /\n ariaHideOptionRole?: boolean;\n /\n If, `true`, the Dropdown button will occupy the full width of it's container\n /\n fullWidth?: boolean;\n /\n Sets the size of the down arrow icon. If this is not specified, a default size based on density is used.\n /\n iconSize?: IconProps[\"size\"];\n /\n Is the dropdown list open\n /\n isOpen?: boolean;\n /\n Label for the dropdown button\n /\n label?: string;\n /\n Id for the label. This is needed for ARIA attributes.\n /\n labelId?: string;\n /\n When the dropdown is collapsed this value is set as aria-posinset on the span containing the selected value\n * /\n posInSet?: number;\n /\n * When the dropdown is collapsed this value is set as aria-setsize on the span containing the selected value\n * /\n setSize?: number;\n /\n \n **/\n labelAriaAttributes?: Pick<\n AriaAttributes,\n \"aria-posinset\" \| \"aria-setsize\" \| \"aria-selected\"\n >;\n}\n\nconst withBaseName = makePrefixer(\"saltDropdownButton\");\n\nexport const DropdownButton = forwardRef(function DropdownButton(\n {\n IconComponent,\n ariaHideOptionRole,\n className,\n disabled,\n iconSize = DEFAULT_ICON_SIZE,\n isOpen,\n label,\n labelId,\n fullWidth,\n posInSet,\n setSize,\n labelAriaAttributes,\n ...rest\n }: DropdownButtonProps,\n ref: ForwardedRef<HTMLButtonElement>,\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-dropdown-button\",\n css: dropdownButtonCss,\n window: targetWindow,\n });\n const { ExpandIcon } = useIcon();\n const Icon = IconComponent === undefined ? ExpandIcon : IconComponent;\n const { inFormField } = useFormFieldLegacyProps();\n // FIXME: use polymorphic button\n // We don't want the 'button' tag to be shown in the DOM to trigger some accessibility testing\n // tool's false alarm on role of 'listbox'\n return (\n <Button\n className={clsx(\n withBaseName(),\n {\n [withBaseName(\"fullwidth\")]: fullWidth,\n [withBaseName(\"formField\")]: inFormField,\n },\n className,\n )}\n data-testid=\"dropdown-button\"\n disabled={disabled}\n variant=\"secondary\"\n {...rest}\n ref={ref}\n >\n <div className={withBaseName(\"content\")}>\n <span\n // 'hidden' so that screen reader won't be confused the additional 'option' which is just a label\n aria-hidden={ariaHideOptionRole ? \"true\" : undefined}\n {...labelAriaAttributes}\n className={withBaseName(\"buttonLabel\")}\n id={labelId}\n role=\"option\"\n >\n {label}\n </span>\n <Icon\n className={withBaseName(\"icon\")}\n size={iconSize}\n aria-label={null}\n aria-hidden=\"true\"\n />\n </div>\n </Button>\n );\n});\n"],"names":["DropdownButton","dropdownButtonCss"],"mappings":";;;;;;;;;;;AA6DA,MAAM,YAAA,GAAe,aAAa,oBAAoB,CAAA;AAEzC,MAAA,cAAA,GAAiB,UAAW,CAAA,SAASA,eAChD,CAAA;AAAA,EACE,aAAA;AAAA,EACA,kBAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAW,GAAA,iBAAA;AAAA,EACX,MAAA;AAAA,EACA,KAAA;AAAA,EACA,OAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA;AAAA,EACA,OAAA;AAAA,EACA,mBAAA;AAAA,EACA,GAAG;AACL,CAAA,EACA,GACA,EAAA;AACA,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,sBAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AACD,EAAM,MAAA,EAAE,UAAW,EAAA,GAAI,OAAQ,EAAA;AAC/B,EAAM,MAAA,IAAA,GAAO,aAAkB,KAAA,MAAA,GAAY,UAAa,GAAA,aAAA;AACxD,EAAM,MAAA,EAAE,WAAY,EAAA,GAAI,uBAAwB,EAAA;AAIhD,EACE,uBAAA,GAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb;AAAA,UACE,CAAC,YAAA,CAAa,WAAW,CAAC,GAAG,SAAA;AAAA,UAC7B,CAAC,YAAA,CAAa,WAAW,CAAC,GAAG;AAAA,SAC/B;AAAA,QACA;AAAA,OACF;AAAA,MACA,aAAY,EAAA,iBAAA;AAAA,MACZ,QAAA;AAAA,MACA,OAAQ,EAAA,WAAA;AAAA,MACP,GAAG,IAAA;AAAA,MACJ,GAAA;AAAA,MAEA,QAAC,kBAAA,IAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,YAAA,CAAa,SAAS,CACpC,EAAA,QAAA,EAAA;AAAA,wBAAA,GAAA;AAAA,UAAC,MAAA;AAAA,UAAA;AAAA,YAEC,aAAA,EAAa,qBAAqB,MAAS,GAAA,MAAA;AAAA,YAC1C,GAAG,mBAAA;AAAA,YACJ,SAAA,EAAW,aAAa,aAAa,CAAA;AAAA,YACrC,EAAI,EAAA,OAAA;AAAA,YACJ,IAAK,EAAA,QAAA;AAAA,YAEJ,QAAA,EAAA;AAAA;AAAA,SACH;AAAA,wBACA,GAAA;AAAA,UAAC,IAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,aAAa,MAAM,CAAA;AAAA,YAC9B,IAAM,EAAA,QAAA;AAAA,YACN,YAAY,EAAA,IAAA;AAAA,YACZ,aAAY,EAAA;AAAA;AAAA;AACd,OACF,EAAA;AAAA;AAAA,GACF;AAEJ,CAAC;;;;"}

package/dist-es/dropdown/useDropdown.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useDropdown.js","sources":["../src/dropdown/useDropdown.ts"],"sourcesContent":["import { useControlled } from \"@salt-ds/core\";\nimport { useCallback, useMemo } from \"react\";\nimport {\n type CollectionItem,\n itemToString as defaultItemToString,\n type SelectHandler,\n type SelectionChangeHandler,\n type SelectionStrategy,\n} from \"../common-hooks\";\nimport { type ListHookProps, type ListHookResult, useList } from \"../list\";\nimport type { DropdownHookProps, DropdownHookResult } from \"./dropdownTypes\";\n\nconst NULL_REF = { current: null };\n\nexport interface DropdownListHookProps<Item, Strategy extends SelectionStrategy>\n extends Partial<Omit<DropdownHookProps, \"onKeyDown\">>,\n Omit<ListHookProps<Item, Strategy>, \"containerRef\"> {\n itemToString?: (item: Item) => string;\n}\n\nexport interface DropdownListHookResult<\n Item,\n Selection extends SelectionStrategy,\n> extends Partial<ListHookResult<Item, Selection>>,\n Partial<DropdownHookResult> {\n onOpenChange: ~~any~~;\n triggerLabel?: string;\n}\n\nexport const useDropdown = <\n Item,\n Selection extends SelectionStrategy = \"default\",\n>({\n collectionHook,\n defaultHighlightedIndex: defaultHighlightedIndexProp,\n defaultIsOpen,\n defaultSelected,\n highlightedIndex: highlightedIndexProp,\n isOpen: isOpenProp,\n itemToString = defaultItemToString,\n onHighlight,\n onOpenChange,\n onSelectionChange,\n onSelect,\n selected,\n selectionStrategy,\n}: DropdownListHookProps<Item, Selection>): DropdownListHookResult<\n Item,\n Selection\n> => {\n const isMultiSelect =\n selectionStrategy === \"multiple\" \|\| selectionStrategy === \"extended\";\n\n const [isOpen, setIsOpen] = useControlled<boolean>({\n controlled: isOpenProp,\n default: defaultIsOpen ?? false,\n name: \"useDropdownList\",\n });\n\n const handleSelectionChange = useCallback<\n SelectionChangeHandler<Item, Selection>\n >(\n (evt, selected) => {\n if (!isMultiSelect) {\n setIsOpen(false);\n onOpenChange?.(false);\n }\n onSelectionChange?.(evt, selected);\n },\n [isMultiSelect, onOpenChange, onSelectionChange],\n );\n\n const handleSelect = useCallback<SelectHandler<Item>>(\n (evt, selected) => {\n if (!isMultiSelect) {\n setIsOpen(false);\n onOpenChange?.(false);\n }\n onSelect?.(evt, selected);\n },\n [isMultiSelect, onOpenChange, onSelect],\n );\n\n const listHook = useList<Item, Selection>({\n collectionHook,\n defaultHighlightedIndex:\n (defaultHighlightedIndexProp ?? highlightedIndexProp === undefined)\n ? 0\n : undefined,\n defaultSelected,\n label: \"useDropDownList\",\n onSelectionChange: handleSelectionChange,\n onSelect: handleSelect,\n containerRef: NULL_REF,\n highlightedIndex: highlightedIndexProp,\n onHighlight,\n selected,\n selectionStrategy,\n tabToSelect: !isMultiSelect,\n });\n\n const handleOpenChange = useCallback(\n (open: boolean) => {\n setIsOpen(open);\n onOpenChange?.(open);\n },\n [onOpenChange],\n );\n\n const triggerLabel = useMemo(() => {\n if (isMultiSelect && Array.isArray(listHook.selected)) {\n const selectedItems = listHook.selected as CollectionItem<Item>[];\n if (selectedItems.length === 0) {\n return undefined;\n }\n if (selectedItems.length === 1) {\n const { value } = selectedItems[0];\n return value === null ? undefined : itemToString(value);\n }\n return `${selectedItems.length} items selected`;\n }\n const selectedItem = listHook.selected as CollectionItem<Item>;\n return selectedItem == null \|\| selectedItem.value === null\n ? undefined\n : itemToString(selectedItem.value);\n }, [isMultiSelect, itemToString, listHook.selected]);\n\n return {\n isOpen,\n onOpenChange: handleOpenChange,\n triggerLabel,\n ...listHook,\n };\n};\n"],"names":["itemToString","defaultItemToString","selected"],"mappings":"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"}
1	+ {"version":3,"file":"useDropdown.js","sources":["../src/dropdown/useDropdown.ts"],"sourcesContent":["import { useControlled } from \"@salt-ds/core\";\nimport { useCallback, useMemo } from \"react\";\nimport {\n type CollectionItem,\n itemToString as defaultItemToString,\n type SelectHandler,\n type SelectionChangeHandler,\n type SelectionStrategy,\n} from \"../common-hooks\";\nimport { type ListHookProps, type ListHookResult, useList } from \"../list\";\nimport type { DropdownHookProps, DropdownHookResult } from \"./dropdownTypes\";\n\nconst NULL_REF = { current: null };\n\nexport interface DropdownListHookProps<Item, Strategy extends SelectionStrategy>\n extends Partial<Omit<DropdownHookProps, \"onKeyDown\">>,\n Omit<ListHookProps<Item, Strategy>, \"containerRef\"> {\n itemToString?: (item: Item) => string;\n}\n\nexport interface DropdownListHookResult<\n Item,\n Selection extends SelectionStrategy,\n> extends Partial<ListHookResult<Item, Selection>>,\n Partial<DropdownHookResult> {\n onOpenChange: (open: boolean) => void;\n triggerLabel?: string;\n}\n\nexport const useDropdown = <\n Item,\n Selection extends SelectionStrategy = \"default\",\n>({\n collectionHook,\n defaultHighlightedIndex: defaultHighlightedIndexProp,\n defaultIsOpen,\n defaultSelected,\n highlightedIndex: highlightedIndexProp,\n isOpen: isOpenProp,\n itemToString = defaultItemToString,\n onHighlight,\n onOpenChange,\n onSelectionChange,\n onSelect,\n selected,\n selectionStrategy,\n}: DropdownListHookProps<Item, Selection>): DropdownListHookResult<\n Item,\n Selection\n> => {\n const isMultiSelect =\n selectionStrategy === \"multiple\" \|\| selectionStrategy === \"extended\";\n\n const [isOpen, setIsOpen] = useControlled<boolean>({\n controlled: isOpenProp,\n default: defaultIsOpen ?? false,\n name: \"useDropdownList\",\n });\n\n const handleSelectionChange = useCallback<\n SelectionChangeHandler<Item, Selection>\n >(\n (evt, selected) => {\n if (!isMultiSelect) {\n setIsOpen(false);\n onOpenChange?.(false);\n }\n onSelectionChange?.(evt, selected);\n },\n [isMultiSelect, onOpenChange, onSelectionChange],\n );\n\n const handleSelect = useCallback<SelectHandler<Item>>(\n (evt, selected) => {\n if (!isMultiSelect) {\n setIsOpen(false);\n onOpenChange?.(false);\n }\n onSelect?.(evt, selected);\n },\n [isMultiSelect, onOpenChange, onSelect],\n );\n\n const listHook = useList<Item, Selection>({\n collectionHook,\n defaultHighlightedIndex:\n (defaultHighlightedIndexProp ?? highlightedIndexProp === undefined)\n ? 0\n : undefined,\n defaultSelected,\n label: \"useDropDownList\",\n onSelectionChange: handleSelectionChange,\n onSelect: handleSelect,\n containerRef: NULL_REF,\n highlightedIndex: highlightedIndexProp,\n onHighlight,\n selected,\n selectionStrategy,\n tabToSelect: !isMultiSelect,\n });\n\n const handleOpenChange = useCallback(\n (open: boolean) => {\n setIsOpen(open);\n onOpenChange?.(open);\n },\n [onOpenChange],\n );\n\n const triggerLabel = useMemo(() => {\n if (isMultiSelect && Array.isArray(listHook.selected)) {\n const selectedItems = listHook.selected as CollectionItem<Item>[];\n if (selectedItems.length === 0) {\n return undefined;\n }\n if (selectedItems.length === 1) {\n const { value } = selectedItems[0];\n return value === null ? undefined : itemToString(value);\n }\n return `${selectedItems.length} items selected`;\n }\n const selectedItem = listHook.selected as CollectionItem<Item>;\n return selectedItem == null \|\| selectedItem.value === null\n ? undefined\n : itemToString(selectedItem.value);\n }, [isMultiSelect, itemToString, listHook.selected]);\n\n return {\n isOpen,\n onOpenChange: handleOpenChange,\n triggerLabel,\n ...listHook,\n };\n};\n"],"names":["itemToString","defaultItemToString","selected"],"mappings":"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"}

package/dist-es/index.js CHANGED Viewed

@@ -11,6 +11,9 @@ export { useCalendar } from './calendar/useCalendar.js';
 export { useCalendarDay } from './calendar/useCalendarDay.js';
 export { isDateRangeSelection, useCalendarSelection, useCalendarSelectionDay } from './calendar/useCalendarSelection.js';
 export { CascadingMenu } from './cascading-menu/CascadingMenu.js';
+export { Collapsible } from './collapsible/Collapsible.js';
+export { CollapsiblePanel } from './collapsible/CollapsiblePanel.js';
+export { CollapsibleTrigger } from './collapsible/CollapsibleTrigger.js';
 export { Color } from './color-chooser/Color.js';
 export { ColorChooser } from './color-chooser/ColorChooser.js';
 export { convertColorMapValueToHex, getColorNameByHexValue, getHexValue, hexValueWithoutAlpha, isValidHex } from './color-chooser/ColorHelpers.js';
@@ -125,6 +128,13 @@ export { StaticListItemContent } from './static-list/StaticListItemContent.js';
 export { SystemStatus } from './system-status/SystemStatus.js';
 export { SystemStatusActions } from './system-status/SystemStatusActions.js';
 export { SystemStatusContent } from './system-status/SystemStatusContent.js';
+export { Table, withTableBaseName } from './table/Table.js';
+export { TBody } from './table/TBody.js';
+export { TD } from './table/TD.js';
+export { TFoot } from './table/TFoot.js';
+export { TH } from './table/TH.js';
+export { THead } from './table/THead.js';
+export { TR } from './table/TR.js';
 export { Tab } from './tabs/Tab.js';
 export { TabActivationIndicator } from './tabs/TabActivationIndicator.js';
 export { TabPanel } from './tabs/TabPanel.js';
@@ -148,6 +158,13 @@ export { ToolbarButton } from './toolbar/ToolbarButton.js';
 export { Tooltray } from './toolbar/Tooltray.js';
 export { ToolbarField } from './toolbar/toolbar-field/ToolbarField.js';
 export { Tree } from './tree/Tree.js';
+export { VerticalNavigation } from './vertical-navigation/VerticalNavigation.js';
+export { VerticalNavigationItem, useVerticalNavigationItem } from './vertical-navigation/VerticalNavigationItem.js';
+export { VerticalNavigationItemContent } from './vertical-navigation/VerticalNavigationItemContent.js';
+export { VerticalNavigationItemExpansionIcon } from './vertical-navigation/VerticalNavigationItemExpansionIcon.js';
+export { VerticalNavigationItemLabel } from './vertical-navigation/VerticalNavigationItemLabel.js';
+export { VerticalNavigationItemTrigger } from './vertical-navigation/VerticalNavigationItemTrigger.js';
+export { VerticalNavigationSubMenu } from './vertical-navigation/VerticalNavigationSubMenu.js';
 export { ElectronWindow } from './window/ElectronWindow.js';
 export { Window, WindowContext, isDesktop, useWindow } from './window/WindowContext.js';
 //# sourceMappingURL=index.js.map

package/dist-es/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~"}
1	+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist-es/input-legacy/InputLegacy.css.js CHANGED Viewed

@@ -1,4 +1,4 @@
-var css_248z = "/* Styles applied to the root element dependent on density */\n.salt-density-touch {\n  --inputLegacy-adornment-height: calc(var(--salt-size-base) + var(--salt-size-unit) * 0.5);\n  --inputLegacy-button-inset: 4px;\n}\n.salt-density-low {\n  --inputLegacy-adornment-height: calc(var(--salt-size-base) + var(--salt-size-unit) * 2 / 3);\n  --inputLegacy-button-inset: 4px;\n}\n.salt-density-medium {\n  --inputLegacy-adornment-height: calc(var(--salt-size-base) + var(--salt-size-unit) * 0.5);\n  --inputLegacy-button-inset: 2px;\n}\n.salt-density-high {\n  --inputLegacy-adornment-height: calc(var(--salt-size-base) + var(--salt-size-unit));\n  --inputLegacy-button-inset: 2px;\n}\n\n/* Style applied to the root element */\n.saltInputLegacy {\n  align-items: center;\n  background: var(--saltInputLegacy-background, none);\n  border: var(--saltInputLegacy-border, none);\n  border-radius: var(--saltInputLegacy-borderRadius, 0);\n  color: var(--saltInputLegacy-text-color, var(--salt-content-primary-foreground));\n  cursor: var(--saltInputLegacy-cursor, default);\n  display: inline-flex;\n  font-family: var(--saltInputLegacy-fontFamily, var(--salt-text-fontFamily));\n  font-size: var(--saltInputLegacy-fontSize, var(--salt-text-fontSize));\n  height: var(--saltInputLegacy-height, var(--salt-size-base));\n  line-height: var(--salt-text-lineHeight);\n  min-height: var(--saltInputLegacy-minHeight, var(--salt-size-base));\n  min-width: var(--saltInputLegacy-minWidth, 8em);\n  padding: var(--saltInputLegacy-padding, 0 var(--salt-size-unit));\n  position: var(--saltInputLegacy-position, relative);\n  width: 100%;\n  box-sizing: border-box;\n}\n\n/* Reset in the next class */\n.saltInputLegacy-input:focus {\n  outline: none;\n}\n\n/* Pseudo-class applied to the root element when focused */\n.saltInputLegacy-focused {\n  outline-style: var(--saltInputLegacy-focused-outlineStyle, var(--salt-focused-outlineStyle));\n  outline-width: var(--saltInputLegacy-focused-outlineWidth, var(--salt-focused-outlineWidth));\n  outline-color: var(--saltInputLegacy-focused-outlineColor, var(--salt-focused-outlineColor));\n  outline-offset: var(--saltInputLegacy-focused-outlineOffset, var(--salt-focused-outlineOffset));\n}\n\n/* Style applied to selected input */\n.saltInputLegacy-input::selection {\n  background-color: var(--saltInputLegacy-highlight-color, var(--salt-content-foreground-highlight));\n}\n\n/* Style applied to inner input component */\n.saltInputLegacy-input {\n  background: var(--saltInputLegacy-background, none);\n  border: none;\n  box-sizing: content-box;\n  color: inherit;\n  display: block;\n  flex: 1;\n  font: inherit;\n  letter-spacing: var(--saltInputLegacy-letterSpacing, 0);\n  margin: 0;\n  min-width: 0;\n  overflow: hidden;\n  padding: 0;\n  height: 100%;\n  width: 100%;\n}\n\n/* Style applied to input if `disabled={true}` */\n.saltInputLegacy-disabled .saltInputLegacy-input {\n  cursor: var(--salt-cursor-disabled);\n  color: var(--saltInputLegacy-text-color-disabled, var(--salt-content-primary-foreground-disabled));\n}\n\n/* Style applied to adornment containers */\n.saltInputLegacy-suffixContainer,\n.saltInputLegacy-prefixContainer {\n  display: flex;\n  align-items: center;\n\n  height: var(--inputLegacy-adornment-height);\n}\n\n/* Style applied to root element with start adornment */\n.saltInputLegacy-inputAdornedStart {\n  padding-left: var(--saltInputLegacy-adornedStart-padding, 0);\n}\n\n/* Style applied to inner input element with start adornment */\n.saltInputLegacy-inputAdornedStart .saltInputLegacy-input {\n  padding-left: var(--saltInputLegacy-adornedStart-input-padding, var(--salt-size-unit));\n}\n\n/* Style applied to root element with end adornment */\n.saltInputLegacy-inputAdornedEnd {\n  padding-right: var(--saltInputLegacy-adornedEnd-padding, 0);\n}\n\n/* Style applied to inner input element with end adornment */\n.saltInputLegacy-inputAdornedEnd .saltInputLegacy-input {\n  padding-right: var(--saltInputLegacy-adornedEnd-input-padding, var(--salt-size-unit));\n}\n\n/* Style applied to salt Button used within Input component adornments */\n.saltInputLegacy .saltInputLegacy-suffixContainer > .saltButton,\n.saltInputLegacy .saltInputLegacy-prefixContainer > .saltButton {\n  height: calc(var(--saltButton-height, var(--salt-size-base)) - (var(--inputLegacy-button-inset) * 2));\n  margin: var(--inputLegacy-button-inset);\n  padding: 0 calc(var(--salt-size-unit) - var(--inputLegacy-button-inset));\n}\n\n/* Style applied if `textAlign={\"left\"}` */\n.saltInputLegacy-leftTextAlign .saltInputLegacy-input {\n  text-align: left;\n}\n\n/* Style applied if `textAlign={\"center\"}` */\n.saltInputLegacy-centerTextAlign .saltInputLegacy-input {\n  text-align: center;\n}\n\n/* Style applied if `textAlign={\"right\"}` */\n.saltInputLegacy-rightTextAlign .saltInputLegacy-input {\n  text-align: right;\n}\n\n/* Style applied if `inFormField={true}` */\n.saltInputLegacy-formField {\n  min-width: var(--saltFormFieldLegacy-input-minWidth, 0px);\n  width: 100%;\n}\n";
+var css_248z = "/* Styles applied to the root element dependent on density */\n.salt-density-touch {\n  --inputLegacy-adornment-height: calc(var(--salt-size-base) + var(--salt-size-unit) * 0.5);\n  --inputLegacy-button-inset: 4px;\n}\n.salt-density-low {\n  --inputLegacy-adornment-height: calc(var(--salt-size-base) + var(--salt-size-unit) * 2 / 3);\n  --inputLegacy-button-inset: 4px;\n}\n.salt-density-medium {\n  --inputLegacy-adornment-height: calc(var(--salt-size-base) + var(--salt-size-unit) * 0.5);\n  --inputLegacy-button-inset: 2px;\n}\n.salt-density-high {\n  --inputLegacy-adornment-height: calc(var(--salt-size-base) + var(--salt-size-unit));\n  --inputLegacy-button-inset: 2px;\n}\n\n/* Style applied to the root element */\n.saltInputLegacy {\n  align-items: center;\n  background: var(--saltInputLegacy-background, none);\n  border: var(--saltInputLegacy-border, none);\n  border-radius: var(--saltInputLegacy-borderRadius, 0);\n  color: var(--saltInputLegacy-text-color, var(--salt-content-primary-foreground));\n  cursor: var(--saltInputLegacy-cursor, default);\n  display: inline-flex;\n  font-family: var(--saltInputLegacy-fontFamily, var(--salt-text-fontFamily));\n  font-size: var(--saltInputLegacy-fontSize, var(--salt-text-fontSize));\n  height: var(--saltInputLegacy-height, var(--salt-size-base));\n  line-height: var(--salt-text-lineHeight);\n  min-height: var(--saltInputLegacy-minHeight, var(--salt-size-base));\n  min-width: var(--saltInputLegacy-minWidth, 8em);\n  padding: var(--saltInputLegacy-padding, 0 var(--salt-size-unit));\n  position: var(--saltInputLegacy-position, relative);\n  width: 100%;\n  box-sizing: border-box;\n}\n\n/* Reset in the next class */\n.saltInputLegacy-input:focus {\n  outline: none;\n}\n\n/* Pseudo-class applied to the root element when focused */\n.saltInputLegacy-focused {\n  outline-style: var(--saltInputLegacy-focused-outlineStyle, var(--salt-focused-outlineStyle));\n  outline-width: var(--saltInputLegacy-focused-outlineWidth, var(--salt-focused-outlineWidth));\n  outline-color: var(--saltInputLegacy-focused-outlineColor, var(--salt-focused-outlineColor));\n  outline-offset: var(--saltInputLegacy-focused-outlineOffset, var(--salt-focused-outlineOffset));\n}\n\n/* Style applied to inner input component */\n.saltInputLegacy-input {\n  background: var(--saltInputLegacy-background, none);\n  border: none;\n  box-sizing: content-box;\n  color: inherit;\n  display: block;\n  flex: 1;\n  font: inherit;\n  letter-spacing: var(--saltInputLegacy-letterSpacing, 0);\n  margin: 0;\n  min-width: 0;\n  overflow: hidden;\n  padding: 0;\n  height: 100%;\n  width: 100%;\n}\n\n/* Style applied to input if `disabled={true}` */\n.saltInputLegacy-disabled .saltInputLegacy-input {\n  cursor: var(--salt-cursor-disabled);\n  color: var(--saltInputLegacy-text-color-disabled, var(--salt-content-primary-foreground-disabled));\n}\n\n/* Style applied to adornment containers */\n.saltInputLegacy-suffixContainer,\n.saltInputLegacy-prefixContainer {\n  display: flex;\n  align-items: center;\n\n  height: var(--inputLegacy-adornment-height);\n}\n\n/* Style applied to root element with start adornment */\n.saltInputLegacy-inputAdornedStart {\n  padding-left: var(--saltInputLegacy-adornedStart-padding, 0);\n}\n\n/* Style applied to inner input element with start adornment */\n.saltInputLegacy-inputAdornedStart .saltInputLegacy-input {\n  padding-left: var(--saltInputLegacy-adornedStart-input-padding, var(--salt-size-unit));\n}\n\n/* Style applied to root element with end adornment */\n.saltInputLegacy-inputAdornedEnd {\n  padding-right: var(--saltInputLegacy-adornedEnd-padding, 0);\n}\n\n/* Style applied to inner input element with end adornment */\n.saltInputLegacy-inputAdornedEnd .saltInputLegacy-input {\n  padding-right: var(--saltInputLegacy-adornedEnd-input-padding, var(--salt-size-unit));\n}\n\n/* Style applied to salt Button used within Input component adornments */\n.saltInputLegacy .saltInputLegacy-suffixContainer > .saltButton,\n.saltInputLegacy .saltInputLegacy-prefixContainer > .saltButton {\n  height: calc(var(--saltButton-height, var(--salt-size-base)) - (var(--inputLegacy-button-inset) * 2));\n  margin: var(--inputLegacy-button-inset);\n  padding: 0 calc(var(--salt-size-unit) - var(--inputLegacy-button-inset));\n}\n\n/* Style applied if `textAlign={\"left\"}` */\n.saltInputLegacy-leftTextAlign .saltInputLegacy-input {\n  text-align: left;\n}\n\n/* Style applied if `textAlign={\"center\"}` */\n.saltInputLegacy-centerTextAlign .saltInputLegacy-input {\n  text-align: center;\n}\n\n/* Style applied if `textAlign={\"right\"}` */\n.saltInputLegacy-rightTextAlign .saltInputLegacy-input {\n  text-align: right;\n}\n\n/* Style applied if `inFormField={true}` */\n.saltInputLegacy-formField {\n  min-width: var(--saltFormFieldLegacy-input-minWidth, 0px);\n  width: 100%;\n}\n";
 export { css_248z as default };
 //# sourceMappingURL=InputLegacy.css.js.map

package/dist-es/list/List.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { jsxs, jsx } from 'react/jsx-runtime';
 import { forwardRef, useRef, createElement, isValidElement, cloneElement } from 'react';
 import { makePrefixer, useIdMemo, useForkRef } from '@salt-ds/core';
 import { useComponentCssInjection } from '@salt-ds/styles';
@@ -252,7 +252,7 @@ const List = forwardRef(function List2({
       tabIndex: listDisabled || disableFocus ? void 0 : 0,
       children: [
         /* @__PURE__ */ jsx(ListItemProxy, { ref: rowHeightProxyRef }),
-        collectionHook.data.length === 0 && ListPlaceholder !== void 0 ? /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(ListPlaceholder, {}) }) : /* @__PURE__ */ jsx(
+        collectionHook.data.length === 0 && ListPlaceholder !== void 0 ? /* @__PURE__ */ jsx(ListPlaceholder, {}) : /* @__PURE__ */ jsx(
           "div",
           {
             className: withBaseName("scrollingContentContainer"),

package/dist-es/list/List.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"List.js","sources":["../src/list/List.tsx"],"sourcesContent":["import { makePrefixer, useForkRef, useIdMemo } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n cloneElement,\n type ForwardedRef,\n forwardRef,\n isValidElement,\n type ReactElement,\n useRef,\n} from \"react\";\nimport {\n type CollectionIndexer,\n type CollectionItem,\n itemToString as defaultItemToString,\n isSelected,\n LIST_FOCUS_VISIBLE,\n type ScrollingAPI,\n type SelectionStrategy,\n useCollectionItems,\n useImperativeScrollingAPI,\n} from \"../common-hooks\";\nimport listCss from \"./List.css\";\nimport { ListItem as DefaultListItem, ListItemProxy } from \"./ListItem\";\nimport type { ListItemProps, ListProps } from \"./listTypes\";\nimport { useList } from \"./useList\";\nimport { useListHeight } from \"./useListHeight\";\n\nconst defaultEmptyMessage = \"No data to display\";\n\nconst withBaseName = makePrefixer(\"saltList\");\n\nexport const List = forwardRef(function List<\n Item,\n Selection extends SelectionStrategy = \"default\",\n>(\n {\n ListItem = DefaultListItem,\n ListPlaceholder,\n borderless,\n children,\n className,\n collapsibleHeaders = false,\n defaultHighlightedIndex,\n defaultSelected,\n disabled: listDisabled = false,\n disableFocus = false,\n disableTypeToSelect,\n displayedItemCount = 10,\n emptyMessage,\n focusVisible: focusVisibleProp,\n getItemHeight: getItemHeightProp,\n getItemId,\n height,\n highlightedIndex: highlightedIndexProp,\n id: idProp,\n itemGapSize = 0,\n itemHeight: itemHeightProp,\n itemTextHighlightPattern,\n itemToString = defaultItemToString,\n listHandlers: listHandlersProp,\n maxHeight,\n maxWidth,\n minHeight,\n minWidth,\n onSelect,\n onSelectionChange,\n onHighlight,\n restoreLastFocus,\n selected: selectedProp,\n selectionStrategy,\n checkable = selectionStrategy === \"multiple\",\n scrollingApiRef,\n // TODO do we still need these ?\n selectionKeys,\n showEmptyMessage = false,\n source,\n style: styleProp,\n stickyHeaders,\n tabToSelect,\n width,\n ...htmlAttributes\n }: ListProps<Item, Selection>,\n forwardedRef?: ForwardedRef<HTMLDivElement>,\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-list\",\n css: listCss,\n window: targetWindow,\n });\n\n const id = useIdMemo(idProp);\n const rootRef = useRef<HTMLDivElement>(null);\n const contentRef = useRef<HTMLDivElement>(null);\n const rowHeightProxyRef = useRef<HTMLDivElement>(null);\n\n const collectionHook = useCollectionItems<Item>({\n id,\n label: \"List\",\n source,\n children,\n options: {\n collapsibleHeaders,\n // Add Group ChildTypes to options\n getItemId,\n itemToString,\n },\n });\n\n const { preferredHeight } = useListHeight({\n borderless,\n displayedItemCount,\n getItemHeight: getItemHeightProp,\n height,\n itemCount: collectionHook.data.length,\n itemGapSize,\n itemHeight: itemHeightProp,\n rowHeightRef: rowHeightProxyRef,\n });\n\n const {\n focusVisible,\n highlightedIndex,\n listControlProps,\n listHandlers,\n listItemHeaderHandlers,\n scrollIntoView,\n selected,\n } = useList<Item, Selection>({\n collapsibleHeaders,\n collectionHook,\n containerRef: rootRef,\n contentRef,\n defaultHighlightedIndex,\n defaultSelected: collectionHook.itemToCollectionItem<\n Selection,\n typeof defaultSelected\n >(defaultSelected),\n disabled: listDisabled,\n disableTypeToSelect,\n highlightedIndex: highlightedIndexProp,\n label: id,\n listHandlers: listHandlersProp, // should this be in context ?\n onSelect,\n onSelectionChange,\n onHighlight,\n restoreLastFocus,\n selected: collectionHook.itemToCollectionItem<\n Selection,\n typeof defaultSelected\n >(selectedProp),\n selectionStrategy,\n selectionKeys,\n stickyHeaders,\n tabToSelect,\n });\n\n useImperativeScrollingAPI({\n collectionHook,\n forwardedRef: scrollingApiRef,\n scrollableRef: rootRef,\n scrollIntoView,\n });\n\n // focusVisible passes as a prop takes precedence\n const appliedFocusVisible = focusVisibleProp ?? focusVisible;\n\n const createHeader: (\n idx: { value: number },\n headerId: string,\n title: string,\n expanded?: boolean,\n ) => ReactElement = function createHeader(idx, headerId, title, expanded) {\n const header = (\n <ListItem\n {...listItemHeaderHandlers}\n className={clsx(\"saltListItemHeader\", {\n focusVisible: collapsibleHeaders && appliedFocusVisible === idx.value,\n })}\n aria-expanded={expanded}\n data-idx={collapsibleHeaders ? idx.value : undefined}\n data-highlighted={idx.value === highlightedIndex \|\| undefined}\n data-sticky={stickyHeaders}\n data-selectable={false}\n id={headerId}\n key={`header-${idx.value}`}\n label={title}\n // role=\"presentation\"\n />\n );\n idx.value += 1;\n return header;\n };\n\n const getItemHeight =\n getItemHeightProp === undefined ? () => itemHeightProp : getItemHeightProp;\n\n function renderCollectionItem(\n list: ReactElement[],\n item: CollectionItem<Item>,\n idx: { value: number },\n ) {\n // Note, a number of these props are specific to ListItem. What if user\n // implements a custom ListItem but neglects to handle all these props.\n // Is that on them ?\n const { disabled, value, id: itemId, label } = item;\n const isChildItem = isValidElement(value);\n const listItemProps: ListItemProps<Item> & {\n key: string;\n \"data-idx\": number;\n } = {\n className: clsx({\n saltHighlighted: idx.value === highlightedIndex,\n saltFocusVisible: appliedFocusVisible === idx.value,\n }),\n disabled: disabled \|\| listDisabled,\n id: itemId,\n item: isChildItem ? undefined : (item?.value ?? undefined),\n itemHeight: getItemHeight(idx.value),\n itemTextHighlightPattern,\n key: itemId,\n \"data-idx\": idx.value,\n label,\n role: \"option\",\n selected: isSelected<Item>(selected, item),\n showCheckbox: checkable,\n };\n list.push(\n isChildItem ? (\n cloneElement(value, listItemProps)\n ) : (\n <ListItem {...listItemProps} />\n ),\n );\n\n idx.value += 1;\n }\n\n const addGroup: (\n list: ReactElement[],\n items: CollectionItem<Item>[],\n idx: { value: number },\n ) => void = function addGroup(\n list: ReactElement[],\n items: CollectionItem<Item>[],\n idx: { value: number },\n ) {\n const { count = 0, id, expanded, label = \"\" } = items[idx.value];\n const header = createHeader(idx, id, label, expanded);\n const childItems: ReactElement \| ReactElement[] =\n expanded !== false\n ? [header].concat(\n renderCollectionItems(items, idx, idx.value + count) \|\| [],\n )\n : header;\n\n list.push(\n <div key={id} role=\"group\">\n {childItems}\n </div>,\n );\n };\n\n const renderCollectionItems = (\n items: CollectionItem<Item>[],\n idx: CollectionIndexer = { value: 0 },\n end = items.length,\n ): ReactElement[] \| undefined => {\n const listItems: ReactElement[] = [];\n while (idx.value < end) {\n const item = items[idx.value];\n if (item.header && item.label != null) {\n listItems.push(\n createHeader(idx, item.id, item.label, item.expanded === false),\n );\n } else if (item.childNodes) {\n addGroup(listItems, items, idx);\n } else {\n renderCollectionItem(listItems, item, idx);\n }\n }\n return listItems;\n };\n\n function renderEmpty() {\n if (emptyMessage \|\| showEmptyMessage) {\n return (\n <span className={withBaseName(\"empty-message\")}>\n {emptyMessage ?? defaultEmptyMessage}\n </span>\n );\n }\n return null;\n }\n\n const renderContent = () => {\n if (collectionHook.data.length) {\n return renderCollectionItems(collectionHook.data);\n }\n renderEmpty();\n };\n\n const contentHeight = \"auto\";\n const sizeStyles = {\n \"--list-item-gap\": itemGapSize ? `${itemGapSize}px` : undefined,\n minWidth,\n minHeight,\n width: width ?? \"100%\",\n height: height ?? \"100%\",\n maxWidth: maxWidth ?? width,\n maxHeight: maxHeight ?? preferredHeight,\n };\n return (\n <div\n aria-multiselectable={\n selectionStrategy === \"multiple\" \|\|\n selectionStrategy === \"extended\" \|\|\n selectionStrategy === \"extended-multi-range\" \|\|\n undefined\n }\n {...htmlAttributes}\n {...listHandlers}\n {...listControlProps}\n className={clsx(withBaseName(), className, {\n // TODO low-emphasis\n [withBaseName(\"borderless\")]: borderless,\n saltDisabled: listDisabled,\n [withBaseName(\"collapsible\")]: collapsibleHeaders,\n saltFocusVisible: highlightedIndex === LIST_FOCUS_VISIBLE,\n })}\n id={`${id}`}\n ref={useForkRef<HTMLDivElement>(rootRef, forwardedRef)}\n role=\"listbox\"\n style={{ ...styleProp, ...sizeStyles }}\n tabIndex={listDisabled \|\| disableFocus ? undefined : 0}\n >\n <ListItemProxy ref={rowHeightProxyRef} />\n {collectionHook.data.length === 0 && ListPlaceholder !== undefined ? (\n <>\n <ListPlaceholder />\n </>\n ) : (\n <div\n className={withBaseName(\"scrollingContentContainer\")}\n ref={contentRef}\n style={{ height: contentHeight }}\n >\n {renderContent()}\n </div>\n )}\n </div>\n );\n}) as <Item = string, Selection extends SelectionStrategy = \"default\">(\n props: ListProps<Item, Selection> & {\n ref?: ForwardedRef<ScrollingAPI<Item>>;\n },\n) => ReactElement<ListProps<Item, Selection>>;\n"],"names":["List","ListItem","DefaultListItem","itemToString","defaultItemToString","listCss","createHeader","addGroup","id"],"mappings":"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"}
1	+ {"version":3,"file":"List.js","sources":["../src/list/List.tsx"],"sourcesContent":["import { makePrefixer, useForkRef, useIdMemo } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n cloneElement,\n type ForwardedRef,\n forwardRef,\n isValidElement,\n type ReactElement,\n useRef,\n} from \"react\";\nimport {\n type CollectionIndexer,\n type CollectionItem,\n itemToString as defaultItemToString,\n isSelected,\n LIST_FOCUS_VISIBLE,\n type ScrollingAPI,\n type SelectionStrategy,\n useCollectionItems,\n useImperativeScrollingAPI,\n} from \"../common-hooks\";\nimport listCss from \"./List.css\";\nimport { ListItem as DefaultListItem, ListItemProxy } from \"./ListItem\";\nimport type { ListItemProps, ListProps } from \"./listTypes\";\nimport { useList } from \"./useList\";\nimport { useListHeight } from \"./useListHeight\";\n\nconst defaultEmptyMessage = \"No data to display\";\n\nconst withBaseName = makePrefixer(\"saltList\");\n\nexport const List = forwardRef(function List<\n Item,\n Selection extends SelectionStrategy = \"default\",\n>(\n {\n ListItem = DefaultListItem,\n ListPlaceholder,\n borderless,\n children,\n className,\n collapsibleHeaders = false,\n defaultHighlightedIndex,\n defaultSelected,\n disabled: listDisabled = false,\n disableFocus = false,\n disableTypeToSelect,\n displayedItemCount = 10,\n emptyMessage,\n focusVisible: focusVisibleProp,\n getItemHeight: getItemHeightProp,\n getItemId,\n height,\n highlightedIndex: highlightedIndexProp,\n id: idProp,\n itemGapSize = 0,\n itemHeight: itemHeightProp,\n itemTextHighlightPattern,\n itemToString = defaultItemToString,\n listHandlers: listHandlersProp,\n maxHeight,\n maxWidth,\n minHeight,\n minWidth,\n onSelect,\n onSelectionChange,\n onHighlight,\n restoreLastFocus,\n selected: selectedProp,\n selectionStrategy,\n checkable = selectionStrategy === \"multiple\",\n scrollingApiRef,\n // TODO do we still need these ?\n selectionKeys,\n showEmptyMessage = false,\n source,\n style: styleProp,\n stickyHeaders,\n tabToSelect,\n width,\n ...htmlAttributes\n }: ListProps<Item, Selection>,\n forwardedRef?: ForwardedRef<HTMLDivElement>,\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-list\",\n css: listCss,\n window: targetWindow,\n });\n\n const id = useIdMemo(idProp);\n const rootRef = useRef<HTMLDivElement>(null);\n const contentRef = useRef<HTMLDivElement>(null);\n const rowHeightProxyRef = useRef<HTMLDivElement>(null);\n\n const collectionHook = useCollectionItems<Item>({\n id,\n label: \"List\",\n source,\n children,\n options: {\n collapsibleHeaders,\n // Add Group ChildTypes to options\n getItemId,\n itemToString,\n },\n });\n\n const { preferredHeight } = useListHeight({\n borderless,\n displayedItemCount,\n getItemHeight: getItemHeightProp,\n height,\n itemCount: collectionHook.data.length,\n itemGapSize,\n itemHeight: itemHeightProp,\n rowHeightRef: rowHeightProxyRef,\n });\n\n const {\n focusVisible,\n highlightedIndex,\n listControlProps,\n listHandlers,\n listItemHeaderHandlers,\n scrollIntoView,\n selected,\n } = useList<Item, Selection>({\n collapsibleHeaders,\n collectionHook,\n containerRef: rootRef,\n contentRef,\n defaultHighlightedIndex,\n defaultSelected: collectionHook.itemToCollectionItem<\n Selection,\n typeof defaultSelected\n >(defaultSelected),\n disabled: listDisabled,\n disableTypeToSelect,\n highlightedIndex: highlightedIndexProp,\n label: id,\n listHandlers: listHandlersProp, // should this be in context ?\n onSelect,\n onSelectionChange,\n onHighlight,\n restoreLastFocus,\n selected: collectionHook.itemToCollectionItem<\n Selection,\n typeof defaultSelected\n >(selectedProp),\n selectionStrategy,\n selectionKeys,\n stickyHeaders,\n tabToSelect,\n });\n\n useImperativeScrollingAPI({\n collectionHook,\n forwardedRef: scrollingApiRef,\n scrollableRef: rootRef,\n scrollIntoView,\n });\n\n // focusVisible passes as a prop takes precedence\n const appliedFocusVisible = focusVisibleProp ?? focusVisible;\n\n const createHeader: (\n idx: { value: number },\n headerId: string,\n title: string,\n expanded?: boolean,\n ) => ReactElement = function createHeader(idx, headerId, title, expanded) {\n const header = (\n <ListItem\n {...listItemHeaderHandlers}\n className={clsx(\"saltListItemHeader\", {\n focusVisible: collapsibleHeaders && appliedFocusVisible === idx.value,\n })}\n aria-expanded={expanded}\n data-idx={collapsibleHeaders ? idx.value : undefined}\n data-highlighted={idx.value === highlightedIndex \|\| undefined}\n data-sticky={stickyHeaders}\n data-selectable={false}\n id={headerId}\n key={`header-${idx.value}`}\n label={title}\n // role=\"presentation\"\n />\n );\n idx.value += 1;\n return header;\n };\n\n const getItemHeight =\n getItemHeightProp === undefined ? () => itemHeightProp : getItemHeightProp;\n\n function renderCollectionItem(\n list: ReactElement[],\n item: CollectionItem<Item>,\n idx: { value: number },\n ) {\n // Note, a number of these props are specific to ListItem. What if user\n // implements a custom ListItem but neglects to handle all these props.\n // Is that on them ?\n const { disabled, value, id: itemId, label } = item;\n const isChildItem = isValidElement(value);\n const listItemProps: ListItemProps<Item> & {\n key: string;\n \"data-idx\": number;\n } = {\n className: clsx({\n saltHighlighted: idx.value === highlightedIndex,\n saltFocusVisible: appliedFocusVisible === idx.value,\n }),\n disabled: disabled \|\| listDisabled,\n id: itemId,\n item: isChildItem ? undefined : (item?.value ?? undefined),\n itemHeight: getItemHeight(idx.value),\n itemTextHighlightPattern,\n key: itemId,\n \"data-idx\": idx.value,\n label,\n role: \"option\",\n selected: isSelected<Item>(selected, item),\n showCheckbox: checkable,\n };\n list.push(\n isChildItem ? (\n cloneElement(value, listItemProps)\n ) : (\n <ListItem {...listItemProps} />\n ),\n );\n\n idx.value += 1;\n }\n\n const addGroup: (\n list: ReactElement[],\n items: CollectionItem<Item>[],\n idx: { value: number },\n ) => void = function addGroup(\n list: ReactElement[],\n items: CollectionItem<Item>[],\n idx: { value: number },\n ) {\n const { count = 0, id, expanded, label = \"\" } = items[idx.value];\n const header = createHeader(idx, id, label, expanded);\n const childItems: ReactElement \| ReactElement[] =\n expanded !== false\n ? [header].concat(\n renderCollectionItems(items, idx, idx.value + count) \|\| [],\n )\n : header;\n\n list.push(\n <div key={id} role=\"group\">\n {childItems}\n </div>,\n );\n };\n\n const renderCollectionItems = (\n items: CollectionItem<Item>[],\n idx: CollectionIndexer = { value: 0 },\n end = items.length,\n ): ReactElement[] \| undefined => {\n const listItems: ReactElement[] = [];\n while (idx.value < end) {\n const item = items[idx.value];\n if (item.header && item.label != null) {\n listItems.push(\n createHeader(idx, item.id, item.label, item.expanded === false),\n );\n } else if (item.childNodes) {\n addGroup(listItems, items, idx);\n } else {\n renderCollectionItem(listItems, item, idx);\n }\n }\n return listItems;\n };\n\n function renderEmpty() {\n if (emptyMessage \|\| showEmptyMessage) {\n return (\n <span className={withBaseName(\"empty-message\")}>\n {emptyMessage ?? defaultEmptyMessage}\n </span>\n );\n }\n return null;\n }\n\n const renderContent = () => {\n if (collectionHook.data.length) {\n return renderCollectionItems(collectionHook.data);\n }\n renderEmpty();\n };\n\n const contentHeight = \"auto\";\n const sizeStyles = {\n \"--list-item-gap\": itemGapSize ? `${itemGapSize}px` : undefined,\n minWidth,\n minHeight,\n width: width ?? \"100%\",\n height: height ?? \"100%\",\n maxWidth: maxWidth ?? width,\n maxHeight: maxHeight ?? preferredHeight,\n };\n return (\n <div\n aria-multiselectable={\n selectionStrategy === \"multiple\" \|\|\n selectionStrategy === \"extended\" \|\|\n selectionStrategy === \"extended-multi-range\" \|\|\n undefined\n }\n {...htmlAttributes}\n {...listHandlers}\n {...listControlProps}\n className={clsx(withBaseName(), className, {\n // TODO low-emphasis\n [withBaseName(\"borderless\")]: borderless,\n saltDisabled: listDisabled,\n [withBaseName(\"collapsible\")]: collapsibleHeaders,\n saltFocusVisible: highlightedIndex === LIST_FOCUS_VISIBLE,\n })}\n id={`${id}`}\n ref={useForkRef<HTMLDivElement>(rootRef, forwardedRef)}\n role=\"listbox\"\n style={{ ...styleProp, ...sizeStyles }}\n tabIndex={listDisabled \|\| disableFocus ? undefined : 0}\n >\n <ListItemProxy ref={rowHeightProxyRef} />\n {collectionHook.data.length === 0 && ListPlaceholder !== undefined ? (\n <ListPlaceholder />\n ) : (\n <div\n className={withBaseName(\"scrollingContentContainer\")}\n ref={contentRef}\n style={{ height: contentHeight }}\n >\n {renderContent()}\n </div>\n )}\n </div>\n );\n}) as <Item = string, Selection extends SelectionStrategy = \"default\">(\n props: ListProps<Item, Selection> & {\n ref?: ForwardedRef<ScrollingAPI<Item>>;\n },\n) => ReactElement<ListProps<Item, Selection>>;\n"],"names":["List","ListItem","DefaultListItem","itemToString","defaultItemToString","listCss","createHeader","addGroup","id"],"mappings":"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"}

package/dist-es/list/ListItem.css.js CHANGED Viewed

@@ -1,4 +1,4 @@
-var css_248z = ".saltListItem {\n  /* Color */\n  --list-item-text-color: var(--salt-content-primary-foreground);\n  --list-item-background: var(--saltList-item-background, var(--salt-selectable-background));\n  /* --list-item-selected-focus-outlineColor: var(--salt-color-white);  TODO: Check token with design */\n  --list-item-text-color-active: var(--salt-content-primary-foreground);\n  --list-item-background-active: var(--salt-selectable-background-selected);\n  --list-item-alignItems: center;\n}\n\n.saltListItem.saltHighlighted {\n  --saltCheckbox-icon-stroke: var(--salt-selectable-borderColor-hover);\n  --list-item-background: var(--salt-selectable-background-hover);\n}\n\n.saltListItemHeader {\n  font-weight: var(--salt-text-fontWeight-strong); /*  TODO: Check token with design */\n}\n\n.saltListItemHeader[data-sticky] {\n  position: sticky;\n  top: 0;\n  z-index: 1;\n}\n\n.saltListItem {\n  color: var(--list-item-text-color);\n  cursor: var(--saltList-item-cursor, var(--salt-cursor-hover));\n  background: var(--saltList-item-background, var(--list-item-background));\n  font-size: var(--salt-text-fontSize);\n  text-align: var(--salt-text-textAlign);\n  line-height: var(--salt-text-lineHeight);\n  height: var(--saltList-item-height, var(--list-item-height, auto));\n  /* Replaced border-bottom with margin. In design spec, the height of the items should not include gap */\n  margin-bottom: var(--list-item-gap);\n  padding: 0 var(--salt-size-unit);\n  left: 0;\n  right: 0;\n  display: flex;\n  position: relative;\n  align-items: var(--list-item-alignItems);\n  white-space: nowrap;\n}\n\n.saltListItem:last-child {\n  margin-bottom: 0px;\n}\n\n.saltListItem-checkbox {\n  --list-item-background-active: var(--salt-selectable-background);\n  --list-item-text-color-active: var(--salt-content-primary-foreground);\n  --list-item-text-padding: 0 0 0 var(--salt-size-unit);\n}\n\n.saltListItem[aria-selected=\"true\"]:not(.saltListItem-checkbox) {\n  --list-item-background: var(--list-item-background-active);\n  color: var(--list-item-text-color-active);\n}\n\n.saltListItem.saltDisabled {\n  --list-item-text-color: var(--salt-content-primary-foreground-disabled);\n  cursor: var(--salt-cursor-disabled);\n}\n\n.saltListItem.saltFocusVisible {\n  outline-style: var(--salt-focused-outlineStyle);\n  outline-width: var(--salt-focused-outlineWidth);\n  outline-offset: -2px;\n  outline-color: var(--salt-focused-outlineColor);\n}\n\n.saltListItem.saltFocusVisible:after {\n  content: none;\n}\n\n.saltListItem[aria-selected=\"true\"]:not(.saltListItem-checkbox).saltFocusVisible {\n  outline-color: var(--list-item-selected-focus-outlineColor);\n}\n\n.saltListItem-textWrapper {\n  flex: 1;\n  overflow: hidden;\n  padding: var(--list-item-text-padding, 0px);\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n\n.saltListItem-proxy {\n  position: absolute !important;\n  visibility: hidden;\n}\n";
+var css_248z = ".saltListItem {\n  /* Color */\n  --list-item-text-color: var(--salt-content-primary-foreground);\n  --list-item-background: var(--saltList-item-background, var(--salt-selectable-background));\n  /* --list-item-selected-focus-outlineColor: var(--salt-color-white);  TODO: Check token with design */\n  --list-item-text-color-active: var(--salt-content-primary-foreground);\n  --list-item-background-active: var(--salt-selectable-background-selected);\n  --list-item-alignItems: center;\n}\n\n.saltListItem.saltHighlighted {\n  --saltCheckbox-icon-stroke: var(--salt-selectable-borderColor-hover);\n  --list-item-background: var(--salt-selectable-background-hover);\n}\n\n.saltListItemHeader {\n  font-weight: var(--salt-text-fontWeight-strong); /*  TODO: Check token with design */\n}\n\n.saltListItemHeader[data-sticky] {\n  position: sticky;\n  top: 0;\n  z-index: 1;\n}\n\n.saltListItem {\n  color: var(--list-item-text-color);\n  cursor: var(--saltList-item-cursor, var(--salt-cursor-hover));\n  background: var(--saltList-item-background, var(--list-item-background));\n  font-size: var(--salt-text-fontSize);\n  text-align: var(--salt-text-textAlign);\n  line-height: var(--salt-text-lineHeight);\n  height: var(--saltList-item-height, var(--list-item-height, auto));\n  /* Replaced border-bottom with margin. In design spec, the height of the items should not include gap */\n  margin-bottom: var(--list-item-gap);\n  padding: 0 var(--salt-size-unit);\n  left: 0;\n  right: 0;\n  display: flex;\n  position: relative;\n  align-items: var(--list-item-alignItems);\n  white-space: nowrap;\n}\n\n.saltListItem:last-child {\n  margin-bottom: 0px;\n}\n\n.saltListItem-checkbox {\n  --list-item-background-active: var(--salt-selectable-background);\n  --list-item-text-color-active: var(--salt-content-primary-foreground);\n  --list-item-text-padding: 0 0 0 var(--salt-size-unit);\n}\n\n.saltListItem[aria-selected=\"true\"]:not(.saltListItem-checkbox) {\n  --list-item-background: var(--list-item-background-active);\n  color: var(--list-item-text-color-active);\n}\n\n.saltListItem.saltDisabled {\n  --list-item-text-color: var(--salt-content-primary-foreground-disabled);\n  cursor: var(--salt-cursor-disabled);\n}\n\n.saltListItem.saltFocusVisible {\n  outline-style: var(--salt-focused-outlineStyle);\n  outline-width: var(--salt-focused-outlineWidth);\n  outline-offset: -2px;\n  outline-color: var(--salt-focused-outlineColor);\n}\n\n.saltListItem.saltFocusVisible:after {\n  content: none;\n}\n\n.saltListItem[aria-selected=\"true\"]:not(.saltListItem-checkbox).saltFocusVisible {\n  outline-color: var(--list-item-selected-focus-outlineColor);\n}\n\n.saltListItem-textWrapper {\n  flex: 1;\n  overflow: hidden;\n  padding: var(--list-item-text-padding, 0px);\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n\n.saltListItem-proxy {\n  /* biome-ignore lint/complexity/noImportantStyles: Needed to ensure the proxy doesn't take any space. */\n  position: absolute !important;\n  visibility: hidden;\n}\n";
 export { css_248z as default };
 //# sourceMappingURL=ListItem.css.js.map

package/dist-es/list/ListItem.js CHANGED Viewed

@@ -8,7 +8,7 @@ import { Highlighter } from './Highlighter.js';
 import css_248z from './ListItem.css.js';
 const withBaseName = makePrefixer("saltListItem");
-const ListItemProxy = forwardRef(function ListItemNextProxy(props, forwardedRef) {
+const ListItemProxy = forwardRef(function ListItemNextProxy(_props, forwardedRef) {
   return /* @__PURE__ */ jsx(
     "div",
     {
@@ -52,6 +52,7 @@ const ListItem = forwardRef(
       "div",
       {
         className,
+        role: "option",
         ...props,
         "aria-disabled": disabled || void 0,
         "aria-selected": selected || void 0,