linear-react-components-ui 1.1.26-beta.9 → 2.0.0-beta.0

package/lib/inputs2/selectfield/listbox.js

@@ -0,0 +1,66 @@
+import { __toESM as e } from "../../_virtual/_rolldown/runtime.js";
+import { require_lodash as t } from "../../node_modules/lodash/lodash.js";
+import { useSelectFieldContext as n } from "./context.js";
+import { Search as r } from "./search.js";
+import { forwardRef as i, useEffect as a, useRef as o, useState as s } from "react";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+//#region src/lib/inputs2/selectfield/listbox.tsx
+var u = /* @__PURE__ */ e(t(), 1), d = 406, f = i((e, t) => {
+	let { children: i, dropdownMaxWidth: f, ...p } = e, { listBoxOpen: m, valueSelect: h, selectFieldId: g, selectContainerRef: _, notFoundFilterLabel: v, searchOnDropdown: y, isMultipleWithCheckboxes: b } = n(), [x, S] = s({}), [C, w] = s(!1), T = o(null), E = y || b;
+	return requestAnimationFrame(() => {
+		let e = T.current?.childNodes, t = T.current?.querySelectorAll("li[data-state-filtered=\"true\"]") ?? [];
+		w(!u.default.isEmpty(e) && u.default.isEmpty(t));
+	}), a(() => {
+		let e = () => {
+			let e = _.current?.getBoundingClientRect();
+			if (e) {
+				let { top: t, left: n, width: r, height: i } = e, a = window.innerHeight - (t + i), o = t, s = a < d && o > a, c = {
+					left: n + window.scrollX,
+					position: "absolute",
+					minWidth: f ?? r
+				};
+				s ? (c.bottom = window.innerHeight - t - window.scrollY, c.maxHeight = Math.min(d, o)) : (c.top = t + i + window.scrollY, c.maxHeight = Math.min(d, a)), S(c);
+			}
+		};
+		return m && (e(), window.addEventListener("resize", e), window.addEventListener("scroll", e, !0)), () => {
+			window.removeEventListener("resize", e), window.removeEventListener("scroll", e, !0);
+		};
+	}, [
+		m,
+		h,
+		_
+	]), /* @__PURE__ */ l("div", {
+		ref: t,
+		style: x,
+		"aria-expanded": m,
+		className: "select-field-listbox",
+		"data-testid": "test-select-field-listbox",
+		"data-dropdown-max-width": f,
+		...p,
+		children: [E && /* @__PURE__ */ c(r, {}), /* @__PURE__ */ l("ul", {
+			id: g,
+			role: "listbox",
+			ref: T,
+			children: [i, C && /* @__PURE__ */ c("li", {
+				tabIndex: -1,
+				"aria-disabled": !0,
+				"aria-label": v,
+				role: "option",
+				id: "not-found-values",
+				className: "not-found-values",
+				onClick: (e) => {
+					e.preventDefault();
+				},
+				onMouseDown: (e) => {
+					e.preventDefault();
+				},
+				children: v
+			}, "not-found-values")]
+		})]
+	});
+});
+f.displayName = "SelectListBox";
+//#endregion
+export { f as ListBox };
+
+//# sourceMappingURL=listbox.js.map

package/lib/inputs2/selectfield/listbox.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"listbox.js","names":[],"sources":["../../../src/lib/inputs2/selectfield/listbox.tsx"],"sourcesContent":["import _ from 'lodash';\nimport { ComponentProps, CSSProperties, forwardRef, useEffect, useRef, useState } from 'react';\nimport { Search } from './search';\nimport { useSelectFieldContext } from './context';\n\ninterface SelectFieldListBoxProps extends ComponentProps<'div'> {\n  dropdownMaxWidth?: number;\n}\n\nconst MAX_HEIGHT = ((27 * 15) + 1); // 27px de height do list item * 15 itens máximos na exibição + 1px de borda listbox.\nconst ListBox = forwardRef<HTMLDivElement, SelectFieldListBoxProps>((props, ref) => {\n  const { children, dropdownMaxWidth, ...rest } = props;\n  const {\n    listBoxOpen, valueSelect, selectFieldId, selectContainerRef, notFoundFilterLabel,\n    searchOnDropdown, isMultipleWithCheckboxes,\n  } = useSelectFieldContext();\n\n  const [listBoxStyles, setListBoxStyles] = useState<CSSProperties>({});\n  const [filterResultIsEmpty, setFilterResultIsEmpty] = useState(false);\n  const listBoxRef = useRef<HTMLUListElement>(null);\n  const shouldBeShowSearchInput = searchOnDropdown || isMultipleWithCheckboxes;\n\n  requestAnimationFrame(() => {\n    const hasChildrenElementsInUL = (listBoxRef.current?.childNodes);\n    const liElementsFiltered = (listBoxRef.current?.querySelectorAll(\n      'li[data-state-filtered=\"true\"]',\n    ) ?? []) as HTMLLIElement[];\n    const filterIsEmpty = !_.isEmpty(hasChildrenElementsInUL) && _.isEmpty(liElementsFiltered);\n    setFilterResultIsEmpty(filterIsEmpty);\n  });\n\n  useEffect(() => {\n    const updatePosition = () => {\n      const selectPositionOnScreen = selectContainerRef.current?.getBoundingClientRect();\n      if (selectPositionOnScreen) {\n        const { top, left, width, height } = selectPositionOnScreen;\n        const spaceBelow = window.innerHeight - (top + height);\n        const spaceAbove = top;\n        const shouldOpenUp = spaceBelow < MAX_HEIGHT && spaceAbove > spaceBelow;\n\n        const styles: CSSProperties = {\n          left: left + window.scrollX,\n          position: 'absolute',\n          minWidth: dropdownMaxWidth ?? width,\n        };\n\n        if (shouldOpenUp) {\n          styles.bottom = window.innerHeight - top - window.scrollY;\n          styles.maxHeight = Math.min(MAX_HEIGHT, spaceAbove);\n        } else {\n          styles.top = top + height + window.scrollY;\n          styles.maxHeight = Math.min(MAX_HEIGHT, spaceBelow);\n        }\n\n        setListBoxStyles(styles);\n      }\n    };\n\n    if (listBoxOpen) {\n      updatePosition();\n      window.addEventListener('resize', updatePosition);\n      window.addEventListener('scroll', updatePosition, true);\n    }\n\n    return () => {\n      window.removeEventListener('resize', updatePosition);\n      window.removeEventListener('scroll', updatePosition, true);\n    };\n  }, [listBoxOpen, valueSelect, selectContainerRef]);\n\n  return (\n    <div\n      ref={ref}\n      style={listBoxStyles}\n      aria-expanded={listBoxOpen}\n      className=\"select-field-listbox\"\n      data-testid=\"test-select-field-listbox\"\n      data-dropdown-max-width={dropdownMaxWidth}\n      {...rest}>\n      {shouldBeShowSearchInput && (<Search />)}\n      <ul\n        id={selectFieldId}\n        role=\"listbox\"\n        ref={listBoxRef}>\n        {children}\n        {filterResultIsEmpty && (\n          <li\n            tabIndex={-1}\n            aria-disabled={true}\n            aria-label={notFoundFilterLabel}\n            key=\"not-found-values\"\n            // eslint-disable-next-line jsx-a11y/role-has-required-aria-props\n            role=\"option\"\n            id=\"not-found-values\"\n            className=\"not-found-values\"\n            onClick={(event) => { event.preventDefault(); }}\n            onMouseDown={(event) => { event.preventDefault(); }}>\n            {notFoundFilterLabel}\n          </li>\n        )}\n      </ul>\n    </div>\n  );\n});\n\nListBox.displayName = 'SelectListBox';\nexport { ListBox };\nexport type { SelectFieldListBoxProps };\n"],"mappings":";;;;;;;mCASM,IAAe,KACf,IAAU,GAAqD,GAAO,MAAQ;CAClF,IAAM,EAAE,aAAU,qBAAkB,GAAG,MAAS,GAC1C,EACJ,gBAAa,gBAAa,kBAAe,uBAAoB,wBAC7D,qBAAkB,gCAChB,GAAuB,EAErB,CAAC,GAAe,KAAoB,EAAwB,EAAE,CAAC,EAC/D,CAAC,GAAqB,KAA0B,EAAS,GAAM,EAC/D,IAAa,EAAyB,KAAK,EAC3C,IAA0B,KAAoB;AAkDpD,QAhDA,4BAA4B;EAC1B,IAAM,IAA2B,EAAW,SAAS,YAC/C,IAAsB,EAAW,SAAS,iBAC9C,mCACD,IAAI,EAAE;AAEP,IADsB,CAAC,EAAA,QAAE,QAAQ,EAAwB,IAAI,EAAA,QAAE,QAAQ,EAAmB,CACrD;GACrC,EAEF,QAAgB;EACd,IAAM,UAAuB;GAC3B,IAAM,IAAyB,EAAmB,SAAS,uBAAuB;AAClF,OAAI,GAAwB;IAC1B,IAAM,EAAE,QAAK,SAAM,UAAO,cAAW,GAC/B,IAAa,OAAO,eAAe,IAAM,IACzC,IAAa,GACb,IAAe,IAAa,KAAc,IAAa,GAEvD,IAAwB;KAC5B,MAAM,IAAO,OAAO;KACpB,UAAU;KACV,UAAU,KAAoB;KAC/B;AAUD,IARI,KACF,EAAO,SAAS,OAAO,cAAc,IAAM,OAAO,SAClD,EAAO,YAAY,KAAK,IAAI,GAAY,EAAW,KAEnD,EAAO,MAAM,IAAM,IAAS,OAAO,SACnC,EAAO,YAAY,KAAK,IAAI,GAAY,EAAW,GAGrD,EAAiB,EAAO;;;AAU5B,SANI,MACF,GAAgB,EAChB,OAAO,iBAAiB,UAAU,EAAe,EACjD,OAAO,iBAAiB,UAAU,GAAgB,GAAK,SAG5C;AAEX,GADA,OAAO,oBAAoB,UAAU,EAAe,EACpD,OAAO,oBAAoB,UAAU,GAAgB,GAAK;;IAE3D;EAAC;EAAa;EAAa;EAAmB,CAAC,EAGhD,kBAAC,OAAD;EACO;EACL,OAAO;EACP,iBAAe;EACf,WAAU;EACV,eAAY;EACZ,2BAAyB;EACzB,GAAI;YAPN,CAQG,KAA4B,kBAAC,GAAD,EAAU,CAAA,EACvC,kBAAC,MAAD;GACE,IAAI;GACJ,MAAK;GACL,KAAK;aAHP,CAIG,GACA,KACC,kBAAC,MAAD;IACE,UAAU;IACV,iBAAe;IACf,cAAY;IAGZ,MAAK;IACL,IAAG;IACH,WAAU;IACV,UAAU,MAAU;AAAE,OAAM,gBAAgB;;IAC5C,cAAc,MAAU;AAAE,OAAM,gBAAgB;;cAC/C;IACE,EARC,mBAQD,CAAA;;;EAKb;AAEF,EAAQ,cAAc"}

