@drivenets/design-system 0.0.2 → 0.0.3

package/dist/components/ds-select/ds-select.js

@@ -0,0 +1,166 @@
+import ds_icon_default from "../ds-icon/ds-icon.js";
+import "../ds-icon/index.js";
+import ds_typography_default from "../ds-typography/ds-typography.js";
+import "../ds-typography/index.js";
+import ds_text_input_default from "../ds-text-input/ds-text-input.js";
+import "../ds-text-input/index.js";
+import ds_checkbox_default from "../ds-checkbox/ds-checkbox.js";
+import "../ds-checkbox/index.js";
+import ds_select_module_default from "./ds-select.module.js";
+import { SelectItemsChips } from "./select-items-chips.js";
+import classNames from "classnames";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { Portal } from "@ark-ui/react/portal";
+import { Select, createListCollection, useSelect } from "@ark-ui/react/select";
+
+//#region src/components/ds-select/ds-select.tsx
+const SEARCH_THRESHOLD = 13;
+const SELECT_ALL_VALUE = "__INTERNAL_SELECT_ALL_VALUE__";
+const SELECT_ALL = {
+	label: "All",
+	value: SELECT_ALL_VALUE
+};
+const DsSelect = ({ id, options: userOptions, value, style, size, clearable, onClear, onBlur, className, placeholder = "Click to select a value", disabled, ...multiselectProps }) => {
+	const [searchTerm, setSearchTerm] = useState("");
+	const [showAllItems, setShowAllItems] = useState(false);
+	const internalOptions = multiselectProps.multiple ? [SELECT_ALL, ...userOptions] : userOptions;
+	const collection = createListCollection({
+		items: internalOptions,
+		itemToValue: (item) => item.value
+	});
+	const filteredOptions = internalOptions.filter((option) => option.label.toLowerCase().includes(searchTerm.toLowerCase()));
+	const normalizedValue = Array.isArray(value) ? value : [value].filter((value$1) => !!value$1);
+	const select = useSelect({
+		collection,
+		disabled,
+		multiple: multiselectProps.multiple,
+		value: normalizedValue,
+		ids: { trigger: id },
+		onOpenChange: () => {
+			setSearchTerm("");
+			setShowAllItems(false);
+		},
+		onValueChange: (details) => {
+			if (!multiselectProps.multiple) {
+				multiselectProps.onValueChange?.(details.value[0]);
+				return;
+			}
+			if (details.value.includes(SELECT_ALL_VALUE)) {
+				const newValues = select.selectedItems.length === userOptions.length ? [] : userOptions.map((opt) => opt.value);
+				multiselectProps.onValueChange?.(newValues);
+				return;
+			}
+			const newValueWithoutSelectAll = details.value.filter((val) => val !== SELECT_ALL_VALUE);
+			multiselectProps.onValueChange?.(newValueWithoutSelectAll);
+		}
+	});
+	return /* @__PURE__ */ jsxs(Select.RootProvider, {
+		value: select,
+		lazyMount: true,
+		children: [
+			/* @__PURE__ */ jsxs(Select.Control, {
+				className: classNames(ds_select_module_default.control, size === "small" && ds_select_module_default.small, className),
+				style,
+				onBlur,
+				onKeyDown: (e) => {
+					if (!clearable) return;
+					if (select.open) return;
+					if (e.key === "Backspace" || e.key === "Delete") {
+						if (multiselectProps.multiple) multiselectProps.onValueChange?.([]);
+						else multiselectProps.onValueChange?.("");
+						onClear?.();
+					}
+				},
+				children: [/* @__PURE__ */ jsxs(Select.Trigger, {
+					id,
+					className: ds_select_module_default.trigger,
+					"aria-labelledby": null,
+					children: [/* @__PURE__ */ jsx(ds_typography_default, {
+						className: ds_select_module_default.valueText,
+						variant: "body-sm-reg",
+						asChild: true,
+						children: /* @__PURE__ */ jsx(Select.ValueText, { placeholder })
+					}), /* @__PURE__ */ jsx(Select.Indicator, {
+						className: ds_select_module_default.triggerIcon,
+						children: /* @__PURE__ */ jsx(ds_icon_default, {
+							icon: "keyboard_arrow_down",
+							size: size === "small" ? "small" : "medium"
+						})
+					})]
+				}), clearable && /* @__PURE__ */ jsx(Select.ClearTrigger, {
+					className: ds_select_module_default.clearIcon,
+					onClick: onClear,
+					children: /* @__PURE__ */ jsx(ds_icon_default, {
+						icon: "close",
+						size: size === "small" ? "small" : "medium"
+					})
+				})]
+			}),
+			/* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(Select.Positioner, {
+				className: ds_select_module_default.viewport,
+				children: /* @__PURE__ */ jsxs(Select.Content, {
+					className: ds_select_module_default.content,
+					children: [
+						userOptions.length > SEARCH_THRESHOLD && /* @__PURE__ */ jsx("div", {
+							className: ds_select_module_default.searchInput,
+							children: /* @__PURE__ */ jsx(ds_text_input_default, {
+								placeholder: "Search",
+								value: searchTerm,
+								onChange: (e) => setSearchTerm(e.target.value),
+								onKeyDown: (e) => {
+									if (e.key === " ") e.stopPropagation();
+								},
+								slots: { startAdornment: /* @__PURE__ */ jsx(ds_icon_default, {
+									icon: "search",
+									size: "tiny"
+								}) }
+							})
+						}),
+						multiselectProps.multiple && /* @__PURE__ */ jsx(SelectItemsChips, {
+							onValueChange: multiselectProps.onValueChange,
+							showAll: showAllItems,
+							onShowAll: () => setShowAllItems(true),
+							count: 6
+						}),
+						filteredOptions.map((item) => {
+							const checked = getItemCheckedState({
+								item,
+								select,
+								options: internalOptions
+							});
+							return /* @__PURE__ */ jsx(ds_typography_default, {
+								variant: "body-sm-reg",
+								asChild: true,
+								className: ds_select_module_default.item,
+								children: /* @__PURE__ */ jsxs(Select.Item, {
+									item,
+									children: [
+										multiselectProps.multiple && /* @__PURE__ */ jsx(ds_checkbox_default, { checked }),
+										item.icon && /* @__PURE__ */ jsx(ds_icon_default, {
+											className: ds_select_module_default.itemIcon,
+											icon: item.icon,
+											"aria-hidden": "true"
+										}),
+										/* @__PURE__ */ jsx(Select.ItemText, { children: item.label })
+									]
+								})
+							}, collection.getItemValue(item));
+						})
+					]
+				})
+			}) }),
+			/* @__PURE__ */ jsx(Select.HiddenSelect, { style: { display: "none" } })
+		]
+	});
+};
+function getItemCheckedState({ item, select, options }) {
+	if (item.value !== SELECT_ALL_VALUE) return select.getItemState({ item }).selected;
+	if (select.selectedItems.length === options.length - 1) return true;
+	return select.hasSelectedItems ? "indeterminate" : false;
+}
+var ds_select_default = DsSelect;
+
+//#endregion
+export { ds_select_default as default };
+//# sourceMappingURL=ds-select.js.map

