@salt-ds/lab 1.0.0-alpha.86 → 1.0.0-alpha.88
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +126 -0
- package/css/salt-lab.css +145 -212
- package/dist-cjs/calendar/internal/CalendarDay.css.js +1 -1
- package/dist-cjs/common-hooks/useSelection.js +0 -2
- package/dist-cjs/common-hooks/useSelection.js.map +1 -1
- package/dist-cjs/contact-details/ContactDetails.css.js +1 -1
- package/dist-cjs/date-input/DateInput.css.js +1 -1
- package/dist-cjs/date-input/DateInputRange.js +2 -8
- package/dist-cjs/date-input/DateInputRange.js.map +1 -1
- package/dist-cjs/date-input/DateInputSingle.js +1 -1
- package/dist-cjs/date-input/DateInputSingle.js.map +1 -1
- package/dist-cjs/index.js +6 -2
- package/dist-cjs/index.js.map +1 -1
- package/dist-cjs/list-deprecated/ListItem.js.map +1 -1
- package/dist-cjs/rating/Rating.css.js +1 -1
- package/dist-cjs/rating/Rating.js +8 -7
- package/dist-cjs/rating/Rating.js.map +1 -1
- package/dist-cjs/tabs-next/TabListNext.js +1 -1
- package/dist-cjs/tabs-next/TabListNext.js.map +1 -1
- package/dist-cjs/tokenized-input-next/TokenizedInputNext.js +2 -2
- package/dist-cjs/tokenized-input-next/TokenizedInputNext.js.map +1 -1
- package/dist-cjs/tree/Tree.css.js +1 -1
- package/dist-cjs/tree/Tree.js +274 -207
- package/dist-cjs/tree/Tree.js.map +1 -1
- package/dist-cjs/tree/TreeContext.js +31 -0
- package/dist-cjs/tree/TreeContext.js.map +1 -0
- package/dist-cjs/tree/TreeNode.css.js +1 -1
- package/dist-cjs/tree/TreeNode.js +86 -42
- package/dist-cjs/tree/TreeNode.js.map +1 -1
- package/dist-cjs/tree/TreeNodeExpansionIcon.css.js +6 -0
- package/dist-cjs/tree/TreeNodeExpansionIcon.css.js.map +1 -0
- package/dist-cjs/tree/TreeNodeExpansionIcon.js +62 -0
- package/dist-cjs/tree/TreeNodeExpansionIcon.js.map +1 -0
- package/dist-cjs/tree/TreeNodeLabel.css.js +6 -0
- package/dist-cjs/tree/TreeNodeLabel.css.js.map +1 -0
- package/dist-cjs/tree/TreeNodeLabel.js +26 -0
- package/dist-cjs/tree/TreeNodeLabel.js.map +1 -0
- package/dist-cjs/tree/TreeNodeTrigger.css.js +6 -0
- package/dist-cjs/tree/TreeNodeTrigger.css.js.map +1 -0
- package/dist-cjs/tree/TreeNodeTrigger.js +152 -0
- package/dist-cjs/tree/TreeNodeTrigger.js.map +1 -0
- package/dist-cjs/tree/useTree.js +305 -133
- package/dist-cjs/tree/useTree.js.map +1 -1
- package/dist-es/calendar/internal/CalendarDay.css.js +1 -1
- package/dist-es/combo-box-deprecated/internal/DefaultComboBox.js +1 -1
- package/dist-es/combo-box-deprecated/internal/MultiSelectComboBox.js +1 -1
- package/dist-es/combo-box-deprecated/internal/useComboBox.js +1 -1
- package/dist-es/combo-box-deprecated/internal/useMultiSelectComboBox.js +1 -1
- package/dist-es/common-hooks/useCollectionItems.js +1 -1
- package/dist-es/common-hooks/useSelection.js +1 -2
- package/dist-es/common-hooks/useSelection.js.map +1 -1
- package/dist-es/contact-details/ContactDetails.css.js +1 -1
- package/dist-es/date-input/DateInput.css.js +1 -1
- package/dist-es/date-input/DateInputRange.js +2 -8
- package/dist-es/date-input/DateInputRange.js.map +1 -1
- package/dist-es/date-input/DateInputSingle.js +1 -1
- package/dist-es/date-input/DateInputSingle.js.map +1 -1
- package/dist-es/dropdown/DropdownBase.js +1 -1
- package/dist-es/index.js +3 -1
- package/dist-es/index.js.map +1 -1
- package/dist-es/list-deprecated/ListItem.js.map +1 -1
- package/dist-es/rating/Rating.css.js +1 -1
- package/dist-es/rating/Rating.js +8 -7
- package/dist-es/rating/Rating.js.map +1 -1
- package/dist-es/tabs/drag-drop/useDragDropNaturalMovement.js +1 -1
- package/dist-es/tabs-next/TabListNext.js +1 -1
- package/dist-es/tabs-next/TabListNext.js.map +1 -1
- package/dist-es/tokenized-input/TokenizedInputBase.js +1 -1
- package/dist-es/tokenized-input-next/TokenizedInputNext.js +2 -2
- package/dist-es/tokenized-input-next/TokenizedInputNext.js.map +1 -1
- package/dist-es/tree/Tree.css.js +1 -1
- package/dist-es/tree/Tree.js +275 -208
- package/dist-es/tree/Tree.js.map +1 -1
- package/dist-es/tree/TreeContext.js +26 -0
- package/dist-es/tree/TreeContext.js.map +1 -0
- package/dist-es/tree/TreeNode.css.js +1 -1
- package/dist-es/tree/TreeNode.js +87 -43
- package/dist-es/tree/TreeNode.js.map +1 -1
- package/dist-es/tree/TreeNodeExpansionIcon.css.js +4 -0
- package/dist-es/tree/TreeNodeExpansionIcon.css.js.map +1 -0
- package/dist-es/tree/TreeNodeExpansionIcon.js +60 -0
- package/dist-es/tree/TreeNodeExpansionIcon.js.map +1 -0
- package/dist-es/tree/TreeNodeLabel.css.js +4 -0
- package/dist-es/tree/TreeNodeLabel.css.js.map +1 -0
- package/dist-es/tree/TreeNodeLabel.js +24 -0
- package/dist-es/tree/TreeNodeLabel.js.map +1 -0
- package/dist-es/tree/TreeNodeTrigger.css.js +4 -0
- package/dist-es/tree/TreeNodeTrigger.css.js.map +1 -0
- package/dist-es/tree/TreeNodeTrigger.js +150 -0
- package/dist-es/tree/TreeNodeTrigger.js.map +1 -0
- package/dist-es/tree/useTree.js +306 -134
- package/dist-es/tree/useTree.js.map +1 -1
- package/dist-types/date-input/DateInputRange.d.ts +1 -1
- package/dist-types/date-input/DateInputSingle.d.ts +1 -1
- package/dist-types/index.d.ts +0 -1
- package/dist-types/list-deprecated/ListItem.d.ts +1 -0
- package/dist-types/rating/Rating.d.ts +5 -6
- package/dist-types/tokenized-input/internal/InputPill.d.ts +1 -1
- package/dist-types/tokenized-input-next/internal/InputPill.d.ts +1 -1
- package/dist-types/tree/Tree.d.ts +36 -3
- package/dist-types/tree/TreeContext.d.ts +71 -0
- package/dist-types/tree/TreeNode.d.ts +23 -10
- package/dist-types/tree/TreeNodeExpansionIcon.d.ts +4 -0
- package/dist-types/tree/TreeNodeLabel.d.ts +4 -0
- package/dist-types/tree/TreeNodeTrigger.d.ts +8 -0
- package/dist-types/tree/index.d.ts +3 -0
- package/dist-types/tree/useTree.d.ts +79 -3
- package/package.json +3 -3
- package/dist-cjs/common-hooks/calcPreferredHeight.js +0 -27
- package/dist-cjs/common-hooks/calcPreferredHeight.js.map +0 -1
- package/dist-cjs/common-hooks/useAutoSizer.js +0 -33
- package/dist-cjs/common-hooks/useAutoSizer.js.map +0 -1
- package/dist-cjs/kbd/Kbd.css.js +0 -6
- package/dist-cjs/kbd/Kbd.css.js.map +0 -1
- package/dist-cjs/kbd/Kbd.js +0 -34
- package/dist-cjs/kbd/Kbd.js.map +0 -1
- package/dist-cjs/tree/use-tree-keyboard-navigation.js +0 -51
- package/dist-cjs/tree/use-tree-keyboard-navigation.js.map +0 -1
- package/dist-es/common-hooks/calcPreferredHeight.js +0 -25
- package/dist-es/common-hooks/calcPreferredHeight.js.map +0 -1
- package/dist-es/common-hooks/useAutoSizer.js +0 -31
- package/dist-es/common-hooks/useAutoSizer.js.map +0 -1
- package/dist-es/kbd/Kbd.css.js +0 -4
- package/dist-es/kbd/Kbd.css.js.map +0 -1
- package/dist-es/kbd/Kbd.js +0 -32
- package/dist-es/kbd/Kbd.js.map +0 -1
- package/dist-es/tree/use-tree-keyboard-navigation.js +0 -48
- package/dist-es/tree/use-tree-keyboard-navigation.js.map +0 -1
- package/dist-types/kbd/Kbd.d.ts +0 -8
- package/dist-types/kbd/index.d.ts +0 -1
- package/dist-types/tree/treeTypes.d.ts +0 -42
- package/dist-types/tree/use-tree-keyboard-navigation.d.ts +0 -15
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ListItem.js","sources":["../src/list-deprecated/ListItem.tsx"],"sourcesContent":["
|
|
1
|
+
{"version":3,"file":"ListItem.js","sources":["../src/list-deprecated/ListItem.tsx"],"sourcesContent":["/** biome-ignore-all lint/correctness/useHookAtTopLevel: biome doesn't recognise the component correctly */\nimport { type ForwardedRef, forwardRef, type ReactElement } from \"react\";\nimport { useDescendant } from \"./internal/DescendantContext\";\nimport { isPlainObject } from \"./internal/helpers\";\nimport { ListItemBase, type ListItemBaseProps } from \"./ListItemBase\";\nimport { useListItem } from \"./useListItem\";\n\nexport interface ListItemProps<Item = string>\n extends Omit<\n ListItemBaseProps,\n \"focusVisible\" | \"highlighted\" | \"selected\" | \"tooltipText\"\n > {\n item?: Item;\n itemToString?: (item: Item) => string;\n}\n\nfunction ListItem<Item = string>(\n props: ListItemProps<Item>,\n ref?: ForwardedRef<HTMLDivElement>,\n) {\n const {\n children,\n item = props.item === undefined && !isPlainObject(children)\n ? (children as unknown as Item)\n : props.item,\n ...restProps\n } = props;\n\n const { itemToString, itemProps } = useListItem({\n index: useDescendant(item),\n item,\n ...restProps,\n });\n\n const itemText = itemToString(item as Item);\n\n return (\n <ListItemBase tooltipText={itemText} {...itemProps} ref={ref}>\n {children !== undefined ? children : itemText}\n </ListItemBase>\n );\n}\n\n// `const` could not be generic, but we has to use `forwardRef` so that React would use the component correctly..?\n// So we have to override the type definition of forwardRef to be our own\ntype GenericListItem = <Item = string>(\n p: ListItemProps<Item> & { ref?: ForwardedRef<HTMLDivElement> },\n) => ReactElement<ListItemProps<Item>>;\n\nconst _ListItem = forwardRef(ListItem) as GenericListItem;\n\nexport { _ListItem as ListItem };\n"],"names":["isPlainObject","useListItem","useDescendant","jsx","ListItemBase","forwardRef"],"mappings":";;;;;;;;;AAgBA,SAAS,QAAA,CACP,OACA,GAAA,EACA;AACA,EAAA,MAAM;AAAA,IACJ,QAAA;AAAA,IACA,IAAA,GAAO,MAAM,IAAA,KAAS,MAAA,IAAa,CAACA,qBAAA,CAAc,QAAQ,CAAA,GACrD,QAAA,GACD,KAAA,CAAM,IAAA;AAAA,IACV,GAAG;AAAA,GACL,GAAI,KAAA;AAEJ,EAAA,MAAM,EAAE,YAAA,EAAc,SAAA,EAAU,GAAIC,uBAAA,CAAY;AAAA,IAC9C,KAAA,EAAOC,gCAAc,IAAI,CAAA;AAAA,IACzB,IAAA;AAAA,IACA,GAAG;AAAA,GACJ,CAAA;AAED,EAAA,MAAM,QAAA,GAAW,aAAa,IAAY,CAAA;AAE1C,EAAA,uBACEC,cAAA,CAACC,yBAAA,EAAA,EAAa,WAAA,EAAa,QAAA,EAAW,GAAG,WAAW,GAAA,EACjD,QAAA,EAAA,QAAA,KAAa,MAAA,GAAY,QAAA,GAAW,QAAA,EACvC,CAAA;AAEJ;AAQA,MAAM,SAAA,GAAYC,iBAAW,QAAQ;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var css_248z = ".saltRating {\n display: flex;\n
|
|
3
|
+
var css_248z = ".saltRating {\n display: inline-flex;\n box-sizing: border-box;\n}\n\n.saltFormField .saltRating-container {\n height: var(--salt-size-base);\n padding-top: calc(var(--salt-spacing-100) + var(--salt-spacing-fixed-100));\n}\n\n.saltFormField .saltRating-label {\n min-height: var(--salt-size-base);\n padding-top: var(--salt-spacing-100);\n}\n\n.saltRating-labelTop,\n.saltRating-labelBottom {\n flex-direction: column;\n align-items: flex-start;\n gap: var(--salt-spacing-fixed-600);\n}\n\n.saltRating-labelLeft,\n.saltRating-labelRight {\n flex-direction: row;\n gap: var(--salt-spacing-fixed-1200);\n}\n\n.saltRating-container {\n display: flex;\n flex-direction: row;\n gap: var(--salt-spacing-fixed-1200);\n flex-wrap: nowrap;\n justify-content: flex-start;\n padding-top: var(--salt-spacing-fixed-100);\n padding-bottom: var(--salt-spacing-fixed-100);\n box-sizing: border-box;\n}\n\n.saltRating-label {\n color: var(--salt-content-primary-foreground);\n font-family: var(--salt-text-fontFamily);\n font-size: var(--salt-text-fontSize);\n font-weight: var(--salt-text-fontWeight);\n line-height: var(--salt-text-lineHeight);\n box-sizing: border-box;\n}\n\n.saltRating-label.saltRating-label-left {\n text-align: right;\n}\n";
|
|
4
4
|
|
|
5
5
|
module.exports = css_248z;
|
|
6
6
|
//# sourceMappingURL=Rating.css.js.map
|
|
@@ -17,8 +17,8 @@ const Rating = react.forwardRef(function Rating2({
|
|
|
17
17
|
name: nameProp,
|
|
18
18
|
onChange,
|
|
19
19
|
className,
|
|
20
|
-
readOnly,
|
|
21
|
-
disabled,
|
|
20
|
+
readOnly: readOnlyProp,
|
|
21
|
+
disabled: disabledProp,
|
|
22
22
|
max = 5,
|
|
23
23
|
getLabel = defaultGetLabel,
|
|
24
24
|
getVisibleLabel,
|
|
@@ -35,11 +35,15 @@ const Rating = react.forwardRef(function Rating2({
|
|
|
35
35
|
window: targetWindow
|
|
36
36
|
});
|
|
37
37
|
const {
|
|
38
|
+
disabled: formFieldDisabled,
|
|
39
|
+
readOnly: formFieldReadOnly,
|
|
38
40
|
a11yProps: {
|
|
39
41
|
"aria-describedby": formFieldDescribedBy,
|
|
40
42
|
"aria-labelledby": formFieldLabelledBy
|
|
41
43
|
} = {}
|
|
42
44
|
} = core.useFormFieldProps();
|
|
45
|
+
const disabled = formFieldDisabled || disabledProp;
|
|
46
|
+
const readOnly = formFieldReadOnly || readOnlyProp;
|
|
43
47
|
const [hoveredValue, setHoveredValue] = react.useState(0);
|
|
44
48
|
const [selected, setSelected] = core.useControlled({
|
|
45
49
|
controlled: valueProp,
|
|
@@ -49,10 +53,6 @@ const Rating = react.forwardRef(function Rating2({
|
|
|
49
53
|
});
|
|
50
54
|
const radioGroupRef = react.useRef(null);
|
|
51
55
|
const name = core.useId(nameProp);
|
|
52
|
-
const updateRating = (newValue, event) => {
|
|
53
|
-
setSelected(newValue);
|
|
54
|
-
onChange == null ? void 0 : onChange(event, newValue);
|
|
55
|
-
};
|
|
56
56
|
const handleMouseEnter = (event) => {
|
|
57
57
|
if (readOnly || disabled) return;
|
|
58
58
|
const itemValue = Number.parseInt(event.currentTarget.value, 10);
|
|
@@ -64,7 +64,8 @@ const Rating = react.forwardRef(function Rating2({
|
|
|
64
64
|
return;
|
|
65
65
|
}
|
|
66
66
|
const itemValue = Number.parseInt(event.currentTarget.value, 10);
|
|
67
|
-
|
|
67
|
+
setSelected(itemValue);
|
|
68
|
+
onChange == null ? void 0 : onChange(event, itemValue);
|
|
68
69
|
};
|
|
69
70
|
const isTopLeft = labelPlacement === "top" || labelPlacement === "left";
|
|
70
71
|
const displayLabel = getVisibleLabel && /* @__PURE__ */ jsxRuntime.jsx(
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Rating.js","sources":["../src/rating/Rating.tsx"],"sourcesContent":["import {\n capitalize,\n
|
|
1
|
+
{"version":3,"file":"Rating.js","sources":["../src/rating/Rating.tsx"],"sourcesContent":["import {\n capitalize,\n makePrefixer,\n useControlled,\n useFormFieldProps,\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 type ChangeEvent,\n type ComponentPropsWithoutRef,\n forwardRef,\n type MouseEvent,\n useRef,\n useState,\n} from \"react\";\nimport ratingCss from \"./Rating.css\";\nimport { RatingItem } from \"./RatingItem\";\n\nconst withBaseName = makePrefixer(\"saltRating\");\n\nexport interface RatingProps\n extends Omit<ComponentPropsWithoutRef<\"div\">, \"onChange\"> {\n /**\n * When provided, the component is controlled.\n */\n value?: number;\n /**\n * Default rating value for uncontrolled mode.\n * @default 0\n */\n defaultValue?: number;\n /**\n * Callback function for rating change.\n * The first parameter is the event, and the second is the selected rating value.\n */\n onChange?: (event: ChangeEvent<HTMLInputElement>, value: number) => void;\n /**\n * If true, the rating component will be in a read-only state.\n */\n readOnly?: boolean;\n /**\n * If true, the rating component will be in a disabled state.\n */\n disabled?: boolean;\n /**\n * Total number of icons displayed.\n * @default 5\n */\n max?: number;\n /**\n * Function used to provide a user-friendly name for the current value of the rating. Primarily used by screen readers.\n */\n getLabel?: (value: number) => string;\n /**\n * Function used to provide a visible label for the rating.\n */\n getVisibleLabel?: (value: number, max: number) => string;\n /**\n * Position of the label relative to the rating component.\n * Can be \"top\", \"right\", \"bottom\", or \"left\".\n * @default \"right\"\n */\n labelPlacement?: \"top\" | \"right\" | \"bottom\" | \"left\";\n /**\n * The name to be set on each radio button within the group. If not set, then one will be generated for you.\n */\n name?: string;\n}\n\nconst defaultGetLabel = (value: number) =>\n `${value} Star${value > 1 ? \"s\" : \"\"}`;\n\nexport const Rating = forwardRef<HTMLDivElement, RatingProps>(function Rating(\n {\n value: valueProp,\n defaultValue = 0,\n name: nameProp,\n onChange,\n className,\n readOnly: readOnlyProp,\n disabled: disabledProp,\n max = 5,\n getLabel = defaultGetLabel,\n getVisibleLabel,\n labelPlacement = \"right\",\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-describedby\": ariaDescribedBy,\n ...restProps\n },\n ref,\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-rating\",\n css: ratingCss,\n window: targetWindow,\n });\n const {\n disabled: formFieldDisabled,\n readOnly: formFieldReadOnly,\n a11yProps: {\n \"aria-describedby\": formFieldDescribedBy,\n \"aria-labelledby\": formFieldLabelledBy,\n } = {},\n } = useFormFieldProps();\n\n const disabled = formFieldDisabled || disabledProp;\n const readOnly = formFieldReadOnly || readOnlyProp;\n\n const [hoveredValue, setHoveredValue] = useState(0);\n const [selected, setSelected] = useControlled({\n controlled: valueProp,\n default: defaultValue,\n name: \"Rating\",\n state: \"value\",\n });\n const radioGroupRef = useRef<HTMLDivElement>(null);\n const name = useId(nameProp);\n\n const handleMouseEnter = (event: MouseEvent<HTMLInputElement>) => {\n if (readOnly || disabled) return;\n const itemValue = Number.parseInt(event.currentTarget.value, 10);\n setHoveredValue(itemValue);\n };\n\n const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n if (readOnly) {\n event.preventDefault();\n return;\n }\n\n const itemValue = Number.parseInt(event.currentTarget.value, 10);\n setSelected(itemValue);\n onChange?.(event, itemValue);\n };\n\n const isTopLeft = labelPlacement === \"top\" || labelPlacement === \"left\";\n\n const displayLabel = getVisibleLabel && (\n <div\n className={clsx(\n withBaseName(\"label\"),\n withBaseName(`label-${labelPlacement}`),\n )}\n aria-hidden\n >\n {getVisibleLabel(hoveredValue || selected, max)}\n </div>\n );\n\n return (\n <div\n ref={ref}\n className={clsx(\n withBaseName(),\n withBaseName(`label${capitalize(labelPlacement)}`),\n className,\n )}\n {...restProps}\n >\n {isTopLeft && displayLabel}\n <div\n role=\"radiogroup\"\n className={withBaseName(\"container\")}\n ref={radioGroupRef}\n aria-readonly={readOnly || undefined}\n aria-label={ariaLabel}\n aria-labelledby={clsx(formFieldLabelledBy, ariaLabelledBy) || undefined}\n aria-describedby={\n clsx(formFieldDescribedBy, ariaDescribedBy) || undefined\n }\n onMouseLeave={() => setHoveredValue(0)}\n >\n {Array.from({ length: max }, (_, index) => {\n const itemValue = index + 1;\n const isHovered = hoveredValue > 0 && itemValue <= hoveredValue;\n const isSelected = hoveredValue === 0 && itemValue <= selected;\n const isUnselecting =\n hoveredValue > 0 &&\n itemValue > hoveredValue &&\n itemValue <= selected;\n return (\n <RatingItem\n key={itemValue}\n currentRating={selected}\n isHovered={isHovered}\n isSelected={isSelected}\n isUnselecting={isUnselecting}\n onMouseEnter={handleMouseEnter}\n onChange={handleChange}\n value={itemValue}\n readOnly={readOnly}\n disabled={disabled}\n name={name}\n aria-label={getLabel?.(itemValue)}\n />\n );\n })}\n </div>\n {!isTopLeft && displayLabel}\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","Rating","useWindow","useComponentCssInjection","ratingCss","useFormFieldProps","useState","useControlled","useRef","useId","jsx","clsx","jsxs","capitalize","RatingItem"],"mappings":";;;;;;;;;;;AAqBA,MAAM,YAAA,GAAeA,kBAAa,YAAY,CAAA;AAmD9C,MAAM,eAAA,GAAkB,CAAC,KAAA,KACvB,CAAA,EAAG,KAAK,CAAA,KAAA,EAAQ,KAAA,GAAQ,CAAA,GAAI,GAAA,GAAM,EAAE,CAAA,CAAA;AAE/B,MAAM,MAAA,GAASC,gBAAA,CAAwC,SAASC,OAAAA,CACrE;AAAA,EACE,KAAA,EAAO,SAAA;AAAA,EACP,YAAA,GAAe,CAAA;AAAA,EACf,IAAA,EAAM,QAAA;AAAA,EACN,QAAA;AAAA,EACA,SAAA;AAAA,EACA,QAAA,EAAU,YAAA;AAAA,EACV,QAAA,EAAU,YAAA;AAAA,EACV,GAAA,GAAM,CAAA;AAAA,EACN,QAAA,GAAW,eAAA;AAAA,EACX,eAAA;AAAA,EACA,cAAA,GAAiB,OAAA;AAAA,EACjB,YAAA,EAAc,SAAA;AAAA,EACd,iBAAA,EAAmB,cAAA;AAAA,EACnB,kBAAA,EAAoB,eAAA;AAAA,EACpB,GAAG;AACL,CAAA,EACA,GAAA,EACA;AACA,EAAA,MAAM,eAAeC,gBAAA,EAAU;AAC/B,EAAAC,+BAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,aAAA;AAAA,IACR,GAAA,EAAKC,QAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AACD,EAAA,MAAM;AAAA,IACJ,QAAA,EAAU,iBAAA;AAAA,IACV,QAAA,EAAU,iBAAA;AAAA,IACV,SAAA,EAAW;AAAA,MACT,kBAAA,EAAoB,oBAAA;AAAA,MACpB,iBAAA,EAAmB;AAAA,QACjB;AAAC,MACHC,sBAAA,EAAkB;AAEtB,EAAA,MAAM,WAAW,iBAAA,IAAqB,YAAA;AACtC,EAAA,MAAM,WAAW,iBAAA,IAAqB,YAAA;AAEtC,EAAA,MAAM,CAAC,YAAA,EAAc,eAAe,CAAA,GAAIC,eAAS,CAAC,CAAA;AAClD,EAAA,MAAM,CAAC,QAAA,EAAU,WAAW,CAAA,GAAIC,kBAAA,CAAc;AAAA,IAC5C,UAAA,EAAY,SAAA;AAAA,IACZ,OAAA,EAAS,YAAA;AAAA,IACT,IAAA,EAAM,QAAA;AAAA,IACN,KAAA,EAAO;AAAA,GACR,CAAA;AACD,EAAA,MAAM,aAAA,GAAgBC,aAAuB,IAAI,CAAA;AACjD,EAAA,MAAM,IAAA,GAAOC,WAAM,QAAQ,CAAA;AAE3B,EAAA,MAAM,gBAAA,GAAmB,CAAC,KAAA,KAAwC;AAChE,IAAA,IAAI,YAAY,QAAA,EAAU;AAC1B,IAAA,MAAM,YAAY,MAAA,CAAO,QAAA,CAAS,KAAA,CAAM,aAAA,CAAc,OAAO,EAAE,CAAA;AAC/D,IAAA,eAAA,CAAgB,SAAS,CAAA;AAAA,EAC3B,CAAA;AAEA,EAAA,MAAM,YAAA,GAAe,CAAC,KAAA,KAAyC;AAC7D,IAAA,IAAI,QAAA,EAAU;AACZ,MAAA,KAAA,CAAM,cAAA,EAAe;AACrB,MAAA;AAAA,IACF;AAEA,IAAA,MAAM,YAAY,MAAA,CAAO,QAAA,CAAS,KAAA,CAAM,aAAA,CAAc,OAAO,EAAE,CAAA;AAC/D,IAAA,WAAA,CAAY,SAAS,CAAA;AACrB,IAAA,QAAA,IAAA,IAAA,GAAA,MAAA,GAAA,QAAA,CAAW,KAAA,EAAO,SAAA,CAAA;AAAA,EACpB,CAAA;AAEA,EAAA,MAAM,SAAA,GAAY,cAAA,KAAmB,KAAA,IAAS,cAAA,KAAmB,MAAA;AAEjE,EAAA,MAAM,eAAe,eAAA,oBACnBC,cAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAWC,SAAA;AAAA,QACT,aAAa,OAAO,CAAA;AAAA,QACpB,YAAA,CAAa,CAAA,MAAA,EAAS,cAAc,CAAA,CAAE;AAAA,OACxC;AAAA,MACA,aAAA,EAAW,IAAA;AAAA,MAEV,QAAA,EAAA,eAAA,CAAgB,YAAA,IAAgB,QAAA,EAAU,GAAG;AAAA;AAAA,GAChD;AAGF,EAAA,uBACEC,eAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,GAAA;AAAA,MACA,SAAA,EAAWD,SAAA;AAAA,QACT,YAAA,EAAa;AAAA,QACb,YAAA,CAAa,CAAA,KAAA,EAAQE,eAAA,CAAW,cAAc,CAAC,CAAA,CAAE,CAAA;AAAA,QACjD;AAAA,OACF;AAAA,MACC,GAAG,SAAA;AAAA,MAEH,QAAA,EAAA;AAAA,QAAA,SAAA,IAAa,YAAA;AAAA,wBACdH,cAAA;AAAA,UAAC,KAAA;AAAA,UAAA;AAAA,YACC,IAAA,EAAK,YAAA;AAAA,YACL,SAAA,EAAW,aAAa,WAAW,CAAA;AAAA,YACnC,GAAA,EAAK,aAAA;AAAA,YACL,iBAAe,QAAA,IAAY,MAAA;AAAA,YAC3B,YAAA,EAAY,SAAA;AAAA,YACZ,iBAAA,EAAiBC,SAAA,CAAK,mBAAA,EAAqB,cAAc,CAAA,IAAK,MAAA;AAAA,YAC9D,kBAAA,EACEA,SAAA,CAAK,oBAAA,EAAsB,eAAe,CAAA,IAAK,MAAA;AAAA,YAEjD,YAAA,EAAc,MAAM,eAAA,CAAgB,CAAC,CAAA;AAAA,YAEpC,QAAA,EAAA,KAAA,CAAM,KAAK,EAAE,MAAA,EAAQ,KAAI,EAAG,CAAC,GAAG,KAAA,KAAU;AACzC,cAAA,MAAM,YAAY,KAAA,GAAQ,CAAA;AAC1B,cAAA,MAAM,SAAA,GAAY,YAAA,GAAe,CAAA,IAAK,SAAA,IAAa,YAAA;AACnD,cAAA,MAAM,UAAA,GAAa,YAAA,KAAiB,CAAA,IAAK,SAAA,IAAa,QAAA;AACtD,cAAA,MAAM,aAAA,GACJ,YAAA,GAAe,CAAA,IACf,SAAA,GAAY,gBACZ,SAAA,IAAa,QAAA;AACf,cAAA,uBACED,cAAA;AAAA,gBAACI,qBAAA;AAAA,gBAAA;AAAA,kBAEC,aAAA,EAAe,QAAA;AAAA,kBACf,SAAA;AAAA,kBACA,UAAA;AAAA,kBACA,aAAA;AAAA,kBACA,YAAA,EAAc,gBAAA;AAAA,kBACd,QAAA,EAAU,YAAA;AAAA,kBACV,KAAA,EAAO,SAAA;AAAA,kBACP,QAAA;AAAA,kBACA,QAAA;AAAA,kBACA,IAAA;AAAA,kBACA,cAAY,QAAA,IAAA,IAAA,GAAA,MAAA,GAAA,QAAA,CAAW,SAAA;AAAA,iBAAA;AAAA,gBAXlB;AAAA,eAYP;AAAA,YAEJ,CAAC;AAAA;AAAA,SACH;AAAA,QACC,CAAC,SAAA,IAAa;AAAA;AAAA;AAAA,GACjB;AAEJ,CAAC;;;;"}
|
|
@@ -99,7 +99,7 @@ const TabListNext = react.forwardRef(
|
|
|
99
99
|
"data-ismeasuring": isMeasuring ? true : void 0,
|
|
100
100
|
ref: handleRef,
|
|
101
101
|
onKeyDown: handleKeyDown,
|
|
102
|
-
"aria-describedby": clsx.clsx(ariaDescribedBy, warningId),
|
|
102
|
+
"aria-describedby": clsx.clsx(ariaDescribedBy, warningId) || void 0,
|
|
103
103
|
...rest,
|
|
104
104
|
children: [
|
|
105
105
|
!isMeasuring && hidden.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { id: warningId, className: withBaseName("overflowWarning"), children: "Note: This tab list includes overflow; tab positions may be inaccurate or change when a tab is selected" }),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TabListNext.js","sources":["../src/tabs-next/TabListNext.tsx"],"sourcesContent":["import { capitalize, makePrefixer, useForkRef, useId } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n forwardRef,\n type KeyboardEvent,\n useRef,\n} from \"react\";\nimport { useOverflow } from \"./hooks/useOverflow\";\nimport { useRestoreActiveTab } from \"./hooks/useRestoreActiveTab\";\nimport tablistNextCss from \"./TabListNext.css\";\nimport { TabOverflowList } from \"./TabOverflowList\";\nimport { useTabsNext } from \"./TabsNextContext\";\n\nconst withBaseName = makePrefixer(\"saltTabListNext\");\n\nexport interface TabListNextProps\n extends Omit<ComponentPropsWithoutRef<\"div\">, \"onChange\"> {\n /**\n * Styling active color variant. Defaults to \"primary\".\n */\n activeColor?: \"primary\" | \"secondary\" | \"tertiary\";\n /**\n * The appearance of the tabs. Defaults to \"bordered\".\n */\n appearance?: \"bordered\" | \"transparent\";\n}\n\nexport const TabListNext = forwardRef<HTMLDivElement, TabListNextProps>(\n function TabstripNext(props, ref) {\n const {\n appearance = \"bordered\",\n activeColor = \"primary\",\n \"aria-describedby\": ariaDescribedBy,\n children,\n className,\n onKeyDown,\n ...rest\n } = props;\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-tablist-next\",\n css: tablistNextCss,\n window: targetWindow,\n });\n\n const {\n selected,\n getNext,\n getPrevious,\n getFirst,\n getLast,\n items,\n activeTab,\n menuOpen,\n setMenuOpen,\n removedActiveTabRef,\n } = useTabsNext();\n\n const tabstripRef = useRef<HTMLDivElement>(null);\n const handleRef = useForkRef(tabstripRef, ref);\n const overflowButtonRef = useRef<HTMLButtonElement>(null);\n\n const [visible, hidden, isMeasuring, realSelectedIndexRef] = useOverflow({\n container: tabstripRef,\n tabs: items,\n children,\n selected,\n overflowButton: overflowButtonRef,\n });\n\n useRestoreActiveTab({\n container: tabstripRef,\n tabs: items,\n realSelectedIndex: realSelectedIndexRef,\n removedActiveTabRef,\n });\n\n const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n onKeyDown?.(event);\n\n const actionMap = {\n ArrowRight: getNext,\n ArrowLeft: getPrevious,\n Home: getFirst,\n End: getLast,\n ArrowUp: menuOpen ? getPrevious : undefined,\n ArrowDown: menuOpen ? getNext : undefined,\n };\n\n const action = actionMap[event.key as keyof typeof actionMap];\n\n if (action) {\n event.preventDefault();\n const activeTabId = activeTab.current?.id;\n if (!activeTabId) return;\n const nextItem = action(activeTabId);\n if (nextItem) {\n nextItem.element?.parentElement?.scrollIntoView({\n block: \"nearest\",\n inline: \"nearest\",\n });\n nextItem.element?.focus({ preventScroll: true });\n }\n }\n };\n\n const warningId = useId();\n\n return (\n <div\n role=\"tablist\"\n className={clsx(\n withBaseName(),\n withBaseName(appearance),\n withBaseName(\"horizontal\"),\n withBaseName(`activeColor${capitalize(activeColor)}`),\n className,\n )}\n data-ismeasuring={isMeasuring ? true : undefined}\n ref={handleRef}\n onKeyDown={handleKeyDown}\n aria-describedby={clsx(ariaDescribedBy, warningId)}\n {...rest}\n >\n {!isMeasuring && hidden.length > 0 && (\n <span id={warningId} className={withBaseName(\"overflowWarning\")}>\n Note: This tab list includes overflow; tab positions may be\n inaccurate or change when a tab is selected\n </span>\n )}\n {visible}\n <TabOverflowList\n isMeasuring={isMeasuring}\n buttonRef={overflowButtonRef}\n tabstripRef={tabstripRef}\n open={menuOpen}\n setOpen={setMenuOpen}\n >\n {hidden}\n </TabOverflowList>\n </div>\n );\n },\n);\n"],"names":["makePrefixer","forwardRef","useWindow","useComponentCssInjection","tablistNextCss","useTabsNext","useRef","useForkRef","useOverflow","useRestoreActiveTab","useId","jsxs","clsx","capitalize","jsx","TabOverflowList"],"mappings":"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
|
|
1
|
+
{"version":3,"file":"TabListNext.js","sources":["../src/tabs-next/TabListNext.tsx"],"sourcesContent":["import { capitalize, makePrefixer, useForkRef, useId } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ComponentPropsWithoutRef,\n forwardRef,\n type KeyboardEvent,\n useRef,\n} from \"react\";\nimport { useOverflow } from \"./hooks/useOverflow\";\nimport { useRestoreActiveTab } from \"./hooks/useRestoreActiveTab\";\nimport tablistNextCss from \"./TabListNext.css\";\nimport { TabOverflowList } from \"./TabOverflowList\";\nimport { useTabsNext } from \"./TabsNextContext\";\n\nconst withBaseName = makePrefixer(\"saltTabListNext\");\n\nexport interface TabListNextProps\n extends Omit<ComponentPropsWithoutRef<\"div\">, \"onChange\"> {\n /**\n * Styling active color variant. Defaults to \"primary\".\n */\n activeColor?: \"primary\" | \"secondary\" | \"tertiary\";\n /**\n * The appearance of the tabs. Defaults to \"bordered\".\n */\n appearance?: \"bordered\" | \"transparent\";\n}\n\nexport const TabListNext = forwardRef<HTMLDivElement, TabListNextProps>(\n function TabstripNext(props, ref) {\n const {\n appearance = \"bordered\",\n activeColor = \"primary\",\n \"aria-describedby\": ariaDescribedBy,\n children,\n className,\n onKeyDown,\n ...rest\n } = props;\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-tablist-next\",\n css: tablistNextCss,\n window: targetWindow,\n });\n\n const {\n selected,\n getNext,\n getPrevious,\n getFirst,\n getLast,\n items,\n activeTab,\n menuOpen,\n setMenuOpen,\n removedActiveTabRef,\n } = useTabsNext();\n\n const tabstripRef = useRef<HTMLDivElement>(null);\n const handleRef = useForkRef(tabstripRef, ref);\n const overflowButtonRef = useRef<HTMLButtonElement>(null);\n\n const [visible, hidden, isMeasuring, realSelectedIndexRef] = useOverflow({\n container: tabstripRef,\n tabs: items,\n children,\n selected,\n overflowButton: overflowButtonRef,\n });\n\n useRestoreActiveTab({\n container: tabstripRef,\n tabs: items,\n realSelectedIndex: realSelectedIndexRef,\n removedActiveTabRef,\n });\n\n const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n onKeyDown?.(event);\n\n const actionMap = {\n ArrowRight: getNext,\n ArrowLeft: getPrevious,\n Home: getFirst,\n End: getLast,\n ArrowUp: menuOpen ? getPrevious : undefined,\n ArrowDown: menuOpen ? getNext : undefined,\n };\n\n const action = actionMap[event.key as keyof typeof actionMap];\n\n if (action) {\n event.preventDefault();\n const activeTabId = activeTab.current?.id;\n if (!activeTabId) return;\n const nextItem = action(activeTabId);\n if (nextItem) {\n nextItem.element?.parentElement?.scrollIntoView({\n block: \"nearest\",\n inline: \"nearest\",\n });\n nextItem.element?.focus({ preventScroll: true });\n }\n }\n };\n\n const warningId = useId();\n\n return (\n <div\n role=\"tablist\"\n className={clsx(\n withBaseName(),\n withBaseName(appearance),\n withBaseName(\"horizontal\"),\n withBaseName(`activeColor${capitalize(activeColor)}`),\n className,\n )}\n data-ismeasuring={isMeasuring ? true : undefined}\n ref={handleRef}\n onKeyDown={handleKeyDown}\n aria-describedby={clsx(ariaDescribedBy, warningId) || undefined}\n {...rest}\n >\n {!isMeasuring && hidden.length > 0 && (\n <span id={warningId} className={withBaseName(\"overflowWarning\")}>\n Note: This tab list includes overflow; tab positions may be\n inaccurate or change when a tab is selected\n </span>\n )}\n {visible}\n <TabOverflowList\n isMeasuring={isMeasuring}\n buttonRef={overflowButtonRef}\n tabstripRef={tabstripRef}\n open={menuOpen}\n setOpen={setMenuOpen}\n >\n {hidden}\n </TabOverflowList>\n </div>\n );\n },\n);\n"],"names":["makePrefixer","forwardRef","useWindow","useComponentCssInjection","tablistNextCss","useTabsNext","useRef","useForkRef","useOverflow","useRestoreActiveTab","useId","jsxs","clsx","capitalize","jsx","TabOverflowList"],"mappings":"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"}
|
|
@@ -178,8 +178,8 @@ const TokenizedInputNext = react.forwardRef(function TokenizedInputNext2({
|
|
|
178
178
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
179
179
|
"textarea",
|
|
180
180
|
{
|
|
181
|
-
"aria-labelledby": clsx.clsx(inputAriaLabelledBy, textAreaLabelledBy),
|
|
182
|
-
"aria-describedby": clsx.clsx(ariaDescribedBy, textAreaDescribedBy),
|
|
181
|
+
"aria-labelledby": clsx.clsx(inputAriaLabelledBy, textAreaLabelledBy) || void 0,
|
|
182
|
+
"aria-describedby": clsx.clsx(ariaDescribedBy, textAreaDescribedBy) || void 0,
|
|
183
183
|
"aria-label": clsx.clsx(ariaLabel, getItemsAriaLabel(selectedItems.length)),
|
|
184
184
|
"aria-activedescendant": highlightedIndex && highlightedIndex >= 0 ? `${id}-pill-${highlightedIndex}` : void 0,
|
|
185
185
|
disabled,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TokenizedInputNext.js","sources":["../src/tokenized-input-next/TokenizedInputNext.tsx"],"sourcesContent":["import {\n type AdornmentValidationStatus,\n Button,\n type ButtonProps,\n makePrefixer,\n type NecessityType,\n StatusAdornment,\n useForkRef,\n useIcon,\n useId,\n type ValidationStatus,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ChangeEventHandler,\n type FocusEvent,\n type FocusEventHandler,\n type ForwardedRef,\n forwardRef,\n type HTMLAttributes,\n type KeyboardEvent,\n type KeyboardEventHandler,\n type ReactEventHandler,\n type Ref,\n type SyntheticEvent,\n type TextareaHTMLAttributes,\n useRef,\n} from \"react\";\nimport { InputPill } from \"./internal/InputPill\";\nimport tokenizedInputCss from \"./TokenizedInputNext.css\";\nimport {\n type TokenizedInputNextHelpers,\n type TokenizedInputNextState,\n useTokenizedInputNext,\n} from \"./useTokenizedInputNext\";\n\ntype ChangeHandler<Item> = (\n event: SyntheticEvent,\n selectedItems: Item[] | undefined,\n) => void;\n\ntype ExpandButtonProps = Pick<\n ButtonProps,\n \"role\" | \"aria-roledescription\" | \"aria-describedby\"\n> & { \"aria-label\"?: string };\n\nexport interface TokenizedInputNextProps<Item>\n extends Partial<TokenizedInputNextState<Item>>,\n Omit<\n HTMLAttributes<HTMLDivElement>,\n \"onFocus\" | \"onBlur\" | \"onChange\" | \"onKeyUp\" | \"onKeyDown\"\n > {\n ExpandButtonProps?: ExpandButtonProps;\n disabled?: boolean;\n focused?: boolean;\n expandButtonRef?: Ref<HTMLButtonElement>;\n onBlur?: FocusEventHandler<HTMLTextAreaElement | HTMLButtonElement>;\n onKeyUp?: KeyboardEventHandler<HTMLTextAreaElement | HTMLButtonElement>;\n // Can key down on either input or expand button\n onKeyDown?: KeyboardEventHandler<HTMLTextAreaElement | HTMLButtonElement>;\n onRemoveItem?: (event: SyntheticEvent, index: number) => void;\n onInputBlur?: FocusEventHandler<HTMLTextAreaElement>;\n onInputFocus?: FocusEventHandler<HTMLTextAreaElement>;\n onInputChange?: ChangeEventHandler<HTMLTextAreaElement>;\n onClick?: ReactEventHandler;\n onClear?: ReactEventHandler;\n delimiters?: string[];\n disableAddOnBlur?: boolean;\n defaultSelected?: Item[];\n onChange?: ChangeHandler<Item>;\n onCollapse?: ReactEventHandler;\n onExpand?: ReactEventHandler;\n\n /// from input\n /**\n * Validation status.\n */\n validationStatus?: Omit<ValidationStatus, \"info\">;\n /**\n * If `true`, the component is read only.\n */\n readOnly?: boolean;\n /**\n * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#Attributes) applied to the `textarea` element.\n */\n textAreaProps?: TextareaHTMLAttributes<HTMLTextAreaElement>;\n /**\n * Optional ref for the textarea component\n */\n textAreaRef?: Ref<HTMLTextAreaElement>;\n necessity?: NecessityType;\n /**\n * Styling variant. Defaults to \"primary\".\n */\n variant?: \"primary\" | \"secondary\";\n}\n\nconst withBaseName = makePrefixer(\"saltTokenizedInputNext\");\n\nconst getItemsAriaLabel = (itemCount: number) =>\n itemCount === 0\n ? \"no item selected\"\n : `${itemCount} ${itemCount > 1 ? \"items\" : \"item\"}`;\n\nexport const TokenizedInputNext = forwardRef(function TokenizedInputNext<Item>(\n {\n textAreaRef: textAreaRefProp,\n textAreaProps = {},\n variant = \"primary\",\n ...rest\n }: TokenizedInputNextProps<Item>,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-tokenized-input-next\",\n css: tokenizedInputCss,\n window: targetWindow,\n });\n const {\n \"aria-describedby\": textAreaDescribedBy,\n \"aria-labelledby\": textAreaLabelledBy,\n required: textAreaRequired,\n ...restTextAreaProps\n } = textAreaProps;\n\n const { refs, helpers, inputProps, firstHiddenIndex } =\n useTokenizedInputNext(rest);\n\n const {\n textAreaRef: textAreaHookRef,\n pillsRef,\n clearButtonRef,\n expandButtonRef,\n statusAdornmentRef,\n containerRef: containerHookRef,\n } = refs;\n\n const {\n ExpandButtonProps = {\n \"aria-label\": \"expand edit\",\n },\n className,\n activeIndices = [],\n selectedItems = [],\n highlightedIndex,\n value,\n expanded,\n disabled,\n onBlur,\n onKeyDown,\n onRemoveItem,\n onInputChange,\n focused,\n validationStatus,\n readOnly,\n onInputFocus,\n onInputBlur,\n onClear,\n onClick,\n onKeyUp,\n id: idProp,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-describedby\": ariaDescribedBy,\n ...restProps\n } = inputProps;\n const { OverflowIcon, CloseIcon } = useIcon();\n const id = useId(idProp);\n const inputId = `${id}-input`;\n const expandButtonId = `${id}-expand-button`;\n const clearButtonId = `${id}-clear-button`;\n\n const keydownExpandButton = useRef(false);\n const containerRef = useForkRef(ref, containerHookRef);\n const textAreaRef = useForkRef(textAreaHookRef, textAreaRefProp);\n const showExpandButton = !expanded && firstHiddenIndex != null;\n\n const hasHelpers = (helpers: TokenizedInputNextHelpers<Item>) => {\n if (process.env.NODE_ENV !== \"production\") {\n if (helpers == null) {\n console.warn(\n 'TokenizedInputNext is used without helpers. You should pass in \"helpers\" from \"useTokenizedInputNext\".',\n );\n }\n }\n return helpers != null;\n };\n\n const handleExpandButtonKeyDown = (\n event: KeyboardEvent<HTMLButtonElement>,\n ) => {\n const singleChar = event.key.length === 1;\n const triggerExpand =\n [\n \"CONTROL\",\n \"META\",\n \"ENTER\",\n \"BACKSPACE\",\n \"ARROWDOWN\",\n \"ARROWLEFT\",\n \"ARROWRIGHT\",\n ].indexOf(event.key.toUpperCase()) !== -1;\n\n if ((singleChar || triggerExpand) && hasHelpers(helpers)) {\n if (event.key === \"Enter\" || event.key === \" \") {\n event.preventDefault();\n event.stopPropagation();\n }\n helpers.updateExpanded(event, true);\n keydownExpandButton.current = true;\n }\n };\n\n const handleInputKeyUp = (\n event: KeyboardEvent<HTMLButtonElement | HTMLTextAreaElement>,\n ) => {\n // Call keydown again if the initial event has been used to expand the input\n if (keydownExpandButton.current && \"Enter\" !== event.key) {\n keydownExpandButton.current = false;\n onKeyDown?.(event);\n }\n onKeyUp?.(event);\n };\n\n const handleExpand = (event: SyntheticEvent<HTMLButtonElement>) => {\n event.stopPropagation();\n\n if (hasHelpers(helpers)) {\n helpers.updateExpanded(event, true);\n }\n };\n\n const handleClearButtonFocus = (event: FocusEvent<HTMLButtonElement>) => {\n event.stopPropagation();\n };\n\n const selectedItemIds = selectedItems.map(\n (_, index) => `${id}-pill-${index}`,\n );\n\n const inputAriaLabelledBy = disabled\n ? [ariaLabelledBy, inputId, ...selectedItemIds]\n : [ariaLabelledBy, inputId];\n\n const expandedWithItems =\n expanded && !showExpandButton && selectedItems.length > 0;\n const { \"aria-label\": expandButtonAccessibleText, ...restExpandButtonProps } =\n ExpandButtonProps;\n\n return (\n <div className={withBaseName(\"container\")}>\n <span\n aria-owns={selectedItemIds.join(\" \")}\n className={withBaseName(\"hidden\")}\n role=\"listbox\"\n />\n <div\n className={clsx(\n withBaseName(),\n withBaseName(variant),\n {\n [withBaseName(\"expanded\")]: expanded,\n [withBaseName(\"focused\")]: !disabled && focused,\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"readOnly\")]: readOnly,\n [withBaseName(validationStatus as string)]: validationStatus,\n },\n className,\n )}\n ref={containerRef}\n onClick={onClick}\n // Tab index allows the div to be found as related target and prevents it closing when a click in happens\n tabIndex={-1}\n {...restProps}\n >\n {selectedItems.length > 0 &&\n selectedItems.map((item, index) => {\n const label = String(item);\n return (\n <InputPill\n disabled={disabled}\n hidden={showExpandButton && index >= firstHiddenIndex}\n highlighted={\n index === highlightedIndex ||\n activeIndices.indexOf(index) !== -1\n }\n id={`${id}-pill-${index}`}\n index={index}\n key={`${index}-${label}`}\n label={label}\n onClose={\n expanded && !readOnly\n ? (event) => onRemoveItem?.(event, index)\n : undefined\n }\n pillsRef={pillsRef}\n />\n );\n })}\n <textarea\n aria-labelledby={clsx(inputAriaLabelledBy, textAreaLabelledBy)}\n aria-describedby={clsx(ariaDescribedBy, textAreaDescribedBy)}\n aria-label={clsx(ariaLabel, getItemsAriaLabel(selectedItems.length))}\n aria-activedescendant={\n highlightedIndex && highlightedIndex >= 0\n ? `${id}-pill-${highlightedIndex}`\n : undefined\n }\n disabled={disabled}\n id={inputId}\n readOnly={readOnly}\n ref={textAreaRef}\n required={textAreaRequired}\n rows={1}\n tabIndex={disabled ? -1 : 0}\n value={value}\n className={clsx(withBaseName(\"textarea\"), textAreaProps?.className)}\n onChange={onInputChange}\n onBlur={onInputBlur}\n onFocus={!disabled ? onInputFocus : undefined}\n onKeyDown={onKeyDown}\n {...restTextAreaProps}\n />\n <div className={withBaseName(\"endAdornmentContainer\")}>\n {!disabled && !readOnly && validationStatus && (\n <StatusAdornment\n className={withBaseName(\"statusAdornment\")}\n ref={statusAdornmentRef}\n status={validationStatus as AdornmentValidationStatus}\n />\n )}\n {expandedWithItems && !readOnly && (\n <Button\n className={withBaseName(\"endAdornment\")}\n disabled={disabled}\n id={clearButtonId}\n onBlur={onBlur}\n onClick={onClear}\n onFocus={handleClearButtonFocus}\n ref={clearButtonRef}\n variant=\"secondary\"\n data-testid=\"clear-button\"\n aria-label=\"clear input\"\n >\n <CloseIcon aria-hidden />\n </Button>\n )}\n {showExpandButton && (\n <Button\n className={withBaseName(\"endAdornment\")}\n aria-label={expandButtonAccessibleText}\n aria-labelledby={clsx(ariaLabelledBy, inputId, expandButtonId)}\n disabled={disabled}\n id={expandButtonId}\n onBlur={onBlur}\n onClick={handleExpand}\n onKeyDown={handleExpandButtonKeyDown}\n onKeyUp={handleInputKeyUp}\n ref={expandButtonRef}\n variant=\"secondary\"\n data-testid=\"expand-button\"\n {...restExpandButtonProps}\n >\n <OverflowIcon />\n </Button>\n )}\n </div>\n\n <div className={withBaseName(\"activationIndicator\")} />\n </div>\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","TokenizedInputNext","useWindow","useComponentCssInjection","tokenizedInputCss","useTokenizedInputNext","useIcon","useId","useRef","useForkRef","helpers","jsxs","jsx","clsx","InputPill","StatusAdornment","Button"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"TokenizedInputNext.js","sources":["../src/tokenized-input-next/TokenizedInputNext.tsx"],"sourcesContent":["import {\n type AdornmentValidationStatus,\n Button,\n type ButtonProps,\n makePrefixer,\n type NecessityType,\n StatusAdornment,\n useForkRef,\n useIcon,\n useId,\n type ValidationStatus,\n} from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n type ChangeEventHandler,\n type FocusEvent,\n type FocusEventHandler,\n type ForwardedRef,\n forwardRef,\n type HTMLAttributes,\n type KeyboardEvent,\n type KeyboardEventHandler,\n type ReactEventHandler,\n type Ref,\n type SyntheticEvent,\n type TextareaHTMLAttributes,\n useRef,\n} from \"react\";\nimport { InputPill } from \"./internal/InputPill\";\nimport tokenizedInputCss from \"./TokenizedInputNext.css\";\nimport {\n type TokenizedInputNextHelpers,\n type TokenizedInputNextState,\n useTokenizedInputNext,\n} from \"./useTokenizedInputNext\";\n\ntype ChangeHandler<Item> = (\n event: SyntheticEvent,\n selectedItems: Item[] | undefined,\n) => void;\n\ntype ExpandButtonProps = Pick<\n ButtonProps,\n \"role\" | \"aria-roledescription\" | \"aria-describedby\"\n> & { \"aria-label\"?: string };\n\nexport interface TokenizedInputNextProps<Item>\n extends Partial<TokenizedInputNextState<Item>>,\n Omit<\n HTMLAttributes<HTMLDivElement>,\n \"onFocus\" | \"onBlur\" | \"onChange\" | \"onKeyUp\" | \"onKeyDown\"\n > {\n ExpandButtonProps?: ExpandButtonProps;\n disabled?: boolean;\n focused?: boolean;\n expandButtonRef?: Ref<HTMLButtonElement>;\n onBlur?: FocusEventHandler<HTMLTextAreaElement | HTMLButtonElement>;\n onKeyUp?: KeyboardEventHandler<HTMLTextAreaElement | HTMLButtonElement>;\n // Can key down on either input or expand button\n onKeyDown?: KeyboardEventHandler<HTMLTextAreaElement | HTMLButtonElement>;\n onRemoveItem?: (event: SyntheticEvent, index: number) => void;\n onInputBlur?: FocusEventHandler<HTMLTextAreaElement>;\n onInputFocus?: FocusEventHandler<HTMLTextAreaElement>;\n onInputChange?: ChangeEventHandler<HTMLTextAreaElement>;\n onClick?: ReactEventHandler;\n onClear?: ReactEventHandler;\n delimiters?: string[];\n disableAddOnBlur?: boolean;\n defaultSelected?: Item[];\n onChange?: ChangeHandler<Item>;\n onCollapse?: ReactEventHandler;\n onExpand?: ReactEventHandler;\n\n /// from input\n /**\n * Validation status.\n */\n validationStatus?: Omit<ValidationStatus, \"info\">;\n /**\n * If `true`, the component is read only.\n */\n readOnly?: boolean;\n /**\n * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea#Attributes) applied to the `textarea` element.\n */\n textAreaProps?: TextareaHTMLAttributes<HTMLTextAreaElement>;\n /**\n * Optional ref for the textarea component\n */\n textAreaRef?: Ref<HTMLTextAreaElement>;\n necessity?: NecessityType;\n /**\n * Styling variant. Defaults to \"primary\".\n */\n variant?: \"primary\" | \"secondary\";\n}\n\nconst withBaseName = makePrefixer(\"saltTokenizedInputNext\");\n\nconst getItemsAriaLabel = (itemCount: number) =>\n itemCount === 0\n ? \"no item selected\"\n : `${itemCount} ${itemCount > 1 ? \"items\" : \"item\"}`;\n\nexport const TokenizedInputNext = forwardRef(function TokenizedInputNext<Item>(\n {\n textAreaRef: textAreaRefProp,\n textAreaProps = {},\n variant = \"primary\",\n ...rest\n }: TokenizedInputNextProps<Item>,\n ref: ForwardedRef<HTMLDivElement>,\n) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-tokenized-input-next\",\n css: tokenizedInputCss,\n window: targetWindow,\n });\n const {\n \"aria-describedby\": textAreaDescribedBy,\n \"aria-labelledby\": textAreaLabelledBy,\n required: textAreaRequired,\n ...restTextAreaProps\n } = textAreaProps;\n\n const { refs, helpers, inputProps, firstHiddenIndex } =\n useTokenizedInputNext(rest);\n\n const {\n textAreaRef: textAreaHookRef,\n pillsRef,\n clearButtonRef,\n expandButtonRef,\n statusAdornmentRef,\n containerRef: containerHookRef,\n } = refs;\n\n const {\n ExpandButtonProps = {\n \"aria-label\": \"expand edit\",\n },\n className,\n activeIndices = [],\n selectedItems = [],\n highlightedIndex,\n value,\n expanded,\n disabled,\n onBlur,\n onKeyDown,\n onRemoveItem,\n onInputChange,\n focused,\n validationStatus,\n readOnly,\n onInputFocus,\n onInputBlur,\n onClear,\n onClick,\n onKeyUp,\n id: idProp,\n \"aria-label\": ariaLabel,\n \"aria-labelledby\": ariaLabelledBy,\n \"aria-describedby\": ariaDescribedBy,\n ...restProps\n } = inputProps;\n const { OverflowIcon, CloseIcon } = useIcon();\n const id = useId(idProp);\n const inputId = `${id}-input`;\n const expandButtonId = `${id}-expand-button`;\n const clearButtonId = `${id}-clear-button`;\n\n const keydownExpandButton = useRef(false);\n const containerRef = useForkRef(ref, containerHookRef);\n const textAreaRef = useForkRef(textAreaHookRef, textAreaRefProp);\n const showExpandButton = !expanded && firstHiddenIndex != null;\n\n const hasHelpers = (helpers: TokenizedInputNextHelpers<Item>) => {\n if (process.env.NODE_ENV !== \"production\") {\n if (helpers == null) {\n console.warn(\n 'TokenizedInputNext is used without helpers. You should pass in \"helpers\" from \"useTokenizedInputNext\".',\n );\n }\n }\n return helpers != null;\n };\n\n const handleExpandButtonKeyDown = (\n event: KeyboardEvent<HTMLButtonElement>,\n ) => {\n const singleChar = event.key.length === 1;\n const triggerExpand =\n [\n \"CONTROL\",\n \"META\",\n \"ENTER\",\n \"BACKSPACE\",\n \"ARROWDOWN\",\n \"ARROWLEFT\",\n \"ARROWRIGHT\",\n ].indexOf(event.key.toUpperCase()) !== -1;\n\n if ((singleChar || triggerExpand) && hasHelpers(helpers)) {\n if (event.key === \"Enter\" || event.key === \" \") {\n event.preventDefault();\n event.stopPropagation();\n }\n helpers.updateExpanded(event, true);\n keydownExpandButton.current = true;\n }\n };\n\n const handleInputKeyUp = (\n event: KeyboardEvent<HTMLButtonElement | HTMLTextAreaElement>,\n ) => {\n // Call keydown again if the initial event has been used to expand the input\n if (keydownExpandButton.current && \"Enter\" !== event.key) {\n keydownExpandButton.current = false;\n onKeyDown?.(event);\n }\n onKeyUp?.(event);\n };\n\n const handleExpand = (event: SyntheticEvent<HTMLButtonElement>) => {\n event.stopPropagation();\n\n if (hasHelpers(helpers)) {\n helpers.updateExpanded(event, true);\n }\n };\n\n const handleClearButtonFocus = (event: FocusEvent<HTMLButtonElement>) => {\n event.stopPropagation();\n };\n\n const selectedItemIds = selectedItems.map(\n (_, index) => `${id}-pill-${index}`,\n );\n\n const inputAriaLabelledBy = disabled\n ? [ariaLabelledBy, inputId, ...selectedItemIds]\n : [ariaLabelledBy, inputId];\n\n const expandedWithItems =\n expanded && !showExpandButton && selectedItems.length > 0;\n const { \"aria-label\": expandButtonAccessibleText, ...restExpandButtonProps } =\n ExpandButtonProps;\n\n return (\n <div className={withBaseName(\"container\")}>\n <span\n aria-owns={selectedItemIds.join(\" \")}\n className={withBaseName(\"hidden\")}\n role=\"listbox\"\n />\n <div\n className={clsx(\n withBaseName(),\n withBaseName(variant),\n {\n [withBaseName(\"expanded\")]: expanded,\n [withBaseName(\"focused\")]: !disabled && focused,\n [withBaseName(\"disabled\")]: disabled,\n [withBaseName(\"readOnly\")]: readOnly,\n [withBaseName(validationStatus as string)]: validationStatus,\n },\n className,\n )}\n ref={containerRef}\n onClick={onClick}\n // Tab index allows the div to be found as related target and prevents it closing when a click in happens\n tabIndex={-1}\n {...restProps}\n >\n {selectedItems.length > 0 &&\n selectedItems.map((item, index) => {\n const label = String(item);\n return (\n <InputPill\n disabled={disabled}\n hidden={showExpandButton && index >= firstHiddenIndex}\n highlighted={\n index === highlightedIndex ||\n activeIndices.indexOf(index) !== -1\n }\n id={`${id}-pill-${index}`}\n index={index}\n key={`${index}-${label}`}\n label={label}\n onClose={\n expanded && !readOnly\n ? (event) => onRemoveItem?.(event, index)\n : undefined\n }\n pillsRef={pillsRef}\n />\n );\n })}\n <textarea\n aria-labelledby={\n clsx(inputAriaLabelledBy, textAreaLabelledBy) || undefined\n }\n aria-describedby={\n clsx(ariaDescribedBy, textAreaDescribedBy) || undefined\n }\n aria-label={clsx(ariaLabel, getItemsAriaLabel(selectedItems.length))}\n aria-activedescendant={\n highlightedIndex && highlightedIndex >= 0\n ? `${id}-pill-${highlightedIndex}`\n : undefined\n }\n disabled={disabled}\n id={inputId}\n readOnly={readOnly}\n ref={textAreaRef}\n required={textAreaRequired}\n rows={1}\n tabIndex={disabled ? -1 : 0}\n value={value}\n className={clsx(withBaseName(\"textarea\"), textAreaProps?.className)}\n onChange={onInputChange}\n onBlur={onInputBlur}\n onFocus={!disabled ? onInputFocus : undefined}\n onKeyDown={onKeyDown}\n {...restTextAreaProps}\n />\n <div className={withBaseName(\"endAdornmentContainer\")}>\n {!disabled && !readOnly && validationStatus && (\n <StatusAdornment\n className={withBaseName(\"statusAdornment\")}\n ref={statusAdornmentRef}\n status={validationStatus as AdornmentValidationStatus}\n />\n )}\n {expandedWithItems && !readOnly && (\n <Button\n className={withBaseName(\"endAdornment\")}\n disabled={disabled}\n id={clearButtonId}\n onBlur={onBlur}\n onClick={onClear}\n onFocus={handleClearButtonFocus}\n ref={clearButtonRef}\n variant=\"secondary\"\n data-testid=\"clear-button\"\n aria-label=\"clear input\"\n >\n <CloseIcon aria-hidden />\n </Button>\n )}\n {showExpandButton && (\n <Button\n className={withBaseName(\"endAdornment\")}\n aria-label={expandButtonAccessibleText}\n aria-labelledby={clsx(ariaLabelledBy, inputId, expandButtonId)}\n disabled={disabled}\n id={expandButtonId}\n onBlur={onBlur}\n onClick={handleExpand}\n onKeyDown={handleExpandButtonKeyDown}\n onKeyUp={handleInputKeyUp}\n ref={expandButtonRef}\n variant=\"secondary\"\n data-testid=\"expand-button\"\n {...restExpandButtonProps}\n >\n <OverflowIcon />\n </Button>\n )}\n </div>\n\n <div className={withBaseName(\"activationIndicator\")} />\n </div>\n </div>\n );\n});\n"],"names":["makePrefixer","forwardRef","TokenizedInputNext","useWindow","useComponentCssInjection","tokenizedInputCss","useTokenizedInputNext","useIcon","useId","useRef","useForkRef","helpers","jsxs","jsx","clsx","InputPill","StatusAdornment","Button"],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var css_248z = ".saltTree {\n
|
|
3
|
+
var css_248z = ".saltTree {\n list-style: none;\n margin: 0;\n padding: 0;\n outline: none;\n width: 100%;\n box-sizing: border-box;\n}\n\n.saltTree-disabled {\n cursor: var(--salt-cursor-disabled);\n}\n";
|
|
4
4
|
|
|
5
5
|
module.exports = css_248z;
|
|
6
6
|
//# sourceMappingURL=Tree.css.js.map
|