@purr-react-styled-components/components.select 0.0.1

package/dist/_components/_menu.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+import { ISelectMenuProps } from '../_types';
+
+export declare const SelectMenu: React.ForwardRefExoticComponent<ISelectMenuProps & React.RefAttributes<HTMLDivElement>>;

package/dist/_components/_option.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+import { ISelectOptionProps } from '../_types';
+
+export declare const SelectOption: React.MemoExoticComponent<({ value, displayedValue, label, disabled, htmlAttributes, handleSelectOption, }: ISelectOptionProps) => React.JSX.Element>;

package/dist/_components/index.d.ts

@@ -0,0 +1,4 @@
+import { default as React } from 'react';
+import { ISelectProps } from '../_types';
+
+export declare const Select: React.ForwardRefExoticComponent<ISelectProps & React.RefAttributes<HTMLSelectElement>>;

package/dist/_menu-BoZEsfHP.js

@@ -0,0 +1,29 @@
+import { jsx as s } from "react/jsx-runtime";
+import h from "clsx";
+import { memo as S, createElement as w, forwardRef as O, useMemo as y } from "react";
+import { S as f } from "./index-D9skdafy.js";
+const $ = S(({
+  value: t,
+  displayedValue: e,
+  label: r,
+  disabled: l,
+  htmlAttributes: m,
+  handleSelectOption: d
+}) => /* @__PURE__ */ w(f.Option, { ...m, $selected: t === e, $disabled: l, key: t, className: h("select-option", t === e && "select-option--selected", l && "select-option--disabled"), onClick: d(t) }, r));
+$.displayName = "SelectOption";
+const N = O(({
+  options: t,
+  position: e,
+  isShowed: r,
+  currentValue: l,
+  optionGroupClassName: m,
+  htmlAttributes: d,
+  selectOption: a
+}, b) => {
+  const u = y(() => t.map((c) => /* @__PURE__ */ s($, { value: c.value, displayedValue: l, label: c.label, disabled: !!c.disabled, htmlAttributes: c.htmlAttributes, handleSelectOption: a }, c.value)), [l, t, a]);
+  return /* @__PURE__ */ s(f.OptionGroup, { ...d, $position: e, $isShowed: r, ref: b, className: h("select-options", !!(e != null && e.top) && `select-options--position-top-${e.top}`, !!(e != null && e.left) && `select-options--position-left-${e.left}`, !!(e != null && e.height) && `select-options--position-height-${e.height}`, !!(e != null && e.width) && `select-options--position-width-${e.width}`, r && "select-options--showed", m), children: u });
+});
+N.displayName = "SelectMenu";
+export {
+  N as SelectMenu
+};

package/dist/_menu-C8lQ1g_y.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const h=require("react/jsx-runtime"),m=require("clsx"),s=require("react"),n=require("./index-DjXPDt7j.cjs"),S=s.memo(({value:t,displayedValue:e,label:r,disabled:l,htmlAttributes:d,handleSelectOption:a})=>s.createElement(n.Styled.Option,{...d,$selected:t===e,$disabled:l,key:t,className:m("select-option",t===e&&"select-option--selected",l&&"select-option--disabled"),onClick:a(t)},r));S.displayName="SelectOption";const b=s.forwardRef(({options:t,position:e,isShowed:r,currentValue:l,optionGroupClassName:d,htmlAttributes:a,selectOption:u},$)=>{const y=s.useMemo(()=>t.map(c=>h.jsx(S,{value:c.value,displayedValue:l,label:c.label,disabled:!!c.disabled,htmlAttributes:c.htmlAttributes,handleSelectOption:u},c.value)),[l,t,u]);return h.jsx(n.Styled.OptionGroup,{...a,$position:e,$isShowed:r,ref:$,className:m("select-options",!!(e!=null&&e.top)&&`select-options--position-top-${e.top}`,!!(e!=null&&e.left)&&`select-options--position-left-${e.left}`,!!(e!=null&&e.height)&&`select-options--position-height-${e.height}`,!!(e!=null&&e.width)&&`select-options--position-width-${e.width}`,r&&"select-options--showed",d),children:y})});b.displayName="SelectMenu";exports.SelectMenu=b;

