brd-ui-kit 0.1.91 → 0.1.93

package/dist/components-forms-form-input-search.js

@@ -0,0 +1,56 @@
+import { jsx as u } from "react/jsx-runtime";
+import { a as V, C as F } from "./index.esm-CFsbc_Iq.js";
+import { getValidationState as x } from "./utils-get-validation-state.js";
+import { InputSearch as y } from "./components-input-search-input-search.js";
+const T = ({
+  name: t,
+  optionName: e,
+  rules: a,
+  disabled: i,
+  onOptionChange: l,
+  ...d
+}) => {
+  const {
+    control: h,
+    setValue: c,
+    formState: { errors: m, touchedFields: f, isSubmitted: g }
+  } = V();
+  return /* @__PURE__ */ u(
+    F,
+    {
+      name: t,
+      rules: a,
+      control: h,
+      render: ({ field: { onChange: p, value: r = "" } }) => {
+        const o = typeof r == "string" ? r : String(r ?? ""), [C, S] = x(
+          t,
+          o,
+          m,
+          f,
+          g
+        );
+        return /* @__PURE__ */ u(
+          y,
+          {
+            ...d,
+            value: o,
+            onChange: (n, s) => {
+              p(n), e && c(e, s ?? null, {
+                shouldDirty: !0,
+                shouldTouch: !0,
+                shouldValidate: !0
+              }), l?.(n, s);
+            },
+            disabled: i,
+            isValid: C,
+            error: S
+          }
+        );
+      }
+    }
+  );
+};
+export {
+  T as FormInputSearch
+};
+//# sourceMappingURL=components-forms-form-input-search.js.map

package/dist/components-forms-form-input-search.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"components-forms-form-input-search.js","sources":["../src/components/forms/form-input-search.tsx"],"sourcesContent":["import { Controller, useFormContext, type RegisterOptions } from \"react-hook-form\";\n\nimport { getValidationState } from \"@/utils/get-validation-state\";\nimport {\n  InputSearch,\n  type InputSearchOption,\n  type InputSearchProps,\n} from \"../input-search\";\n\ntype Props<T = unknown> = Omit<\n  InputSearchProps<T>,\n  \"value\" | \"onChange\" | \"disabled\" | \"isValid\" | \"error\"\n> & {\n  name: string;\n  optionName?: string;\n  rules?: RegisterOptions;\n  disabled?: boolean;\n  onOptionChange?: (value: string, option?: InputSearchOption<T>) => void;\n};\n\nexport const FormInputSearch = <T,>({\n  name,\n  optionName,\n  rules,\n  disabled,\n  onOptionChange,\n  ...rest\n}: Props<T>) => {\n  const {\n    control,\n    setValue,\n    formState: { errors, touchedFields, isSubmitted },\n  } = useFormContext();\n\n  return (\n    <Controller\n      name={name}\n      rules={rules}\n      control={control}\n      render={({ field: { onChange, value = \"\" } }) => {\n        const currentValue = typeof value === \"string\" ? value : String(value ?? \"\");\n        const [isValid, errorMsg] = getValidationState(\n          name,\n          currentValue,\n          errors,\n          touchedFields,\n          isSubmitted,\n        );\n\n        const handleChange = (nextValue: string, option?: InputSearchOption<T>) => {\n          onChange(nextValue);\n\n          if (optionName) {\n            setValue(optionName, option ?? null, {\n              shouldDirty: true,\n              shouldTouch: true,\n              shouldValidate: true,\n            });\n          }\n\n          onOptionChange?.(nextValue, option);\n        };\n\n        return (\n          <InputSearch\n            {...rest}\n            value={currentValue}\n            onChange={handleChange}\n            disabled={disabled}\n            isValid={isValid}\n            error={errorMsg}\n          />\n        );\n      }}\n    />\n  );\n};\n\nexport type { Props as FormInputSearchProps };\n"],"names":["FormInputSearch","name","optionName","rules","disabled","onOptionChange","rest","control","setValue","errors","touchedFields","isSubmitted","useFormContext","jsx","Controller","onChange","value","currentValue","isValid","errorMsg","getValidationState","InputSearch","nextValue","option"],"mappings":";;;;AAoBO,MAAMA,IAAkB,CAAK;AAAA,EAClC,MAAAC;AAAA,EACA,YAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,GAAGC;AACL,MAAgB;AACd,QAAM;AAAA,IACJ,SAAAC;AAAA,IACA,UAAAC;AAAA,IACA,WAAW,EAAE,QAAAC,GAAQ,eAAAC,GAAe,aAAAC,EAAA;AAAA,EAAY,IAC9CC,EAAA;AAEJ,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAAb;AAAA,MACA,OAAAE;AAAA,MACA,SAAAI;AAAA,MACA,QAAQ,CAAC,EAAE,OAAO,EAAE,UAAAQ,GAAU,OAAAC,IAAQ,GAAA,QAAW;AAC/C,cAAMC,IAAe,OAAOD,KAAU,WAAWA,IAAQ,OAAOA,KAAS,EAAE,GACrE,CAACE,GAASC,CAAQ,IAAIC;AAAA,UAC1BnB;AAAA,UACAgB;AAAA,UACAR;AAAA,UACAC;AAAA,UACAC;AAAA,QAAA;AAiBF,eACE,gBAAAE;AAAA,UAACQ;AAAA,UAAA;AAAA,YACE,GAAGf;AAAA,YACJ,OAAOW;AAAA,YACP,UAlBiB,CAACK,GAAmBC,MAAkC;AACzE,cAAAR,EAASO,CAAS,GAEdpB,KACFM,EAASN,GAAYqB,KAAU,MAAM;AAAA,gBACnC,aAAa;AAAA,gBACb,aAAa;AAAA,gBACb,gBAAgB;AAAA,cAAA,CACjB,GAGHlB,IAAiBiB,GAAWC,CAAM;AAAA,YACpC;AAAA,YAOI,UAAAnB;AAAA,YACA,SAAAc;AAAA,YACA,OAAOC;AAAA,UAAA;AAAA,QAAA;AAAA,MAGb;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/components-forms.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./components-forms-form.cjs"),r=require("./components-forms-form-avatar-uploader.cjs"),e=require("./components-forms-form-contact-input.cjs"),m=require("./components-forms-form-files-uploader.cjs"),t=require("./components-forms-form-input.cjs"),n=require("./components-forms-form-input-password.cjs"),s=require("./components-forms-form-Input-phone.cjs"),c=require("./components-forms-form-select.cjs"),p=require("./components-forms-form-select-calendar.cjs"),a=require("./components-forms-form-textarea.cjs"),u=require("./components-forms-form-toggle-group.cjs"),F=require("./components-forms-from-checkbox.cjs");exports.Form=o.Form;exports.FormAvatar=r.FormAvatar;exports.FormContactInput=e.FormContactInput;exports.FormFilesUploader=m.FormFilesUploader;exports.FormInput=t.FormInput;exports.FormInputPassword=n.FormInputPassword;exports.FormInputPhone=s.FormInputPhone;exports.FormSelect=c.FormSelect;exports.FormSelectCalendar=p.FormSelectCalendar;exports.FormTextarea=a.FormTextarea;exports.FormToggleGroup=u.FormToggleGroup;exports.FormCheckbox=F.FormCheckbox;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./components-forms-form.cjs"),r=require("./components-forms-form-avatar-uploader.cjs"),e=require("./components-forms-form-contact-input.cjs"),m=require("./components-forms-form-files-uploader.cjs"),n=require("./components-forms-form-input.cjs"),t=require("./components-forms-form-input-password.cjs"),s=require("./components-forms-form-Input-phone.cjs"),c=require("./components-forms-form-input-search.cjs"),p=require("./components-forms-form-select.cjs"),u=require("./components-forms-form-select-calendar.cjs"),a=require("./components-forms-form-textarea.cjs"),F=require("./components-forms-form-toggle-group.cjs"),f=require("./components-forms-from-checkbox.cjs");exports.Form=o.Form;exports.FormAvatar=r.FormAvatar;exports.FormContactInput=e.FormContactInput;exports.FormFilesUploader=m.FormFilesUploader;exports.FormInput=n.FormInput;exports.FormInputPassword=t.FormInputPassword;exports.FormInputPhone=s.FormInputPhone;exports.FormInputSearch=c.FormInputSearch;exports.FormSelect=p.FormSelect;exports.FormSelectCalendar=u.FormSelectCalendar;exports.FormTextarea=a.FormTextarea;exports.FormToggleGroup=F.FormToggleGroup;exports.FormCheckbox=f.FormCheckbox;
 //# sourceMappingURL=components-forms.cjs.map

package/dist/components-forms.js

@@ -5,23 +5,25 @@ import { FormFilesUploader as f } from "./components-forms-form-files-uploader.j
 import { FormInput as n } from "./components-forms-form-input.js";
 import { FormInputPassword as u } from "./components-forms-form-input-password.js";
 import { FormInputPhone as I } from "./components-forms-form-Input-phone.js";
-import { FormSelect as s } from "./components-forms-form-select.js";
+import { FormInputSearch as h } from "./components-forms-form-input-search.js";
+import { FormSelect as C } from "./components-forms-form-select.js";
 import { FormSelectCalendar as g } from "./components-forms-form-select-calendar.js";
-import { FormTextarea as P } from "./components-forms-form-textarea.js";
-import { FormToggleGroup as T } from "./components-forms-form-toggle-group.js";
-import { FormCheckbox as i } from "./components-forms-from-checkbox.js";
+import { FormTextarea as T } from "./components-forms-form-textarea.js";
+import { FormToggleGroup as i } from "./components-forms-form-toggle-group.js";
+import { FormCheckbox as v } from "./components-forms-from-checkbox.js";
 export {
   e as Form,
   t as FormAvatar,
-  i as FormCheckbox,
+  v as FormCheckbox,
   x as FormContactInput,
   f as FormFilesUploader,
   n as FormInput,
   u as FormInputPassword,
   I as FormInputPhone,
-  s as FormSelect,
+  h as FormInputSearch,
+  C as FormSelect,
   g as FormSelectCalendar,
-  P as FormTextarea,
-  T as FormToggleGroup
+  T as FormTextarea,
+  i as FormToggleGroup
 };
 //# sourceMappingURL=components-forms.js.map

package/dist/components-forms.js.map

