@drivenets/design-system 0.0.3 → 0.0.4

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

@@ -9,6 +9,7 @@ const require_ds_checkbox = require('../ds-checkbox/ds-checkbox.cjs');
 require('../ds-checkbox/index.cjs');
 const require_ds_select_module = require('./ds-select.module.cjs');
 const require_select_items_chips = require('./select-items-chips.cjs');
+let react_compiler_runtime = require("react/compiler-runtime");
 let classnames = require("classnames");
 classnames = require_rolldown_runtime.__toESM(classnames);
 let react_jsx_runtime = require("react/jsx-runtime");
@@ -23,46 +24,214 @@ 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 DsSelect = (t0) => {
+	const $ = (0, react_compiler_runtime.c)(35);
+	const { id, options: userOptions, value, style, size, clearable, onClear, onBlur, className, placeholder: t1, disabled, ...multiselectProps } = t0;
+	const placeholder = t1 === void 0 ? "Click to select a value" : t1;
 	const [searchTerm, setSearchTerm] = (0, react.useState)("");
 	const [showAllItems, setShowAllItems] = (0, react.useState)(false);
 	const internalOptions = multiselectProps.multiple ? [SELECT_ALL, ...userOptions] : userOptions;
 	const collection = (0, __ark_ui_react_select.createListCollection)({
 		items: internalOptions,
-		itemToValue: (item) => item.value
+		itemToValue: _temp
 	});
-	const filteredOptions = internalOptions.filter((option) => option.label.toLowerCase().includes(searchTerm.toLowerCase()));
-	const normalizedValue = Array.isArray(value) ? value : [value].filter((value$1) => !!value$1);
+	let t2;
+	if ($[0] !== searchTerm) {
+		t2 = (option) => option.label.toLowerCase().includes(searchTerm.toLowerCase());
+		$[0] = searchTerm;
+		$[1] = t2;
+	} else t2 = $[1];
+	const filteredOptions = internalOptions.filter(t2);
+	const normalizedValue = Array.isArray(value) ? value : [value].filter(_temp2);
+	let t3;
+	if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+		t3 = () => {
+			setSearchTerm("");
+			setShowAllItems(false);
+		};
+		$[2] = t3;
+	} else t3 = $[2];
 	const select = (0, __ark_ui_react_select.useSelect)({
 		collection,
 		disabled,
 		multiple: multiselectProps.multiple,
 		value: normalizedValue,
 		ids: { trigger: id },
-		onOpenChange: () => {
-			setSearchTerm("");
-			setShowAllItems(false);
-		},
+		onOpenChange: t3,
 		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);
+				const newValues = select.selectedItems.length === userOptions.length ? [] : userOptions.map(_temp3);
 				multiselectProps.onValueChange?.(newValues);
 				return;
 			}
-			const newValueWithoutSelectAll = details.value.filter((val) => val !== SELECT_ALL_VALUE);
+			const newValueWithoutSelectAll = details.value.filter(_temp4);
 			multiselectProps.onValueChange?.(newValueWithoutSelectAll);
 		}
 	});