package/dist/_style.d.ts

@@ -0,0 +1,35 @@
+import { TSelectVariant } from './_types';
+
+export declare const Styled: {
+    Container: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+        $fullWidth: boolean;
+    }>> & string;
+    Option: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {
+        $selected: boolean;
+        $disabled?: boolean;
+    }>> & string;
+    OptionGroup: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+        $isShowed: boolean;
+        $position: {
+            left: number;
+            top: number;
+            width: number;
+        } | null;
+    }>> & string;
+    Box: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+        $fullWidth: boolean;
+        $disabled: boolean;
+        $variant: TSelectVariant;
+        $isError: boolean;
+    }>> & string;
+    InnerBox: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {
+        $hasLabel: boolean;
+        $variant: TSelectVariant;
+        $disabled: boolean;
+    }>> & string;
+    FakeSelect: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<import('react').DetailedHTMLProps<import('react').SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement>, never>> & string;
+    PostAdornmentContentWrapper: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+        $isShowed: boolean;
+        $disabled?: boolean;
+    }>> & string;
+};

package/dist/_types.d.ts

@@ -0,0 +1,51 @@
+import { HTMLAttributes, MouseEvent, MouseEventHandler, ReactNode } from 'react';
+import { FieldError } from 'react-hook-form';
+import { IExtendable } from '@purr-core/utils.definitions';
+import { IHelperTextProps } from '@purr-react-styled-components/components.helper-text';
+import { ILabelProps } from '@purr-react-styled-components/components.label';
+import { IPostAdornmentProps } from '@purr-react-styled-components/components.post-adornment';
+
+export interface ISelectOption {
+    value: string;
+    label: ReactNode;
+    disabled?: boolean;
+    htmlAttributes?: HTMLAttributes<HTMLSpanElement> & IExtendable;
+}
+export interface ISelectOptionProps extends ISelectOption {
+    displayedValue?: string;
+    handleSelectOption: (value: string) => MouseEventHandler<HTMLSpanElement>;
+}
+export type TSelectVariant = "standard" | "outlined" | "filled";
+export interface ISelectMenuProps {
+    options: ISelectOption[];
+    position: {
+        left: number;
+        top: number;
+        width: number;
+        height: number;
+    } | null;
+    isShowed: boolean;
+    currentValue?: string;
+    optionGroupClassName?: string;
+    htmlAttributes?: HTMLAttributes<HTMLDivElement> & IExtendable;
+    selectOption: (value: string) => MouseEventHandler<HTMLSpanElement>;
+}
+export interface ISelectProps {
+    optionGroupClassName?: string;
+    options: ISelectOption[];
+    value?: string;
+    variant?: TSelectVariant;
+    labelProps?: ILabelProps;
+    postAdornmentProps?: IPostAdornmentProps;
+    helperTextProps?: IHelperTextProps;
+    htmlAttributes?: HTMLAttributes<HTMLDivElement> & IExtendable;
+    menuHtmlAttributes?: HTMLAttributes<HTMLDivElement> & IExtendable;
+    tabIndex?: number;
+    className?: string;
+    fullWidth?: boolean;
+    disabled?: boolean;
+    required?: boolean;
+    error?: FieldError;
+    isStandalone?: boolean;
+    onChange?: (value: string, e: MouseEvent<HTMLSpanElement>) => void;
+}

package/dist/index-D9skdafy.js

