@drivenets/design-system 0.0.1 → 0.0.3

package/dist/components/ds-dropdown-menu/ds-dropdown-menu.types.d.ts

@@ -0,0 +1,247 @@
+import { IconType } from "../ds-icon/ds-icon.types.js";
+import "../ds-icon/index.js";
+import { CSSProperties, MouseEvent, ReactNode } from "react";
+import { Menu } from "@ark-ui/react/menu";
+
+//#region src/components/ds-dropdown-menu/ds-dropdown-menu.types.d.ts
+/**
+ * Base positioning type
+ */
+type BasePositioning = NonNullable<Menu.RootProps['positioning']>;
+/**
+ * Positioning options for dropdown menu
+ */
+type DsDropdownMenuPositioning = Pick<BasePositioning, 'placement' | 'gutter' | 'sameWidth'>;
+/**
+ * DEPRECATED: Legacy dropdown menu option configuration
+ * Use compound component pattern instead
+ * @deprecated
+ */
+interface DsDropdownMenuOptionLegacy {
+  /**
+   * Display label for the menu option
+   */
+  label: string;
+  /**
+   * Optional icon to display
+   */
+  icon?: IconType;
+  /**
+   * Whether this option is disabled
+   */
+  disabled?: boolean;
+  /**
+   * Click handler for the option
+   */
+  onClick?: (e: MouseEvent<HTMLElement>) => void;
+  /**
+   * Optional value for selection tracking
+   */
+  value?: string;
+}
+/**
+ * DEPRECATED: Legacy props for DsDropdownMenuLegacy component
+ * Use compound component pattern instead
+ * @deprecated
+ */
+interface DsDropdownMenuLegacyProps {
+  /**
+   * The options to be displayed in the dropdown menu
+   */
+  options: DsDropdownMenuOptionLegacy[];
+  /**
+   * Optional children to be rendered inside the component
+   * Typically used for the trigger element
+   */
+  children?: ReactNode | undefined;
+  /**
+   * The gap between the trigger and dropdown content in pixels
+   * @default 0
+   */
+  contentGap?: number;
+  /**
+   * Additional CSS class names
+   */
+  className?: string;
+  /**
+   * Optional inline styles to apply to the component
+   */
+  style?: CSSProperties;
+  /**
+   * The alignment of the dropdown content
+   * @default 'center'
+   */
+  align?: 'start' | 'center' | 'end';
+  /**
+   * The side of the dropdown content
+   * @default 'bottom'
+   */
+  side?: 'top' | 'right' | 'bottom' | 'left';
+  /**
+   * Whether to render in place instead of using portals
+   * @default false
+   */
+  disablePortal?: boolean;
+  /**
+   * Whether to disable the search functionality
+   * @default false
+   */
+  disableSearch?: boolean;
+  /**
+   * Currently selected value (for selection tracking)
+   */
+  selected?: string;
+  /**
+   * Callback when an option with a value is selected
+   */
+  onSelect?: (value: string) => void;
+}
+/**
+ * Props for the DsDropdownMenu Root component
+ */
+interface DsDropdownMenuRootProps {
+  /**
+   * Whether the dropdown is open (controlled mode)
+   */
+  open?: boolean;
+  /**
+   * Callback when open state changes
+   */
+  onOpenChange?: (open: boolean) => void;
+  /**
+   * Callback when an item is selected
+   */
+  onSelect?: (value: string) => void;
+  /**
+   * Callback when the highlighted item changes
+   */
+  onHighlightChange?: (value: string | null) => void;
+  /**
+   * Positioning options for the dropdown
+   */
+  positioning?: DsDropdownMenuPositioning;
+  /**
+   * Prevents the menu from closing when any item is selected
+   * @default false
+   */
+  preventCloseOnSelect?: boolean;
+  /**
+   * Root content
+   */
+  children?: ReactNode;
+}
+/**
+ * Props for the DsDropdownMenu Trigger component
+ */
+type DsDropdownMenuTriggerProps = Menu.TriggerProps;
+/**
+ * Props for the DsDropdownMenu Content component
+ */
+interface DsDropdownMenuContentProps extends Pick<Menu.ContentProps, 'className' | 'style' | 'children'> {
+  /**
+   * Whether to render in place instead of using portals
+   * @default false
+   */
+  disablePortal?: boolean;
+}
+/**
+ * Props for the DsDropdownMenu Item component
+ */
+interface DsDropdownMenuItemProps extends Pick<Menu.ItemProps, 'disabled' | 'asChild' | 'className' | 'style' | 'onSelect' | 'onClick' | 'value' | 'children'> {
+  /**
+   * Whether the item is selected (applies selected styling)
+   */
+  selected?: boolean;
+}
+/**
+ * Props for the DsDropdownMenu ItemIndicator component
+ */
+interface DsDropdownMenuItemIndicatorProps {
+  /**
+   * Custom content to render as the indicator (defaults to check icon)
+   */
+  children?: ReactNode;
+  /**
+   * Optional CSS class name
+   */
+  className?: string;
+  /**
+   * Optional inline styles
+   */
+  style?: CSSProperties;
+}
+/**
+ * Props for the DsDropdownMenu Header component
+ */
+interface DsDropdownMenuHeaderProps {
+  /**
+   * The header content (typically a search input or filter controls)
+   */
+  children: ReactNode;
+  /**
+   * Optional CSS class name
+   */
+  className?: string;
+  /**
+   * Optional inline styles
+   */
+  style?: CSSProperties;
+}
+/**
+ * Props for the DsDropdownMenu Actions component
+ */
+interface DsDropdownMenuActionsProps {
+  /**
+   * The action buttons or elements
+   */
+  children: ReactNode;
+  /**
+   * Optional CSS class name
+   */
+  className?: string;
+  /**
+   * Optional inline styles
+   */
+  style?: CSSProperties;
+}
+/**
+ * Props for the DsDropdownMenu ItemGroup component
+ */
+interface DsDropdownMenuItemGroupProps extends Menu.ItemGroupProps {
+  /**
+   * Whether the group is collapsed
+   */
+  collapsed?: boolean;
+  /**
+   * Callback when collapse state changes
+   */
+  onCollapsedChange?: (collapsed: boolean) => void;
+}
+/**
+ * Props for the DsDropdownMenu ItemGroupLabel component
+ */
+type DsDropdownMenuItemGroupLabelProps = Menu.ItemGroupLabelProps;
+/**
+ * Props for the DsDropdownMenu ItemGroupContent component
+ */
+interface DsDropdownMenuItemGroupContentProps {
+  /**
+   * The content to show/hide based on collapsed state
+   */
+  children: ReactNode;
+  /**
+   * Optional CSS class name
+   */
+  className?: string;
+  /**
+   * Optional inline styles
+   */
+  style?: CSSProperties;
+}
+/**
+ * Props for the DsDropdownMenu Separator component
+ */
+type DsDropdownMenuSeparatorProps = Menu.SeparatorProps;
+//#endregion
+export { DsDropdownMenuActionsProps, DsDropdownMenuContentProps, DsDropdownMenuHeaderProps, DsDropdownMenuItemGroupContentProps, DsDropdownMenuItemGroupLabelProps, DsDropdownMenuItemGroupProps, DsDropdownMenuItemIndicatorProps, DsDropdownMenuItemProps, DsDropdownMenuLegacyProps, DsDropdownMenuOptionLegacy, DsDropdownMenuPositioning, DsDropdownMenuRootProps, DsDropdownMenuSeparatorProps, DsDropdownMenuTriggerProps };
+//# sourceMappingURL=ds-dropdown-menu.types.d.ts.map