package/lib/inputs2/selectfield/options.d.ts

@@ -0,0 +1,8 @@
+import { ComponentProps, ReactNode } from 'react';
+interface OptionsProps extends ComponentProps<'div'> {
+    children: ReactNode;
+    disabled?: boolean;
+}
+declare const Options: import('react').ForwardRefExoticComponent<Omit<OptionsProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+export { Options };
+export type { OptionsProps };

package/lib/inputs2/selectfield/options.js

@@ -0,0 +1,20 @@
+import '../../assets/styles/slot.css';/* empty css                       */
+import { forwardRef as e } from "react";
+import { jsx as t } from "react/jsx-runtime";
+//#region src/lib/inputs2/selectfield/options.tsx
+var n = e((e, n) => {
+	let { children: r, ...i } = e;
+	return /* @__PURE__ */ t("div", {
+		ref: n,
+		className: "field-slot",
+		"aria-disabled": e["aria-disabled"],
+		"data-state-disabled": e.disabled,
+		...i,
+		children: r
+	});
+});
+n.displayName = "OptionsSlot";
+//#endregion
+export { n as Options };
+
+//# sourceMappingURL=options.js.map

package/lib/inputs2/selectfield/options.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"options.js","names":[],"sources":["../../../src/lib/inputs2/selectfield/options.tsx"],"sourcesContent":["import { ComponentProps, forwardRef, ReactNode } from 'react';\nimport '../../assets/styles/slot.scss';\n\ninterface OptionsProps extends ComponentProps<'div'> {\n  children: ReactNode;\n  disabled?: boolean;\n}\n\nconst Options = forwardRef<HTMLDivElement, OptionsProps>((props, ref) => {\n  const { children, ...rest } = props;\n\n  return (\n    <div\n      ref={ref}\n      className=\"field-slot\"\n      aria-disabled={props['aria-disabled']}\n      data-state-disabled={props.disabled}\n      {...rest}>\n      {children}\n    </div>\n  );\n});\n\nOptions.displayName = 'OptionsSlot';\n\nexport { Options };\nexport type { OptionsProps };\n"],"mappings":";;;;AAQA,IAAM,IAAU,GAA0C,GAAO,MAAQ;CACvE,IAAM,EAAE,aAAU,GAAG,MAAS;AAE9B,QACE,kBAAC,OAAD;EACO;EACL,WAAU;EACV,iBAAe,EAAM;EACrB,uBAAqB,EAAM;EAC3B,GAAI;EACH;EACG,CAAA;EAER;AAEF,EAAQ,cAAc"}

package/lib/inputs2/selectfield/search.d.ts

@@ -0,0 +1,6 @@
+import { ComponentProps } from 'react';
+interface SelectFieldSearchProps extends ComponentProps<'div'> {
+}
+declare const Search: import('react').ForwardRefExoticComponent<Omit<SelectFieldSearchProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+export { Search };
+export type { SelectFieldSearchProps };

package/lib/inputs2/selectfield/search.js