@@ -0,0 +1,144 @@
+import { jsx as n, jsxs as I } from "react/jsx-runtime";
+import p from "clsx";
+import { lazy as g, forwardRef as Y, useRef as B, useState as O, useMemo as $, Suspense as u, useCallback as J } from "react";
+import { Portal as K } from "@purr-core/components.portal";
+import Q from "@purr-core/hooks.block";
+import U from "@purr-core/hooks.not-click-on-elements";
+import X from "@purr-core/hooks.sync-state-with-props";
+import d, { css as L } from "styled-components";
+import { getVariantStyle as Z } from "@purr-react-styled-components/utils.helpers";
+const q = (e) => e.$variant === "standard" ? L(["padding:0px 35px 0px 0px;"]) : L(["padding:0px 35px 0px 14px;"]), m = {
+  Container: d.div.withConfig({
+    displayName: "_style__Container",
+    componentId: "sc-1ikgo6d-0"
+  })(["position:relative;width:", ";min-width:210px;"], ({
+    $fullWidth: e
+  }) => e ? "100%" : "fit-content"),
+  Option: d.span.withConfig({
+    displayName: "_style__Option",
+    componentId: "sc-1ikgo6d-1"
+  })(["display:block;transition:all 200ms ease-in-out;cursor:pointer;padding:0px 14px;height:36px;line-height:36px;background-color:", ";color:", ';overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-family:"Verdana",sans-serif;font-size:16px;&:hover{background-color:#ffffff14;}'], ({
+    $selected: e,
+    $disabled: x
+  }) => x ? "#121212" : e ? "#90caf929" : "transparent", ({
+    $disabled: e
+  }) => e ? "#ffffff80" : "#ffffff"),
+  OptionGroup: d.div.withConfig({
+    displayName: "_style__OptionGroup",
+    componentId: "sc-1ikgo6d-2"
+  })(["position:absolute;display:", ";top:", "px;left:", "px;width:", "px;padding:6px 0px;z-index:999;background-color:rgb(18,18,18);min-width:120px;border-radius:4px;box-shadow:rgb(0 0 0 / 20%) 0px 5px 5px -3px,rgb(0 0 0 / 14%) 0px 8px 10px 1px,rgb(0 0 0 / 12%) 0px 3px 14px 2px;background-image:linear-gradient(#ffffff1f,#ffffff1f);"], ({
+    $isShowed: e
+  }) => e ? "block" : "none", ({
+    $position: e
+  }) => (e == null ? void 0 : e.top) || 0, ({
+    $position: e
+  }) => (e == null ? void 0 : e.left) || 0, ({
+    $position: e
+  }) => (e == null ? void 0 : e.width) || 0),
+  Box: d.div.withConfig({
+    displayName: "_style__Box",
+    componentId: "sc-1ikgo6d-3"
+  })(["transition:all 200ms ease-in-out;position:relative;width:", ";height:56px;border-radius:4px;cursor:", ";", ";"], ({
+    $fullWidth: e
+  }) => e ? "100%" : "210px", ({
+    $disabled: e
+  }) => e ? "not-allowed" : "pointer", Z),
+  InnerBox: d.span.withConfig({
+    displayName: "_style__InnerBox",
+    componentId: "sc-1ikgo6d-4"
+  })(["position:absolute;transition:all 200ms ease-in-out;box-sizing:border-box;width:100%;height:", ";line-height:", ";top:", ";left:0px;background-color:transparent;border:none;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:", ';font-family:"Verdana",sans-serif;font-size:16px;', ";&:focus-visible{outline:none;}"], ({
+    $hasLabel: e
+  }) => e ? "44px" : "56px", ({
+    $hasLabel: e
+  }) => e ? "44px" : "56px", ({
+    $hasLabel: e
+  }) => e ? "12px" : "0px", ({
+    $disabled: e
+  }) => e ? "#ffffff80" : "#ffffff", q),
+  FakeSelect: d.select.withConfig({
+    displayName: "_style__FakeSelect",
+    componentId: "sc-1ikgo6d-5"
+  })(["width:100%;height:100%;opacity:0;cursor:pointer;"]),
+  PostAdornmentContentWrapper: d.div.withConfig({
+    displayName: "_style__PostAdornmentContentWrapper",
+    componentId: "sc-1ikgo6d-6"
+  })(["display:flex;transition:all 350ms ease-in-out;width:20px;height:20px;color:", ";transform:", ";"], ({
+    $disabled: e
+  }) => e ? "#ffffff80" : "#ffffff", ({
+    $isShowed: e
+  }) => e ? "rotate(180deg)" : "none")
+}, A = g(() => import("@purr-react-styled-components/components.helper-text").then((e) => ({
+  default: e.HelperText
+}))), T = g(() => import("@purr-react-styled-components/components.icon").then((e) => ({
+  default: e.Icon
+}))), P = g(() => import("@purr-react-styled-components/components.label").then((e) => ({
+  default: e.Label
+}))), ee = g(() => import("@purr-react-styled-components/components.post-adornment").then((e) => ({
+  default: e.PostAdornment
+}))), te = g(() => import("./_menu-BoZEsfHP.js").then((e) => ({
+  default: e.SelectMenu
+}))), ne = (e, x = !0) => {
+  var o;
+  const t = (o = e.current) == null ? void 0 : o.getBoundingClientRect();
+  return {
+    left: (t == null ? void 0 : t.x) || 0,
+    top: ((t == null ? void 0 : t.y) || 0) + (x && (window == null ? void 0 : window.scrollY) || 0),
+    width: (t == null ? void 0 : t.width) || 0,
+    height: (t == null ? void 0 : t.height) || 0
+  };
+}, ie = Y(({
+  optionGroupClassName: e,
+  options: x,
+  value: t,
+  variant: o = "standard",
+  labelProps: c,
+  postAdornmentProps: f,
+  helperTextProps: a,
+  className: z,
+  fullWidth: w = !1,
+  disabled: i = !1,
+  required: C = !1,
+  error: s = null,
+  isStandalone: R = !1,
+  tabIndex: V = -1,
+  menuHtmlAttributes: E,
+  htmlAttributes: F,
+  onChange: y
+}, oe) => {
+  const k = B(null), N = B(null), [l, _] = O(!1), [W, M] = O(null), {
+    currentValue: S,
+    setCurrentValue: v
+  } = X(t, R);
+  U([k, N], () => {
+    l && _(!1);
+  });
+  const j = (h) => {
+    if (h.preventDefault(), !i) {
+      if (!l) {
+        const r = ne(k);
+        M({
+          ...r,
+          top: r.top + r.height
+        });
+      }
+      _((r) => !r);
+    }
+  }, G = Q(() => !!(i || l || S)), b = x.find((h) => h.value === S), H = $(() => /* @__PURE__ */ n(m.PostAdornmentContentWrapper, { $isShowed: l, $disabled: i, className: p("select-post-adornment-content", l && "select-post-adornment-content--showed", i && "select-post-adornment-content--disabled"), children: (f == null ? void 0 : f.children) ?? /* @__PURE__ */ n(u, { children: /* @__PURE__ */ n(T, { name: "chevron-down" }) }) }), [i, l, f == null ? void 0 : f.children]), D = J((h) => (r) => {
+    y == null || y(h, r), _(!1), v(h);
+  }, [y, v, _]);
+  return /* @__PURE__ */ I(m.Container, { ...F, $fullWidth: w, className: p("select", w && "select--fullWidth", z), children: [
+    /* @__PURE__ */ I(m.Box, { $variant: o, $disabled: i, $fullWidth: w, $isError: !!s, ref: k, onClick: j, tabIndex: V, className: p("select-box", w && "select-box--full-width", i && "select-box--disabled", !!s && "select-box--error", `select-box--variant-${o}`), children: [
+      /* @__PURE__ */ n(u, { children: !!(c != null && c.children) && /* @__PURE__ */ n(P, { ...c, required: C, disabled: i, variant: o, isLabelCollapsed: G, isFocused: l, isError: !!s }) }),
+      /* @__PURE__ */ n(m.FakeSelect, { required: C, disabled: i }),
+      /* @__PURE__ */ n(m.InnerBox, { $hasLabel: !!(c != null && c.children), $variant: o, $disabled: i, className: p("select-inner-box", `select-inner-box--variant-${o}`, !!(c != null && c.children) && "select-inner-box--hasLabel", i && "select-inner-box--disabled"), children: b == null ? void 0 : b.label }),
+      /* @__PURE__ */ n(u, { children: !!(f != null && f.children) && /* @__PURE__ */ n(ee, { ...f, variant: o, children: H }) }),
+      /* @__PURE__ */ n(u, { children: !!(a != null && a.children) && /* @__PURE__ */ n(A, { ...a, isError: !!s, variant: o, children: (s == null ? void 0 : s.message) ?? (a == null ? void 0 : a.children) ?? "" }) })
+    ] }),
+    /* @__PURE__ */ n(K, { className: p("portal-select", e), children: /* @__PURE__ */ n(u, { children: l && /* @__PURE__ */ n(te, { ref: N, options: x, position: W, isShowed: l, optionGroupClassName: e, currentValue: S, htmlAttributes: E, selectOption: D }) }) })
+  ] });
+});
+ie.displayName = "Select";
+export {
+  m as S,
+  ie as a
+};