@@ -1 +1 @@
-{"version":3,"file":"components-forms.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}
+{"version":3,"file":"components-forms.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;"}

package/dist/components-input-contact-input-contact.cjs

@@ -1,5 +1,5 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),P=require("brd-phosphor-strokes-icons/icons/CaretDown"),j=require("brd-phosphor-strokes-icons/icons/CaretUp"),_=require("brd-phosphor-strokes-icons/icons/EnvelopeSimple"),k=require("brd-phosphor-strokes-icons/icons/MaxLogo"),S=require("brd-phosphor-strokes-icons/icons/Phone"),i=require("./components-icons-stroke-icon.cjs"),T=require("brd-phosphor-strokes-icons/icons/TelegramLogo"),L=require("brd-phosphor-strokes-icons/icons/WhatsAppLogoFilled");require("./approval-log.view-DC5xl6KF.cjs");const b=require("./lib-utils.cjs");require("class-variance-authority");require("./components-ui-badge-badge.styles.cjs");const z=require("./components-ui-button-button.cjs");require("./components-ui-button-button.styles.cjs");require("./components-ui-card-card.cjs");require("./components-ui-checkbox-checkbox.cjs");const F=require("./hooks-usePopupControls.cjs");require("./calendar-BClkfQSD.cjs");require("brd-phosphor-strokes-icons/icons");require("./components-ui-combobox-combobox.cjs");require("./components-ui-dialog-dialog.cjs");const c=require("react");require("./components-ui-label-label.cjs");require("./components-ui-separator-separator.cjs");require("./components-ui-field-field.styles.cjs");require("./components-ui-input-input.styles.cjs");require("./components-ui-textarea-textarea.cjs");require("./components-ui-input-group-input-group.styles.cjs");require("./components-ui-navigation-item-navigation-item.styles.cjs");require("./components-ui-navigation-menu-navigation-menu.styles.cjs");require("./components-ui-pagination-pagination.cjs");require("./components-ui-progress-progress.cjs");require("./components-ui-radio-group-radio-group.cjs");require("./components-ui-switch-switch.cjs");require("./components-ui-toggle-toggle.styles.cjs");require("./components-ui-toggle-group-toggle-group.cjs");require("./components-ui-table-table.cjs");require("./components-ui-tabs-tabs.cjs");require("./components-ui-tooltip-tooltip.cjs");require("./components-ui-typography-typography.styles.cjs");require("brd-phosphor-strokes-icons/icons/CaretLeft");require("brd-phosphor-strokes-icons/icons/CaretRight");require("./components-app-pagination-app-pagination.styles.cjs");require("brd-phosphor-strokes-icons/icons/CaretUpDown");require("./components-app-sidebar-app-sidebar.styles.cjs");require("./components-data-table-data-table.styles.cjs");require("./components-ui-dropdown-menu-dropdown-menu.styles.cjs");const N=require("./components-input-field-input-field.cjs");require("brd-phosphor-strokes-icons/icons/Eye");require("brd-phosphor-strokes-icons/icons/EyeSlash");require("./components-select-field-select-field.cjs");require("./lodash-kqhtUJfz.cjs");require("./chart-9H_9wEfR.cjs");require("brd-phosphor-strokes-icons/icons/CheckCircle");require("brd-phosphor-strokes-icons/icons/Info");require("brd-phosphor-strokes-icons/icons/SpinnerGap");require("brd-phosphor-strokes-icons/icons/Warning");require("brd-phosphor-strokes-icons/icons/X");require("brd-phosphor-strokes-icons/icons/XCircle");require("./index-DGxwh2Ms.cjs");require("./index-fTTv8YY8.cjs");require("brd-phosphor-strokes-icons/icons/Plus");const D=require("./components-input-phone-input-phone.cjs");require("./components-card-info-card-info.styles.cjs");const E=[{label:"Мобильный",icon:"phone"},{label:"Telegram",icon:"telegram-logo"},{label:"WhatsApp",icon:"whats-app-logo-filled"},{label:"Max",icon:"max-logo"},{label:"E-mail",icon:"envelope-simple"}],h={phone:S.Phone,"telegram-logo":T.TelegramLogo,"whats-app-logo-filled":L.WhatsAppLogoFilled,"max-logo":k.MaxLogo,"envelope-simple":_.EnvelopeSimple},x=o=>{switch(o){case"max-logo":return{bgColor:"bg-[linear-gradient(135deg,#9933DD_0%,#2831B9_50%,#44CCFF_100%)]"};case"telegram-logo":return{bgColor:"bg-[#289AD2]"};case"whats-app-logo-filled":return{bgColor:"bg-[#00C202]",textColor:"text-primary-inverse-text"};default:return{}}},a=o=>({wrapper:b.cn(`flex h-5.5 w-5.5 shrink-0 items-center justify-center rounded-sm
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),j=require("brd-phosphor-strokes-icons/icons/CaretDown"),y=require("brd-phosphor-strokes-icons/icons/CaretUp"),_=require("brd-phosphor-strokes-icons/icons/EnvelopeSimple"),k=require("brd-phosphor-strokes-icons/icons/MaxLogo"),S=require("brd-phosphor-strokes-icons/icons/Phone"),i=require("./components-icons-stroke-icon.cjs"),T=require("brd-phosphor-strokes-icons/icons/TelegramLogo"),L=require("brd-phosphor-strokes-icons/icons/WhatsAppLogoFilled");require("./approval-log.view-DC5xl6KF.cjs");const b=require("./lib-utils.cjs");require("class-variance-authority");require("./components-ui-badge-badge.styles.cjs");const z=require("./components-ui-button-button.cjs");require("./components-ui-button-button.styles.cjs");require("./components-ui-card-card.cjs");require("./components-ui-checkbox-checkbox.cjs");const F=require("./hooks-usePopupControls.cjs");require("./calendar-BClkfQSD.cjs");require("brd-phosphor-strokes-icons/icons");require("./components-ui-combobox-combobox.cjs");require("./components-ui-dialog-dialog.cjs");const c=require("react");require("./components-ui-label-label.cjs");require("./components-ui-separator-separator.cjs");require("./components-ui-field-field.styles.cjs");require("./components-ui-input-input.styles.cjs");require("./components-ui-textarea-textarea.cjs");require("./components-ui-input-group-input-group.styles.cjs");require("./components-ui-navigation-item-navigation-item.styles.cjs");require("./components-ui-navigation-menu-navigation-menu.styles.cjs");require("./components-ui-pagination-pagination.cjs");require("./components-ui-progress-progress.cjs");require("./components-ui-radio-group-radio-group.cjs");require("./components-ui-switch-switch.cjs");require("./components-ui-toggle-toggle.styles.cjs");require("./components-ui-toggle-group-toggle-group.cjs");require("./components-ui-table-table.cjs");require("./components-ui-tabs-tabs.cjs");require("./components-ui-tooltip-tooltip.cjs");require("./components-ui-typography-typography.styles.cjs");require("brd-phosphor-strokes-icons/icons/CaretLeft");require("brd-phosphor-strokes-icons/icons/CaretRight");require("./components-app-pagination-app-pagination.styles.cjs");require("brd-phosphor-strokes-icons/icons/CaretUpDown");require("./components-app-sidebar-app-sidebar.styles.cjs");require("./components-data-table-data-table.styles.cjs");require("./components-ui-dropdown-menu-dropdown-menu.styles.cjs");const N=require("./components-input-field-input-field.cjs");require("brd-phosphor-strokes-icons/icons/Eye");require("brd-phosphor-strokes-icons/icons/EyeSlash");require("./components-select-field-select-field.cjs");require("./lodash-kqhtUJfz.cjs");require("./chart-9H_9wEfR.cjs");require("brd-phosphor-strokes-icons/icons/CheckCircle");require("brd-phosphor-strokes-icons/icons/Info");require("brd-phosphor-strokes-icons/icons/SpinnerGap");require("brd-phosphor-strokes-icons/icons/Warning");require("brd-phosphor-strokes-icons/icons/X");require("brd-phosphor-strokes-icons/icons/XCircle");require("./index-DGxwh2Ms.cjs");require("./index-fTTv8YY8.cjs");require("brd-phosphor-strokes-icons/icons/Plus");const D=require("./components-input-phone-input-phone.cjs");require("./components-card-info-card-info.styles.cjs");const E=[{label:"Мобильный",icon:"phone"},{label:"Telegram",icon:"telegram-logo"},{label:"WhatsApp",icon:"whats-app-logo-filled"},{label:"Max",icon:"max-logo"},{label:"E-mail",icon:"envelope-simple"}],h={phone:S.Phone,"telegram-logo":T.TelegramLogo,"whats-app-logo-filled":L.WhatsAppLogoFilled,"max-logo":k.MaxLogo,"envelope-simple":_.EnvelopeSimple},x=o=>{switch(o){case"max-logo":return{bgColor:"bg-[linear-gradient(135deg,#9933DD_0%,#2831B9_50%,#44CCFF_100%)]"};case"telegram-logo":return{bgColor:"bg-[#289AD2]"};case"whats-app-logo-filled":return{bgColor:"bg-[#00C202]",textColor:"text-primary-inverse-text"};default:return{}}},a=o=>({wrapper:b.cn(`flex h-5.5 w-5.5 shrink-0 items-center justify-center rounded-sm
     ${x(o).bgColor??"bg-primary-inverse-hover-bg"}
-    ${x(o).textColor??"text-primary-inverse-text"}`),icon:"size-5 shrink-0"}),O=o=>{const{inputProps:C,inputPhoneProps:f,onTypeChange:v,...p}=o,[n,I]=c.useState("phone"),{isOpened:s,openPopup:q,closePopup:u}=F.usePopupControls(),l=c.useRef(null);c.useEffect(()=>{const e=t=>{l.current&&!l.current.contains(t.target)&&u()};return s&&document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}},[s,u]);const m=e=>{switch(e){case"phone":return"+7 (999) 999-99-99";case"telegram-logo":return"@username";case"whats-app-logo-filled":return"+7 (999) 999-99-99";case"max-logo":return"ID пользователя Max";case"envelope-simple":return"example@mail.com";default:return"Введите значение"}},w=e=>()=>{I(e),v?.(e),u()},d=h[n],g=s?j.CaretUp:P.CaretDown;return r.jsxs("div",{className:b.cn("relative",o.classes?.container),children:[["telegram-logo","max-logo","envelope-simple"].includes(n)?r.jsx(N.InputField,{...C,...p,date:[{id:"0",position:"inline-start",component:r.jsx(i.StrokeIcon,{icon:d,size:"medium",classes:a(n)})},{id:"1",position:"inline-end",component:r.jsx(i.StrokeIcon,{icon:g,size:"medium",className:"cursor-pointer",onClick:q})}],placeholder:m(n)}):r.jsx(D.InputPhone,{...f,...p,date:[{id:"0",position:"inline-start",component:r.jsx(i.StrokeIcon,{icon:d,size:"medium",classes:a(n)})},{id:"1",position:"inline-end",component:r.jsx(i.StrokeIcon,{icon:g,size:"medium",className:"cursor-pointer",onClick:q})}],placeholder:m(n)}),s&&r.jsx("div",{className:`border-inp-hover-border bg-primary-bg absolute z-100 my-2 flex w-full
-            flex-col rounded-xl border`,ref:l,children:E.map(({label:e,icon:t})=>{const y=h[t];return r.jsxs(z.Button,{variant:"ghost",className:"flex w-full justify-start",type:"button",onClick:w(t),children:[r.jsx(i.StrokeIcon,{icon:y,size:"medium",className:"text-primary-inverse-text",classes:a(t)}),e]},e)})})]})};exports.InputContact=O;
+    ${x(o).textColor??"text-primary-inverse-text"}`),icon:"size-5 shrink-0"}),O=o=>{const{inputProps:C,inputPhoneProps:f,onTypeChange:v,...p}=o,[n,I]=c.useState("phone"),{isOpened:s,openPopup:q,closePopup:u}=F.usePopupControls(),l=c.useRef(null);c.useEffect(()=>{const e=t=>{l.current&&!l.current.contains(t.target)&&u()};return s&&document.addEventListener("mousedown",e),()=>{document.removeEventListener("mousedown",e)}},[s,u]);const m=e=>{switch(e){case"phone":return"+7 (999) 999-99-99";case"telegram-logo":return"@username";case"whats-app-logo-filled":return"+7 (999) 999-99-99";case"max-logo":return"ID пользователя Max";case"envelope-simple":return"example@mail.com";default:return"Введите значение"}},w=e=>()=>{I(e),v?.(e),u()},d=h[n],g=s?y.CaretUp:j.CaretDown;return r.jsxs("div",{className:b.cn("relative",o.classes?.container),children:[["telegram-logo","max-logo","envelope-simple"].includes(n)?r.jsx(N.InputField,{...C,...p,date:[{id:"0",position:"inline-start",component:r.jsx(i.StrokeIcon,{icon:d,size:"medium",classes:a(n)})},{id:"1",position:"inline-end",component:r.jsx(i.StrokeIcon,{icon:g,size:"medium",className:"cursor-pointer",onClick:q})}],placeholder:m(n)}):r.jsx(D.InputPhone,{...f,...p,date:[{id:"0",position:"inline-start",component:r.jsx(i.StrokeIcon,{icon:d,size:"medium",classes:a(n)})},{id:"1",position:"inline-end",component:r.jsx(i.StrokeIcon,{icon:g,size:"medium",className:"cursor-pointer",onClick:q})}],placeholder:m(n)}),s&&r.jsx("div",{className:`border-inp-hover-border bg-primary-bg absolute z-100 mt-2 flex w-full
+            flex-col rounded-xl border`,ref:l,children:E.map(({label:e,icon:t})=>{const P=h[t];return r.jsxs(z.Button,{variant:"ghost",className:"flex w-full justify-start",type:"button",onClick:w(t),children:[r.jsx(i.StrokeIcon,{icon:P,size:"medium",className:"text-primary-inverse-text",classes:a(t)}),e]},e)})})]})};exports.InputContact=O;
 //# sourceMappingURL=components-input-contact-input-contact.cjs.map