package/dist/components/ds-dropdown-menu/ds-dropdown-menu.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ds-dropdown-menu.types.d.ts","names":[],"sources":["../../../src/components/ds-dropdown-menu/ds-dropdown-menu.types.tsx"],"sourcesContent":[],"mappings":";;;;;;;;;AAE2C,KAKtC,eAAA,GAAkB,WAAY,CAAA,IAAA,CAAK,SAAA,CAAjB,aAAW,CAAA,CAAA;AAKlC;AAOA;;AAgB0B,KAvBd,yBAAA,GAA4B,IAuBd,CAvBmB,eAuBnB,EAAA,WAAA,GAAA,QAAA,GAAA,WAAA,CAAA;;;AAY1B;;;AAsBS,UAlDQ,0BAAA,CAkDR;EAAa;AAkCtB;AAmCA;EAKiB,KAAA,EAAA,MAAA;EAcA;AAajB;AAkBA;EAkBiB,IAAA,CAAA,EAnLT,QAmLS;EAkBA;AAcjB;AAKA;EAkBY,QAAA,CAAA,EAAA,OAAA;;;;gBAlOG,WAAW;;;;;;;;;;;UAYT,yBAAA;;;;WAIP;;;;;aAKE;;;;;;;;;;;;;UAaH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;UAkCQ,uBAAA;;;;;;;;;;;;;;;;;;;;gBAoBF;;;;;;;;;aASH;;;;;KAMA,0BAAA,GAA6B,IAAA,CAAK;;;;UAK7B,0BAAA,SAAmC,KACnD,IAAA,CAAK;;;;;;;;;;UAaW,uBAAA,SAAgC,KAChD,IAAA,CAAK;;;;;;;;;UAYW,gCAAA;;;;aAIL;;;;;;;;UAQH;;;;;UAMQ,yBAAA;;;;YAIN;;;;;;;;UAQF;;;;;UAMQ,0BAAA;;;;YAIN;;;;;;;;UAQF;;;;;UAMQ,4BAAA,SAAqC,IAAA,CAAK;;;;;;;;;;;;;KAc/C,iCAAA,GAAoC,IAAA,CAAK;;;;UAKpC,mCAAA;;;;YAIN;;;;;;;;UAQF;;;;;KAMG,4BAAA,GAA+B,IAAA,CAAK"}

