ui-library-sorin 0.0.2 → 0.0.3

package/dist/components/Autocomplete/Autocomplete.d.ts

@@ -0,0 +1,23 @@
+import { ReactElement } from 'react';
+export interface AutocompleteOption {
+    label: string;
+    value: string;
+}
+export interface AutocompleteProps {
+    label: string;
+    options: AutocompleteOption[];
+    value?: string;
+    defaultValue?: string;
+    onValueChange?: (value: string) => void;
+    filterType?: "contains" | "startsWith" | "endsWith";
+    limit?: number;
+    mode?: "list" | "both" | "inline" | "none";
+    icon?: ReactElement;
+    toggleIcon?: () => void;
+    className?: string;
+    error?: string;
+    hideError?: boolean;
+    disabled?: boolean;
+    name?: string;
+}
+export declare function Autocomplete({ label, options, filterType, limit, mode, icon, toggleIcon, className, error, hideError, ...props }: AutocompleteProps): import("react").JSX.Element;

package/dist/components/Autocomplete/Autocomplete2.cjs

@@ -0,0 +1 @@
+"use client";"use client";const e=require("../../assets/icons/ErrorIcon.cjs");;/* empty css               */let t=require("react/jsx-runtime"),n=require("@base-ui/react/autocomplete");function r({label:r,options:i,filterType:a=`contains`,limit:o,mode:s,icon:c,toggleIcon:l,className:u,error:d,hideError:f=!1,...p}){let{contains:m,startsWith:h,endsWith:g}=n.Autocomplete.useFilter(),_={contains:m,startsWith:h,endsWith:g}[a],v=[d?`ui-library-autocomplete--error`:``,c?`ui-library-autocomplete--has-icon`:``].filter(Boolean).join(` `);return(0,t.jsxs)(n.Autocomplete.Root,{items:i,filter:_,limit:o,mode:s,...p,children:[(0,t.jsxs)(`div`,{className:`ui-library-autocomplete ${u}`,children:[(0,t.jsxs)(`label`,{className:`ui-library-autocomplete__label ${v}`,children:[(0,t.jsx)(`span`,{className:`ui-library-autocomplete__span`,children:r}),(0,t.jsx)(n.Autocomplete.Input,{className:`ui-library-autocomplete__input`,"aria-invalid":!!d,placeholder:` `}),c&&(0,t.jsx)(`div`,{className:`ui-library-autocomplete__icon`,onClick:l,children:c})]}),!f&&(0,t.jsx)(`div`,{className:`ui-library-autocomplete__error`,children:d&&(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(`span`,{className:`ui-library-autocomplete__error-icon`,children:(0,t.jsx)(e.default,{})}),(0,t.jsx)(`span`,{className:`ui-library-autocomplete__error-text`,children:d})]})})]}),(0,t.jsx)(n.Autocomplete.Portal,{children:(0,t.jsx)(n.Autocomplete.Positioner,{className:`ui-library-autocomplete__positioner`,side:`bottom`,sideOffset:4,children:(0,t.jsxs)(n.Autocomplete.Popup,{className:`ui-library-autocomplete__popup`,children:[(0,t.jsx)(n.Autocomplete.Empty,{children:(0,t.jsx)(`div`,{className:`ui-library-autocomplete__empty`,children:`No hay resultados.`})}),(0,t.jsx)(n.Autocomplete.List,{className:`ui-library-autocomplete__list`,children:e=>(0,t.jsx)(n.Autocomplete.Item,{value:e,className:`ui-library-autocomplete__item`,children:e.label},e.value)})]})})})]})}exports.Autocomplete=r;

package/dist/components/Autocomplete/Autocomplete2.js