package/dist/index-DjXPDt7j.cjs

@@ -0,0 +1 @@
+"use strict";var G=Object.create;var N=Object.defineProperty;var H=Object.getOwnPropertyDescriptor;var D=Object.getOwnPropertyNames;var Y=Object.getPrototypeOf,$=Object.prototype.hasOwnProperty;var J=(e,c,t,l)=>{if(c&&typeof c=="object"||typeof c=="function")for(let i of D(c))!$.call(e,i)&&i!==t&&N(e,i,{get:()=>c[i],enumerable:!(l=H(c,i))||l.enumerable});return e};var S=(e,c,t)=>(t=e!=null?G(Y(e)):{},J(c||!e||!e.__esModule?N(t,"default",{value:e,enumerable:!0}):t,e));const s=require("react/jsx-runtime"),g=require("clsx"),n=require("react"),K=require("@purr-core/components.portal"),Q=require("@purr-core/hooks.block"),U=require("@purr-core/hooks.not-click-on-elements"),X=require("@purr-core/hooks.sync-state-with-props"),r=require("styled-components"),Z=require("@purr-react-styled-components/utils.helpers"),A=e=>e.$variant==="standard"?r.css(["padding:0px 35px 0px 0px;"]):r.css(["padding:0px 35px 0px 14px;"]),p={Container:r.div.withConfig({displayName:"_style__Container",componentId:"sc-1ikgo6d-0"})(["position:relative;width:",";min-width:210px;"],({$fullWidth:e})=>e?"100%":"fit-content"),Option:r.span.withConfig({displayName:"_style__Option",componentId:"sc-1ikgo6d-1"})(["display:block;transition:all 200ms ease-in-out;cursor:pointer;padding:0px 14px;height:36px;line-height:36px;background-color:",";color:",';overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-family:"Verdana",sans-serif;font-size:16px;&:hover{background-color:#ffffff14;}'],({$selected:e,$disabled:c})=>c?"#121212":e?"#90caf929":"transparent",({$disabled:e})=>e?"#ffffff80":"#ffffff"),OptionGroup:r.div.withConfig({displayName:"_style__OptionGroup",componentId:"sc-1ikgo6d-2"})(["position:absolute;display:",";top:","px;left:","px;width:","px;padding:6px 0px;z-index:999;background-color:rgb(18,18,18);min-width:120px;border-radius:4px;box-shadow:rgb(0 0 0 / 20%) 0px 5px 5px -3px,rgb(0 0 0 / 14%) 0px 8px 10px 1px,rgb(0 0 0 / 12%) 0px 3px 14px 2px;background-image:linear-gradient(#ffffff1f,#ffffff1f);"],({$isShowed:e})=>e?"block":"none",({$position:e})=>(e==null?void 0:e.top)||0,({$position:e})=>(e==null?void 0:e.left)||0,({$position:e})=>(e==null?void 0:e.width)||0),Box:r.div.withConfig({displayName:"_style__Box",componentId:"sc-1ikgo6d-3"})(["transition:all 200ms ease-in-out;position:relative;width:",";height:56px;border-radius:4px;cursor:",";",";"],({$fullWidth:e})=>e?"100%":"210px",({$disabled:e})=>e?"not-allowed":"pointer",Z.getVariantStyle),InnerBox:r.span.withConfig({displayName:"_style__InnerBox",componentId:"sc-1ikgo6d-4"})(["position:absolute;transition:all 200ms ease-in-out;box-sizing:border-box;width:100%;height:",";line-height:",";top:",";left:0px;background-color:transparent;border:none;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:",';font-family:"Verdana",sans-serif;font-size:16px;',";&:focus-visible{outline:none;}"],({$hasLabel:e})=>e?"44px":"56px",({$hasLabel:e})=>e?"44px":"56px",({$hasLabel:e})=>e?"12px":"0px",({$disabled:e})=>e?"#ffffff80":"#ffffff",A),FakeSelect:r.select.withConfig({displayName:"_style__FakeSelect",componentId:"sc-1ikgo6d-5"})(["width:100%;height:100%;opacity:0;cursor:pointer;"]),PostAdornmentContentWrapper:r.div.withConfig({displayName:"_style__PostAdornmentContentWrapper",componentId:"sc-1ikgo6d-6"})(["display:flex;transition:all 350ms ease-in-out;width:20px;height:20px;color:",";transform:",";"],({$disabled:e})=>e?"#ffffff80":"#ffffff",({$isShowed:e})=>e?"rotate(180deg)":"none")},T=n.lazy(()=>import("@purr-react-styled-components/components.helper-text").then(e=>({default:e.HelperText}))),P=n.lazy(()=>import("@purr-react-styled-components/components.icon").then(e=>({default:e.Icon}))),ee=n.lazy(()=>import("@purr-react-styled-components/components.label").then(e=>({default:e.Label}))),te=n.lazy(()=>import("@purr-react-styled-components/components.post-adornment").then(e=>({default:e.PostAdornment}))),ne=n.lazy(()=>Promise.resolve().then(()=>require("./_menu-C8lQ1g_y.cjs")).then(e=>({default:e.SelectMenu}))),ie=(e,c=!0)=>{var l;const t=(l=e.current)==null?void 0:l.getBoundingClientRect();return{left:(t==null?void 0:t.x)||0,top:((t==null?void 0:t.y)||0)+(c&&(window==null?void 0:window.scrollY)||0),width:(t==null?void 0:t.width)||0,height:(t==null?void 0:t.height)||0}},I=n.forwardRef(({optionGroupClassName:e,options:c,value:t,variant:l="standard",labelProps:i,postAdornmentProps:f,helperTextProps:d,className:q,fullWidth:w=!1,disabled:o=!1,required:b=!1,error:x=null,isStandalone:z=!1,tabIndex:B=-1,menuHtmlAttributes:O,htmlAttributes:R,onChange:m},se)=>{const _=n.useRef(null),v=n.useRef(null),[a,y]=n.useState(!1),[L,V]=n.useState(null),{currentValue:k,setCurrentValue:C}=X(t,z);U([_,v],()=>{a&&y(!1)});const E=h=>{if(h.preventDefault(),!o){if(!a){const u=ie(_);V({...u,top:u.top+u.height})}y(u=>!u)}},F=Q(()=>!!(o||a||k)),j=c.find(h=>h.value===k),W=n.useMemo(()=>s.jsx(p.PostAdornmentContentWrapper,{$isShowed:a,$disabled:o,className:g("select-post-adornment-content",a&&"select-post-adornment-content--showed",o&&"select-post-adornment-content--disabled"),children:(f==null?void 0:f.children)??s.jsx(n.Suspense,{children:s.jsx(P,{name:"chevron-down"})})}),[o,a,f==null?void 0:f.children]),M=n.useCallback(h=>u=>{m==null||m(h,u),y(!1),C(h)},[m,C,y]);return s.jsxs(p.Container,{...R,$fullWidth:w,className:g("select",w&&"select--fullWidth",q),children:[s.jsxs(p.Box,{$variant:l,$disabled:o,$fullWidth:w,$isError:!!x,ref:_,onClick:E,tabIndex:B,className:g("select-box",w&&"select-box--full-width",o&&"select-box--disabled",!!x&&"select-box--error",`select-box--variant-${l}`),children:[s.jsx(n.Suspense,{children:!!(i!=null&&i.children)&&s.jsx(ee,{...i,required:b,disabled:o,variant:l,isLabelCollapsed:F,isFocused:a,isError:!!x})}),s.jsx(p.FakeSelect,{required:b,disabled:o}),s.jsx(p.InnerBox,{$hasLabel:!!(i!=null&&i.children),$variant:l,$disabled:o,className:g("select-inner-box",`select-inner-box--variant-${l}`,!!(i!=null&&i.children)&&"select-inner-box--hasLabel",o&&"select-inner-box--disabled"),children:j==null?void 0:j.label}),s.jsx(n.Suspense,{children:!!(f!=null&&f.children)&&s.jsx(te,{...f,variant:l,children:W})}),s.jsx(n.Suspense,{children:!!(d!=null&&d.children)&&s.jsx(T,{...d,isError:!!x,variant:l,children:(x==null?void 0:x.message)??(d==null?void 0:d.children)??""})})]}),s.jsx(K.Portal,{className:g("portal-select",e),children:s.jsx(n.Suspense,{children:a&&s.jsx(ne,{ref:v,options:c,position:L,isShowed:a,optionGroupClassName:e,currentValue:k,htmlAttributes:O,selectOption:M})})})]})});I.displayName="Select";exports.Select=I;exports.Styled=p;