package/dist/components/ds-select/ds-select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ds-select.js","names":["SELECT_ALL: DsSelectOption","value","styles","DsTypography","DsIcon","DsTextInput","DsCheckbox"],"sources":["../../../src/components/ds-select/ds-select.tsx"],"sourcesContent":["import { useState } from 'react';\nimport { type UseSelectReturn, Select, createListCollection, useSelect } from '@ark-ui/react/select';\nimport { Portal } from '@ark-ui/react/portal';\nimport classNames from 'classnames';\nimport styles from './ds-select.module.scss';\nimport type { DsSelectOption, DsSelectProps } from './ds-select.types';\nimport { DsIcon } from '../ds-icon';\nimport { type DsCheckboxProps, DsCheckbox } from '../ds-checkbox';\nimport { SelectItemsChips } from './select-items-chips';\nimport { DsTypography } from '../ds-typography';\nimport { DsTextInput } from '../ds-text-input';\n\nconst SEARCH_THRESHOLD = 13;\nconst SELECT_ALL_VALUE = '__INTERNAL_SELECT_ALL_VALUE__';\n\nconst SELECT_ALL: DsSelectOption = {\n\tlabel: 'All',\n\tvalue: SELECT_ALL_VALUE,\n};\n\nconst DsSelect = ({\n\tid,\n\toptions: userOptions,\n\tvalue,\n\tstyle,\n\tsize,\n\tclearable,\n\tonClear,\n\tonBlur,\n\tclassName,\n\tplaceholder = 'Click to select a value',\n\tdisabled,\n\t...multiselectProps\n}: DsSelectProps) => {\n\tconst [searchTerm, setSearchTerm] = useState('');\n\tconst [showAllItems, setShowAllItems] = useState(false);\n\n\tconst internalOptions = multiselectProps.multiple ? [SELECT_ALL, ...userOptions] : userOptions;\n\n\tconst collection = createListCollection({\n\t\titems: internalOptions,\n\t\titemToValue: (item) => item.value,\n\t});\n\n\tconst filteredOptions = internalOptions.filter((option) =>\n\t\toption.label.toLowerCase().includes(searchTerm.toLowerCase()),\n\t);\n\n\tconst normalizedValue = Array.isArray(value) ? value : [value].filter((value) => !!value);\n\n\tconst select = useSelect({\n\t\tcollection,\n\t\tdisabled,\n\t\tmultiple: multiselectProps.multiple,\n\t\tvalue: normalizedValue,\n\n\t\t// Override Ark's auto-generated trigger id if an id provided by the user.\n\t\t// See: https://github.com/chakra-ui/zag/blob/f6e079095/packages/machines/select/src/select.dom.ts#L5\n\t\tids: { trigger: id },\n\n\t\tonOpenChange: () => {\n\t\t\tsetSearchTerm('');\n\t\t\tsetShowAllItems(false);\n\t\t},\n\n\t\tonValueChange: (details) => {\n\t\t\t// Single select mode.\n\t\t\tif (!multiselectProps.multiple) {\n\t\t\t\tmultiselectProps.onValueChange?.(details.value[0]);\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// \"Select All\" clicked in multi select mode.\n\t\t\tconst isSelectAllClicked = details.value.includes(SELECT_ALL_VALUE);\n\n\t\t\tif (isSelectAllClicked) {\n\t\t\t\tconst areAllOptionsSelected = select.selectedItems.length === userOptions.length;\n\n\t\t\t\tconst newValues = areAllOptionsSelected ? [] : userOptions.map((opt) => opt.value);\n\n\t\t\t\tmultiselectProps.onValueChange?.(newValues);\n\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\t// \"Regular\" multi select mode.\n\t\t\tconst newValueWithoutSelectAll = details.value.filter((val) => val !== SELECT_ALL_VALUE);\n\n\t\t\tmultiselectProps.onValueChange?.(newValueWithoutSelectAll);\n\t\t},\n\t});\n\n\treturn (\n\t\t<Select.RootProvider\n\t\t\tvalue={select}\n\t\t\t// When rendering the Select inside a Modal, it has an `aria-hidden=\"true\"` attribute\n\t\t\t// which causes screen readers to ignore it.\n\t\t\t//\n\t\t\t// See: https://github.com/chakra-ui/ark/issues/3728\n\t\t\tlazyMount\n\t\t>\n\t\t\t<Select.Control\n\t\t\t\tclassName={classNames(styles.control, size === 'small' && styles.small, className)}\n\t\t\t\tstyle={style}\n\t\t\t\tonBlur={onBlur}\n\t\t\t\tonKeyDown={(e) => {\n\t\t\t\t\tif (!clearable) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\n\t\t\t\t\tif (select.open) {\n\t\t\t\t\t\treturn;\n\t\t\t\t\t}\n\n\t\t\t\t\tif (e.key === 'Backspace' || e.key === 'Delete') {\n\t\t\t\t\t\tif (multiselectProps.multiple) {\n\t\t\t\t\t\t\tmultiselectProps.onValueChange?.([]);\n\t\t\t\t\t\t} else {\n\t\t\t\t\t\t\tmultiselectProps.onValueChange?.('');\n\t\t\t\t\t\t}\n\n\t\t\t\t\t\tonClear?.();\n\t\t\t\t\t}\n\t\t\t\t}}\n\t\t\t>\n\t\t\t\t<Select.Trigger\n\t\t\t\t\tid={id}\n\t\t\t\t\tclassName={styles.trigger}\n\t\t\t\t\t// Ark expects a `Select.Label` component to exist and automatically label the trigger\n\t\t\t\t\t// with it. We're using the `DsFormControl` label handling instead, so we disable the\n\t\t\t\t\t// automatic labelling here.\n\t\t\t\t\taria-labelledby={null as never}\n\t\t\t\t>\n\t\t\t\t\t<DsTypography className={styles.valueText} variant=\"body-sm-reg\" asChild>\n\t\t\t\t\t\t<Select.ValueText placeholder={placeholder} />\n\t\t\t\t\t</DsTypography>\n\n\t\t\t\t\t<Select.Indicator className={styles.triggerIcon}>\n\t\t\t\t\t\t<DsIcon icon=\"keyboard_arrow_down\" size={size === 'small' ? 'small' : 'medium'} />\n\t\t\t\t\t</Select.Indicator>\n\t\t\t\t</Select.Trigger>\n\n\t\t\t\t{clearable && (\n\t\t\t\t\t<Select.ClearTrigger className={styles.clearIcon} onClick={onClear}>\n\t\t\t\t\t\t<DsIcon icon=\"close\" size={size === 'small' ? 'small' : 'medium'} />\n\t\t\t\t\t</Select.ClearTrigger>\n\t\t\t\t)}\n\t\t\t</Select.Control>\n\t\t\t<Portal>\n\t\t\t\t<Select.Positioner className={styles.viewport}>\n\t\t\t\t\t<Select.Content className={styles.content}>\n\t\t\t\t\t\t{userOptions.length > SEARCH_THRESHOLD && (\n\t\t\t\t\t\t\t<div className={styles.searchInput}>\n\t\t\t\t\t\t\t\t<DsTextInput\n\t\t\t\t\t\t\t\t\tplaceholder=\"Search\"\n\t\t\t\t\t\t\t\t\tvalue={searchTerm}\n\t\t\t\t\t\t\t\t\tonChange={(e) => setSearchTerm(e.target.value)}\n\t\t\t\t\t\t\t\t\tonKeyDown={(e) => {\n\t\t\t\t\t\t\t\t\t\t// Prevent the select from opening/closing when pressing space in the search input.\n\t\t\t\t\t\t\t\t\t\tif (e.key === ' ') {\n\t\t\t\t\t\t\t\t\t\t\te.stopPropagation();\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t\tslots={{\n\t\t\t\t\t\t\t\t\t\tstartAdornment: <DsIcon icon=\"search\" size=\"tiny\" />,\n\t\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{multiselectProps.multiple && (\n\t\t\t\t\t\t\t<SelectItemsChips\n\t\t\t\t\t\t\t\tonValueChange={multiselectProps.onValueChange}\n\t\t\t\t\t\t\t\tshowAll={showAllItems}\n\t\t\t\t\t\t\t\tonShowAll={() => setShowAllItems(true)}\n\t\t\t\t\t\t\t\t// TODO: Find a way to calculate this based on the size of the select.\n\t\t\t\t\t\t\t\tcount={6}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\n\t\t\t\t\t\t{filteredOptions.map((item) => {\n\t\t\t\t\t\t\tconst checked = getItemCheckedState({ item, select, options: internalOptions });\n\n\t\t\t\t\t\t\treturn (\n\t\t\t\t\t\t\t\t<DsTypography\n\t\t\t\t\t\t\t\t\tvariant=\"body-sm-reg\"\n\t\t\t\t\t\t\t\t\tasChild\n\t\t\t\t\t\t\t\t\tkey={collection.getItemValue(item)}\n\t\t\t\t\t\t\t\t\tclassName={styles.item}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<Select.Item item={item}>\n\t\t\t\t\t\t\t\t\t\t{multiselectProps.multiple && <DsCheckbox checked={checked} />}\n\t\t\t\t\t\t\t\t\t\t{item.icon && <DsIcon className={styles.itemIcon} icon={item.icon} aria-hidden=\"true\" />}\n\t\t\t\t\t\t\t\t\t\t<Select.ItemText>{item.label}</Select.ItemText>\n\t\t\t\t\t\t\t\t\t</Select.Item>\n\t\t\t\t\t\t\t\t</DsTypography>\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t})}\n\t\t\t\t\t</Select.Content>\n\t\t\t\t</Select.Positioner>\n\t\t\t</Portal>\n\n\t\t\t{/*\n\t\t\t\tThis element isn't properly hidden by Zag, so we hide it manually.\n\t\t\t \tFor more information, see: https://github.com/chakra-ui/zag/issues/2865\n\t\t\t*/}\n\t\t\t<Select.HiddenSelect style={{ display: 'none' }} />\n\t\t</Select.RootProvider>\n\t);\n};\n\nfunction getItemCheckedState({\n\titem,\n\tselect,\n\toptions,\n}: {\n\titem: DsSelectOption;\n\tselect: UseSelectReturn<DsSelectOption>;\n\toptions: DsSelectOption[];\n}): DsCheckboxProps['checked'] {\n\tconst isRegularItem = item.value !== SELECT_ALL_VALUE;\n\n\tif (isRegularItem) {\n\t\treturn select.getItemState({ item }).selected;\n\t}\n\n\t// Doing -1 since it contains the \"Select All\" option itself.\n\tconst allSelected = select.selectedItems.length === options.length - 1;\n\n\tif (allSelected) {\n\t\treturn true;\n\t}\n\n\tconst someSelected = select.hasSelectedItems;\n\n\treturn someSelected ? 'indeterminate' : false;\n}\n\nexport default DsSelect;\n"],"mappings":"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"}

package/dist/components/ds-select/ds-select.module.cjs

@@ -0,0 +1,24 @@
+
+//#region src/components/ds-select/ds-select.module.scss
+var ds_select_module_default = {
+	"control": "_control_1joiq_1",
+	"triggerIcon": "_triggerIcon_1joiq_1",
+	"clearIcon": "_clearIcon_1joiq_1",
+	"itemValue": "_itemValue_1joiq_1",
+	"small": "_small_1joiq_1",
+	"trigger": "_trigger_1joiq_1",
+	"content": "_content_1joiq_1",
+	"expand": "_expand_1joiq_1",
+	"collapse": "_collapse_1joiq_1",
+	"searchInput": "_searchInput_1joiq_1",
+	"searchInputField": "_searchInputField_1joiq_1",
+	"searchIcon": "_searchIcon_1joiq_1",
+	"viewport": "_viewport_1joiq_1",
+	"item": "_item_1joiq_1",
+	"itemIcon": "_itemIcon_1joiq_1",
+	"valueText": "_valueText_1joiq_1",
+	"multiSelectItemsContainer": "_multiSelectItemsContainer_1joiq_1"
+};
+
+//#endregion
+exports.default = ds_select_module_default;

package/dist/components/ds-select/ds-select.module.js

@@ -0,0 +1,24 @@
+//#region src/components/ds-select/ds-select.module.scss
+var ds_select_module_default = {
+	"control": "_control_1joiq_1",
+	"triggerIcon": "_triggerIcon_1joiq_1",
+	"clearIcon": "_clearIcon_1joiq_1",
+	"itemValue": "_itemValue_1joiq_1",
+	"small": "_small_1joiq_1",
+	"trigger": "_trigger_1joiq_1",
+	"content": "_content_1joiq_1",
+	"expand": "_expand_1joiq_1",
+	"collapse": "_collapse_1joiq_1",
+	"searchInput": "_searchInput_1joiq_1",
+	"searchInputField": "_searchInputField_1joiq_1",
+	"searchIcon": "_searchIcon_1joiq_1",
+	"viewport": "_viewport_1joiq_1",
+	"item": "_item_1joiq_1",
+	"itemIcon": "_itemIcon_1joiq_1",
+	"valueText": "_valueText_1joiq_1",
+	"multiSelectItemsContainer": "_multiSelectItemsContainer_1joiq_1"
+};
+
+//#endregion
+export { ds_select_module_default as default };
+//# sourceMappingURL=ds-select.module.js.map

package/dist/components/ds-select/ds-select.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ds-select.module.js","names":[],"sources":["../../../file:/home/runner/work/design-system/design-system/packages/design-system/src/components/ds-select/ds-select.module.scss","../../../file:/home/runner/work/design-system/design-system/packages/design-system/src/styles/shared/_input.scss","../../../file:/home/runner/work/design-system/design-system/packages/design-system/src/styles/shared/_dropdown.scss","../../../file:/home/runner/work/design-system/design-system/packages/design-system/src/styles/mixins/_bounding-box.scss","../../../file:/home/runner/work/design-system/design-system/packages/design-system/src/styles/_typography.scss"],"sourcesContent":["@use '../../styles/typography';\n@use '../../styles/shared/dropdown';\n@use '../../styles/shared/input';\n\n.control {\n\t@include input.selectControl;\n}\n\n.trigger {\n\t@include input.selectTrigger;\n}\n\n.content {\n\t@include dropdown.dropdown-content;\n}\n\n.searchInput {\n\t@include input.searchInput;\n}\n\n.viewport {\n\t@include dropdown.dropdown-viewport;\n\tmax-height: 256px;\n\n\t& > .content {\n\t\toverflow-y: auto;\n\t\toverflow-x: hidden;\n\t\tscrollbar-width: thin;\n\t}\n}\n\n.item {\n\tdisplay: flex;\n\talign-items: center;\n\tgap: 8px;\n\tcolor: var(--color-font-secondary);\n\tpadding: var(--spacing-xs);\n\tborder-radius: 2px;\n\tcursor: pointer;\n\toutline: none;\n\n\t&[data-highlighted],\n\t&:hover {\n\t\tbackground: var(--color-background-selected-weak);\n\n\t\t.itemIcon {\n\t\t\tcolor: var(--color-background-selected);\n\t\t}\n\t}\n}\n\n.valueText {\n\t@include typography.ellipsis;\n\tgrid-column: 1;\n\tgrid-row: 1;\n\tcolor: var(--color-font-secondary);\n\ttext-align: start;\n}\n\n.multiSelectItemsContainer {\n\tdisplay: flex;\n\tflex-wrap: wrap;\n\tgap: var(--spacing-3xs);\n\tpadding: var(--spacing-3xs);\n\tborder-bottom: 1px solid var(--color-border-secondary);\n}\n"],"mappings":""}

package/dist/components/ds-select/ds-select.types.d.cts

@@ -0,0 +1,74 @@
+import { IconName } from "../ds-icon/ds-icon.types.cjs";
+import React from "react";
+
+//#region src/components/ds-select/ds-select.types.d.ts
+type SelectSize = 'default' | 'small';
+interface DsSelectOption {
+  /**
+   * Label to display in the select
+   */
+  label: string;
+  /**
+   * Value to return when the option is selected
+   */
+  value: SelectOptionValue;
+  /**
+   * Optional icon to display next to the label
+   */
+  icon?: IconName;
+}
+type SelectOptionValue = string;
+type DsSelectProps = {
+  /**
+   * Unique identifier for the select component
+   */
+  id?: string;
+  /**
+   * Options to display in the select dropdown
+   */
+  options: DsSelectOption[];
+  /**
+   * Additional styles to apply to the icon
+   */
+  style?: React.CSSProperties;
+  /**
+   * Additional CSS class names
+   */
+  className?: string;
+  /**
+   * Event handler called when the select loses focus
+   *
+   * @param event
+   */
+  onBlur?: (event: React.FocusEvent) => void;
+  /**
+   * Placeholder text to display when no option is selected
+   */
+  placeholder?: string;
+  /**
+   * Whether the select is disabled
+   */
+  disabled?: boolean;
+  /**
+   * The size of the select component
+   * @default 'default'
+   */
+  size?: SelectSize;
+} & ({
+  clearable?: undefined | false;
+  onClear?: never;
+} | {
+  clearable: true;
+  onClear?: () => void;
+}) & ({
+  multiple?: undefined | false;
+  value: SelectOptionValue;
+  onValueChange?: (value: SelectOptionValue) => void;
+} | {
+  multiple: true;
+  value: SelectOptionValue[];
+  onValueChange?: (value: SelectOptionValue[]) => void;
+});
+//#endregion
+export { DsSelectOption, DsSelectProps, SelectSize };
+//# sourceMappingURL=ds-select.types.d.cts.map

package/dist/components/ds-select/ds-select.types.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ds-select.types.d.cts","names":[],"sources":["../../../src/components/ds-select/ds-select.types.tsx"],"sourcesContent":[],"mappings":";;;;KAGY,UAAA;UAEK,cAAA;EAFL;AAEZ;AAeA;EAEY,KAAA,EAAA,MAAA;EAQF;;;EA2BF,KAAA,EA5CA,iBA4CA;EAcG;;;EAMiB,IAAA,CAAA,EA5DpB,QA4DoB;;KAzDhB,iBAAA;KAEA,aAAA;;;;;;;;WAQF;;;;UAID,KAAA,CAAM;;;;;;;;;;mBAUG,KAAA,CAAM;;;;;;;;;;;;;SAahB;;;;;;;;;SAcG;0BACiB;;;SAIjB;0BACiB"}

package/dist/components/ds-select/ds-select.types.d.ts

@@ -0,0 +1,75 @@
+import { IconName } from "../ds-icon/ds-icon.types.js";
+import "../ds-icon/index.js";
+import React from "react";
+
+//#region src/components/ds-select/ds-select.types.d.ts
+type SelectSize = 'default' | 'small';
+interface DsSelectOption {
+  /**
+   * Label to display in the select
+   */
+  label: string;
+  /**
+   * Value to return when the option is selected
+   */
+  value: SelectOptionValue;
+  /**
+   * Optional icon to display next to the label
+   */
+  icon?: IconName;
+}
+type SelectOptionValue = string;
+type DsSelectProps = {
+  /**
+   * Unique identifier for the select component
+   */
+  id?: string;
+  /**
+   * Options to display in the select dropdown
+   */
+  options: DsSelectOption[];
+  /**
+   * Additional styles to apply to the icon
+   */
+  style?: React.CSSProperties;
+  /**
+   * Additional CSS class names
+   */
+  className?: string;
+  /**
+   * Event handler called when the select loses focus
+   *
+   * @param event
+   */
+  onBlur?: (event: React.FocusEvent) => void;
+  /**
+   * Placeholder text to display when no option is selected
+   */
+  placeholder?: string;
+  /**
+   * Whether the select is disabled
+   */
+  disabled?: boolean;
+  /**
+   * The size of the select component
+   * @default 'default'
+   */
+  size?: SelectSize;
+} & ({
+  clearable?: undefined | false;
+  onClear?: never;
+} | {
+  clearable: true;
+  onClear?: () => void;
+}) & ({
+  multiple?: undefined | false;
+  value: SelectOptionValue;
+  onValueChange?: (value: SelectOptionValue) => void;
+} | {
+  multiple: true;
+  value: SelectOptionValue[];
+  onValueChange?: (value: SelectOptionValue[]) => void;
+});
+//#endregion
+export { DsSelectOption, DsSelectProps, SelectSize };
+//# sourceMappingURL=ds-select.types.d.ts.map

package/dist/components/ds-select/ds-select.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ds-select.types.d.ts","names":[],"sources":["../../../src/components/ds-select/ds-select.types.tsx"],"sourcesContent":[],"mappings":";;;;;KAGY,UAAA;UAEK,cAAA;;AAFjB;AAEA;EAeY,KAAA,EAAA,MAAA;EAEA;;;EAsBM,KAAM,EA/BhB,iBA+BgB;EAahB;;;EAmBG,IAAA,CAAA,EA3DH,QA2DG;;AACkC,KAzDjC,iBAAA,GAyDiC,MAAA;KAvDjC,aAAA;;;;;;;;WAQF;;;;UAID,KAAA,CAAM;;;;;;;;;;mBAUG,KAAA,CAAM;;;;;;;;;;;;;SAahB;;;;;;;;;SAcG;0BACiB;;;SAIjB;0BACiB"}

package/dist/components/ds-select/index.cjs

@@ -0,0 +1 @@
+const require_ds_select = require('./ds-select.cjs');

package/dist/components/ds-select/index.d.ts

@@ -0,0 +1,2 @@
+import { DsSelectOption, DsSelectProps, SelectSize } from "./ds-select.types.js";
+import { DsSelect } from "./ds-select.js";

package/dist/components/ds-select/index.js

@@ -0,0 +1 @@
+import ds_select_default from "./ds-select.js";

package/dist/components/ds-select/select-items-chips.cjs

@@ -0,0 +1,46 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+const require_ds_button = require('../ds-button/ds-button.cjs');
+const require_ds_chip = require('../ds-chip/ds-chip.cjs');
+const require_ds_select_module = require('./ds-select.module.cjs');
+let react_jsx_runtime = require("react/jsx-runtime");
+let __ark_ui_react_select = require("@ark-ui/react/select");
+
+//#region src/components/ds-select/select-items-chips.tsx
+function SelectItemsChips({ showAll, onShowAll, onValueChange, count }) {
+	const { collection, value: selectedItems } = (0, __ark_ui_react_select.useSelectContext)();
+	if (!selectedItems.length) return null;
+	const itemsToShow = showAll ? selectedItems : selectedItems.slice(0, count);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		className: require_ds_select_module.default.multiSelectItemsContainer,
+		children: [
+			itemsToShow.map((itemValue) => {
+				const item = collection.find(itemValue);
+				if (!item) return null;
+				const onDelete = () => {
+					const filteredValue = selectedItems.filter((v) => v !== item.value);
+					onValueChange?.(filteredValue);
+				};
+				return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_chip.default, {
+					label: item.label,
+					onDelete
+				}, itemValue);
+			}),
+			!showAll && selectedItems.length > count && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_chip.default, {
+				label: `+${String(selectedItems.length - count)}`,
+				onClick: onShowAll,
+				size: "small"
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_button.default, {
+				design: "v1.2",
+				buttonType: "tertiary",
+				variant: "ghost",
+				size: "small",
+				onClick: () => onValueChange?.([]),
+				children: "Clear All"
+			})
+		]
+	});
+}
+
+//#endregion
+exports.SelectItemsChips = SelectItemsChips;