package/dist/components-input-contact-input-contact.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"components-input-contact-input-contact.cjs","sources":["../src/constants/contact-input.ts","../src/components/input-contact/input-contact.tsx"],"sourcesContent":["import type { TOption } from \"@/components/input-contact/input-contact\";\n\nexport const OPTIONS: TOption[] = [\n  {\n    label: \"Мобильный\",\n    icon: \"phone\",\n  },\n  {\n    label: \"Telegram\",\n    icon: \"telegram-logo\",\n  },\n  {\n    label: \"WhatsApp\",\n    icon: \"whats-app-logo-filled\",\n  },\n  {\n    label: \"Max\",\n    icon: \"max-logo\",\n  },\n  {\n    label: \"E-mail\",\n    icon: \"envelope-simple\",\n  },\n];\n","import { CaretDown } from \"@/components/icons/CaretDown\";\nimport { CaretUp } from \"@/components/icons/CaretUp\";\nimport { EnvelopeSimple } from \"@/components/icons/EnvelopeSimple\";\nimport { MaxLogo } from \"@/components/icons/MaxLogo\";\nimport { Phone } from \"@/components/icons/Phone\";\nimport { StrokeIcon, type StrokeIconComponent } from \"@/components/icons/stroke-icon\";\nimport { TelegramLogo } from \"@/components/icons/TelegramLogo\";\nimport { WhatsAppLogoFilled } from \"@/components/icons/WhatsAppLogoFilled\";\nimport { OPTIONS } from \"@/constants/contact-input\";\nimport {\n  Button,\n  InputField,\n  InputPhone,\n  cn,\n  usePopupControls,\n  type InputPhoneProps,\n} from \"@/index\";\nimport { useEffect, useRef, useState } from \"react\";\n\nexport type TOption = {\n  label: string;\n  icon: TypesChange;\n};\n\ntype TypesChange =\n  | \"phone\"\n  | \"telegram-logo\"\n  | \"whats-app-logo-filled\"\n  | \"max-logo\"\n  | \"envelope-simple\";\n\nconst contactIcons: Record<TypesChange, StrokeIconComponent> = {\n  phone: Phone,\n  \"telegram-logo\": TelegramLogo,\n  \"whats-app-logo-filled\": WhatsAppLogoFilled,\n  \"max-logo\": MaxLogo,\n  \"envelope-simple\": EnvelopeSimple,\n};\n\ntype Props = {\n  isValid?: boolean;\n  label?: string;\n  description?: string;\n  classes?: {\n    fieldset?: string;\n    fieldgroup?: string;\n    field?: string;\n    container?: string;\n  };\n  value?: string;\n  name?: string;\n  onTypeChange?: (type: TypesChange) => void;\n  inputProps: React.ComponentPropsWithRef<\"input\">;\n  inputPhoneProps: InputPhoneProps;\n  disabled?: boolean;\n};\n\n// TODO: заменить цвета\nconst iconStyles = (icon: TypesChange) => {\n  switch (icon) {\n    case \"max-logo\":\n      return {\n        bgColor: \"bg-[linear-gradient(135deg,#9933DD_0%,#2831B9_50%,#44CCFF_100%)]\",\n      };\n\n    case \"telegram-logo\":\n      return {\n        bgColor: \"bg-[#289AD2]\",\n      };\n\n    case \"whats-app-logo-filled\":\n      return {\n        bgColor: \"bg-[#00C202]\",\n        textColor: \"text-primary-inverse-text\",\n      };\n\n    default:\n      return {};\n  }\n};\n\nconst getContactIconClasses = (icon: TypesChange) => ({\n  wrapper: cn(\n    `flex h-5.5 w-5.5 shrink-0 items-center justify-center rounded-sm\n    ${iconStyles(icon).bgColor ?? \"bg-primary-inverse-hover-bg\"}\n    ${iconStyles(icon).textColor ?? \"text-primary-inverse-text\"}`,\n  ),\n  icon: \"size-5 shrink-0\",\n});\n\nexport const InputContact = (props: Props) => {\n  const { inputProps, inputPhoneProps, onTypeChange, ...rest } = props;\n\n  const [type, setType] = useState<TypesChange>(\"phone\");\n  const { isOpened, openPopup, closePopup } = usePopupControls();\n  const wrapperRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    const handleClickOutside = (event: MouseEvent) => {\n      if (wrapperRef.current && !wrapperRef.current.contains(event.target as Node)) {\n        closePopup();\n      }\n    };\n\n    if (isOpened) {\n      document.addEventListener(\"mousedown\", handleClickOutside);\n    }\n\n    return () => {\n      document.removeEventListener(\"mousedown\", handleClickOutside);\n    };\n  }, [isOpened, closePopup]);\n\n  const getPlaceholder = (type: TypesChange): string => {\n    switch (type) {\n      case \"phone\":\n        return \"+7 (999) 999-99-99\";\n      case \"telegram-logo\":\n        return \"@username\";\n      case \"whats-app-logo-filled\":\n        return \"+7 (999) 999-99-99\";\n      case \"max-logo\":\n        return \"ID пользователя Max\";\n      case \"envelope-simple\":\n        return \"example@mail.com\";\n      default:\n        return \"Введите значение\";\n    }\n  };\n\n  const handleTypeChange = (type: TypesChange) => {\n    return () => {\n      setType(type);\n      onTypeChange?.(type);\n      closePopup();\n    };\n  };\n\n  const SelectedIcon = contactIcons[type];\n  const ToggleIcon = isOpened ? CaretUp : CaretDown;\n\n  return (\n    <div className={cn(\"relative\", props.classes?.container)}>\n      {[\"telegram-logo\", \"max-logo\", \"envelope-simple\"].includes(type) ? (\n        <InputField\n          {...inputProps}\n          {...rest}\n          date={[\n            {\n              id: \"0\",\n              position: \"inline-start\",\n              component: (\n                <StrokeIcon\n                  icon={SelectedIcon}\n                  size=\"medium\"\n                  classes={getContactIconClasses(type)}\n                />\n              ),\n            },\n            {\n              id: \"1\",\n              position: \"inline-end\",\n              component: (\n                <StrokeIcon\n                  icon={ToggleIcon}\n                  size=\"medium\"\n                  className=\"cursor-pointer\"\n                  onClick={openPopup}\n                />\n              ),\n            },\n          ]}\n          placeholder={getPlaceholder(type)}\n        />\n      ) : (\n        <InputPhone\n          {...inputPhoneProps}\n          {...rest}\n          date={[\n            {\n              id: \"0\",\n              position: \"inline-start\",\n              component: (\n                <StrokeIcon\n                  icon={SelectedIcon}\n                  size=\"medium\"\n                  classes={getContactIconClasses(type)}\n                />\n              ),\n            },\n            {\n              id: \"1\",\n              position: \"inline-end\",\n              component: (\n                <StrokeIcon\n                  icon={ToggleIcon}\n                  size=\"medium\"\n                  className=\"cursor-pointer\"\n                  onClick={openPopup}\n                />\n              ),\n            },\n          ]}\n          placeholder={getPlaceholder(type)}\n        />\n      )}\n\n      {isOpened && (\n        <div\n          className=\"border-inp-hover-border bg-primary-bg absolute z-100 my-2 flex w-full\n            flex-col rounded-xl border\"\n          ref={wrapperRef}\n        >\n          {OPTIONS.map(({ label, icon }) => {\n            const OptionIcon = contactIcons[icon];\n\n            return (\n              <Button\n                key={label}\n                variant=\"ghost\"\n                className=\"flex w-full justify-start\"\n                type=\"button\"\n                onClick={handleTypeChange(icon)}\n              >\n                <StrokeIcon\n                  icon={OptionIcon}\n                  size=\"medium\"\n                  className=\"text-primary-inverse-text\"\n                  classes={getContactIconClasses(icon)}\n                />\n\n                {label}\n              </Button>\n            );\n          })}\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport type { Props as InputContactProps, TypesChange };\n"],"names":["OPTIONS","contactIcons","Phone","TelegramLogo","WhatsAppLogoFilled","MaxLogo","EnvelopeSimple","iconStyles","icon","getContactIconClasses","cn","InputContact","props","inputProps","inputPhoneProps","onTypeChange","rest","type","setType","useState","isOpened","openPopup","closePopup","usePopupControls","wrapperRef","useRef","useEffect","handleClickOutside","event","getPlaceholder","handleTypeChange","SelectedIcon","ToggleIcon","CaretUp","CaretDown","jsxs","jsx","InputField","StrokeIcon","InputPhone","label","OptionIcon","Button"],"mappings":"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"}
+{"version":3,"file":"components-input-contact-input-contact.cjs","sources":["../src/constants/contact-input.ts","../src/components/input-contact/input-contact.tsx"],"sourcesContent":["import type { TOption } from \"@/components/input-contact/input-contact\";\n\nexport const OPTIONS: TOption[] = [\n  {\n    label: \"Мобильный\",\n    icon: \"phone\",\n  },\n  {\n    label: \"Telegram\",\n    icon: \"telegram-logo\",\n  },\n  {\n    label: \"WhatsApp\",\n    icon: \"whats-app-logo-filled\",\n  },\n  {\n    label: \"Max\",\n    icon: \"max-logo\",\n  },\n  {\n    label: \"E-mail\",\n    icon: \"envelope-simple\",\n  },\n];\n","import { CaretDown } from \"@/components/icons/CaretDown\";\nimport { CaretUp } from \"@/components/icons/CaretUp\";\nimport { EnvelopeSimple } from \"@/components/icons/EnvelopeSimple\";\nimport { MaxLogo } from \"@/components/icons/MaxLogo\";\nimport { Phone } from \"@/components/icons/Phone\";\nimport { StrokeIcon, type StrokeIconComponent } from \"@/components/icons/stroke-icon\";\nimport { TelegramLogo } from \"@/components/icons/TelegramLogo\";\nimport { WhatsAppLogoFilled } from \"@/components/icons/WhatsAppLogoFilled\";\nimport { OPTIONS } from \"@/constants/contact-input\";\nimport {\n  Button,\n  InputField,\n  InputPhone,\n  cn,\n  usePopupControls,\n  type InputPhoneProps,\n} from \"@/index\";\nimport { useEffect, useRef, useState } from \"react\";\n\nexport type TOption = {\n  label: string;\n  icon: TypesChange;\n};\n\ntype TypesChange =\n  | \"phone\"\n  | \"telegram-logo\"\n  | \"whats-app-logo-filled\"\n  | \"max-logo\"\n  | \"envelope-simple\";\n\nconst contactIcons: Record<TypesChange, StrokeIconComponent> = {\n  phone: Phone,\n  \"telegram-logo\": TelegramLogo,\n  \"whats-app-logo-filled\": WhatsAppLogoFilled,\n  \"max-logo\": MaxLogo,\n  \"envelope-simple\": EnvelopeSimple,\n};\n\ntype Props = {\n  isValid?: boolean;\n  label?: string;\n  description?: string;\n  classes?: {\n    fieldset?: string;\n    fieldgroup?: string;\n    field?: string;\n    container?: string;\n  };\n  value?: string;\n  name?: string;\n  onTypeChange?: (type: TypesChange) => void;\n  inputProps: React.ComponentPropsWithRef<\"input\">;\n  inputPhoneProps: InputPhoneProps;\n  disabled?: boolean;\n};\n\n// TODO: заменить цвета\nconst iconStyles = (icon: TypesChange) => {\n  switch (icon) {\n    case \"max-logo\":\n      return {\n        bgColor: \"bg-[linear-gradient(135deg,#9933DD_0%,#2831B9_50%,#44CCFF_100%)]\",\n      };\n\n    case \"telegram-logo\":\n      return {\n        bgColor: \"bg-[#289AD2]\",\n      };\n\n    case \"whats-app-logo-filled\":\n      return {\n        bgColor: \"bg-[#00C202]\",\n        textColor: \"text-primary-inverse-text\",\n      };\n\n    default:\n      return {};\n  }\n};\n\nconst getContactIconClasses = (icon: TypesChange) => ({\n  wrapper: cn(\n    `flex h-5.5 w-5.5 shrink-0 items-center justify-center rounded-sm\n    ${iconStyles(icon).bgColor ?? \"bg-primary-inverse-hover-bg\"}\n    ${iconStyles(icon).textColor ?? \"text-primary-inverse-text\"}`,\n  ),\n  icon: \"size-5 shrink-0\",\n});\n\nexport const InputContact = (props: Props) => {\n  const { inputProps, inputPhoneProps, onTypeChange, ...rest } = props;\n\n  const [type, setType] = useState<TypesChange>(\"phone\");\n  const { isOpened, openPopup, closePopup } = usePopupControls();\n  const wrapperRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    const handleClickOutside = (event: MouseEvent) => {\n      if (wrapperRef.current && !wrapperRef.current.contains(event.target as Node)) {\n        closePopup();\n      }\n    };\n\n    if (isOpened) {\n      document.addEventListener(\"mousedown\", handleClickOutside);\n    }\n\n    return () => {\n      document.removeEventListener(\"mousedown\", handleClickOutside);\n    };\n  }, [isOpened, closePopup]);\n\n  const getPlaceholder = (type: TypesChange): string => {\n    switch (type) {\n      case \"phone\":\n        return \"+7 (999) 999-99-99\";\n      case \"telegram-logo\":\n        return \"@username\";\n      case \"whats-app-logo-filled\":\n        return \"+7 (999) 999-99-99\";\n      case \"max-logo\":\n        return \"ID пользователя Max\";\n      case \"envelope-simple\":\n        return \"example@mail.com\";\n      default:\n        return \"Введите значение\";\n    }\n  };\n\n  const handleTypeChange = (type: TypesChange) => {\n    return () => {\n      setType(type);\n      onTypeChange?.(type);\n      closePopup();\n    };\n  };\n\n  const SelectedIcon = contactIcons[type];\n  const ToggleIcon = isOpened ? CaretUp : CaretDown;\n\n  return (\n    <div className={cn(\"relative\", props.classes?.container)}>\n      {[\"telegram-logo\", \"max-logo\", \"envelope-simple\"].includes(type) ? (\n        <InputField\n          {...inputProps}\n          {...rest}\n          date={[\n            {\n              id: \"0\",\n              position: \"inline-start\",\n              component: (\n                <StrokeIcon\n                  icon={SelectedIcon}\n                  size=\"medium\"\n                  classes={getContactIconClasses(type)}\n                />\n              ),\n            },\n            {\n              id: \"1\",\n              position: \"inline-end\",\n              component: (\n                <StrokeIcon\n                  icon={ToggleIcon}\n                  size=\"medium\"\n                  className=\"cursor-pointer\"\n                  onClick={openPopup}\n                />\n              ),\n            },\n          ]}\n          placeholder={getPlaceholder(type)}\n        />\n      ) : (\n        <InputPhone\n          {...inputPhoneProps}\n          {...rest}\n          date={[\n            {\n              id: \"0\",\n              position: \"inline-start\",\n              component: (\n                <StrokeIcon\n                  icon={SelectedIcon}\n                  size=\"medium\"\n                  classes={getContactIconClasses(type)}\n                />\n              ),\n            },\n            {\n              id: \"1\",\n              position: \"inline-end\",\n              component: (\n                <StrokeIcon\n                  icon={ToggleIcon}\n                  size=\"medium\"\n                  className=\"cursor-pointer\"\n                  onClick={openPopup}\n                />\n              ),\n            },\n          ]}\n          placeholder={getPlaceholder(type)}\n        />\n      )}\n\n      {isOpened && (\n        <div\n          className=\"border-inp-hover-border bg-primary-bg absolute z-100 mt-2 flex w-full\n            flex-col rounded-xl border\"\n          ref={wrapperRef}\n        >\n          {OPTIONS.map(({ label, icon }) => {\n            const OptionIcon = contactIcons[icon];\n\n            return (\n              <Button\n                key={label}\n                variant=\"ghost\"\n                className=\"flex w-full justify-start\"\n                type=\"button\"\n                onClick={handleTypeChange(icon)}\n              >\n                <StrokeIcon\n                  icon={OptionIcon}\n                  size=\"medium\"\n                  className=\"text-primary-inverse-text\"\n                  classes={getContactIconClasses(icon)}\n                />\n\n                {label}\n              </Button>\n            );\n          })}\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport type { Props as InputContactProps, TypesChange };\n"],"names":["OPTIONS","contactIcons","Phone","TelegramLogo","WhatsAppLogoFilled","MaxLogo","EnvelopeSimple","iconStyles","icon","getContactIconClasses","cn","InputContact","props","inputProps","inputPhoneProps","onTypeChange","rest","type","setType","useState","isOpened","openPopup","closePopup","usePopupControls","wrapperRef","useRef","useEffect","handleClickOutside","event","getPlaceholder","handleTypeChange","SelectedIcon","ToggleIcon","CaretUp","CaretDown","jsxs","jsx","InputField","StrokeIcon","InputPhone","label","OptionIcon","Button"],"mappings":"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"}

package/dist/components-input-contact-input-contact.js