@@ -0,0 +1,72 @@
+"use client";
+"use client";
+import e from "../../assets/icons/ErrorIcon.js";
+/* empty css             */
+import { Fragment as t, jsx as n, jsxs as r } from "react/jsx-runtime";
+import { Autocomplete as i } from "@base-ui/react/autocomplete";
+//#region src/components/Autocomplete/Autocomplete.tsx
+function a({ label: a, options: o, filterType: s = "contains", limit: c, mode: l, icon: u, toggleIcon: d, className: f, error: p, hideError: m = !1, ...h }) {
+	let { contains: g, startsWith: _, endsWith: v } = i.useFilter(), y = {
+		contains: g,
+		startsWith: _,
+		endsWith: v
+	}[s], b = [p ? "ui-library-autocomplete--error" : "", u ? "ui-library-autocomplete--has-icon" : ""].filter(Boolean).join(" ");
+	return /* @__PURE__ */ r(i.Root, {
+		items: o,
+		filter: y,
+		limit: c,
+		mode: l,
+		...h,
+		children: [/* @__PURE__ */ r("div", {
+			className: `ui-library-autocomplete ${f}`,
+			children: [/* @__PURE__ */ r("label", {
+				className: `ui-library-autocomplete__label ${b}`,
+				children: [
+					/* @__PURE__ */ n("span", {
+						className: "ui-library-autocomplete__span",
+						children: a
+					}),
+					/* @__PURE__ */ n(i.Input, {
+						className: "ui-library-autocomplete__input",
+						"aria-invalid": !!p,
+						placeholder: " "
+					}),
+					u && /* @__PURE__ */ n("div", {
+						className: "ui-library-autocomplete__icon",
+						onClick: d,
+						children: u
+					})
+				]
+			}), !m && /* @__PURE__ */ n("div", {
+				className: "ui-library-autocomplete__error",
+				children: p && /* @__PURE__ */ r(t, { children: [/* @__PURE__ */ n("span", {
+					className: "ui-library-autocomplete__error-icon",
+					children: /* @__PURE__ */ n(e, {})
+				}), /* @__PURE__ */ n("span", {
+					className: "ui-library-autocomplete__error-text",
+					children: p
+				})] })
+			})]
+		}), /* @__PURE__ */ n(i.Portal, { children: /* @__PURE__ */ n(i.Positioner, {
+			className: "ui-library-autocomplete__positioner",
+			side: "bottom",
+			sideOffset: 4,
+			children: /* @__PURE__ */ r(i.Popup, {
+				className: "ui-library-autocomplete__popup",
+				children: [/* @__PURE__ */ n(i.Empty, { children: /* @__PURE__ */ n("div", {
+					className: "ui-library-autocomplete__empty",
+					children: "No hay resultados."
+				}) }), /* @__PURE__ */ n(i.List, {
+					className: "ui-library-autocomplete__list",
+					children: (e) => /* @__PURE__ */ n(i.Item, {
+						value: e,
+						className: "ui-library-autocomplete__item",
+						children: e.label
+					}, e.value)
+				})]
+			})
+		}) })]
+	});
+}
+//#endregion
+export { a as Autocomplete };

package/dist/components/Autocomplete/index.d.ts

@@ -0,0 +1,2 @@
+export { Autocomplete } from './Autocomplete';
+export type { AutocompleteOption, AutocompleteProps } from './Autocomplete';

package/dist/index.cjs

@@ -1 +1 @@
-Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});/* empty css                 */const e=require("./components/Button/Button2.cjs"),t=require("./components/Input/Input2.cjs"),n=require("./components/Checkbox/Checkbox2.cjs"),r=require("./components/RadioNative/RadioNative2.cjs"),i=require("./components/Switch/Switch2.cjs"),a=require("./components/Select/Select2.cjs"),o=require("./components/Tabs/Tabs2.cjs"),s=require("./components/Tooltip/Tooltip2.cjs"),c=require("./components/IconButton/IconButton2.cjs"),l=require("./components/Timeline/Timeline2.cjs"),u=require("./components/Modal/Modal2.cjs");exports.Button=e.Button,exports.Checkbox=n.Checkbox,exports.IconButton=c.IconButton,exports.Input=t.Input,exports.Modal=u.Modal,exports.RadioNative=r.RadioNative,exports.Select=a.Select,exports.Switch=i.Switch,exports.Tabs=o.Tabs,exports.Timeline=l.Timeline,exports.Tooltip=s.Tooltip;
+Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});/* empty css                 */const e=require("./components/Button/Button2.cjs"),t=require("./components/Input/Input2.cjs"),n=require("./components/Checkbox/Checkbox2.cjs"),r=require("./components/RadioNative/RadioNative2.cjs"),i=require("./components/Switch/Switch2.cjs"),a=require("./components/Select/Select2.cjs"),o=require("./components/Tabs/Tabs2.cjs"),s=require("./components/Tooltip/Tooltip2.cjs"),c=require("./components/IconButton/IconButton2.cjs"),l=require("./components/Timeline/Timeline2.cjs"),u=require("./components/Modal/Modal2.cjs"),d=require("./components/Autocomplete/Autocomplete2.cjs");exports.Autocomplete=d.Autocomplete,exports.Button=e.Button,exports.Checkbox=n.Checkbox,exports.IconButton=c.IconButton,exports.Input=t.Input,exports.Modal=u.Modal,exports.RadioNative=r.RadioNative,exports.Select=a.Select,exports.Switch=i.Switch,exports.Tabs=o.Tabs,exports.Timeline=l.Timeline,exports.Tooltip=s.Tooltip;

package/dist/index.d.ts

@@ -9,3 +9,4 @@ export { Tooltip } from './components/Tooltip';
 export { IconButton } from './components/IconButton';
 export { Timeline } from './components/Timeline';
 export { Modal } from './components/Modal';
+export { Autocomplete } from './components/Autocomplete';

package/dist/index.js

@@ -10,4 +10,5 @@ import { Tooltip as s } from "./components/Tooltip/Tooltip2.js";
 import { IconButton as c } from "./components/IconButton/IconButton2.js";
 import { Timeline as l } from "./components/Timeline/Timeline2.js";
 import { Modal as u } from "./components/Modal/Modal2.js";
-export { e as Button, n as Checkbox, c as IconButton, t as Input, u as Modal, r as RadioNative, a as Select, i as Switch, o as Tabs, l as Timeline, s as Tooltip };
+import { Autocomplete as d } from "./components/Autocomplete/Autocomplete2.js";
+export { d as Autocomplete, e as Button, n as Checkbox, c as IconButton, t as Input, u as Modal, r as RadioNative, a as Select, i as Switch, o as Tabs, l as Timeline, s as Tooltip };