@@ -0,0 +1,51 @@
+import e from "../../icons/index.js";
+import { RightSlot as t } from "../slot/index.js";
+import { Input as n } from "../textfield/index.js";
+import { useSelectFieldContext as r } from "./context.js";
+import { setFocusOnOffsetElement as i } from "./helpers.js";
+import { forwardRef as a } from "react";
+import { jsx as o } from "react/jsx-runtime";
+//#region src/lib/inputs2/selectfield/search.tsx
+var s = a((a, s) => {
+	let { ...c } = a, { nameSelect: l, handleOnSearch: u, handleOnKeyDown: d, selectSearchInputRef: f, selectInputRef: p, handleCloseListBox: m, searchInputPlaceholder: h } = r(), g = (e) => {
+		u?.(e);
+	}, _ = () => {
+		m();
+	}, v = (e) => {
+		if (e.key && e.key === "Tab") {
+			let t = p.current;
+			e.key === "Tab" && i(t, "next"), e.shiftKey && i(t, "before");
+		}
+		d?.(e);
+	};
+	return /* @__PURE__ */ o("div", {
+		ref: s,
+		className: "select-field-search",
+		...c,
+		children: /* @__PURE__ */ o(n, {
+			"data-testid": "test-select-field-search-input",
+			autoComplete: "off",
+			ref: f,
+			name: String(l).concat("-select-field-search"),
+			tabIndex: 0,
+			placeholder: h,
+			customClassWrapper: "select-field-search-input",
+			onBlur: _,
+			onChange: g,
+			onKeyDown: v,
+			children: /* @__PURE__ */ o(t, {
+				style: { padding: "0px 6px 0px 3px" },
+				children: /* @__PURE__ */ o(e, {
+					size: 16,
+					name: "search",
+					colorStyle: "default"
+				})
+			})
+		})
+	});
+});
+s.displayName = "SelectFieldSearch";
+//#endregion
+export { s as Search };
+
+//# sourceMappingURL=search.js.map

package/lib/inputs2/selectfield/search.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"search.js","names":[],"sources":["../../../src/lib/inputs2/selectfield/search.tsx"],"sourcesContent":["import { ChangeEvent, ComponentProps, forwardRef, KeyboardEvent } from 'react';\nimport Icon from '../../icons';\nimport * as TextField from '../textfield';\nimport { RightSlot } from '../slot';\nimport { useSelectFieldContext } from './context';\nimport { setFocusOnOffsetElement } from './helpers';\n\ninterface SelectFieldSearchProps extends ComponentProps<'div'> { }\n\nconst Search = forwardRef<HTMLDivElement, SelectFieldSearchProps>((props, ref) => {\n  const { ...rest } = props;\n  const {\n    nameSelect, handleOnSearch, handleOnKeyDown, selectSearchInputRef, selectInputRef,\n    handleCloseListBox,\n    searchInputPlaceholder,\n  } = useSelectFieldContext();\n\n  const handleOnChangeSearchInput = (event: ChangeEvent<HTMLInputElement>) => {\n    handleOnSearch?.(event);\n  };\n\n  const handleOnBlur = () => {\n    handleCloseListBox();\n  };\n\n  const handleOnKeyDownSearchInput = (event: KeyboardEvent<HTMLInputElement>) => {\n    if (event.key && event.key === 'Tab') {\n      const inputElement = selectInputRef.current!;\n      if (event.key === 'Tab') {\n        setFocusOnOffsetElement(inputElement, 'next');\n      }\n      if (event.shiftKey) {\n        setFocusOnOffsetElement(inputElement, 'before');\n      }\n    }\n    handleOnKeyDown?.(event);\n  };\n\n  return (\n    <div ref={ref} className=\"select-field-search\" {...rest}>\n      <TextField.Input\n        data-testid=\"test-select-field-search-input\"\n        autoComplete=\"off\"\n        ref={selectSearchInputRef}\n        name={String(nameSelect).concat('-select-field-search')}\n        tabIndex={0}\n        placeholder={searchInputPlaceholder}\n        customClassWrapper=\"select-field-search-input\"\n        onBlur={handleOnBlur}\n        onChange={handleOnChangeSearchInput}\n        onKeyDown={handleOnKeyDownSearchInput}>\n        <RightSlot style={{ padding: '0px 6px 0px 3px' }}>\n          <Icon\n            size={16}\n            name=\"search\"\n            colorStyle=\"default\" />\n        </RightSlot>\n      </TextField.Input>\n    </div>\n  );\n});\n\nSearch.displayName = 'SelectFieldSearch';\nexport { Search };\nexport type { SelectFieldSearchProps };\n"],"mappings":";;;;;;;;AASA,IAAM,IAAS,GAAoD,GAAO,MAAQ;CAChF,IAAM,EAAE,GAAG,MAAS,GACd,EACJ,eAAY,mBAAgB,oBAAiB,yBAAsB,mBACnE,uBACA,8BACE,GAAuB,EAErB,KAA6B,MAAyC;AAC1E,MAAiB,EAAM;IAGnB,UAAqB;AACzB,KAAoB;IAGhB,KAA8B,MAA2C;AAC7E,MAAI,EAAM,OAAO,EAAM,QAAQ,OAAO;GACpC,IAAM,IAAe,EAAe;AAIpC,GAHI,EAAM,QAAQ,SAChB,EAAwB,GAAc,OAAO,EAE3C,EAAM,YACR,EAAwB,GAAc,SAAS;;AAGnD,MAAkB,EAAM;;AAG1B,QACE,kBAAC,OAAD;EAAU;EAAK,WAAU;EAAsB,GAAI;YACjD,kBAAC,GAAD;GACE,eAAY;GACZ,cAAa;GACb,KAAK;GACL,MAAM,OAAO,EAAW,CAAC,OAAO,uBAAuB;GACvD,UAAU;GACV,aAAa;GACb,oBAAmB;GACnB,QAAQ;GACR,UAAU;GACV,WAAW;aACX,kBAAC,GAAD;IAAW,OAAO,EAAE,SAAS,mBAAmB;cAC9C,kBAAC,GAAD;KACE,MAAM;KACN,MAAK;KACL,YAAW;KAAY,CAAA;IACf,CAAA;GACI,CAAA;EACd,CAAA;EAER;AAEF,EAAO,cAAc"}

package/lib/inputs2/selectfield/selections.d.ts

@@ -0,0 +1,9 @@
+import { ComponentProps } from 'react';
+interface SelectFieldSelectionsProps extends ComponentProps<'div'> {
+    isDisabled: boolean;
+    isReadOnly: boolean;
+    listOfOptionsToSelect: Map<string, string>;
+}
+declare const Selections: import('react').ForwardRefExoticComponent<Omit<SelectFieldSelectionsProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+export { Selections };
+export type { SelectFieldSelectionsProps };

package/lib/inputs2/selectfield/selections.js