package/dist/components/ds-dropdown-menu/index.cjs

@@ -0,0 +1 @@
+const require_ds_dropdown_menu = require('./ds-dropdown-menu.cjs');

package/dist/components/ds-dropdown-menu/index.d.ts

@@ -0,0 +1,2 @@
+import { DsDropdownMenuActionsProps, DsDropdownMenuContentProps, DsDropdownMenuHeaderProps, DsDropdownMenuItemGroupContentProps, DsDropdownMenuItemGroupLabelProps, DsDropdownMenuItemGroupProps, DsDropdownMenuItemIndicatorProps, DsDropdownMenuItemProps, DsDropdownMenuLegacyProps, DsDropdownMenuOptionLegacy, DsDropdownMenuPositioning, DsDropdownMenuRootProps, DsDropdownMenuSeparatorProps, DsDropdownMenuTriggerProps } from "./ds-dropdown-menu.types.js";
+import { DsDropdownMenu, DsDropdownMenuLegacy } from "./ds-dropdown-menu.js";

package/dist/components/ds-dropdown-menu/index.js

@@ -0,0 +1 @@
+import { DsDropdownMenu, DsDropdownMenuLegacy } from "./ds-dropdown-menu.js";

package/dist/components/ds-expandable-text-input/ds-expandable-text-input.cjs