package/dist/components/ds-select/select-items-chips.js

@@ -0,0 +1,46 @@
+import ds_button_default from "../ds-button/ds-button.js";
+import ds_chip_default from "../ds-chip/ds-chip.js";
+import ds_select_module_default from "./ds-select.module.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useSelectContext } from "@ark-ui/react/select";
+
+//#region src/components/ds-select/select-items-chips.tsx
+function SelectItemsChips({ showAll, onShowAll, onValueChange, count }) {
+	const { collection, value: selectedItems } = useSelectContext();
+	if (!selectedItems.length) return null;
+	const itemsToShow = showAll ? selectedItems : selectedItems.slice(0, count);
+	return /* @__PURE__ */ jsxs("div", {
+		className: ds_select_module_default.multiSelectItemsContainer,
+		children: [
+			itemsToShow.map((itemValue) => {
+				const item = collection.find(itemValue);
+				if (!item) return null;
+				const onDelete = () => {
+					const filteredValue = selectedItems.filter((v) => v !== item.value);
+					onValueChange?.(filteredValue);
+				};
+				return /* @__PURE__ */ jsx(ds_chip_default, {
+					label: item.label,
+					onDelete
+				}, itemValue);
+			}),
+			!showAll && selectedItems.length > count && /* @__PURE__ */ jsx(ds_chip_default, {
+				label: `+${String(selectedItems.length - count)}`,
+				onClick: onShowAll,
+				size: "small"
+			}),
+			/* @__PURE__ */ jsx(ds_button_default, {
+				design: "v1.2",
+				buttonType: "tertiary",
+				variant: "ghost",
+				size: "small",
+				onClick: () => onValueChange?.([]),
+				children: "Clear All"
+			})
+		]
+	});
+}
+
+//#endregion
+export { SelectItemsChips };
+//# sourceMappingURL=select-items-chips.js.map