@@ -216,7 +216,7 @@ const B = [
     m && /* @__PURE__ */ e(
       "div",
       {
-        className: `border-inp-hover-border bg-primary-bg absolute z-100 my-2 flex w-full
+        className: `border-inp-hover-border bg-primary-bg absolute z-100 mt-2 flex w-full
             flex-col rounded-xl border`,
         ref: l,
         children: B.map(({ label: o, icon: i }) => {

package/dist/components-input-contact-input-contact.js.map

@@ -1 +1 @@
-{"version":3,"file":"components-input-contact-input-contact.js","sources":["../src/constants/contact-input.ts","../src/components/input-contact/input-contact.tsx"],"sourcesContent":["import type { TOption } from \"@/components/input-contact/input-contact\";\n\nexport const OPTIONS: TOption[] = [\n  {\n    label: \"Мобильный\",\n    icon: \"phone\",\n  },\n  {\n    label: \"Telegram\",\n    icon: \"telegram-logo\",\n  },\n  {\n    label: \"WhatsApp\",\n    icon: \"whats-app-logo-filled\",\n  },\n  {\n    label: \"Max\",\n    icon: \"max-logo\",\n  },\n  {\n    label: \"E-mail\",\n    icon: \"envelope-simple\",\n  },\n];\n","import { CaretDown } from \"@/components/icons/CaretDown\";\nimport { CaretUp } from \"@/components/icons/CaretUp\";\nimport { EnvelopeSimple } from \"@/components/icons/EnvelopeSimple\";\nimport { MaxLogo } from \"@/components/icons/MaxLogo\";\nimport { Phone } from \"@/components/icons/Phone\";\nimport { StrokeIcon, type StrokeIconComponent } from \"@/components/icons/stroke-icon\";\nimport { TelegramLogo } from \"@/components/icons/TelegramLogo\";\nimport { WhatsAppLogoFilled } from \"@/components/icons/WhatsAppLogoFilled\";\nimport { OPTIONS } from \"@/constants/contact-input\";\nimport {\n  Button,\n  InputField,\n  InputPhone,\n  cn,\n  usePopupControls,\n  type InputPhoneProps,\n} from \"@/index\";\nimport { useEffect, useRef, useState } from \"react\";\n\nexport type TOption = {\n  label: string;\n  icon: TypesChange;\n};\n\ntype TypesChange =\n  | \"phone\"\n  | \"telegram-logo\"\n  | \"whats-app-logo-filled\"\n  | \"max-logo\"\n  | \"envelope-simple\";\n\nconst contactIcons: Record<TypesChange, StrokeIconComponent> = {\n  phone: Phone,\n  \"telegram-logo\": TelegramLogo,\n  \"whats-app-logo-filled\": WhatsAppLogoFilled,\n  \"max-logo\": MaxLogo,\n  \"envelope-simple\": EnvelopeSimple,\n};\n\ntype Props = {\n  isValid?: boolean;\n  label?: string;\n  description?: string;\n  classes?: {\n    fieldset?: string;\n    fieldgroup?: string;\n    field?: string;\n    container?: string;\n  };\n  value?: string;\n  name?: string;\n  onTypeChange?: (type: TypesChange) => void;\n  inputProps: React.ComponentPropsWithRef<\"input\">;\n  inputPhoneProps: InputPhoneProps;\n  disabled?: boolean;\n};\n\n// TODO: заменить цвета\nconst iconStyles = (icon: TypesChange) => {\n  switch (icon) {\n    case \"max-logo\":\n      return {\n        bgColor: \"bg-[linear-gradient(135deg,#9933DD_0%,#2831B9_50%,#44CCFF_100%)]\",\n      };\n\n    case \"telegram-logo\":\n      return {\n        bgColor: \"bg-[#289AD2]\",\n      };\n\n    case \"whats-app-logo-filled\":\n      return {\n        bgColor: \"bg-[#00C202]\",\n        textColor: \"text-primary-inverse-text\",\n      };\n\n    default:\n      return {};\n  }\n};\n\nconst getContactIconClasses = (icon: TypesChange) => ({\n  wrapper: cn(\n    `flex h-5.5 w-5.5 shrink-0 items-center justify-center rounded-sm\n    ${iconStyles(icon).bgColor ?? \"bg-primary-inverse-hover-bg\"}\n    ${iconStyles(icon).textColor ?? \"text-primary-inverse-text\"}`,\n  ),\n  icon: \"size-5 shrink-0\",\n});\n\nexport const InputContact = (props: Props) => {\n  const { inputProps, inputPhoneProps, onTypeChange, ...rest } = props;\n\n  const [type, setType] = useState<TypesChange>(\"phone\");\n  const { isOpened, openPopup, closePopup } = usePopupControls();\n  const wrapperRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    const handleClickOutside = (event: MouseEvent) => {\n      if (wrapperRef.current && !wrapperRef.current.contains(event.target as Node)) {\n        closePopup();\n      }\n    };\n\n    if (isOpened) {\n      document.addEventListener(\"mousedown\", handleClickOutside);\n    }\n\n    return () => {\n      document.removeEventListener(\"mousedown\", handleClickOutside);\n    };\n  }, [isOpened, closePopup]);\n\n  const getPlaceholder = (type: TypesChange): string => {\n    switch (type) {\n      case \"phone\":\n        return \"+7 (999) 999-99-99\";\n      case \"telegram-logo\":\n        return \"@username\";\n      case \"whats-app-logo-filled\":\n        return \"+7 (999) 999-99-99\";\n      case \"max-logo\":\n        return \"ID пользователя Max\";\n      case \"envelope-simple\":\n        return \"example@mail.com\";\n      default:\n        return \"Введите значение\";\n    }\n  };\n\n  const handleTypeChange = (type: TypesChange) => {\n    return () => {\n      setType(type);\n      onTypeChange?.(type);\n      closePopup();\n    };\n  };\n\n  const SelectedIcon = contactIcons[type];\n  const ToggleIcon = isOpened ? CaretUp : CaretDown;\n\n  return (\n    <div className={cn(\"relative\", props.classes?.container)}>\n      {[\"telegram-logo\", \"max-logo\", \"envelope-simple\"].includes(type) ? (\n        <InputField\n          {...inputProps}\n          {...rest}\n          date={[\n            {\n              id: \"0\",\n              position: \"inline-start\",\n              component: (\n                <StrokeIcon\n                  icon={SelectedIcon}\n                  size=\"medium\"\n                  classes={getContactIconClasses(type)}\n                />\n              ),\n            },\n            {\n              id: \"1\",\n              position: \"inline-end\",\n              component: (\n                <StrokeIcon\n                  icon={ToggleIcon}\n                  size=\"medium\"\n                  className=\"cursor-pointer\"\n                  onClick={openPopup}\n                />\n              ),\n            },\n          ]}\n          placeholder={getPlaceholder(type)}\n        />\n      ) : (\n        <InputPhone\n          {...inputPhoneProps}\n          {...rest}\n          date={[\n            {\n              id: \"0\",\n              position: \"inline-start\",\n              component: (\n                <StrokeIcon\n                  icon={SelectedIcon}\n                  size=\"medium\"\n                  classes={getContactIconClasses(type)}\n                />\n              ),\n            },\n            {\n              id: \"1\",\n              position: \"inline-end\",\n              component: (\n                <StrokeIcon\n                  icon={ToggleIcon}\n                  size=\"medium\"\n                  className=\"cursor-pointer\"\n                  onClick={openPopup}\n                />\n              ),\n            },\n          ]}\n          placeholder={getPlaceholder(type)}\n        />\n      )}\n\n      {isOpened && (\n        <div\n          className=\"border-inp-hover-border bg-primary-bg absolute z-100 my-2 flex w-full\n            flex-col rounded-xl border\"\n          ref={wrapperRef}\n        >\n          {OPTIONS.map(({ label, icon }) => {\n            const OptionIcon = contactIcons[icon];\n\n            return (\n              <Button\n                key={label}\n                variant=\"ghost\"\n                className=\"flex w-full justify-start\"\n                type=\"button\"\n                onClick={handleTypeChange(icon)}\n              >\n                <StrokeIcon\n                  icon={OptionIcon}\n                  size=\"medium\"\n                  className=\"text-primary-inverse-text\"\n                  classes={getContactIconClasses(icon)}\n                />\n\n                {label}\n              </Button>\n            );\n          })}\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport type { Props as InputContactProps, TypesChange };\n"],"names":["OPTIONS","contactIcons","Phone","TelegramLogo","WhatsAppLogoFilled","MaxLogo","EnvelopeSimple","iconStyles","icon","getContactIconClasses","cn","InputContact","props","inputProps","inputPhoneProps","onTypeChange","rest","type","setType","useState","isOpened","openPopup","closePopup","usePopupControls","wrapperRef","useRef","useEffect","handleClickOutside","event","getPlaceholder","handleTypeChange","SelectedIcon","ToggleIcon","CaretUp","CaretDown","jsxs","jsx","InputField","StrokeIcon","InputPhone","label","OptionIcon","Button"],"mappings":"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"}
+{"version":3,"file":"components-input-contact-input-contact.js","sources":["../src/constants/contact-input.ts","../src/components/input-contact/input-contact.tsx"],"sourcesContent":["import type { TOption } from \"@/components/input-contact/input-contact\";\n\nexport const OPTIONS: TOption[] = [\n  {\n    label: \"Мобильный\",\n    icon: \"phone\",\n  },\n  {\n    label: \"Telegram\",\n    icon: \"telegram-logo\",\n  },\n  {\n    label: \"WhatsApp\",\n    icon: \"whats-app-logo-filled\",\n  },\n  {\n    label: \"Max\",\n    icon: \"max-logo\",\n  },\n  {\n    label: \"E-mail\",\n    icon: \"envelope-simple\",\n  },\n];\n","import { CaretDown } from \"@/components/icons/CaretDown\";\nimport { CaretUp } from \"@/components/icons/CaretUp\";\nimport { EnvelopeSimple } from \"@/components/icons/EnvelopeSimple\";\nimport { MaxLogo } from \"@/components/icons/MaxLogo\";\nimport { Phone } from \"@/components/icons/Phone\";\nimport { StrokeIcon, type StrokeIconComponent } from \"@/components/icons/stroke-icon\";\nimport { TelegramLogo } from \"@/components/icons/TelegramLogo\";\nimport { WhatsAppLogoFilled } from \"@/components/icons/WhatsAppLogoFilled\";\nimport { OPTIONS } from \"@/constants/contact-input\";\nimport {\n  Button,\n  InputField,\n  InputPhone,\n  cn,\n  usePopupControls,\n  type InputPhoneProps,\n} from \"@/index\";\nimport { useEffect, useRef, useState } from \"react\";\n\nexport type TOption = {\n  label: string;\n  icon: TypesChange;\n};\n\ntype TypesChange =\n  | \"phone\"\n  | \"telegram-logo\"\n  | \"whats-app-logo-filled\"\n  | \"max-logo\"\n  | \"envelope-simple\";\n\nconst contactIcons: Record<TypesChange, StrokeIconComponent> = {\n  phone: Phone,\n  \"telegram-logo\": TelegramLogo,\n  \"whats-app-logo-filled\": WhatsAppLogoFilled,\n  \"max-logo\": MaxLogo,\n  \"envelope-simple\": EnvelopeSimple,\n};\n\ntype Props = {\n  isValid?: boolean;\n  label?: string;\n  description?: string;\n  classes?: {\n    fieldset?: string;\n    fieldgroup?: string;\n    field?: string;\n    container?: string;\n  };\n  value?: string;\n  name?: string;\n  onTypeChange?: (type: TypesChange) => void;\n  inputProps: React.ComponentPropsWithRef<\"input\">;\n  inputPhoneProps: InputPhoneProps;\n  disabled?: boolean;\n};\n\n// TODO: заменить цвета\nconst iconStyles = (icon: TypesChange) => {\n  switch (icon) {\n    case \"max-logo\":\n      return {\n        bgColor: \"bg-[linear-gradient(135deg,#9933DD_0%,#2831B9_50%,#44CCFF_100%)]\",\n      };\n\n    case \"telegram-logo\":\n      return {\n        bgColor: \"bg-[#289AD2]\",\n      };\n\n    case \"whats-app-logo-filled\":\n      return {\n        bgColor: \"bg-[#00C202]\",\n        textColor: \"text-primary-inverse-text\",\n      };\n\n    default:\n      return {};\n  }\n};\n\nconst getContactIconClasses = (icon: TypesChange) => ({\n  wrapper: cn(\n    `flex h-5.5 w-5.5 shrink-0 items-center justify-center rounded-sm\n    ${iconStyles(icon).bgColor ?? \"bg-primary-inverse-hover-bg\"}\n    ${iconStyles(icon).textColor ?? \"text-primary-inverse-text\"}`,\n  ),\n  icon: \"size-5 shrink-0\",\n});\n\nexport const InputContact = (props: Props) => {\n  const { inputProps, inputPhoneProps, onTypeChange, ...rest } = props;\n\n  const [type, setType] = useState<TypesChange>(\"phone\");\n  const { isOpened, openPopup, closePopup } = usePopupControls();\n  const wrapperRef = useRef<HTMLDivElement>(null);\n\n  useEffect(() => {\n    const handleClickOutside = (event: MouseEvent) => {\n      if (wrapperRef.current && !wrapperRef.current.contains(event.target as Node)) {\n        closePopup();\n      }\n    };\n\n    if (isOpened) {\n      document.addEventListener(\"mousedown\", handleClickOutside);\n    }\n\n    return () => {\n      document.removeEventListener(\"mousedown\", handleClickOutside);\n    };\n  }, [isOpened, closePopup]);\n\n  const getPlaceholder = (type: TypesChange): string => {\n    switch (type) {\n      case \"phone\":\n        return \"+7 (999) 999-99-99\";\n      case \"telegram-logo\":\n        return \"@username\";\n      case \"whats-app-logo-filled\":\n        return \"+7 (999) 999-99-99\";\n      case \"max-logo\":\n        return \"ID пользователя Max\";\n      case \"envelope-simple\":\n        return \"example@mail.com\";\n      default:\n        return \"Введите значение\";\n    }\n  };\n\n  const handleTypeChange = (type: TypesChange) => {\n    return () => {\n      setType(type);\n      onTypeChange?.(type);\n      closePopup();\n    };\n  };\n\n  const SelectedIcon = contactIcons[type];\n  const ToggleIcon = isOpened ? CaretUp : CaretDown;\n\n  return (\n    <div className={cn(\"relative\", props.classes?.container)}>\n      {[\"telegram-logo\", \"max-logo\", \"envelope-simple\"].includes(type) ? (\n        <InputField\n          {...inputProps}\n          {...rest}\n          date={[\n            {\n              id: \"0\",\n              position: \"inline-start\",\n              component: (\n                <StrokeIcon\n                  icon={SelectedIcon}\n                  size=\"medium\"\n                  classes={getContactIconClasses(type)}\n                />\n              ),\n            },\n            {\n              id: \"1\",\n              position: \"inline-end\",\n              component: (\n                <StrokeIcon\n                  icon={ToggleIcon}\n                  size=\"medium\"\n                  className=\"cursor-pointer\"\n                  onClick={openPopup}\n                />\n              ),\n            },\n          ]}\n          placeholder={getPlaceholder(type)}\n        />\n      ) : (\n        <InputPhone\n          {...inputPhoneProps}\n          {...rest}\n          date={[\n            {\n              id: \"0\",\n              position: \"inline-start\",\n              component: (\n                <StrokeIcon\n                  icon={SelectedIcon}\n                  size=\"medium\"\n                  classes={getContactIconClasses(type)}\n                />\n              ),\n            },\n            {\n              id: \"1\",\n              position: \"inline-end\",\n              component: (\n                <StrokeIcon\n                  icon={ToggleIcon}\n                  size=\"medium\"\n                  className=\"cursor-pointer\"\n                  onClick={openPopup}\n                />\n              ),\n            },\n          ]}\n          placeholder={getPlaceholder(type)}\n        />\n      )}\n\n      {isOpened && (\n        <div\n          className=\"border-inp-hover-border bg-primary-bg absolute z-100 mt-2 flex w-full\n            flex-col rounded-xl border\"\n          ref={wrapperRef}\n        >\n          {OPTIONS.map(({ label, icon }) => {\n            const OptionIcon = contactIcons[icon];\n\n            return (\n              <Button\n                key={label}\n                variant=\"ghost\"\n                className=\"flex w-full justify-start\"\n                type=\"button\"\n                onClick={handleTypeChange(icon)}\n              >\n                <StrokeIcon\n                  icon={OptionIcon}\n                  size=\"medium\"\n                  className=\"text-primary-inverse-text\"\n                  classes={getContactIconClasses(icon)}\n                />\n\n                {label}\n              </Button>\n            );\n          })}\n        </div>\n      )}\n    </div>\n  );\n};\n\nexport type { Props as InputContactProps, TypesChange };\n"],"names":["OPTIONS","contactIcons","Phone","TelegramLogo","WhatsAppLogoFilled","MaxLogo","EnvelopeSimple","iconStyles","icon","getContactIconClasses","cn","InputContact","props","inputProps","inputPhoneProps","onTypeChange","rest","type","setType","useState","isOpened","openPopup","closePopup","usePopupControls","wrapperRef","useRef","useEffect","handleClickOutside","event","getPlaceholder","handleTypeChange","SelectedIcon","ToggleIcon","CaretUp","CaretDown","jsxs","jsx","InputField","StrokeIcon","InputPhone","label","OptionIcon","Button"],"mappings":"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"}

package/dist/components-input-search-input-search.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react/jsx-runtime");require("./approval-log.view-DC5xl6KF.cjs");require("./lib-utils.cjs");require("class-variance-authority");require("./components-ui-badge-badge.styles.cjs");require("./components-ui-button-button.cjs");require("./components-ui-button-button.styles.cjs");require("./components-ui-card-card.cjs");require("./components-ui-checkbox-checkbox.cjs");require("brd-phosphor-strokes-icons/icons/CaretDown");const t=require("react");require("./calendar-BClkfQSD.cjs");require("brd-phosphor-strokes-icons/icons");const i=require("./components-ui-combobox-combobox.cjs");require("./components-ui-dialog-dialog.cjs");require("./components-ui-label-label.cjs");require("./components-ui-separator-separator.cjs");require("./components-ui-field-field.styles.cjs");require("./components-ui-input-input.styles.cjs");require("./components-ui-textarea-textarea.cjs");require("./components-ui-input-group-input-group.styles.cjs");require("./components-ui-navigation-item-navigation-item.styles.cjs");require("./components-ui-navigation-menu-navigation-menu.styles.cjs");require("./components-ui-pagination-pagination.cjs");require("./components-ui-progress-progress.cjs");require("./components-ui-radio-group-radio-group.cjs");require("./components-ui-switch-switch.cjs");require("./components-ui-toggle-toggle.styles.cjs");require("./components-ui-toggle-group-toggle-group.cjs");require("./components-ui-table-table.cjs");require("./components-ui-tabs-tabs.cjs");require("./components-ui-tooltip-tooltip.cjs");require("./components-ui-typography-typography.styles.cjs");require("brd-phosphor-strokes-icons/icons/CaretLeft");require("brd-phosphor-strokes-icons/icons/CaretRight");require("./components-app-pagination-app-pagination.styles.cjs");require("brd-phosphor-strokes-icons/icons/CaretUpDown");require("./components-app-sidebar-app-sidebar.styles.cjs");require("./components-data-table-data-table.styles.cjs");require("./components-ui-dropdown-menu-dropdown-menu.styles.cjs");require("brd-phosphor-strokes-icons/icons/Eye");require("brd-phosphor-strokes-icons/icons/EyeSlash");require("./components-select-field-select-field.cjs");require("./lodash-kqhtUJfz.cjs");require("./chart-9H_9wEfR.cjs");require("brd-phosphor-strokes-icons/icons/CheckCircle");require("brd-phosphor-strokes-icons/icons/Info");require("brd-phosphor-strokes-icons/icons/SpinnerGap");require("brd-phosphor-strokes-icons/icons/Warning");require("brd-phosphor-strokes-icons/icons/X");require("brd-phosphor-strokes-icons/icons/XCircle");require("./index-DGxwh2Ms.cjs");require("./index-fTTv8YY8.cjs");require("brd-phosphor-strokes-icons/icons/Plus");require("brd-phosphor-strokes-icons/icons/CaretUp");require("brd-phosphor-strokes-icons/icons/EnvelopeSimple");require("brd-phosphor-strokes-icons/icons/MaxLogo");require("brd-phosphor-strokes-icons/icons/Phone");require("brd-phosphor-strokes-icons/icons/TelegramLogo");require("brd-phosphor-strokes-icons/icons/WhatsAppLogoFilled");require("./components-input-phone-input-phone.cjs");require("./components-card-info-card-info.styles.cjs");const R=300,S=({options:r,value:c,onChange:o,onSearch:q,placeholder:f="Выберите...",searchPlaceholder:d="Поиск...",emptyText:h="Ничего не найдено",loadingText:C="Загрузка...",loading:j=!1,disabled:m=!1,className:v,renderOption:b,debounceMs:x=R})=>{const[l,n]=t.useState(""),a=t.useRef(null);t.useEffect(()=>{if(q)return a.current=setTimeout(()=>{q(l)},x),()=>{a.current&&clearTimeout(a.current)}},[x,q,l]);const s=t.useMemo(()=>r.find(e=>e.value===c)??null,[r,c]),g=t.useMemo(()=>{if(q)return r;const e=l.trim().toLowerCase();return e?r.filter(E=>E.label.toLowerCase().includes(e)):r},[q,r,l]),y=s?s.label:f,I=e=>{if(!e||e.value===c){o?.(""),n("");return}o?.(e.value,e),n("")};return u.jsxs(i.Combobox,{items:r,value:s,onInputValueChange:n,onValueChange:m?void 0:I,children:[u.jsx(i.ComboboxInput,{disabled:m,className:v,placeholder:s?y:d}),u.jsxs(i.ComboboxContent,{children:[u.jsx(i.ComboboxEmpty,{children:j?C:h}),u.jsx(i.ComboboxList,{children:g.map(e=>u.jsx(i.ComboboxItem,{value:e,children:b?b(e):u.jsx("div",{className:"hover:bg-primary-hover-bg w-full px-4 py-2",children:e.label})},e.value))})]})]})};exports.InputSearch=S;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime");require("./approval-log.view-DC5xl6KF.cjs");require("./lib-utils.cjs");require("class-variance-authority");require("./components-ui-badge-badge.styles.cjs");require("./components-ui-button-button.cjs");require("./components-ui-button-button.styles.cjs");require("./components-ui-card-card.cjs");require("./components-ui-checkbox-checkbox.cjs");require("brd-phosphor-strokes-icons/icons/CaretDown");const l=require("react");require("./calendar-BClkfQSD.cjs");require("brd-phosphor-strokes-icons/icons");const u=require("./components-ui-combobox-combobox.cjs");require("./components-ui-dialog-dialog.cjs");require("./components-ui-label-label.cjs");require("./components-ui-separator-separator.cjs");require("./components-ui-field-field.styles.cjs");require("./components-ui-input-input.styles.cjs");require("./components-ui-textarea-textarea.cjs");require("./components-ui-input-group-input-group.styles.cjs");require("./components-ui-navigation-item-navigation-item.styles.cjs");require("./components-ui-navigation-menu-navigation-menu.styles.cjs");require("./components-ui-pagination-pagination.cjs");require("./components-ui-progress-progress.cjs");require("./components-ui-radio-group-radio-group.cjs");require("./components-ui-switch-switch.cjs");require("./components-ui-toggle-toggle.styles.cjs");require("./components-ui-toggle-group-toggle-group.cjs");require("./components-ui-table-table.cjs");require("./components-ui-tabs-tabs.cjs");require("./components-ui-tooltip-tooltip.cjs");require("./components-ui-typography-typography.styles.cjs");require("brd-phosphor-strokes-icons/icons/CaretLeft");require("brd-phosphor-strokes-icons/icons/CaretRight");require("./components-app-pagination-app-pagination.styles.cjs");require("brd-phosphor-strokes-icons/icons/CaretUpDown");require("./components-app-sidebar-app-sidebar.styles.cjs");require("./components-data-table-data-table.styles.cjs");require("./components-ui-dropdown-menu-dropdown-menu.styles.cjs");require("brd-phosphor-strokes-icons/icons/Eye");require("brd-phosphor-strokes-icons/icons/EyeSlash");require("./components-select-field-select-field.cjs");require("./lodash-kqhtUJfz.cjs");require("./chart-9H_9wEfR.cjs");require("brd-phosphor-strokes-icons/icons/CheckCircle");require("brd-phosphor-strokes-icons/icons/Info");require("brd-phosphor-strokes-icons/icons/SpinnerGap");require("brd-phosphor-strokes-icons/icons/Warning");require("brd-phosphor-strokes-icons/icons/X");require("brd-phosphor-strokes-icons/icons/XCircle");require("./index-DGxwh2Ms.cjs");require("./index-fTTv8YY8.cjs");require("brd-phosphor-strokes-icons/icons/Plus");require("brd-phosphor-strokes-icons/icons/CaretUp");require("brd-phosphor-strokes-icons/icons/EnvelopeSimple");require("brd-phosphor-strokes-icons/icons/MaxLogo");require("brd-phosphor-strokes-icons/icons/Phone");require("brd-phosphor-strokes-icons/icons/TelegramLogo");require("brd-phosphor-strokes-icons/icons/WhatsAppLogoFilled");require("./components-input-phone-input-phone.cjs");require("./components-card-info-card-info.styles.cjs");const R=300,_=({options:i,value:n,onChange:b,onSearch:q,placeholder:v="Выберите...",searchPlaceholder:C="Поиск...",emptyText:d="Ничего не найдено",loadingText:j="Загрузка...",loading:g=!1,disabled:t=!1,showClear:I=!1,isValid:x,className:S,error:T,renderOption:f,debounceMs:h=R})=>{const[a,s]=l.useState(""),c=l.useRef(null);l.useEffect(()=>{if(q)return c.current=setTimeout(()=>{q(a)},h),()=>{c.current&&clearTimeout(c.current)}},[h,q,a]);const y={...x===!0&&!t&&{"aria-valid":!0},...x===!1&&!t&&{"aria-invalid":!0},disabled:t},o=l.useMemo(()=>i.find(e=>e.value===n)??null,[i,n]),E=l.useMemo(()=>{if(q)return i;const e=a.trim().toLowerCase();return e?i.filter(m=>m.label.toLowerCase().includes(e)):i},[q,i,a]),V=o?o.label:v,L=e=>{if(!e||e.value===n){b?.(""),s("");return}b?.(e.value,e),s("")};return r.jsx(u.ComboboxField,{error:T,children:r.jsxs(u.Combobox,{items:E,value:o,itemToStringLabel:e=>e.label,itemToStringValue:e=>e.value,isItemEqualToValue:(e,m)=>e.value===m.value,onInputValueChange:s,onValueChange:t?void 0:L,children:[r.jsx(u.ComboboxInput,{...y,disabled:t,className:S,placeholder:o?V:C,showClear:I}),r.jsxs(u.ComboboxContent,{children:[r.jsx(u.ComboboxEmpty,{children:g?j:d}),r.jsx(u.ComboboxList,{children:e=>r.jsx(u.ComboboxItem,{value:e,children:f?f(e):r.jsx("div",{className:"hover:bg-primary-hover-bg w-full px-4 py-2",children:e.label})},e.value)})]})]})})};exports.InputSearch=_;
 //# sourceMappingURL=components-input-search-input-search.cjs.map

package/dist/components-input-search-input-search.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"components-input-search-input-search.cjs","sources":["../src/components/input-search/input-search.tsx"],"sourcesContent":["import {\n  Combobox,\n  ComboboxContent,\n  ComboboxEmpty,\n  ComboboxInput,\n  ComboboxItem,\n  ComboboxList,\n} from \"@/index\";\nimport { useEffect, useMemo, useRef, useState, type ReactNode } from \"react\";\n\nexport type InputSearchOption<T = unknown> = {\n  value: string;\n  label: string;\n  meta?: T;\n};\n\ntype InputSearchProps<T = unknown> = {\n  options: InputSearchOption<T>[];\n  value?: string;\n  onChange?: (value: string, option?: InputSearchOption<T>) => void;\n  onSearch?: (search: string) => void;\n  placeholder?: string;\n  searchPlaceholder?: string;\n  emptyText?: string;\n  loadingText?: string;\n  loading?: boolean;\n  disabled?: boolean;\n  className?: string;\n  renderOption?: (option: InputSearchOption<T>) => ReactNode;\n  debounceMs?: number;\n};\n\nconst DEBOUNCE_MS = 300;\n\nexport const InputSearch = <T,>({\n  options,\n  value,\n  onChange,\n  onSearch,\n  placeholder = \"Выберите...\",\n  searchPlaceholder = \"Поиск...\",\n  emptyText = \"Ничего не найдено\",\n  loadingText = \"Загрузка...\",\n  loading = false,\n  disabled = false,\n  className,\n  renderOption,\n  debounceMs = DEBOUNCE_MS,\n}: InputSearchProps<T>) => {\n  const [searchValue, setSearchValue] = useState(\"\");\n  const timerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n  useEffect(() => {\n    if (!onSearch) return;\n\n    timerRef.current = setTimeout(() => {\n      onSearch(searchValue);\n    }, debounceMs);\n\n    return () => {\n      if (timerRef.current) {\n        clearTimeout(timerRef.current);\n      }\n    };\n  }, [debounceMs, onSearch, searchValue]);\n\n  const selectedOption = useMemo(\n    () => options.find((option) => option.value === value) ?? null,\n    [options, value],\n  );\n\n  const filteredOptions = useMemo(() => {\n    if (onSearch) return options;\n\n    const normalizedSearch = searchValue.trim().toLowerCase();\n    if (!normalizedSearch) return options;\n\n    return options.filter((option) =>\n      option.label.toLowerCase().includes(normalizedSearch),\n    );\n  }, [onSearch, options, searchValue]);\n\n  const inputPlaceholder = selectedOption ? selectedOption.label : placeholder;\n\n  const handleChange = (option: InputSearchOption<T> | null) => {\n    if (!option || option.value === value) {\n      onChange?.(\"\");\n      setSearchValue(\"\");\n      return;\n    }\n\n    onChange?.(option.value, option);\n    setSearchValue(\"\");\n  };\n\n  return (\n    <Combobox\n      items={options}\n      value={selectedOption}\n      onInputValueChange={setSearchValue}\n      onValueChange={disabled ? undefined : handleChange}\n    >\n      <ComboboxInput\n        disabled={disabled}\n        className={className}\n        placeholder={selectedOption ? inputPlaceholder : searchPlaceholder}\n      />\n\n      <ComboboxContent>\n        <ComboboxEmpty>{loading ? loadingText : emptyText}</ComboboxEmpty>\n        <ComboboxList>\n          {filteredOptions.map((option) => (\n            <ComboboxItem\n              key={option.value}\n              value={option}\n            >\n              {renderOption ? (\n                renderOption(option)\n              ) : (\n                <div className=\"hover:bg-primary-hover-bg w-full px-4 py-2\">\n                  {option.label}\n                </div>\n              )}\n            </ComboboxItem>\n          ))}\n        </ComboboxList>\n      </ComboboxContent>\n    </Combobox>\n  );\n};\n\nexport type { InputSearchProps };\n"],"names":["DEBOUNCE_MS","InputSearch","options","value","onChange","onSearch","placeholder","searchPlaceholder","emptyText","loadingText","loading","disabled","className","renderOption","debounceMs","searchValue","setSearchValue","useState","timerRef","useRef","useEffect","selectedOption","useMemo","option","filteredOptions","normalizedSearch","inputPlaceholder","handleChange","jsxs","Combobox","jsx","ComboboxInput","ComboboxContent","ComboboxEmpty","ComboboxList","ComboboxItem"],"mappings":"2lGAgCA,MAAMA,EAAc,IAEPC,EAAc,CAAK,CAC9B,QAAAC,EACA,MAAAC,EACA,SAAAC,EACA,SAAAC,EACA,YAAAC,EAAc,cACd,kBAAAC,EAAoB,WACpB,UAAAC,EAAY,oBACZ,YAAAC,EAAc,cACd,QAAAC,EAAU,GACV,SAAAC,EAAW,GACX,UAAAC,EACA,aAAAC,EACA,WAAAC,EAAad,CACf,IAA2B,CACzB,KAAM,CAACe,EAAaC,CAAc,EAAIC,EAAAA,SAAS,EAAE,EAC3CC,EAAWC,EAAAA,OAA6C,IAAI,EAElEC,EAAAA,UAAU,IAAM,CACd,GAAKf,EAEL,OAAAa,EAAS,QAAU,WAAW,IAAM,CAClCb,EAASU,CAAW,CACtB,EAAGD,CAAU,EAEN,IAAM,CACPI,EAAS,SACX,aAAaA,EAAS,OAAO,CAEjC,CACF,EAAG,CAACJ,EAAYT,EAAUU,CAAW,CAAC,EAEtC,MAAMM,EAAiBC,EAAAA,QACrB,IAAMpB,EAAQ,KAAMqB,GAAWA,EAAO,QAAUpB,CAAK,GAAK,KAC1D,CAACD,EAASC,CAAK,CAAA,EAGXqB,EAAkBF,EAAAA,QAAQ,IAAM,CACpC,GAAIjB,EAAU,OAAOH,EAErB,MAAMuB,EAAmBV,EAAY,KAAA,EAAO,YAAA,EAC5C,OAAKU,EAEEvB,EAAQ,OAAQqB,GACrBA,EAAO,MAAM,YAAA,EAAc,SAASE,CAAgB,CAAA,EAHxBvB,CAKhC,EAAG,CAACG,EAAUH,EAASa,CAAW,CAAC,EAE7BW,EAAmBL,EAAiBA,EAAe,MAAQf,EAE3DqB,EAAgBJ,GAAwC,CAC5D,GAAI,CAACA,GAAUA,EAAO,QAAUpB,EAAO,CACrCC,IAAW,EAAE,EACbY,EAAe,EAAE,EACjB,MACF,CAEAZ,IAAWmB,EAAO,MAAOA,CAAM,EAC/BP,EAAe,EAAE,CACnB,EAEA,OACEY,EAAAA,KAACC,EAAAA,SAAA,CACC,MAAO3B,EACP,MAAOmB,EACP,mBAAoBL,EACpB,cAAeL,EAAW,OAAYgB,EAEtC,SAAA,CAAAG,EAAAA,IAACC,EAAAA,cAAA,CACC,SAAApB,EACA,UAAAC,EACA,YAAaS,EAAiBK,EAAmBnB,CAAA,CAAA,SAGlDyB,EAAAA,gBAAA,CACC,SAAA,CAAAF,EAAAA,IAACG,EAAAA,cAAA,CAAe,SAAAvB,EAAUD,EAAcD,EAAU,EAClDsB,EAAAA,IAACI,EAAAA,aAAA,CACE,SAAAV,EAAgB,IAAKD,GACpBO,EAAAA,IAACK,EAAAA,aAAA,CAEC,MAAOZ,EAEN,SAAAV,EACCA,EAAaU,CAAM,QAElB,MAAA,CAAI,UAAU,6CACZ,SAAAA,EAAO,KAAA,CACV,CAAA,EARGA,EAAO,KAAA,CAWf,CAAA,CACH,CAAA,CAAA,CACF,CAAA,CAAA,CAAA,CAGN"}
+{"version":3,"file":"components-input-search-input-search.cjs","sources":["../src/components/input-search/input-search.tsx"],"sourcesContent":["import {\n  Combobox,\n  ComboboxContent,\n  ComboboxEmpty,\n  ComboboxField,\n  ComboboxInput,\n  ComboboxItem,\n  ComboboxList,\n} from \"@/index\";\nimport { useEffect, useMemo, useRef, useState, type ReactNode } from \"react\";\n\nexport type InputSearchOption<T = unknown> = {\n  value: string;\n  label: string;\n  meta?: T;\n};\n\ntype InputSearchProps<T = unknown> = {\n  options: InputSearchOption<T>[];\n  value?: string;\n  onChange?: (value: string, option?: InputSearchOption<T>) => void;\n  onSearch?: (search: string) => void;\n  placeholder?: string;\n  searchPlaceholder?: string;\n  emptyText?: string;\n  loadingText?: string;\n  loading?: boolean;\n  disabled?: boolean;\n  className?: string;\n  renderOption?: (option: InputSearchOption<T>) => ReactNode;\n  debounceMs?: number;\n  showClear?: boolean;\n  isValid?: boolean;\n  error?: string;\n};\n\nconst DEBOUNCE_MS = 300;\n\nexport const InputSearch = <T,>({\n  options,\n  value,\n  onChange,\n  onSearch,\n  placeholder = \"Выберите...\",\n  searchPlaceholder = \"Поиск...\",\n  emptyText = \"Ничего не найдено\",\n  loadingText = \"Загрузка...\",\n  loading = false,\n  disabled = false,\n  showClear = false,\n  isValid,\n  className,\n  error,\n  renderOption,\n  debounceMs = DEBOUNCE_MS,\n}: InputSearchProps<T>) => {\n  const [searchValue, setSearchValue] = useState(\"\");\n  const timerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n  useEffect(() => {\n    if (!onSearch) return;\n\n    timerRef.current = setTimeout(() => {\n      onSearch(searchValue);\n    }, debounceMs);\n\n    return () => {\n      if (timerRef.current) {\n        clearTimeout(timerRef.current);\n      }\n    };\n  }, [debounceMs, onSearch, searchValue]);\n\n  const validationProps = {\n    ...(isValid === true && !disabled && { \"aria-valid\": true }),\n    ...(isValid === false && !disabled && { \"aria-invalid\": true }),\n    disabled,\n  };\n\n  const selectedOption = useMemo(\n    () => options.find((option) => option.value === value) ?? null,\n    [options, value],\n  );\n\n  const filteredOptions = useMemo(() => {\n    if (onSearch) return options;\n\n    const normalizedSearch = searchValue.trim().toLowerCase();\n    if (!normalizedSearch) return options;\n\n    return options.filter((option) =>\n      option.label.toLowerCase().includes(normalizedSearch),\n    );\n  }, [onSearch, options, searchValue]);\n\n  const inputPlaceholder = selectedOption ? selectedOption.label : placeholder;\n\n  const handleChange = (option: InputSearchOption<T> | null) => {\n    if (!option || option.value === value) {\n      onChange?.(\"\");\n      setSearchValue(\"\");\n      return;\n    }\n\n    onChange?.(option.value, option);\n    setSearchValue(\"\");\n  };\n\n  return (\n    <ComboboxField error={error}>\n      <Combobox\n        items={filteredOptions}\n        value={selectedOption}\n        itemToStringLabel={(option) => option.label}\n        itemToStringValue={(option) => option.value}\n        isItemEqualToValue={(option, currentValue) =>\n          option.value === currentValue.value\n        }\n        onInputValueChange={setSearchValue}\n        onValueChange={disabled ? undefined : handleChange}\n      >\n        <ComboboxInput\n          {...validationProps}\n          disabled={disabled}\n          className={className}\n          placeholder={selectedOption ? inputPlaceholder : searchPlaceholder}\n          showClear={showClear}\n        />\n\n        <ComboboxContent>\n          <ComboboxEmpty>{loading ? loadingText : emptyText}</ComboboxEmpty>\n          <ComboboxList>\n            {(option: InputSearchOption<T>) => (\n              <ComboboxItem\n                key={option.value}\n                value={option}\n              >\n                {renderOption ? (\n                  renderOption(option)\n                ) : (\n                  <div className=\"hover:bg-primary-hover-bg w-full px-4 py-2\">\n                    {option.label}\n                  </div>\n                )}\n              </ComboboxItem>\n            )}\n          </ComboboxList>\n        </ComboboxContent>\n      </Combobox>\n    </ComboboxField>\n  );\n};\n\nexport type { InputSearchProps };\n"],"names":["DEBOUNCE_MS","InputSearch","options","value","onChange","onSearch","placeholder","searchPlaceholder","emptyText","loadingText","loading","disabled","showClear","isValid","className","error","renderOption","debounceMs","searchValue","setSearchValue","useState","timerRef","useRef","useEffect","validationProps","selectedOption","useMemo","option","filteredOptions","normalizedSearch","inputPlaceholder","handleChange","jsx","ComboboxField","jsxs","Combobox","currentValue","ComboboxInput","ComboboxContent","ComboboxEmpty","ComboboxList","ComboboxItem"],"mappings":"2lGAoCA,MAAMA,EAAc,IAEPC,EAAc,CAAK,CAC9B,QAAAC,EACA,MAAAC,EACA,SAAAC,EACA,SAAAC,EACA,YAAAC,EAAc,cACd,kBAAAC,EAAoB,WACpB,UAAAC,EAAY,oBACZ,YAAAC,EAAc,cACd,QAAAC,EAAU,GACV,SAAAC,EAAW,GACX,UAAAC,EAAY,GACZ,QAAAC,EACA,UAAAC,EACA,MAAAC,EACA,aAAAC,EACA,WAAAC,EAAajB,CACf,IAA2B,CACzB,KAAM,CAACkB,EAAaC,CAAc,EAAIC,EAAAA,SAAS,EAAE,EAC3CC,EAAWC,EAAAA,OAA6C,IAAI,EAElEC,EAAAA,UAAU,IAAM,CACd,GAAKlB,EAEL,OAAAgB,EAAS,QAAU,WAAW,IAAM,CAClChB,EAASa,CAAW,CACtB,EAAGD,CAAU,EAEN,IAAM,CACPI,EAAS,SACX,aAAaA,EAAS,OAAO,CAEjC,CACF,EAAG,CAACJ,EAAYZ,EAAUa,CAAW,CAAC,EAEtC,MAAMM,EAAkB,CACtB,GAAIX,IAAY,IAAQ,CAACF,GAAY,CAAE,aAAc,EAAA,EACrD,GAAIE,IAAY,IAAS,CAACF,GAAY,CAAE,eAAgB,EAAA,EACxD,SAAAA,CAAA,EAGIc,EAAiBC,EAAAA,QACrB,IAAMxB,EAAQ,KAAMyB,GAAWA,EAAO,QAAUxB,CAAK,GAAK,KAC1D,CAACD,EAASC,CAAK,CAAA,EAGXyB,EAAkBF,EAAAA,QAAQ,IAAM,CACpC,GAAIrB,EAAU,OAAOH,EAErB,MAAM2B,EAAmBX,EAAY,KAAA,EAAO,YAAA,EAC5C,OAAKW,EAEE3B,EAAQ,OAAQyB,GACrBA,EAAO,MAAM,YAAA,EAAc,SAASE,CAAgB,CAAA,EAHxB3B,CAKhC,EAAG,CAACG,EAAUH,EAASgB,CAAW,CAAC,EAE7BY,EAAmBL,EAAiBA,EAAe,MAAQnB,EAE3DyB,EAAgBJ,GAAwC,CAC5D,GAAI,CAACA,GAAUA,EAAO,QAAUxB,EAAO,CACrCC,IAAW,EAAE,EACbe,EAAe,EAAE,EACjB,MACF,CAEAf,IAAWuB,EAAO,MAAOA,CAAM,EAC/BR,EAAe,EAAE,CACnB,EAEA,OACEa,EAAAA,IAACC,EAAAA,eAAc,MAAAlB,EACb,SAAAmB,EAAAA,KAACC,EAAAA,SAAA,CACC,MAAOP,EACP,MAAOH,EACP,kBAAoBE,GAAWA,EAAO,MACtC,kBAAoBA,GAAWA,EAAO,MACtC,mBAAoB,CAACA,EAAQS,IAC3BT,EAAO,QAAUS,EAAa,MAEhC,mBAAoBjB,EACpB,cAAeR,EAAW,OAAYoB,EAEtC,SAAA,CAAAC,EAAAA,IAACK,EAAAA,cAAA,CACE,GAAGb,EACJ,SAAAb,EACA,UAAAG,EACA,YAAaW,EAAiBK,EAAmBvB,EACjD,UAAAK,CAAA,CAAA,SAGD0B,EAAAA,gBAAA,CACC,SAAA,CAAAN,EAAAA,IAACO,EAAAA,cAAA,CAAe,SAAA7B,EAAUD,EAAcD,EAAU,EAClDwB,EAAAA,IAACQ,EAAAA,aAAA,CACE,SAACb,GACAK,EAAAA,IAACS,EAAAA,aAAA,CAEC,MAAOd,EAEN,SAAAX,EACCA,EAAaW,CAAM,QAElB,MAAA,CAAI,UAAU,6CACZ,SAAAA,EAAO,KAAA,CACV,CAAA,EARGA,EAAO,KAAA,CAUd,CAEJ,CAAA,CAAA,CACF,CAAA,CAAA,CAAA,EAEJ,CAEJ"}