@@ -0,0 +1,62 @@
+import e from "../../icons/index.js";
+import { useSelectFieldContext as t } from "./context.js";
+import { forwardRef as n } from "react";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region src/lib/inputs2/selectfield/selections.tsx
+var a = (t) => {
+	let { isDisabled: n, isReadOnly: a, value: o, label: s, removeItemSelected: c, ...l } = t;
+	return /* @__PURE__ */ i("span", {
+		id: o,
+		title: s,
+		className: "selected",
+		"data-state-disabled": n,
+		"data-state-read-only": a,
+		...l,
+		children: [/* @__PURE__ */ r("p", {
+			className: "label",
+			children: s
+		}), /* @__PURE__ */ r("button", {
+			type: "button",
+			disabled: n,
+			"data-state-read-only": a,
+			tabIndex: -1,
+			className: "remove",
+			title: "Remover",
+			onClick: c,
+			onMouseDown: (e) => {
+				e.preventDefault();
+			},
+			children: /* @__PURE__ */ r(e, { name: "cancel2" })
+		})]
+	});
+}, o = n((e, n) => {
+	let { isDisabled: i, isReadOnly: o, listOfOptionsToSelect: s, ...c } = e, { valueSelect: l, isMultipleDefault: u, handleOnChange: d } = t(), f = !![...l]?.length, p = (e, t) => {
+		d?.(e, t, !0);
+	};
+	return f ? /* @__PURE__ */ r("div", {
+		ref: n,
+		className: "selections",
+		"data-testid": "test-select-field-input-selections",
+		"aria-disabled": i,
+		"aria-readonly": o,
+		"data-state-multiple-selections": u,
+		...c,
+		children: [...l].map((e) => {
+			let t = s.get(e);
+			return /* @__PURE__ */ r(a, {
+				value: e,
+				label: t,
+				isDisabled: i,
+				isReadOnly: o,
+				removeItemSelected: () => {
+					p(e, t);
+				}
+			}, e);
+		})
+	}) : null;
+});
+o.displayName = "SelectFieldSelections";
+//#endregion
+export { o as Selections };
+
+//# sourceMappingURL=selections.js.map

package/lib/inputs2/selectfield/selections.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"selections.js","names":[],"sources":["../../../src/lib/inputs2/selectfield/selections.tsx"],"sourcesContent":["import { ComponentProps, forwardRef } from 'react';\nimport Icon from '../../icons';\nimport { useSelectFieldContext } from './context';\n\ninterface SelectFieldItemSelectedProps extends ComponentProps<'span'> {\n  isDisabled: boolean;\n  isReadOnly: boolean;\n  value?: any;\n  label?: string;\n  removeItemSelected: () => void;\n}\n\nconst ItemSelected = (props: SelectFieldItemSelectedProps) => {\n  const { isDisabled, isReadOnly, value, label, removeItemSelected, ...rest } = props;\n\n  return (\n    <span\n      id={value}\n      title={label}\n      className=\"selected\"\n      data-state-disabled={isDisabled}\n      data-state-read-only={isReadOnly}\n      {...rest}>\n      <p className=\"label\">{label}</p>\n      <button\n        type=\"button\"\n        disabled={isDisabled}\n        data-state-read-only={isReadOnly}\n        tabIndex={-1}\n        className=\"remove\"\n        title=\"Remover\"\n        onClick={removeItemSelected}\n        onMouseDown={(event) => { event.preventDefault(); }}>\n        <Icon name=\"cancel2\" />\n      </button>\n    </span>\n  );\n};\n\ninterface SelectFieldSelectionsProps extends ComponentProps<'div'> {\n  isDisabled: boolean;\n  isReadOnly: boolean;\n  listOfOptionsToSelect: Map<string, string>;\n}\n\nconst Selections = forwardRef<HTMLDivElement, SelectFieldSelectionsProps>((props, ref) => {\n  const { isDisabled, isReadOnly, listOfOptionsToSelect, ...rest } = props;\n  const { valueSelect, isMultipleDefault, handleOnChange } = useSelectFieldContext();\n  const hasValuesSelected = Boolean([...valueSelect]?.length);\n\n  const handleRemoveItemSelected = (value: any, label: string) => {\n    handleOnChange?.(value, label, true);\n  };\n\n  if (!hasValuesSelected) return null;\n  return (\n    <div\n      ref={ref}\n      className=\"selections\"\n      data-testid=\"test-select-field-input-selections\"\n      aria-disabled={isDisabled}\n      aria-readonly={isReadOnly}\n      data-state-multiple-selections={isMultipleDefault}\n      {...rest}>\n      {[...valueSelect].map((value) => {\n        const label = listOfOptionsToSelect.get(value)!;\n        return (\n          <ItemSelected\n            key={value}\n            value={value}\n            label={label}\n            isDisabled={isDisabled}\n            isReadOnly={isReadOnly}\n            removeItemSelected={() => { handleRemoveItemSelected(value, label); }} />\n        );\n      })}\n    </div>\n  );\n});\n\nSelections.displayName = 'SelectFieldSelections';\nexport { Selections };\nexport type { SelectFieldSelectionsProps };\n"],"mappings":";;;;;AAYA,IAAM,KAAgB,MAAwC;CAC5D,IAAM,EAAE,eAAY,eAAY,UAAO,UAAO,uBAAoB,GAAG,MAAS;AAE9E,QACE,kBAAC,QAAD;EACE,IAAI;EACJ,OAAO;EACP,WAAU;EACV,uBAAqB;EACrB,wBAAsB;EACtB,GAAI;YANN,CAOE,kBAAC,KAAD;GAAG,WAAU;aAAS;GAAU,CAAA,EAChC,kBAAC,UAAD;GACE,MAAK;GACL,UAAU;GACV,wBAAsB;GACtB,UAAU;GACV,WAAU;GACV,OAAM;GACN,SAAS;GACT,cAAc,MAAU;AAAE,MAAM,gBAAgB;;aAChD,kBAAC,GAAD,EAAM,MAAK,WAAY,CAAA;GAChB,CAAA,CAAA;;GAWT,IAAa,GAAwD,GAAO,MAAQ;CACxF,IAAM,EAAE,eAAY,eAAY,0BAAuB,GAAG,MAAS,GAC7D,EAAE,gBAAa,sBAAmB,sBAAmB,GAAuB,EAC5E,IAAoB,EAAQ,CAAC,GAAG,EAAY,EAAE,QAE9C,KAA4B,GAAY,MAAkB;AAC9D,MAAiB,GAAO,GAAO,GAAK;;AAItC,QADK,IAEH,kBAAC,OAAD;EACO;EACL,WAAU;EACV,eAAY;EACZ,iBAAe;EACf,iBAAe;EACf,kCAAgC;EAChC,GAAI;YACH,CAAC,GAAG,EAAY,CAAC,KAAK,MAAU;GAC/B,IAAM,IAAQ,EAAsB,IAAI,EAAM;AAC9C,UACE,kBAAC,GAAD;IAES,OAAA;IACA,OAAA;IACK;IACA;IACZ,0BAA0B;AAAE,OAAyB,GAAO,EAAM;;IAAO,EALpE,EAKoE;;EAG3E,CAAA,GAtBuB;EAwB/B;AAEF,EAAW,cAAc"}

package/lib/inputs2/selectfield/simple.d.ts

@@ -0,0 +1,9 @@
+import { SelectFieldInputProps } from './types';
+interface SimpleSelectFieldProps extends SelectFieldInputProps {
+    dataSource: Array<Record<string, any>>;
+    idKey: string;
+    descriptionKey: string;
+}
+declare const Simple: import('react').ForwardRefExoticComponent<SimpleSelectFieldProps & import('react').RefAttributes<HTMLInputElement>>;
+export { Simple };
+export type { SimpleSelectFieldProps };

package/lib/inputs2/selectfield/simple.js