package/dist/components/ds-select/select-items-chips.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"select-items-chips.js","names":["styles","DsChip","DsButton"],"sources":["../../../src/components/ds-select/select-items-chips.tsx"],"sourcesContent":["import { useSelectContext, type UseSelectContext } from '@ark-ui/react/select';\nimport styles from './ds-select.module.scss';\nimport DsButton from '../ds-button/ds-button';\nimport DsChip from '../ds-chip/ds-chip';\nimport type { DsSelectOption, SelectOptionValue } from './ds-select.types';\n\ntype SelectItemsChipsProps = {\n\tshowAll: boolean;\n\tonValueChange?: (value: SelectOptionValue[]) => void;\n\tonShowAll: () => void;\n\tcount: number;\n};\n\nexport function SelectItemsChips({ showAll, onShowAll, onValueChange, count }: SelectItemsChipsProps) {\n\tconst { collection, value: selectedItems } = useSelectContext() as UseSelectContext<DsSelectOption>;\n\n\tif (!selectedItems.length) {\n\t\treturn null;\n\t}\n\n\tconst itemsToShow = showAll ? selectedItems : selectedItems.slice(0, count);\n\n\treturn (\n\t\t<div className={styles.multiSelectItemsContainer}>\n\t\t\t{itemsToShow.map((itemValue) => {\n\t\t\t\tconst item = collection.find(itemValue);\n\n\t\t\t\tif (!item) {\n\t\t\t\t\treturn null;\n\t\t\t\t}\n\n\t\t\t\tconst onDelete = () => {\n\t\t\t\t\tconst filteredValue = selectedItems.filter((v) => v !== item.value);\n\n\t\t\t\t\tonValueChange?.(filteredValue);\n\t\t\t\t};\n\n\t\t\t\treturn <DsChip key={itemValue} label={item.label} onDelete={onDelete} />;\n\t\t\t})}\n\n\t\t\t{!showAll && selectedItems.length > count && (\n\t\t\t\t<DsChip label={`+${String(selectedItems.length - count)}`} onClick={onShowAll} size=\"small\" />\n\t\t\t)}\n\n\t\t\t<DsButton\n\t\t\t\tdesign=\"v1.2\"\n\t\t\t\tbuttonType=\"tertiary\"\n\t\t\t\tvariant=\"ghost\"\n\t\t\t\tsize=\"small\"\n\t\t\t\tonClick={() => onValueChange?.([])}\n\t\t\t>\n\t\t\t\tClear All\n\t\t\t</DsButton>\n\t\t</div>\n\t);\n}\n"],"mappings":";;;;;;;AAaA,SAAgB,iBAAiB,EAAE,SAAS,WAAW,eAAe,SAAgC;CACrG,MAAM,EAAE,YAAY,OAAO,kBAAkB,kBAAkB;AAE/D,KAAI,CAAC,cAAc,OAClB,QAAO;CAGR,MAAM,cAAc,UAAU,gBAAgB,cAAc,MAAM,GAAG,MAAM;AAE3E,QACC,qBAAC;EAAI,WAAWA,yBAAO;;GACrB,YAAY,KAAK,cAAc;IAC/B,MAAM,OAAO,WAAW,KAAK,UAAU;AAEvC,QAAI,CAAC,KACJ,QAAO;IAGR,MAAM,iBAAiB;KACtB,MAAM,gBAAgB,cAAc,QAAQ,MAAM,MAAM,KAAK,MAAM;AAEnE,qBAAgB,cAAc;;AAG/B,WAAO,oBAACC;KAAuB,OAAO,KAAK;KAAiB;OAAxC,UAAoD;KACvE;GAED,CAAC,WAAW,cAAc,SAAS,SACnC,oBAACA;IAAO,OAAO,IAAI,OAAO,cAAc,SAAS,MAAM;IAAI,SAAS;IAAW,MAAK;KAAU;GAG/F,oBAACC;IACA,QAAO;IACP,YAAW;IACX,SAAQ;IACR,MAAK;IACL,eAAe,gBAAgB,EAAE,CAAC;cAClC;KAEU;;GACN"}