package/dist/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./index-DjXPDt7j.cjs");exports.Select=e.Select;

package/dist/index.d.ts

@@ -0,0 +1,2 @@
+export * from './_components';
+export * from './_types';

package/dist/index.js

@@ -0,0 +1,4 @@
+import { a as o } from "./index-D9skdafy.js";
+export {
+  o as Select
+};

package/package.json

@@ -0,0 +1,49 @@
+{
+  "name": "@purr-react-styled-components/components.select",
+  "version": "0.0.1",
+  "type": "module",
+  "main": "dist/index.cjs",
+  "module": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.js"
+      },
+      "require": {
+        "types": "./dist/index.d.ts",
+        "default": "./dist/index.cjs"
+      }
+    }
+  },
+  "files": [
+    "dist"
+  ],
+  "peerDependencies": {
+    "typescript": "*",
+    "react": "*",
+    "styled-components": "*",
+    "clsx": "*",
+    "react-hook-form": "*",
+    "@purr-react-styled-components/components.helper-text": "0.0.1",
+    "@purr-react-styled-components/components.label": "0.0.1",
+    "@purr-react-styled-components/components.post-adornment": "0.0.1",
+    "@purr-react-styled-components/utils.helpers": "0.0.1",
+    "@purr-core/utils.definitions": "0.0.4",
+    "@purr-react-styled-components/components.icon": "0.0.1",
+    "@purr-core/components.portal": "0.0.1",
+    "@purr-core/hooks.block": "0.0.3",
+    "@purr-core/hooks.not-click-on-elements": "0.0.2",
+    "@purr-core/hooks.sync-state-with-props": "0.0.2"
+  },
+  "author": "@DinhThienPhuc",
+  "license": "ISC",
+  "description": "",
+  "sideEffects": false,
+  "scripts": {
+    "dev": "vite build --watch",
+    "build": "tsc && vite build",
+    "lint": "eslint . --ext ts,tsx --max-warnings 0"
+  }
+}