@@ -0,0 +1,22 @@
+import { Item as e } from "./item.js";
+import { Input as t } from "./index.js";
+import { forwardRef as n } from "react";
+import { jsx as r } from "react/jsx-runtime";
+//#region src/lib/inputs2/selectfield/simple.tsx
+var i = n((n, i) => {
+	let { idKey: a, descriptionKey: o, dataSource: s, ...c } = n;
+	return /* @__PURE__ */ r(t, {
+		...c,
+		ref: i,
+		children: s?.map((t) => /* @__PURE__ */ r(e, {
+			value: t[a],
+			label: t[o],
+			children: t[o]
+		}, t[a]))
+	});
+});
+i.displayName = "SimpleSelectFieldInput";
+//#endregion
+export { i as Simple };
+
+//# sourceMappingURL=simple.js.map

package/lib/inputs2/selectfield/simple.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"simple.js","names":[],"sources":["../../../src/lib/inputs2/selectfield/simple.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\nimport { Input, Item } from \".\";\nimport type { SelectFieldInputProps } from \"./types\";\n\ninterface SimpleSelectFieldProps extends SelectFieldInputProps {\n  dataSource: Array<Record<string, any>>;\n  idKey: string;\n  descriptionKey: string;\n}\n\nconst Simple = forwardRef<HTMLInputElement, SimpleSelectFieldProps>(\n  (props, ref) => {\n    const { idKey, descriptionKey, dataSource, ...rest } = props;\n\n    return (\n      <Input {...rest} ref={ref}>\n        {dataSource?.map(item => (\n          <Item key={item[idKey]} value={item[idKey]} label={item[descriptionKey]}>\n            {item[descriptionKey]}\n          </Item>\n        ))}\n      </Input>\n    );\n  },\n);\n\nSimple.displayName = 'SimpleSelectFieldInput';\nexport { Simple };\nexport type { SimpleSelectFieldProps };\n"],"mappings":";;;;;AAUA,IAAM,IAAS,GACZ,GAAO,MAAQ;CACd,IAAM,EAAE,UAAO,mBAAgB,eAAY,GAAG,MAAS;AAEvD,QACE,kBAAC,GAAD;EAAO,GAAI;EAAW;YACnB,GAAY,KAAI,MACf,kBAAC,GAAD;GAAwB,OAAO,EAAK;GAAQ,OAAO,EAAK;aACrD,EAAK;GACD,EAFI,EAAK,GAET,CAAA;EAEH,CAAA;EAGb;AAED,EAAO,cAAc"}

package/lib/inputs2/selectfield/triggers.d.ts