package/dist/components/ds-smart-tabs/ds-smart-tabs.cjs

@@ -0,0 +1,90 @@
+const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
+const require_ds_icon = require('../ds-icon/ds-icon.cjs');
+require('../ds-icon/index.cjs');
+const require_ds_smart_tabs_module = require('./ds-smart-tabs.module.cjs');
+let classnames = require("classnames");
+classnames = require_rolldown_runtime.__toESM(classnames);
+let react_jsx_runtime = require("react/jsx-runtime");
+let react = require("react");
+
+//#region src/components/ds-smart-tabs/ds-smart-tabs.tsx
+const colorMap = {
+	"dark-blue": "var(--color-background-info-strong)",
+	"light-blue": "var(--color-background-active-moderate)",
+	"dark-gray": "var(--color-background-brand)",
+	green: "var(--color-background-success-strong)",
+	fuchsia: "var(--color-data-fuchsia)",
+	blue: "var(--color-icon-information-secondary)",
+	gray: "var(--color-icon-information-main)",
+	red: "var(--color-icon-warning)",
+	amber: "var(--color-data-amber)"
+};
+const SmartTabsContext = (0, react.createContext)(null);
+const useSmartTabsContext = () => {
+	const context = (0, react.useContext)(SmartTabsContext);
+	if (!context) throw new Error("DsTab must be used within DsSmartTabs");
+	return context;
+};
+/**
+* Individual tab component
+*/
+const DsSmartTab = ({ label, value, icon, content, color, disabled, className, style = {}, ...props }) => {
+	const { activeTab, onTabClick } = useSmartTabsContext();
+	const tabClass = (0, classnames.default)(require_ds_smart_tabs_module.default.tab, {
+		[require_ds_smart_tabs_module.default.active]: activeTab === value,
+		[require_ds_smart_tabs_module.default.disabled]: disabled
+	}, className);
+	const tabStyle = {
+		...style,
+		...color && { "--tab-color": colorMap[color] }
+	};
+	const handleClick = () => {
+		if (!disabled) onTabClick(value);
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
+		type: "button",
+		className: tabClass,
+		style: tabStyle,
+		onClick: handleClick,
+		disabled,
+		...props,
+		children: [
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_icon.default, {
+				className: require_ds_smart_tabs_module.default.icon,
+				icon,
+				size: "small"
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: require_ds_smart_tabs_module.default.label,
+				children: label
+			}),
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+				className: require_ds_smart_tabs_module.default.content,
+				children: content
+			})
+		]
+	});
+};
+/**
+* Design system SmartTabs component
+*/
+const DsSmartTabs = ({ activeTab, onTabClick, className, style = {}, children, ...props }) => {
+	const contextValue = {
+		activeTab,
+		onTabClick
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(SmartTabsContext.Provider, {
+		value: contextValue,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: (0, classnames.default)(require_ds_smart_tabs_module.default.container, className),
+			style,
+			...props,
+			children
+		})
+	});
+};
+DsSmartTabs.Tab = DsSmartTab;
+var ds_smart_tabs_default = DsSmartTabs;
+
+//#endregion
+exports.default = ds_smart_tabs_default;