+	const t4 = size === "small" && require_ds_select_module.default.small;
+	let t5;
+	if ($[3] !== className || $[4] !== t4) {
+		t5 = (0, classnames.default)(require_ds_select_module.default.control, t4, className);
+		$[3] = className;
+		$[4] = t4;
+		$[5] = t5;
+	} else t5 = $[5];
+	let t6;
+	if ($[6] !== placeholder) {
+		t6 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_typography.default, {
+			className: require_ds_select_module.default.valueText,
+			variant: "body-sm-reg",
+			asChild: true,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_select.Select.ValueText, { placeholder })
+		});
+		$[6] = placeholder;
+		$[7] = t6;
+	} else t6 = $[7];
+	const t7 = size === "small" ? "small" : "medium";
+	let t8;
+	if ($[8] !== t7) {
+		t8 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_select.Select.Indicator, {
+			className: require_ds_select_module.default.triggerIcon,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_icon.default, {
+				icon: "keyboard_arrow_down",
+				size: t7
+			})
+		});
+		$[8] = t7;
+		$[9] = t8;
+	} else t8 = $[9];
+	let t9;
+	if ($[10] !== id || $[11] !== t6 || $[12] !== t8) {
+		t9 = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__ark_ui_react_select.Select.Trigger, {
+			id,
+			className: require_ds_select_module.default.trigger,
+			"aria-labelledby": null,
+			children: [t6, t8]
+		});
+		$[10] = id;
+		$[11] = t6;
+		$[12] = t8;
+		$[13] = t9;
+	} else t9 = $[13];
+	let t10;
+	if ($[14] !== clearable || $[15] !== onClear || $[16] !== size) {
+		t10 = clearable && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_select.Select.ClearTrigger, {
+			className: require_ds_select_module.default.clearIcon,
+			onClick: onClear,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_icon.default, {
+				icon: "close",
+				size: size === "small" ? "small" : "medium"
+			})
+		});
+		$[14] = clearable;
+		$[15] = onClear;
+		$[16] = size;
+		$[17] = t10;
+	} else t10 = $[17];
+	const T0 = __ark_ui_react_portal.Portal;
+	const t11 = __ark_ui_react_select.Select;
+	const t12 = require_ds_select_module.default;
+	const t13 = __ark_ui_react_select.Select;
+	const t14 = require_ds_select_module.default;
+	let t15;
+	if ($[18] !== searchTerm || $[19] !== userOptions.length) {
+		t15 = userOptions.length > SEARCH_THRESHOLD && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+			className: require_ds_select_module.default.searchInput,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_text_input.default, {
+				placeholder: "Search",
+				value: searchTerm,
+				onChange: (e_0) => setSearchTerm(e_0.target.value),
+				onKeyDown: _temp5,
+				slots: { startAdornment: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_icon.default, {
+					icon: "search",
+					size: "tiny"
+				}) }
+			})
+		});
+		$[18] = searchTerm;
+		$[19] = userOptions.length;
+		$[20] = t15;
+	} else t15 = $[20];
+	const t16 = multiselectProps.multiple && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_select_items_chips.SelectItemsChips, {
+		onValueChange: multiselectProps.onValueChange,
+		showAll: showAllItems,
+		onShowAll: () => setShowAllItems(true),
+		count: 6
+	});
+	const t17 = filteredOptions.map((item_0) => {
+		const checked = getItemCheckedState({
+			item: item_0,
+			select,
+			options: internalOptions
+		});
+		return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_typography.default, {
+			variant: "body-sm-reg",
+			asChild: true,
+			className: require_ds_select_module.default.item,
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__ark_ui_react_select.Select.Item, {
+				item: item_0,
+				children: [
+					multiselectProps.multiple && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_checkbox.default, { checked }),
+					item_0.icon && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_icon.default, {
+						className: require_ds_select_module.default.itemIcon,
+						icon: item_0.icon,
+						"aria-hidden": "true"
+					}),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_select.Select.ItemText, { children: item_0.label })
+				]
+			})
+		}, collection.getItemValue(item_0));
+	});
+	let t18;
+	if ($[21] !== t13.Content || $[22] !== t14.content || $[23] !== t15 || $[24] !== t16 || $[25] !== t17) {
+		t18 = /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(t13.Content, {
+			className: t14.content,
+			children: [
+				t15,
+				t16,
+				t17
+			]
+		});
+		$[21] = t13.Content;
+		$[22] = t14.content;
+		$[23] = t15;
+		$[24] = t16;
+		$[25] = t17;
+		$[26] = t18;
+	} else t18 = $[26];
+	let t19;
+	if ($[27] !== t11.Positioner || $[28] !== t12.viewport || $[29] !== t18) {
+		t19 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(t11.Positioner, {
+			className: t12.viewport,
+			children: t18
+		});
+		$[27] = t11.Positioner;
+		$[28] = t12.viewport;
+		$[29] = t18;
+		$[30] = t19;
+	} else t19 = $[30];
+	let t20;
+	if ($[31] !== T0 || $[32] !== t19) {
+		t20 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(T0, { children: t19 });
+		$[31] = T0;
+		$[32] = t19;
+		$[33] = t20;
+	} else t20 = $[33];
+	let t21;
+	if ($[34] === Symbol.for("react.memo_cache_sentinel")) {
+		t21 = /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_select.Select.HiddenSelect, { style: { display: "none" } });
+		$[34] = t21;
+	} else t21 = $[34];
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__ark_ui_react_select.Select.RootProvider, {
 		value: select,
 		lazyMount: true,
 		children: [
 			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__ark_ui_react_select.Select.Control, {
-				className: (0, classnames.default)(require_ds_select_module.default.control, size === "small" && require_ds_select_module.default.small, className),
+				className: t5,
 				style,
 				onBlur,
 				onKeyDown: (e) => {
@@ -74,85 +243,10 @@ const DsSelect = ({ id, options: userOptions, value, style, size, clearable, onC
 						onClear?.();
 					}
 				},
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__ark_ui_react_select.Select.Trigger, {
-					id,
-					className: require_ds_select_module.default.trigger,
-					"aria-labelledby": null,
-					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_typography.default, {
-						className: require_ds_select_module.default.valueText,
-						variant: "body-sm-reg",
-						asChild: true,
-						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_select.Select.ValueText, { placeholder })
-					}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_select.Select.Indicator, {
-						className: require_ds_select_module.default.triggerIcon,
-						children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_icon.default, {
-							icon: "keyboard_arrow_down",
-							size: size === "small" ? "small" : "medium"
-						})
-					})]
-				}), clearable && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_select.Select.ClearTrigger, {
-					className: require_ds_select_module.default.clearIcon,
-					onClick: onClear,
-					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_icon.default, {
-						icon: "close",
-						size: size === "small" ? "small" : "medium"
-					})
-				})]
+				children: [t9, t10]
 			}),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_portal.Portal, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_select.Select.Positioner, {
-				className: require_ds_select_module.default.viewport,
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__ark_ui_react_select.Select.Content, {
-					className: require_ds_select_module.default.content,
-					children: [
-						userOptions.length > SEARCH_THRESHOLD && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-							className: require_ds_select_module.default.searchInput,
-							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_text_input.default, {
-								placeholder: "Search",
-								value: searchTerm,
-								onChange: (e) => setSearchTerm(e.target.value),
-								onKeyDown: (e) => {
-									if (e.key === " ") e.stopPropagation();
-								},
-								slots: { startAdornment: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_icon.default, {
-									icon: "search",
-									size: "tiny"
-								}) }
-							})
-						}),
-						multiselectProps.multiple && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_select_items_chips.SelectItemsChips, {
-							onValueChange: multiselectProps.onValueChange,
-							showAll: showAllItems,
-							onShowAll: () => setShowAllItems(true),
-							count: 6
-						}),
-						filteredOptions.map((item) => {
-							const checked = getItemCheckedState({
-								item,
-								select,
-								options: internalOptions
-							});
-							return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_typography.default, {
-								variant: "body-sm-reg",
-								asChild: true,
-								className: require_ds_select_module.default.item,
-								children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__ark_ui_react_select.Select.Item, {
-									item,
-									children: [
-										multiselectProps.multiple && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_checkbox.default, { checked }),
-										item.icon && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_icon.default, {
-											className: require_ds_select_module.default.itemIcon,
-											icon: item.icon,
-											"aria-hidden": "true"
-										}),
-										/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_select.Select.ItemText, { children: item.label })
-									]
-								})
-							}, collection.getItemValue(item));
-						})
-					]
-				})
-			}) }),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__ark_ui_react_select.Select.HiddenSelect, { style: { display: "none" } })
+			t20,
+			t21
 		]
 	});
 };