package/dist/components-input-search-input-search.js

@@ -1,4 +1,4 @@
-import { jsxs as f, jsx as o } from "react/jsx-runtime";
+import { jsx as o, jsxs as h } from "react/jsx-runtime";
 import "./approval-log.view-CZoufOXF.js";
 import "./lib-utils.js";
 import "class-variance-authority";
@@ -8,10 +8,10 @@ import "./components-ui-button-button.styles.js";
 import "./components-ui-card-card.js";
 import "./components-ui-checkbox-checkbox.js";
 import "brd-phosphor-strokes-icons/icons/CaretDown";
-import { useState as w, useRef as y, useEffect as L, useMemo as b } from "react";
+import { useState as S, useRef as j, useEffect as N, useMemo as v } from "react";
 import "./calendar-B78l3uF9.js";
 import "brd-phosphor-strokes-icons/icons";
-import { Combobox as j, ComboboxInput as N, ComboboxContent as O, ComboboxEmpty as R, ComboboxList as T, ComboboxItem as z } from "./components-ui-combobox-combobox.js";
+import { ComboboxField as O, Combobox as P, ComboboxInput as R, ComboboxContent as q, ComboboxEmpty as z, ComboboxList as B, ComboboxItem as D } from "./components-ui-combobox-combobox.js";
 import "./components-ui-dialog-dialog.js";
 import "./components-ui-label-label.js";
 import "./components-ui-separator-separator.js";