@@ -0,0 +1,8 @@
+interface SelectFieldTriggersProps {
+}
+declare const Triggers: {
+    (): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { Triggers };
+export type { SelectFieldTriggersProps };

package/lib/inputs2/selectfield/triggers.js

@@ -0,0 +1,110 @@
+import { require_compiler_runtime as e } from "../../node_modules/react/compiler-runtime.js";
+import t from "../../icons/index.js";
+import n from "../../buttons/index.js";
+import r from "../../list/Item.js";
+import i from "../../list/index.js";
+import { useSelectFieldContext as a } from "./context.js";
+import { Fragment as o } from "react";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+//#region src/lib/inputs2/selectfield/triggers.tsx
+var l = e(), u = () => {
+	let e = (0, l.c)(17), { isDisabled: u, selectFieldId: g, listBoxOpen: _, showClearButton: v, dropdownAlignButton: y, handleClearValue: b, handleChangeListBoxState: x, handleCheckMultiple: S, optionItens: C, isMultipleSelect: w, isMultipleWithCheckboxes: T } = a(), E = !!C?.length, D = !w && E || T, O;
+	if (e[0] !== y || e[1] !== x || e[2] !== S || e[3] !== b || e[4] !== D || e[5] !== E || e[6] !== u || e[7] !== T || e[8] !== _ || e[9] !== C || e[10] !== g || e[11] !== v) {
+		let a;
+		e[13] === S ? a = e[14] : (a = () => {
+			S(!0);
+		}, e[13] = S, e[14] = a);
+		let l;
+		e[15] === S ? l = e[16] : (l = () => {
+			S(!1);
+		}, e[15] = S, e[16] = l), O = c(o, { children: [
+			s("button", {
+				"data-testid": "test-select-field-trigger-clear",
+				className: "clear",
+				type: "button",
+				title: "Limpar",
+				tabIndex: -1,
+				disabled: u,
+				"aria-disabled": u,
+				"aria-label": "Limpar",
+				"aria-controls": g,
+				onClick: b,
+				"data-state-visible": v,
+				onMouseDown: d,
+				children: s(t, { name: "cancel" })
+			}),
+			s(n, {
+				"data-testid": "test-select-field-trigger-options",
+				dropdown: !0,
+				transparent: !0,
+				boxShadow: !1,
+				showIconDropdown: !1,
+				visible: D,
+				type: "button",
+				title: "Opções",
+				tabIndex: -1,
+				disabled: u,
+				"aria-label": "Opções",
+				"aria-controls": g,
+				iconName: "more1",
+				dropdownAlign: y,
+				onMouseDown: f,
+				children: c(i, { children: [
+					s(r, {
+						visible: T,
+						itemId: "opcao-marcar-todos",
+						leftIconName: "checkboxChecked",
+						text: "Marcar Todos",
+						onMouseDown: p,
+						onClick: a
+					}),
+					s(r, {
+						visible: T,
+						itemId: "opcao-desmarcar-todos",
+						leftIconName: "checkboxUnchecked",
+						text: "Desmarcar Todos",
+						onMouseDown: m,
+						onClick: l
+					}),
+					s(o, { children: E && C })
+				] })
+			}),
+			s("button", {
+				"data-testid": "test-select-field-trigger-open-listbox",
+				className: "open-listbox",
+				type: "button",
+				title: _ ? "Fechar" : "Abrir",
+				tabIndex: -1,
+				disabled: u,
+				"aria-disabled": u,
+				"aria-label": _ ? "Fechar" : "Abrir",
+				"aria-expanded": _,
+				"aria-controls": g,
+				onClick: x,
+				onMouseDown: h,
+				children: s(t, { name: "mini_down" })
+			})
+		] }), e[0] = y, e[1] = x, e[2] = S, e[3] = b, e[4] = D, e[5] = E, e[6] = u, e[7] = T, e[8] = _, e[9] = C, e[10] = g, e[11] = v, e[12] = O;
+	} else O = e[12];
+	return O;
+};
+u.displayName = "SelectFieldTriggers";
+function d(e) {
+	e.preventDefault();
+}
+function f(e) {
+	e.preventDefault();
+}
+function p(e) {
+	e?.preventDefault?.();
+}
+function m(e) {
+	e?.preventDefault?.();
+}
+function h(e) {
+	e.preventDefault();
+}
+//#endregion
+export { u as Triggers };
+
+//# sourceMappingURL=triggers.js.map

package/lib/inputs2/selectfield/triggers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"triggers.js","names":[],"sources":["../../../src/lib/inputs2/selectfield/triggers.tsx"],"sourcesContent":["import { Fragment } from 'react';\nimport Icon from '../../icons';\nimport Button from '../../buttons';\nimport List, { ListItem } from '../../list';\nimport { useSelectFieldContext } from './context';\n\ninterface SelectFieldTriggersProps { }\n\nconst Triggers = () => {\n  const {\n    isDisabled, selectFieldId, listBoxOpen, showClearButton, dropdownAlignButton, handleClearValue,\n    handleChangeListBoxState, handleCheckMultiple, optionItens, isMultipleSelect, \n    isMultipleWithCheckboxes,\n  } = useSelectFieldContext();\n  const hasOptionsItens = Boolean(optionItens?.length);\n  const hasConditionToShowOptionsButton = (!isMultipleSelect && hasOptionsItens) \n    || isMultipleWithCheckboxes;\n\n  return (\n    <Fragment>\n      <button\n        data-testid=\"test-select-field-trigger-clear\"\n        className=\"clear\"\n        type=\"button\"\n        title=\"Limpar\"\n        tabIndex={-1}\n        disabled={isDisabled}\n        aria-disabled={isDisabled}\n        aria-label=\"Limpar\"\n        aria-controls={selectFieldId}\n        onClick={handleClearValue}\n        data-state-visible={showClearButton}\n        onMouseDown={(event) => { event.preventDefault(); }}>\n        <Icon name=\"cancel\" />\n      </button>\n      <Button\n        data-testid=\"test-select-field-trigger-options\"\n        dropdown\n        transparent\n        boxShadow={false}\n        showIconDropdown={false}\n        visible={hasConditionToShowOptionsButton}\n        type=\"button\"\n        title=\"Opções\"\n        tabIndex={-1}\n        disabled={isDisabled}\n        aria-label=\"Opções\"\n        aria-controls={selectFieldId}\n        iconName=\"more1\"\n        dropdownAlign={dropdownAlignButton}\n        onMouseDown={(event) => { event.preventDefault(); }}>\n        <List>\n          <ListItem\n            visible={isMultipleWithCheckboxes}\n            itemId=\"opcao-marcar-todos\"\n            leftIconName=\"checkboxChecked\"\n            text=\"Marcar Todos\"\n            onMouseDown={(event) => { event?.preventDefault?.(); }}\n            onClick={() => { handleCheckMultiple(true); }} />\n          <ListItem\n            visible={isMultipleWithCheckboxes}\n            itemId=\"opcao-desmarcar-todos\"\n            leftIconName=\"checkboxUnchecked\"\n            text=\"Desmarcar Todos\"\n            onMouseDown={(event) => { event?.preventDefault?.(); }}\n            onClick={() => { handleCheckMultiple(false); }} />\n          <Fragment>\n            {hasOptionsItens && optionItens}\n          </Fragment>\n        </List>\n      </Button>\n      <button\n        data-testid=\"test-select-field-trigger-open-listbox\"\n        className=\"open-listbox\"\n        type=\"button\"\n        title={!listBoxOpen ? 'Abrir' : 'Fechar'}\n        tabIndex={-1}\n        disabled={isDisabled}\n        aria-disabled={isDisabled}\n        aria-label={!listBoxOpen ? 'Abrir' : 'Fechar'}\n        aria-expanded={listBoxOpen}\n        aria-controls={selectFieldId}\n        onClick={handleChangeListBoxState}\n        onMouseDown={(event) => { event.preventDefault(); }}>\n        <Icon name=\"mini_down\" />\n      </button>\n    </Fragment>\n  );\n};\n\nTriggers.displayName = 'SelectFieldTriggers';\nexport { Triggers };\nexport type { SelectFieldTriggersProps };\n"],"mappings":";;;;;;;;;aAQM,UAAA;CAAA,IAAA,KAAA,GAAA,EAAA,GAAA,GAAA,EACJ,EAAA,eAAA,kBAAA,gBAAA,oBAAA,wBAAA,qBAAA,6BAAA,wBAAA,gBAAA,qBAAA,gCAII,GAAuB,EAC3B,IAAwB,EAAQ,GAAA,QAChC,IAAyC,CAAC,KAAD,KAAA,GACpC;AAAA,KAAA,EAAA,OAAA,KAAA,EAAA,OAAA,KAAA,EAAA,OAAA,KAAA,EAAA,OAAA,KAAA,EAAA,OAAA,KAAA,EAAA,OAAA,KAAA,EAAA,OAAA,KAAA,EAAA,OAAA,KAAA,EAAA,OAAA,KAAA,EAAA,OAAA,KAAA,EAAA,QAAA,KAAA,EAAA,QAAA,GAAA;EAAA,IAAA;AAAA,EAAA,EAAA,QAAA,iBA0CK,UAAA;AAAiB,KAAoB,GAAK;;;AA4BvC,6BArBH,UAAA;AAAiB,KAAoB,GAAM;4BA9CnD,IAAA,EAAC,GAAD,EAAA,UAAA;GACE,EAAC,UAAD;IAAA,eACc;IAAA,WACF;IAAA,MACL;IAAA,OACC;IAAA,UACI;IAAC,UACD;IAAA,iBACK;IAAA,cACJ;IAAA,iBACI;IAAA,SACN;IAAA,sBACW;IAAA,aACpB;cACA,EAAC,GAAD,EAAA,MAAW,UAAW,CAAA;IACf,CAAA;GACT,EAAC,GAAD;IAAA,eACc;IAAA,UACZ;IAAA,aACA;IAAA,WACW;IAAA,kBACO;IAAA,SACT;IAAA,MACJ;IAAA,OACC;IAAA,UACI;IAAC,UACD;IAAA,cACC;IAAA,iBACI;IAAA,UACN;IAAA,eACM;IAAA,aACf;cACA,EAAC,GAAD,EAAA,UAAA;KACE,EAAC,GAAD;MAAA,SACW;MAAA,QACF;MAAA,cACM;MAAA,MACR;MAAA,aACL;eACA;MAAiD,CAAA;KACnD,EAAC,GAAD;MAAA,SACW;MAAA,QACF;MAAA,cACM;MAAA,MACR;MAAA,aACL;eACA;MAAkD,CAAA;KACpD,EAAC,GAAD,EAAA,UACG,KAAA,GACQ,CAAA;KAAA,EACN,CAAA;IACA,CAAA;GACT,EAAC,UAAD;IAAA,eACc;IAAA,WACF;IAAA,MACL;IAAA,OACG,IAAD,WAAA;IAAyB,UACtB;IAAC,UACD;IAAA,iBACK;IAAA,cACF,IAAD,WAAA;IAAyB,iBACtB;IAAA,iBACA;IAAA,SACN;IAAA,aACT;cACA,EAAC,GAAD,EAAA,MAAW,aAAc,CAAA;IAClB,CAAA;GAAA,EACA,CAAA,EAAA,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,KAAA,GAAA,EAAA,MAAA,GAAA,EAAA,MAAA,GAAA,EAAA,MAAA;OAAA,KAAA,EAAA;AAAA,QAnEX;;AAuEJ,EAAS,cAAc;AAlFjB,SAAA,EAAA,GAAA;AAwB4B,GAAA,gBAAsB;;AAxBlD,SAAA,EAAA,GAAA;AA0C4B,GAAA,gBAAsB;;AA1ClD,SAAA,EAAA,GAAA;AAiDgC,IAAA,kBAAyB;;AAjDzD,SAAA,EAAA,GAAA;AAwDgC,IAAA,kBAAyB;;AAxDzD,SAAA,EAAA,GAAA;AA2E4B,GAAA,gBAAsB"}