@@ -0,0 +1,83 @@
+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_text_input = require('../ds-text-input/ds-text-input.cjs');
+require('../ds-text-input/index.cjs');
+const require_ds_button = require('../ds-button/ds-button.cjs');
+require('../ds-button/index.cjs');
+const require_ds_expandable_text_input_module = require('./ds-expandable-text-input.module.cjs');
+const require_merge_refs = require('../ds-table/utils/merge-refs.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-expandable-text-input/ds-expandable-text-input.tsx
+function DsExpandableTextInput({ onClear, onExpandChange, icon, ...props }) {
+	const [expanded, _setExpanded] = (0, react.useState)(false);
+	const [dirty, setDirty] = (0, react.useState)(false);
+	const ref = (0, react.useRef)(null);
+	const setExpanded = (newExpanded) => {
+		_setExpanded(newExpanded);
+		onExpandChange?.(newExpanded);
+		if (!newExpanded) setDirty(false);
+	};
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_text_input.default, {
+		...props,
+		ref: require_merge_refs.mergeRefs(ref, props.ref),
+		tabIndex: expanded ? 0 : -1,
+		className: (0, classnames.default)(props.className, require_ds_expandable_text_input_module.default.expandableInput, expanded && require_ds_expandable_text_input_module.default.expanded, dirty && require_ds_expandable_text_input_module.default.dirty),
+		onChange: (e) => {
+			props.onChange?.(e);
+			setDirty(true);
+		},
+		onBlur: (e) => {
+			props.onBlur?.(e);
+			if (!dirty && !ref.current?.value) setExpanded(false);
+		},
+		slots: {
+			inputWrapper: InputExpander,
+			startAdornment: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
+				type: "button",
+				className: require_ds_expandable_text_input_module.default.trigger,
+				"aria-label": "Open text input",
+				"aria-hidden": expanded,
+				tabIndex: expanded ? -1 : 0,
+				onClick: () => {
+					if (props.disabled) return;
+					setExpanded(true);
+					ref.current?.focus();
+				},
+				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_icon.default, {
+					icon,
+					size: "small"
+				})
+			}),
+			endAdornment: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ds_button.default, {
+				design: "v1.2",
+				size: "small",
+				buttonType: "tertiary",
+				variant: "filled",
+				className: require_ds_expandable_text_input_module.default.clearTrigger,
+				onClick: () => {
+					setExpanded(false);
+					if (ref.current) {
+						ref.current.blur();
+						ref.current.value = "";
+					}
+					onClear?.();
+				},
+				children: "Clear"
+			})
+		}
+	});
+}
+function InputExpander({ children }) {
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: require_ds_expandable_text_input_module.default.inputExpander,
+		children
+	});
+}
+
+//#endregion
+exports.DsExpandableTextInput = DsExpandableTextInput;

package/dist/components/ds-expandable-text-input/ds-expandable-text-input.d.cts

@@ -0,0 +1,13 @@
+import { DsExpandableTextInputProps } from "./ds-expandable-text-input.types.cjs";
+import * as react_jsx_runtime38 from "react/jsx-runtime";
+
+//#region src/components/ds-expandable-text-input/ds-expandable-text-input.d.ts
+declare function DsExpandableTextInput({
+  onClear,
+  onExpandChange,
+  icon,
+  ...props
+}: DsExpandableTextInputProps): react_jsx_runtime38.JSX.Element;
+//#endregion
+export { DsExpandableTextInput };
+//# sourceMappingURL=ds-expandable-text-input.d.cts.map

package/dist/components/ds-expandable-text-input/ds-expandable-text-input.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ds-expandable-text-input.d.cts","names":[],"sources":["../../../src/components/ds-expandable-text-input/ds-expandable-text-input.tsx"],"sourcesContent":[],"mappings":";;;;iBASgB,qBAAA;;;;;GAKb,6BAA0B,mBAAA,CAAA,GAAA,CAAA"}

package/dist/components/ds-expandable-text-input/ds-expandable-text-input.d.ts

@@ -0,0 +1,13 @@
+import { DsExpandableTextInputProps } from "./ds-expandable-text-input.types.js";
+import * as react_jsx_runtime37 from "react/jsx-runtime";
+
+//#region src/components/ds-expandable-text-input/ds-expandable-text-input.d.ts
+declare function DsExpandableTextInput({
+  onClear,
+  onExpandChange,
+  icon,
+  ...props
+}: DsExpandableTextInputProps): react_jsx_runtime37.JSX.Element;
+//#endregion
+export { DsExpandableTextInput };
+//# sourceMappingURL=ds-expandable-text-input.d.ts.map

package/dist/components/ds-expandable-text-input/ds-expandable-text-input.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ds-expandable-text-input.d.ts","names":[],"sources":["../../../src/components/ds-expandable-text-input/ds-expandable-text-input.tsx"],"sourcesContent":[],"mappings":";;;;iBASgB,qBAAA;;;;;GAKb,6BAA0B,mBAAA,CAAA,GAAA,CAAA"}

package/dist/components/ds-expandable-text-input/ds-expandable-text-input.js