@@ -60,78 +60,90 @@ import "brd-phosphor-strokes-icons/icons/TelegramLogo";
 import "brd-phosphor-strokes-icons/icons/WhatsAppLogoFilled";
 import "./components-input-phone-input-phone.js";
 import "./components-card-info-card-info.styles.js";
-const B = 300, Fr = ({
+const F = 300, Qr = ({
   options: t,
-  value: p,
-  onChange: a,
-  onSearch: m,
-  placeholder: h = "Выберите...",
+  value: l,
+  onChange: c,
+  onSearch: i,
+  placeholder: C = "Выберите...",
   searchPlaceholder: d = "Поиск...",
-  emptyText: C = "Ничего не найдено",
-  loadingText: x = "Загрузка...",
-  loading: v = !1,
-  disabled: n = !1,
-  className: g,
-  renderOption: c,
-  debounceMs: s = B
+  emptyText: x = "Ничего не найдено",
+  loadingText: g = "Загрузка...",
+  loading: E = !1,
+  disabled: m = !1,
+  showClear: I = !1,
+  isValid: s,
+  className: T,
+  error: V,
+  renderOption: f,
+  debounceMs: b = F
 }) => {
-  const [i, l] = w(""), u = y(null);
-  L(() => {
-    if (m)
+  const [e, a] = S(""), u = j(null);
+  N(() => {
+    if (i)
       return u.current = setTimeout(() => {
-        m(i);
-      }, s), () => {
+        i(e);
+      }, b), () => {
         u.current && clearTimeout(u.current);
       };
-  }, [s, m, i]);
-  const e = b(
-    () => t.find((r) => r.value === p) ?? null,
-    [t, p]
-  ), E = b(() => {
-    if (m) return t;
-    const r = i.trim().toLowerCase();
+  }, [b, i, e]);
+  const L = {
+    ...s === !0 && !m && { "aria-valid": !0 },
+    ...s === !1 && !m && { "aria-invalid": !0 },
+    disabled: m
+  }, p = v(
+    () => t.find((r) => r.value === l) ?? null,
+    [t, l]
+  ), w = v(() => {
+    if (i) return t;
+    const r = e.trim().toLowerCase();
     return r ? t.filter(
-      (V) => V.label.toLowerCase().includes(r)
+      (n) => n.label.toLowerCase().includes(r)
     ) : t;
-  }, [m, t, i]), I = e ? e.label : h;
-  return /* @__PURE__ */ f(
-    j,
+  }, [i, t, e]), y = p ? p.label : C;
+  return /* @__PURE__ */ o(O, { error: V, children: /* @__PURE__ */ h(
+    P,
     {
-      items: t,
-      value: e,
-      onInputValueChange: l,
-      onValueChange: n ? void 0 : (r) => {
-        if (!r || r.value === p) {
-          a?.(""), l("");
+      items: w,
+      value: p,
+      itemToStringLabel: (r) => r.label,
+      itemToStringValue: (r) => r.value,
+      isItemEqualToValue: (r, n) => r.value === n.value,
+      onInputValueChange: a,
+      onValueChange: m ? void 0 : (r) => {
+        if (!r || r.value === l) {
+          c?.(""), a("");
           return;
         }
-        a?.(r.value, r), l("");
+        c?.(r.value, r), a("");
       },
       children: [
         /* @__PURE__ */ o(
-          N,
+          R,
           {
-            disabled: n,
-            className: g,
-            placeholder: e ? I : d
+            ...L,
+            disabled: m,
+            className: T,
+            placeholder: p ? y : d,
+            showClear: I
           }
         ),
-        /* @__PURE__ */ f(O, { children: [
-          /* @__PURE__ */ o(R, { children: v ? x : C }),
-          /* @__PURE__ */ o(T, { children: E.map((r) => /* @__PURE__ */ o(
-            z,
+        /* @__PURE__ */ h(q, { children: [
+          /* @__PURE__ */ o(z, { children: E ? g : x }),
+          /* @__PURE__ */ o(B, { children: (r) => /* @__PURE__ */ o(
+            D,
             {
               value: r,
-              children: c ? c(r) : /* @__PURE__ */ o("div", { className: "hover:bg-primary-hover-bg w-full px-4 py-2", children: r.label })
+              children: f ? f(r) : /* @__PURE__ */ o("div", { className: "hover:bg-primary-hover-bg w-full px-4 py-2", children: r.label })
             },
             r.value
-          )) })
+          ) })
         ] })
       ]
     }
-  );
+  ) });
 };
 export {
-  Fr as InputSearch
+  Qr as InputSearch
 };
 //# sourceMappingURL=components-input-search-input-search.js.map

package/dist/components-input-search-input-search.js.map

@@ -1 +1 @@
-{"version":3,"file":"components-input-search-input-search.js","sources":["../src/components/input-search/input-search.tsx"],"sourcesContent":["import {\n  Combobox,\n  ComboboxContent,\n  ComboboxEmpty,\n  ComboboxInput,\n  ComboboxItem,\n  ComboboxList,\n} from \"@/index\";\nimport { useEffect, useMemo, useRef, useState, type ReactNode } from \"react\";\n\nexport type InputSearchOption<T = unknown> = {\n  value: string;\n  label: string;\n  meta?: T;\n};\n\ntype InputSearchProps<T = unknown> = {\n  options: InputSearchOption<T>[];\n  value?: string;\n  onChange?: (value: string, option?: InputSearchOption<T>) => void;\n  onSearch?: (search: string) => void;\n  placeholder?: string;\n  searchPlaceholder?: string;\n  emptyText?: string;\n  loadingText?: string;\n  loading?: boolean;\n  disabled?: boolean;\n  className?: string;\n  renderOption?: (option: InputSearchOption<T>) => ReactNode;\n  debounceMs?: number;\n};\n\nconst DEBOUNCE_MS = 300;\n\nexport const InputSearch = <T,>({\n  options,\n  value,\n  onChange,\n  onSearch,\n  placeholder = \"Выберите...\",\n  searchPlaceholder = \"Поиск...\",\n  emptyText = \"Ничего не найдено\",\n  loadingText = \"Загрузка...\",\n  loading = false,\n  disabled = false,\n  className,\n  renderOption,\n  debounceMs = DEBOUNCE_MS,\n}: InputSearchProps<T>) => {\n  const [searchValue, setSearchValue] = useState(\"\");\n  const timerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n  useEffect(() => {\n    if (!onSearch) return;\n\n    timerRef.current = setTimeout(() => {\n      onSearch(searchValue);\n    }, debounceMs);\n\n    return () => {\n      if (timerRef.current) {\n        clearTimeout(timerRef.current);\n      }\n    };\n  }, [debounceMs, onSearch, searchValue]);\n\n  const selectedOption = useMemo(\n    () => options.find((option) => option.value === value) ?? null,\n    [options, value],\n  );\n\n  const filteredOptions = useMemo(() => {\n    if (onSearch) return options;\n\n    const normalizedSearch = searchValue.trim().toLowerCase();\n    if (!normalizedSearch) return options;\n\n    return options.filter((option) =>\n      option.label.toLowerCase().includes(normalizedSearch),\n    );\n  }, [onSearch, options, searchValue]);\n\n  const inputPlaceholder = selectedOption ? selectedOption.label : placeholder;\n\n  const handleChange = (option: InputSearchOption<T> | null) => {\n    if (!option || option.value === value) {\n      onChange?.(\"\");\n      setSearchValue(\"\");\n      return;\n    }\n\n    onChange?.(option.value, option);\n    setSearchValue(\"\");\n  };\n\n  return (\n    <Combobox\n      items={options}\n      value={selectedOption}\n      onInputValueChange={setSearchValue}\n      onValueChange={disabled ? undefined : handleChange}\n    >\n      <ComboboxInput\n        disabled={disabled}\n        className={className}\n        placeholder={selectedOption ? inputPlaceholder : searchPlaceholder}\n      />\n\n      <ComboboxContent>\n        <ComboboxEmpty>{loading ? loadingText : emptyText}</ComboboxEmpty>\n        <ComboboxList>\n          {filteredOptions.map((option) => (\n            <ComboboxItem\n              key={option.value}\n              value={option}\n            >\n              {renderOption ? (\n                renderOption(option)\n              ) : (\n                <div className=\"hover:bg-primary-hover-bg w-full px-4 py-2\">\n                  {option.label}\n                </div>\n              )}\n            </ComboboxItem>\n          ))}\n        </ComboboxList>\n      </ComboboxContent>\n    </Combobox>\n  );\n};\n\nexport type { InputSearchProps };\n"],"names":["DEBOUNCE_MS","InputSearch","options","value","onChange","onSearch","placeholder","searchPlaceholder","emptyText","loadingText","loading","disabled","className","renderOption","debounceMs","searchValue","setSearchValue","useState","timerRef","useRef","useEffect","selectedOption","useMemo","option","filteredOptions","normalizedSearch","inputPlaceholder","jsxs","Combobox","jsx","ComboboxInput","ComboboxContent","ComboboxEmpty","ComboboxList","ComboboxItem"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgCA,MAAMA,IAAc,KAEPC,KAAc,CAAK;AAAA,EAC9B,SAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,mBAAAC,IAAoB;AAAA,EACpB,WAAAC,IAAY;AAAA,EACZ,aAAAC,IAAc;AAAA,EACd,SAAAC,IAAU;AAAA,EACV,UAAAC,IAAW;AAAA,EACX,WAAAC;AAAA,EACA,cAAAC;AAAA,EACA,YAAAC,IAAad;AACf,MAA2B;AACzB,QAAM,CAACe,GAAaC,CAAc,IAAIC,EAAS,EAAE,GAC3CC,IAAWC,EAA6C,IAAI;AAElE,EAAAC,EAAU,MAAM;AACd,QAAKf;AAEL,aAAAa,EAAS,UAAU,WAAW,MAAM;AAClC,QAAAb,EAASU,CAAW;AAAA,MACtB,GAAGD,CAAU,GAEN,MAAM;AACX,QAAII,EAAS,WACX,aAAaA,EAAS,OAAO;AAAA,MAEjC;AAAA,EACF,GAAG,CAACJ,GAAYT,GAAUU,CAAW,CAAC;AAEtC,QAAMM,IAAiBC;AAAA,IACrB,MAAMpB,EAAQ,KAAK,CAACqB,MAAWA,EAAO,UAAUpB,CAAK,KAAK;AAAA,IAC1D,CAACD,GAASC,CAAK;AAAA,EAAA,GAGXqB,IAAkBF,EAAQ,MAAM;AACpC,QAAIjB,EAAU,QAAOH;AAErB,UAAMuB,IAAmBV,EAAY,KAAA,EAAO,YAAA;AAC5C,WAAKU,IAEEvB,EAAQ;AAAA,MAAO,CAACqB,MACrBA,EAAO,MAAM,YAAA,EAAc,SAASE,CAAgB;AAAA,IAAA,IAHxBvB;AAAA,EAKhC,GAAG,CAACG,GAAUH,GAASa,CAAW,CAAC,GAE7BW,IAAmBL,IAAiBA,EAAe,QAAQf;AAajE,SACE,gBAAAqB;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,OAAO1B;AAAA,MACP,OAAOmB;AAAA,MACP,oBAAoBL;AAAA,MACpB,eAAeL,IAAW,SAhBT,CAACY,MAAwC;AAC5D,YAAI,CAACA,KAAUA,EAAO,UAAUpB,GAAO;AACrC,UAAAC,IAAW,EAAE,GACbY,EAAe,EAAE;AACjB;AAAA,QACF;AAEA,QAAAZ,IAAWmB,EAAO,OAAOA,CAAM,GAC/BP,EAAe,EAAE;AAAA,MACnB;AAAA,MASI,UAAA;AAAA,QAAA,gBAAAa;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,UAAAnB;AAAA,YACA,WAAAC;AAAA,YACA,aAAaS,IAAiBK,IAAmBnB;AAAA,UAAA;AAAA,QAAA;AAAA,0BAGlDwB,GAAA,EACC,UAAA;AAAA,UAAA,gBAAAF,EAACG,GAAA,EAAe,UAAAtB,IAAUD,IAAcD,GAAU;AAAA,UAClD,gBAAAqB,EAACI,GAAA,EACE,UAAAT,EAAgB,IAAI,CAACD,MACpB,gBAAAM;AAAA,YAACK;AAAA,YAAA;AAAA,cAEC,OAAOX;AAAA,cAEN,UAAAV,IACCA,EAAaU,CAAM,sBAElB,OAAA,EAAI,WAAU,8CACZ,UAAAA,EAAO,MAAA,CACV;AAAA,YAAA;AAAA,YARGA,EAAO;AAAA,UAAA,CAWf,EAAA,CACH;AAAA,QAAA,EAAA,CACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"components-input-search-input-search.js","sources":["../src/components/input-search/input-search.tsx"],"sourcesContent":["import {\n  Combobox,\n  ComboboxContent,\n  ComboboxEmpty,\n  ComboboxField,\n  ComboboxInput,\n  ComboboxItem,\n  ComboboxList,\n} from \"@/index\";\nimport { useEffect, useMemo, useRef, useState, type ReactNode } from \"react\";\n\nexport type InputSearchOption<T = unknown> = {\n  value: string;\n  label: string;\n  meta?: T;\n};\n\ntype InputSearchProps<T = unknown> = {\n  options: InputSearchOption<T>[];\n  value?: string;\n  onChange?: (value: string, option?: InputSearchOption<T>) => void;\n  onSearch?: (search: string) => void;\n  placeholder?: string;\n  searchPlaceholder?: string;\n  emptyText?: string;\n  loadingText?: string;\n  loading?: boolean;\n  disabled?: boolean;\n  className?: string;\n  renderOption?: (option: InputSearchOption<T>) => ReactNode;\n  debounceMs?: number;\n  showClear?: boolean;\n  isValid?: boolean;\n  error?: string;\n};\n\nconst DEBOUNCE_MS = 300;\n\nexport const InputSearch = <T,>({\n  options,\n  value,\n  onChange,\n  onSearch,\n  placeholder = \"Выберите...\",\n  searchPlaceholder = \"Поиск...\",\n  emptyText = \"Ничего не найдено\",\n  loadingText = \"Загрузка...\",\n  loading = false,\n  disabled = false,\n  showClear = false,\n  isValid,\n  className,\n  error,\n  renderOption,\n  debounceMs = DEBOUNCE_MS,\n}: InputSearchProps<T>) => {\n  const [searchValue, setSearchValue] = useState(\"\");\n  const timerRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n  useEffect(() => {\n    if (!onSearch) return;\n\n    timerRef.current = setTimeout(() => {\n      onSearch(searchValue);\n    }, debounceMs);\n\n    return () => {\n      if (timerRef.current) {\n        clearTimeout(timerRef.current);\n      }\n    };\n  }, [debounceMs, onSearch, searchValue]);\n\n  const validationProps = {\n    ...(isValid === true && !disabled && { \"aria-valid\": true }),\n    ...(isValid === false && !disabled && { \"aria-invalid\": true }),\n    disabled,\n  };\n\n  const selectedOption = useMemo(\n    () => options.find((option) => option.value === value) ?? null,\n    [options, value],\n  );\n\n  const filteredOptions = useMemo(() => {\n    if (onSearch) return options;\n\n    const normalizedSearch = searchValue.trim().toLowerCase();\n    if (!normalizedSearch) return options;\n\n    return options.filter((option) =>\n      option.label.toLowerCase().includes(normalizedSearch),\n    );\n  }, [onSearch, options, searchValue]);\n\n  const inputPlaceholder = selectedOption ? selectedOption.label : placeholder;\n\n  const handleChange = (option: InputSearchOption<T> | null) => {\n    if (!option || option.value === value) {\n      onChange?.(\"\");\n      setSearchValue(\"\");\n      return;\n    }\n\n    onChange?.(option.value, option);\n    setSearchValue(\"\");\n  };\n\n  return (\n    <ComboboxField error={error}>\n      <Combobox\n        items={filteredOptions}\n        value={selectedOption}\n        itemToStringLabel={(option) => option.label}\n        itemToStringValue={(option) => option.value}\n        isItemEqualToValue={(option, currentValue) =>\n          option.value === currentValue.value\n        }\n        onInputValueChange={setSearchValue}\n        onValueChange={disabled ? undefined : handleChange}\n      >\n        <ComboboxInput\n          {...validationProps}\n          disabled={disabled}\n          className={className}\n          placeholder={selectedOption ? inputPlaceholder : searchPlaceholder}\n          showClear={showClear}\n        />\n\n        <ComboboxContent>\n          <ComboboxEmpty>{loading ? loadingText : emptyText}</ComboboxEmpty>\n          <ComboboxList>\n            {(option: InputSearchOption<T>) => (\n              <ComboboxItem\n                key={option.value}\n                value={option}\n              >\n                {renderOption ? (\n                  renderOption(option)\n                ) : (\n                  <div className=\"hover:bg-primary-hover-bg w-full px-4 py-2\">\n                    {option.label}\n                  </div>\n                )}\n              </ComboboxItem>\n            )}\n          </ComboboxList>\n        </ComboboxContent>\n      </Combobox>\n    </ComboboxField>\n  );\n};\n\nexport type { InputSearchProps };\n"],"names":["DEBOUNCE_MS","InputSearch","options","value","onChange","onSearch","placeholder","searchPlaceholder","emptyText","loadingText","loading","disabled","showClear","isValid","className","error","renderOption","debounceMs","searchValue","setSearchValue","useState","timerRef","useRef","useEffect","validationProps","selectedOption","useMemo","option","filteredOptions","normalizedSearch","inputPlaceholder","jsx","ComboboxField","jsxs","Combobox","currentValue","ComboboxInput","ComboboxContent","ComboboxEmpty","ComboboxList","ComboboxItem"],"mappings":"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"}

package/dist/components-ui-icon-icon-map.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("brd-phosphor-strokes-icons/icons"),r={"arrow-counter-clockwise":e.ArrowCounterClockwise,"arrow-down-left":e.ArrowDownLeft,"arrow-u-down-left":e.ArrowUDownLeft,"bell-ringing":e.BellRinging,"bounding-box":e.BoundingBox,briefcase:e.Briefcase,building:e.Building,buildings:e.Buildings,"calendar-dots":e.CalendarDots,"caret-down":e.CaretDown,"caret-left":e.CaretLeft,"caret-left-filled":e.CaretLeftFilled,"caret-right":e.CaretRight,"caret-right-filled":e.CaretRightFilled,"caret-up":e.CaretUp,"caret-up-down":e.CaretUpDown,"chart-line":e.ChartLine,"chat-circle":e.ChatCircle,check:e.Check,"check-circle":e.CheckCircle,clock:e.Clock,"columns-plus-right":e.ColumnsPlusRight,copy:e.Copy,"credit-card":e.CreditCard,"dots-three":e.DotsThree,"download-simple":e.DownloadSimple,envelope:e.Envelope,"envelope-simple":e.EnvelopeSimple,eye:e.Eye,"eye-slash":e.EyeSlash,"file-text":e.FileText,folder:e.Folder,funnel:e.Funnel,gear:e.Gear,hash:e.Hash,info:e.Info,link:e.Link,"list-bullets":e.ListBullets,"lock-key":e.LockKey,"magnifying-glass":e.MagnifyingGlass,"max-logo":e.MaxLogo,package:e.Package,"paper-plane-tilt":e.PaperPlaneTilt,pencil:e.Pencil,"pencil-simple":e.PencilSimple,phone:e.Phone,plus:e.Plus,"presentation-chart":e.PresentationChart,question:e.Question,"share-network":e.ShareNetwork,"spinner-gap":e.SpinnerGap,"squares-four":e.SquaresFour,"telegram-logo":e.TelegramLogo,trash:e.Trash,"user-circle-gear":e.UserCircleGear,users:e.Users,"users-four":e.UsersFour,warning:e.Warning,"warning-circle":e.WarningCircle,"whats-app-logo-filled":e.WhatsAppLogoFilled,wrench:e.Wrench,x:e.X,"x-circle":e.XCircle},l=Object.keys(r);exports.iconComponents=r;exports.supportedIconTypes=l;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("brd-phosphor-strokes-icons/icons"),r={"arrow-counter-clockwise":e.ArrowCounterClockwise,"arrow-down-left":e.ArrowDownLeft,"arrow-u-down-left":e.ArrowUDownLeft,"bell-ringing":e.BellRinging,"bounding-box":e.BoundingBox,briefcase:e.Briefcase,building:e.Building,buildings:e.Buildings,"calendar-dots":e.CalendarDots,"caret-down":e.CaretDown,"caret-left":e.CaretLeft,"caret-left-filled":e.CaretLeftFilled,"caret-right":e.CaretRight,"caret-right-filled":e.CaretRightFilled,"caret-up":e.CaretUp,"caret-up-down":e.CaretUpDown,"chart-line":e.ChartLine,"chat-circle":e.ChatCircle,check:e.Check,"check-circle":e.CheckCircle,clock:e.Clock,"columns-plus-right":e.ColumnsPlusRight,copy:e.Copy,"credit-card":e.CreditCard,"dots-three":e.DotsThree,"download-simple":e.DownloadSimple,envelope:e.Envelope,"envelope-simple":e.EnvelopeSimple,eye:e.Eye,"eye-slash":e.EyeSlash,"file-text":e.FileText,folder:e.Folder,funnel:e.Funnel,gear:e.Gear,hash:e.Hash,info:e.Info,link:e.Link,"list-bullets":e.ListBullets,"lock-key":e.LockKey,"magnifying-glass":e.MagnifyingGlass,"max-logo":e.MaxLogo,package:e.Package,"paper-plane-tilt":e.PaperPlaneTilt,pencil:e.Pencil,"pencil-simple":e.PencilSimple,phone:e.Phone,plus:e.Plus,"presentation-chart":e.PresentationChart,question:e.Question,"share-network":e.ShareNetwork,"spinner-gap":e.SpinnerGap,"squares-four":e.SquaresFour,"telegram-logo":e.TelegramLogo,trash:e.Trash,"user-circle-gear":e.UserCircleGear,users:e.Users,"users-four":e.UsersFour,warning:e.Warning,"warning-circle":e.WarningCircle,"whats-app-logo-filled":e.WhatsAppLogoFilled,wrench:e.Wrench,x:e.X,"x-circle":e.XCircle,"clipboard-text":e.ClipboardText,"chart-line-up":e.ChartLineUp,"currency-circle-dollar":e.CurrencyCircleDollar,"shield-check":e.ShieldCheck},l=Object.keys(r);exports.iconComponents=r;exports.supportedIconTypes=l;
 //# sourceMappingURL=components-ui-icon-icon-map.cjs.map