@@ -162,6 +256,21 @@ function getItemCheckedState({ item, select, options }) {
 	return select.hasSelectedItems ? "indeterminate" : false;
 }
 var ds_select_default = DsSelect;
+function _temp(item) {
+	return item.value;
+}
+function _temp2(value_0) {
+	return !!value_0;
+}
+function _temp3(opt) {
+	return opt.value;
+}
+function _temp4(val) {
+	return val !== SELECT_ALL_VALUE;
+}
+function _temp5(e_1) {
+	if (e_1.key === " ") e_1.stopPropagation();
+}
 
 //#endregion
 exports.default = ds_select_default;

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

@@ -1,5 +1,5 @@
 import { DsSelectProps } from "./ds-select.types.cjs";
-import * as react_jsx_runtime8 from "react/jsx-runtime";
+import * as react_jsx_runtime34 from "react/jsx-runtime";
 
 //#region src/components/ds-select/ds-select.d.ts
 declare const DsSelect: ({
@@ -15,7 +15,7 @@ declare const DsSelect: ({
   placeholder,
   disabled,
   ...multiselectProps
-}: DsSelectProps) => react_jsx_runtime8.JSX.Element;
+}: DsSelectProps) => react_jsx_runtime34.JSX.Element;
 //#endregion
 export { DsSelect };
 //# sourceMappingURL=ds-select.d.cts.map

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

@@ -1 +1 @@
-{"version":3,"file":"ds-select.d.cts","names":[],"sources":["../../../src/components/ds-select/ds-select.tsx"],"sourcesContent":[],"mappings":";;;;cAoBM;;WAAY;;;;;;;;;;;GAaf,kBAAa,kBAAA,CAAA,GAAA,CAAA"}
+{"version":3,"file":"ds-select.d.cts","names":[],"sources":["../../../src/components/ds-select/ds-select.tsx"],"sourcesContent":[],"mappings":";;;;cAoBM;;WAAY;;;;;;;;;;;GAaf,kBAAa,mBAAA,CAAA,GAAA,CAAA"}