package/lib/inputs2/selectfield/types.d.ts

@@ -0,0 +1,55 @@
+import { ChangeEvent, ComponentPropsWithoutRef } from 'react';
+import { TextAlign } from '../../@types/Align';
+import { ColorTheme } from '../../@types/ColorStyles';
+import { ITooltipCommonProps } from '../../tooltip/types';
+import { Position, HintPosition } from '../../@types/Position';
+import { OnDenied, PermissionAttr } from '../../@types/PermissionAttr';
+export declare enum MultipleVariantEnum {
+    default = "default",
+    checkboxes = "checkboxes"
+}
+export declare enum Keys {
+    escape = "Escape",
+    arrowDown = "ArrowDown",
+    arrowUp = "ArrowUp",
+    enter = "Enter",
+    backspace = "Backspace",
+    delete = "Delete",
+    spaceBar = " "
+}
+type InputHTMLProps = Omit<ComponentPropsWithoutRef<'input'>, 'multiple' | 'type'>;
+export interface SelectFieldInputProps extends SelectFieldInputBaseProps {
+    gridLayout?: string;
+    permissionAttr?: PermissionAttr;
+    onDeniedActions?: OnDenied;
+}
+export interface SelectFieldInputBaseProps extends InputHTMLProps, ITooltipCommonProps {
+    skeletonize?: boolean;
+    undigitable?: boolean;
+    externalSearch?: boolean;
+    showClearButton?: boolean;
+    searchOnDropdown?: boolean;
+    openDropdownOnFocus?: boolean;
+    value?: any;
+    label?: string;
+    errors?: string[];
+    striped?: boolean;
+    hint?: string;
+    notFoundFilterLabel?: string;
+    customClass?: string;
+    customClassLabel?: string;
+    customClassWrapper?: string;
+    searchInputPlaceholder?: string;
+    customClassInputContainer?: string;
+    multipleInputLabelEmpty?: string;
+    multipleInputLabelManySelection?: string;
+    textAlign?: TextAlign;
+    hintPosition?: HintPosition;
+    themePopover?: ColorTheme;
+    popoverAlign?: Extract<Position, 'left' | 'right'>;
+    dropdownAlignButton?: Extract<Position, 'left' | 'right'>;
+    onSearch?: (event?: ChangeEvent<HTMLInputElement>) => void;
+    multiple?: keyof typeof MultipleVariantEnum;
+    dropdownMaxWidth?: number;
+}
+export {};

package/lib/inputs2/selectfield/types.js

@@ -0,0 +1,10 @@
+//#region src/lib/inputs2/selectfield/types.ts
+var e = /* @__PURE__ */ function(e) {
+	return e.default = "default", e.checkboxes = "checkboxes", e;
+}({}), t = /* @__PURE__ */ function(e) {
+	return e.escape = "Escape", e.arrowDown = "ArrowDown", e.arrowUp = "ArrowUp", e.enter = "Enter", e.backspace = "Backspace", e.delete = "Delete", e.spaceBar = " ", e;
+}({});
+//#endregion
+export { t as Keys, e as MultipleVariantEnum };
+
+//# sourceMappingURL=types.js.map

package/lib/inputs2/selectfield/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","names":[],"sources":["../../../src/lib/inputs2/selectfield/types.ts"],"sourcesContent":["import { ChangeEvent, type ComponentPropsWithoutRef } from 'react';\nimport type { TextAlign } from '../../@types/Align';\nimport type { ColorTheme } from '../../@types/ColorStyles';\nimport type { ITooltipCommonProps } from '../../tooltip/types';\nimport type { Position, HintPosition } from '../../@types/Position';\nimport type { OnDenied, PermissionAttr } from '../../@types/PermissionAttr';\n\nexport enum MultipleVariantEnum { default = 'default', checkboxes = 'checkboxes' }\nexport enum Keys {\n  escape = 'Escape',\n  arrowDown = 'ArrowDown',\n  arrowUp = 'ArrowUp',\n  enter = 'Enter',\n  backspace = 'Backspace',\n  delete = 'Delete',\n  spaceBar = ' '\n}\ntype InputHTMLProps = Omit<ComponentPropsWithoutRef<'input'>, 'multiple' | 'type'>;\n\nexport interface SelectFieldInputProps extends SelectFieldInputBaseProps {\n  gridLayout?: string;\n  permissionAttr?: PermissionAttr;\n  onDeniedActions?: OnDenied;\n}\n\nexport interface SelectFieldInputBaseProps extends InputHTMLProps, ITooltipCommonProps {\n  skeletonize?: boolean;\n  undigitable?: boolean;\n  externalSearch?: boolean;\n  showClearButton?: boolean;\n  searchOnDropdown?: boolean;\n  openDropdownOnFocus?: boolean;\n  value?: any;\n  label?: string;\n  errors?: string[];\n  striped?: boolean;\n  hint?: string;\n  notFoundFilterLabel?: string;\n  customClass?: string;\n  customClassLabel?: string;\n  customClassWrapper?: string;\n  searchInputPlaceholder?: string;\n  customClassInputContainer?: string;\n  multipleInputLabelEmpty?: string;\n  multipleInputLabelManySelection?: string;\n  textAlign?: TextAlign;\n  hintPosition?: HintPosition;\n  themePopover?: ColorTheme;\n  popoverAlign?: Extract<Position, 'left' | 'right'>;\n  dropdownAlignButton?: Extract<Position, 'left' | 'right'>;\n  onSearch?: (event?: ChangeEvent<HTMLInputElement>) => void;\n  multiple?: keyof typeof MultipleVariantEnum;\n  dropdownMaxWidth?: number;\n}\n"],"mappings":";AAOA,IAAY,IAAL,yBAAA,GAAA;QAA2B,EAAA,UAAA,WAAqB,EAAA,aAAA;KAA2B,EACtE,IAAL,yBAAA,GAAA;QACL,EAAA,SAAA,UACA,EAAA,YAAA,aACA,EAAA,UAAA,WACA,EAAA,QAAA,SACA,EAAA,YAAA,aACA,EAAA,SAAA,UACA,EAAA,WAAA;KACD"}

package/lib/inputs2/slot/index.d.ts

@@ -0,0 +1,17 @@
+import { ComponentProps, ReactNode } from 'react';
+declare enum SlotPosition {
+    left = "left",
+    right = "right"
+}
+interface SlotProps extends ComponentProps<'div'> {
+    children: ReactNode;
+    disabled?: boolean;
+}
+declare const LeftSlot: import('react').ForwardRefExoticComponent<Omit<SlotProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+declare const RightSlot: import('react').ForwardRefExoticComponent<Omit<SlotProps, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
+declare const getSlotsElements: (children: ReactNode, isDisabled: boolean) => {
+    leftSlotElements: ReactNode[];
+    rightSlotElements: ReactNode[];
+};
+export { LeftSlot, RightSlot, getSlotsElements };
+export type { SlotProps, SlotPosition };

package/lib/inputs2/slot/index.js