@@ -0,0 +1,82 @@
+import ds_icon_default from "../ds-icon/ds-icon.js";
+import "../ds-icon/index.js";
+import ds_text_input_default from "../ds-text-input/ds-text-input.js";
+import "../ds-text-input/index.js";
+import ds_button_default from "../ds-button/ds-button.js";
+import "../ds-button/index.js";
+import ds_expandable_text_input_module_default from "./ds-expandable-text-input.module.js";
+import { mergeRefs } from "../ds-table/utils/merge-refs.js";
+import classNames from "classnames";
+import { jsx } from "react/jsx-runtime";
+import { useRef, useState } from "react";
+
+//#region src/components/ds-expandable-text-input/ds-expandable-text-input.tsx
+function DsExpandableTextInput({ onClear, onExpandChange, icon, ...props }) {
+	const [expanded, _setExpanded] = useState(false);
+	const [dirty, setDirty] = useState(false);
+	const ref = useRef(null);
+	const setExpanded = (newExpanded) => {
+		_setExpanded(newExpanded);
+		onExpandChange?.(newExpanded);
+		if (!newExpanded) setDirty(false);
+	};
+	return /* @__PURE__ */ jsx(ds_text_input_default, {
+		...props,
+		ref: mergeRefs(ref, props.ref),
+		tabIndex: expanded ? 0 : -1,
+		className: classNames(props.className, ds_expandable_text_input_module_default.expandableInput, expanded && ds_expandable_text_input_module_default.expanded, dirty && ds_expandable_text_input_module_default.dirty),
+		onChange: (e) => {
+			props.onChange?.(e);
+			setDirty(true);
+		},
+		onBlur: (e) => {
+			props.onBlur?.(e);
+			if (!dirty && !ref.current?.value) setExpanded(false);
+		},
+		slots: {
+			inputWrapper: InputExpander,
+			startAdornment: /* @__PURE__ */ jsx("button", {
+				type: "button",
+				className: ds_expandable_text_input_module_default.trigger,
+				"aria-label": "Open text input",
+				"aria-hidden": expanded,
+				tabIndex: expanded ? -1 : 0,
+				onClick: () => {
+					if (props.disabled) return;
+					setExpanded(true);
+					ref.current?.focus();
+				},
+				children: /* @__PURE__ */ jsx(ds_icon_default, {
+					icon,
+					size: "small"
+				})
+			}),
+			endAdornment: /* @__PURE__ */ jsx(ds_button_default, {
+				design: "v1.2",
+				size: "small",
+				buttonType: "tertiary",
+				variant: "filled",
+				className: ds_expandable_text_input_module_default.clearTrigger,
+				onClick: () => {
+					setExpanded(false);
+					if (ref.current) {
+						ref.current.blur();
+						ref.current.value = "";
+					}
+					onClear?.();
+				},
+				children: "Clear"
+			})
+		}
+	});
+}
+function InputExpander({ children }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: ds_expandable_text_input_module_default.inputExpander,
+		children
+	});
+}
+
+//#endregion
+export { DsExpandableTextInput };
+//# sourceMappingURL=ds-expandable-text-input.js.map