package/dist/components/ds-smart-tabs/ds-smart-tabs.d.cts

@@ -0,0 +1,22 @@
+import { DsSmartTabProps, DsSmartTabsProps } from "./ds-smart-tabs.types.cjs";
+import * as react_jsx_runtime7 from "react/jsx-runtime";
+import React from "react";
+
+//#region src/components/ds-smart-tabs/ds-smart-tabs.d.ts
+/**
+ * Design system SmartTabs component
+ */
+declare const DsSmartTabs: {
+  ({
+    activeTab,
+    onTabClick,
+    className,
+    style,
+    children,
+    ...props
+  }: DsSmartTabsProps): react_jsx_runtime7.JSX.Element;
+  Tab: React.FC<DsSmartTabProps>;
+};
+//#endregion
+export { DsSmartTabs };
+//# sourceMappingURL=ds-smart-tabs.d.cts.map

package/dist/components/ds-smart-tabs/ds-smart-tabs.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ds-smart-tabs.d.cts","names":[],"sources":["../../../src/components/ds-smart-tabs/ds-smart-tabs.tsx"],"sourcesContent":[],"mappings":";;;;;;;;AAKsF,cAmFhF,WAoBL,EAAA;;;;;;;;KAbE,mBAAgB,kBAAA,CAAA,GAAA,CAAA"}