@@ -0,0 +1,52 @@
+import '../../assets/styles/slot.css';/* empty css                       */
+import { Children as e, cloneElement as t, forwardRef as n, isValidElement as r } from "react";
+import { jsx as i } from "react/jsx-runtime";
+//#region src/lib/inputs2/slot/index.tsx
+var a = /* @__PURE__ */ function(e) {
+	return e.left = "left", e.right = "right", e;
+}(a || {}), o = n((e, t) => {
+	let { children: n, ...r } = e;
+	return /* @__PURE__ */ i("div", {
+		ref: t,
+		className: "field-slot",
+		"aria-disabled": e["aria-disabled"],
+		"data-state-disabled": e.disabled,
+		"data-state-position": a.left,
+		...r,
+		children: n
+	});
+});
+o.displayName = "LeftSlot";
+var s = n((e, t) => {
+	let { children: n, ...r } = e;
+	return /* @__PURE__ */ i("div", {
+		ref: t,
+		className: "field-slot",
+		"aria-disabled": e["aria-disabled"],
+		"data-state-disabled": e.disabled,
+		"data-state-position": a.right,
+		...r,
+		children: n
+	});
+});
+s.displayName = "RightSlot";
+var c = (n, i) => {
+	let a = [], c = [];
+	return e.forEach(n, (e, n) => {
+		if (r(e)) {
+			let r = t(e, {
+				key: e.key ?? `slot-${n}`,
+				disabled: i,
+				"aria-disabled": i
+			});
+			e.type === o && a.push(r), e.type === s && c.push(r);
+		}
+	}), {
+		leftSlotElements: a,
+		rightSlotElements: c
+	};
+};
+//#endregion
+export { o as LeftSlot, s as RightSlot, c as getSlotsElements };
+
+//# sourceMappingURL=index.js.map

package/lib/inputs2/slot/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/lib/inputs2/slot/index.tsx"],"sourcesContent":["import { Children, cloneElement, ComponentProps, forwardRef, isValidElement, ReactNode } from 'react';\nimport '../../assets/styles/slot.scss';\n\nenum SlotPosition { left = 'left', right = 'right' }\ninterface SlotProps extends ComponentProps<'div'> {\n  children: ReactNode;\n  disabled?: boolean;\n}\n\nconst LeftSlot = forwardRef<HTMLDivElement, SlotProps>((props, ref) => {\n  const { children, ...rest } = props;\n\n  return (\n    <div\n      ref={ref}\n      className=\"field-slot\"\n      aria-disabled={props['aria-disabled']}\n      data-state-disabled={props.disabled}\n      data-state-position={SlotPosition.left}\n      {...rest}>\n      {children}\n    </div>\n  );\n});\n\nLeftSlot.displayName = 'LeftSlot';\n\nconst RightSlot = forwardRef<HTMLDivElement, SlotProps>((props, ref) => {\n  const { children, ...rest } = props;\n\n  return (\n    <div\n      ref={ref}\n      className=\"field-slot\"\n      aria-disabled={props['aria-disabled']}\n      data-state-disabled={props.disabled}\n      data-state-position={SlotPosition.right}\n      {...rest}>\n      {children}\n    </div>\n  );\n});\n\nRightSlot.displayName = 'RightSlot';\n\nconst getSlotsElements = (children: ReactNode, isDisabled: boolean) => {\n  const left: ReactNode[] = [];\n  const right: ReactNode[] = [];\n\n  Children.forEach(children, (childElement, index) => {\n    if (isValidElement<SlotProps>(childElement)) {\n      const clonedChild = cloneElement(childElement, {\n        key: childElement.key ?? `slot-${index}`,\n        disabled: isDisabled,\n        'aria-disabled': isDisabled,\n      });\n      if (childElement.type === LeftSlot) left.push(clonedChild);\n      if (childElement.type === RightSlot) right.push(clonedChild);\n    }\n  });\n\n  return { leftSlotElements: left, rightSlotElements: right };\n};\n\nexport { LeftSlot, RightSlot, getSlotsElements };\nexport type { SlotProps, SlotPosition };\n"],"mappings":";;;;AAGA,IAAK,IAAL,yBAAA,GAAA;QAAoB,EAAA,OAAA,QAAe,EAAA,QAAA;EAA9B,KAAA,EAAA,CAA+C,EAM9C,IAAW,GAAuC,GAAO,MAAQ;CACrE,IAAM,EAAE,aAAU,GAAG,MAAS;AAE9B,QACE,kBAAC,OAAD;EACO;EACL,WAAU;EACV,iBAAe,EAAM;EACrB,uBAAqB,EAAM;EAC3B,uBAAqB,EAAa;EAClC,GAAI;EACH;EACG,CAAA;EAER;AAEF,EAAS,cAAc;AAEvB,IAAM,IAAY,GAAuC,GAAO,MAAQ;CACtE,IAAM,EAAE,aAAU,GAAG,MAAS;AAE9B,QACE,kBAAC,OAAD;EACO;EACL,WAAU;EACV,iBAAe,EAAM;EACrB,uBAAqB,EAAM;EAC3B,uBAAqB,EAAa;EAClC,GAAI;EACH;EACG,CAAA;EAER;AAEF,EAAU,cAAc;AAExB,IAAM,KAAoB,GAAqB,MAAwB;CACrE,IAAM,IAAoB,EAAE,EACtB,IAAqB,EAAE;AAc7B,QAZA,EAAS,QAAQ,IAAW,GAAc,MAAU;AAClD,MAAI,EAA0B,EAAa,EAAE;GAC3C,IAAM,IAAc,EAAa,GAAc;IAC7C,KAAK,EAAa,OAAO,QAAQ;IACjC,UAAU;IACV,iBAAiB;IAClB,CAAC;AAEF,GADI,EAAa,SAAS,KAAU,EAAK,KAAK,EAAY,EACtD,EAAa,SAAS,KAAW,EAAM,KAAK,EAAY;;GAE9D,EAEK;EAAE,kBAAkB;EAAM,mBAAmB;EAAO"}

package/lib/inputs2/textareafield/base.d.ts

@@ -0,0 +1,23 @@
+import { default as React } from 'react';
+import { ITooltipCommonProps } from '../../tooltip/types';
+import { TextAlign } from '../../@types/Align';
+import { ColorTheme } from '../../@types/ColorStyles';
+import { Position, HintPosition } from '../../@types/Position';
+export interface TextAreaFieldInputBaseProps extends React.ComponentPropsWithoutRef<'textarea'>, ITooltipCommonProps {
+    hint?: string;
+    label?: string;
+    errors?: string[];
+    customClass?: string;
+    customClassLabel?: string;
+    customClassWrapper?: string;
+    customClassInputContainer?: string;
+    rounded?: boolean;
+    readOnly?: boolean;
+    skeletonize?: boolean;
+    labelUppercase?: boolean;
+    textAlign?: TextAlign;
+    hintPosition?: HintPosition;
+    themePopover?: ColorTheme;
+    popoverAlign?: Extract<Position, 'left' | 'right'>;
+}
+export declare const InputBase: React.ForwardRefExoticComponent<TextAreaFieldInputBaseProps & React.RefAttributes<HTMLTextAreaElement>>;