package/dist/components/ds-expandable-text-input/ds-expandable-text-input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ds-expandable-text-input.js","names":["DsTextInput","styles","DsIcon","DsButton"],"sources":["../../../src/components/ds-expandable-text-input/ds-expandable-text-input.tsx"],"sourcesContent":["import { type ReactNode, useRef, useState } from 'react';\nimport { DsTextInput } from '../ds-text-input';\nimport { DsIcon } from '../ds-icon';\nimport classNames from 'classnames';\nimport styles from './ds-expandable-text-input.module.scss';\nimport { mergeRefs } from '../ds-table/utils/merge-refs';\nimport type { DsExpandableTextInputProps } from './ds-expandable-text-input.types';\nimport { DsButton } from '../ds-button';\n\nexport function DsExpandableTextInput({\n\tonClear,\n\tonExpandChange,\n\ticon,\n\t...props\n}: DsExpandableTextInputProps) {\n\tconst [expanded, _setExpanded] = useState(false);\n\tconst [dirty, setDirty] = useState(false);\n\tconst ref = useRef<HTMLInputElement>(null);\n\n\tconst setExpanded = (newExpanded: boolean) => {\n\t\t_setExpanded(newExpanded);\n\n\t\tonExpandChange?.(newExpanded);\n\n\t\tif (!newExpanded) {\n\t\t\tsetDirty(false);\n\t\t}\n\t};\n\n\treturn (\n\t\t<DsTextInput\n\t\t\t{...props}\n\t\t\tref={mergeRefs(ref, props.ref)}\n\t\t\ttabIndex={expanded ? 0 : -1}\n\t\t\tclassName={classNames(\n\t\t\t\tprops.className,\n\t\t\t\tstyles.expandableInput,\n\t\t\t\texpanded && styles.expanded,\n\t\t\t\tdirty && styles.dirty,\n\t\t\t)}\n\t\t\tonChange={(e) => {\n\t\t\t\tprops.onChange?.(e);\n\n\t\t\t\tsetDirty(true);\n\t\t\t}}\n\t\t\tonBlur={(e) => {\n\t\t\t\tprops.onBlur?.(e);\n\n\t\t\t\tif (!dirty && !ref.current?.value) {\n\t\t\t\t\tsetExpanded(false);\n\t\t\t\t}\n\t\t\t}}\n\t\t\tslots={{\n\t\t\t\tinputWrapper: InputExpander,\n\t\t\t\tstartAdornment: (\n\t\t\t\t\t<button\n\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\tclassName={styles.trigger}\n\t\t\t\t\t\taria-label=\"Open text input\"\n\t\t\t\t\t\taria-hidden={expanded}\n\t\t\t\t\t\ttabIndex={expanded ? -1 : 0}\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\tif (props.disabled) {\n\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\tsetExpanded(true);\n\n\t\t\t\t\t\t\tref.current?.focus();\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\t<DsIcon icon={icon} size=\"small\" />\n\t\t\t\t\t</button>\n\t\t\t\t),\n\n\t\t\t\tendAdornment: (\n\t\t\t\t\t<DsButton\n\t\t\t\t\t\tdesign=\"v1.2\"\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tbuttonType=\"tertiary\"\n\t\t\t\t\t\tvariant=\"filled\"\n\t\t\t\t\t\tclassName={styles.clearTrigger}\n\t\t\t\t\t\tonClick={() => {\n\t\t\t\t\t\t\tsetExpanded(false);\n\n\t\t\t\t\t\t\tif (ref.current) {\n\t\t\t\t\t\t\t\tref.current.blur();\n\n\t\t\t\t\t\t\t\t// Manually clear the input in uncontrolled mode.\n\t\t\t\t\t\t\t\tref.current.value = '';\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\tonClear?.();\n\t\t\t\t\t\t}}\n\t\t\t\t\t>\n\t\t\t\t\t\tClear\n\t\t\t\t\t</DsButton>\n\t\t\t\t),\n\t\t\t}}\n\t\t/>\n\t);\n}\n\nfunction InputExpander({ children }: { children: ReactNode }) {\n\treturn <div className={styles.inputExpander}>{children}</div>;\n}\n"],"mappings":";;;;;;;;;;;;;AASA,SAAgB,sBAAsB,EACrC,SACA,gBACA,MACA,GAAG,SAC2B;CAC9B,MAAM,CAAC,UAAU,gBAAgB,SAAS,MAAM;CAChD,MAAM,CAAC,OAAO,YAAY,SAAS,MAAM;CACzC,MAAM,MAAM,OAAyB,KAAK;CAE1C,MAAM,eAAe,gBAAyB;AAC7C,eAAa,YAAY;AAEzB,mBAAiB,YAAY;AAE7B,MAAI,CAAC,YACJ,UAAS,MAAM;;AAIjB,QACC,oBAACA;EACA,GAAI;EACJ,KAAK,UAAU,KAAK,MAAM,IAAI;EAC9B,UAAU,WAAW,IAAI;EACzB,WAAW,WACV,MAAM,WACNC,wCAAO,iBACP,YAAYA,wCAAO,UACnB,SAASA,wCAAO,MAChB;EACD,WAAW,MAAM;AAChB,SAAM,WAAW,EAAE;AAEnB,YAAS,KAAK;;EAEf,SAAS,MAAM;AACd,SAAM,SAAS,EAAE;AAEjB,OAAI,CAAC,SAAS,CAAC,IAAI,SAAS,MAC3B,aAAY,MAAM;;EAGpB,OAAO;GACN,cAAc;GACd,gBACC,oBAAC;IACA,MAAK;IACL,WAAWA,wCAAO;IAClB,cAAW;IACX,eAAa;IACb,UAAU,WAAW,KAAK;IAC1B,eAAe;AACd,SAAI,MAAM,SACT;AAGD,iBAAY,KAAK;AAEjB,SAAI,SAAS,OAAO;;cAGrB,oBAACC;KAAa;KAAM,MAAK;MAAU;KAC3B;GAGV,cACC,oBAACC;IACA,QAAO;IACP,MAAK;IACL,YAAW;IACX,SAAQ;IACR,WAAWF,wCAAO;IAClB,eAAe;AACd,iBAAY,MAAM;AAElB,SAAI,IAAI,SAAS;AAChB,UAAI,QAAQ,MAAM;AAGlB,UAAI,QAAQ,QAAQ;;AAGrB,gBAAW;;cAEZ;KAEU;GAEZ;GACA;;AAIJ,SAAS,cAAc,EAAE,YAAqC;AAC7D,QAAO,oBAAC;EAAI,WAAWA,wCAAO;EAAgB;GAAe"}

package/dist/components/ds-expandable-text-input/ds-expandable-text-input.module.cjs

@@ -0,0 +1,13 @@
+
+//#region src/components/ds-expandable-text-input/ds-expandable-text-input.module.scss
+var ds_expandable_text_input_module_default = {
+	"expandableInput": "_expandableInput_dd7gz_1",
+	"expanded": "_expanded_dd7gz_1",
+	"trigger": "_trigger_dd7gz_1",
+	"clearTrigger": "_clearTrigger_dd7gz_1",
+	"dirty": "_dirty_dd7gz_1",
+	"inputExpander": "_inputExpander_dd7gz_1"
+};
+
+//#endregion
+exports.default = ds_expandable_text_input_module_default;

package/dist/components/ds-expandable-text-input/ds-expandable-text-input.module.js

@@ -0,0 +1,13 @@
+//#region src/components/ds-expandable-text-input/ds-expandable-text-input.module.scss
+var ds_expandable_text_input_module_default = {
+	"expandableInput": "_expandableInput_dd7gz_1",
+	"expanded": "_expanded_dd7gz_1",
+	"trigger": "_trigger_dd7gz_1",
+	"clearTrigger": "_clearTrigger_dd7gz_1",
+	"dirty": "_dirty_dd7gz_1",
+	"inputExpander": "_inputExpander_dd7gz_1"
+};
+
+//#endregion
+export { ds_expandable_text_input_module_default as default };
+//# sourceMappingURL=ds-expandable-text-input.module.js.map

package/dist/components/ds-expandable-text-input/ds-expandable-text-input.module.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ds-expandable-text-input.module.js","names":[],"sources":["../../../src/components/ds-expandable-text-input/ds-expandable-text-input.module.scss"],"sourcesContent":[".expandableInput {\n\twidth: max-content;\n\ttransition: 0.3s padding;\n\n\t&:not(.expanded) {\n\t\tgap: 0;\n\t\tpadding-inline: var(--spacing-xs);\n\t}\n\n\t.trigger:focus {\n\t\toutline: none;\n\t}\n\n\t// Increase the clickable area of the start adornment.\n\t.trigger::before {\n\t\tcontent: '';\n\t\tdisplay: block;\n\t\tposition: absolute;\n\t\tinset: 0;\n\t\tcursor: pointer;\n\t}\n\n\t&:has(:disabled) .trigger::before {\n\t\tcursor: not-allowed;\n\t}\n\n\t&.expanded .trigger {\n\t\tpointer-events: none;\n\n\t\t&::before {\n\t\t\tdisplay: none;\n\t\t}\n\t}\n\n\t.clearTrigger {\n\t\ttransition: 0.3s opacity;\n\t}\n\n\t&:not(.expanded) .clearTrigger {\n\t\tdisplay: none;\n\t}\n\n\t&:not(.dirty) .clearTrigger {\n\t\topacity: 0;\n\t\tpointer-events: none;\n\t}\n\n\t// See: https://css-tricks.com/css-grid-can-do-auto-height-transitions/\n\t.inputExpander {\n\t\tdisplay: grid;\n\t\tgrid-template-columns: 0fr;\n\t\toverflow: hidden;\n\t\ttransition: 0.3s grid-template-columns;\n\n\t\tinput {\n\t\t\tmin-width: 0;\n\t\t\topacity: 0;\n\t\t\ttransition: 0.15s opacity;\n\t\t}\n\t}\n\n\t&.expanded .inputExpander {\n\t\tgrid-template-columns: 1fr;\n\n\t\tinput {\n\t\t\topacity: 1;\n\t\t\ttransition: 0.3s opacity 0.15s;\n\t\t}\n\t}\n}\n"],"mappings":""}

package/dist/components/ds-expandable-text-input/ds-expandable-text-input.types.d.cts

@@ -0,0 +1,21 @@
+import { IconType } from "../ds-icon/ds-icon.types.cjs";
+import { DsTextInputProps } from "../ds-text-input/ds-text-input.types.cjs";
+
+//#region src/components/ds-expandable-text-input/ds-expandable-text-input.types.d.ts
+interface DsExpandableTextInputProps extends Omit<DsTextInputProps, 'tabIndex' | 'slots'> {
+  /**
+   * The icon to display inside the expandable input trigger button
+   */
+  icon: IconType;
+  /**
+   * Callback fired when the clear action is triggered
+   */
+  onClear?: () => void;
+  /**
+   * Callback fired when the expanded state changes
+   */
+  onExpandChange?: (expanded: boolean) => void;
+}
+//#endregion
+export { DsExpandableTextInputProps };
+//# sourceMappingURL=ds-expandable-text-input.types.d.cts.map

package/dist/components/ds-expandable-text-input/ds-expandable-text-input.types.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ds-expandable-text-input.types.d.cts","names":[],"sources":["../../../src/components/ds-expandable-text-input/ds-expandable-text-input.types.tsx"],"sourcesContent":[],"mappings":";;;;UAGiB,0BAAA,SAAmC,KAAK;;AAAzD;;EAIO,IAAA,EAAA,QAAA;EAJ6C"}

package/dist/components/ds-expandable-text-input/ds-expandable-text-input.types.d.ts

@@ -0,0 +1,23 @@
+import { IconType } from "../ds-icon/ds-icon.types.js";
+import "../ds-icon/index.js";
+import { DsTextInputProps } from "../ds-text-input/ds-text-input.types.js";
+import "../ds-text-input/index.js";
+
+//#region src/components/ds-expandable-text-input/ds-expandable-text-input.types.d.ts
+interface DsExpandableTextInputProps extends Omit<DsTextInputProps, 'tabIndex' | 'slots'> {
+  /**
+   * The icon to display inside the expandable input trigger button
+   */
+  icon: IconType;
+  /**
+   * Callback fired when the clear action is triggered
+   */
+  onClear?: () => void;
+  /**
+   * Callback fired when the expanded state changes
+   */
+  onExpandChange?: (expanded: boolean) => void;
+}
+//#endregion
+export { DsExpandableTextInputProps };
+//# sourceMappingURL=ds-expandable-text-input.types.d.ts.map

package/dist/components/ds-expandable-text-input/ds-expandable-text-input.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ds-expandable-text-input.types.d.ts","names":[],"sources":["../../../src/components/ds-expandable-text-input/ds-expandable-text-input.types.tsx"],"sourcesContent":[],"mappings":";;;;;;UAGiB,0BAAA,SAAmC,KAAK;;;;EAAxC,IAAA,EAIV,QAJU;EAAwC;;;EAAD,OAAA,CAAA,EAAA,GAAA,GAAA,IAAA"}

package/dist/components/ds-expandable-text-input/index.cjs

@@ -0,0 +1 @@
+const require_ds_expandable_text_input = require('./ds-expandable-text-input.cjs');

package/dist/components/ds-expandable-text-input/index.d.ts

@@ -0,0 +1,2 @@
+import { DsExpandableTextInputProps } from "./ds-expandable-text-input.types.js";
+import { DsExpandableTextInput } from "./ds-expandable-text-input.js";

package/dist/components/ds-expandable-text-input/index.js

@@ -0,0 +1 @@
+import { DsExpandableTextInput } from "./ds-expandable-text-input.js";