package/dist/components/ds-smart-tabs/ds-smart-tabs.d.ts

@@ -0,0 +1,22 @@
+import { DsSmartTabProps, DsSmartTabsProps } from "./ds-smart-tabs.types.js";
+import * as react_jsx_runtime3 from "react/jsx-runtime";
+import React from "react";
+
+//#region src/components/ds-smart-tabs/ds-smart-tabs.d.ts
+/**
+ * Design system SmartTabs component
+ */
+declare const DsSmartTabs: {
+  ({
+    activeTab,
+    onTabClick,
+    className,
+    style,
+    children,
+    ...props
+  }: DsSmartTabsProps): react_jsx_runtime3.JSX.Element;
+  Tab: React.FC<DsSmartTabProps>;
+};
+//#endregion
+export { DsSmartTabs };
+//# sourceMappingURL=ds-smart-tabs.d.ts.map

package/dist/components/ds-smart-tabs/ds-smart-tabs.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ds-smart-tabs.d.ts","names":[],"sources":["../../../src/components/ds-smart-tabs/ds-smart-tabs.tsx"],"sourcesContent":[],"mappings":";;;;;;;;AAKsF,cAmFhF,WAoBL,EAAA;;;;;;;;KAbE,mBAAgB,kBAAA,CAAA,GAAA,CAAA"}