@clicktap/ui 0.20.1 → 0.21.0

package/components/Select/DropdownSelect.d.ts

@@ -0,0 +1,16 @@
+import { SelectProps as AriaSelectProps } from 'react-aria-components';
+import { ReactNode } from 'react';
+export type DropdownSelectProps<T extends object> = Omit<AriaSelectProps<T>, 'children'> & {
+    label?: string;
+    placeholder?: string;
+    children: ReactNode;
+    className?: string;
+    classNames?: {
+        trigger?: string;
+        label?: string;
+        value?: string;
+        listContainer?: string;
+        list?: string;
+    };
+};
+export declare function DropdownSelect<T extends object>({ label, placeholder, children, className, classNames, ...props }: DropdownSelectProps<T>): import("react/jsx-runtime").JSX.Element;

package/components/Select/DropdownSelect.js

@@ -0,0 +1 @@
+import{jsxs as s,jsx as e}from"react/jsx-runtime";import{Select as x,Label as u,Button as p,SelectValue as h,Popover as m,ListBox as b}from"react-aria-components";import{cn as t}from"../../utils/cn.js";function v({label:o,placeholder:l,children:i,className:n,classNames:r,...d}){return s(x,{...d,className:t("flex items-center gap-2",n),children:[o&&e(u,{className:t("text-xs text-slate-500",r?.label),children:o}),s(p,{className:t("flex items-center justify-between","border border-solid border-slate-300","text-sm text-slate-900","py-0 px-3","h-10","rounded-md","bg-white","cursor-pointer","transition-all ease-in-out duration-200","data-[hovered]:border-slate-400","data-[focused]:border-slate-400 data-[focused]:outline data-[focused]:outline-2 data-[focused]:outline-slate-200",r?.trigger),children:[e(h,{className:t("text-sm truncate",r?.value),children:({isPlaceholder:a,selectedText:c})=>e("span",{className:a?"text-slate-400":"",children:a?l??"Select...":c})}),e("svg",{width:"16",height:"16",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:"shrink-0 ml-2",children:e("path",{d:"M6 9L12 15L18 9",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round",className:"stroke-slate-900"})})]}),e(m,{className:t("px-0 py-1.5","shadow-[0_10px_15px_-3px_rgba(0,0,0,0.1),0_4px_6px_-4px_rgba(0,0,0,0.1)]","rounded-md","w-[var(--trigger-width)]","bg-white","border border-solid border-slate-300",r?.listContainer),children:e(b,{className:t("max-h-80 overflow-y-auto outline-none",r?.list),children:i})})]})}export{v as DropdownSelect};

package/components/Select/index.d.ts

@@ -1,3 +1,5 @@
+export { DropdownSelect } from './DropdownSelect';
+export type { DropdownSelectProps } from './DropdownSelect';
 export { Option } from './Option';
 export { Select } from './Select';
 export type { OptionProps } from './Option.types';

package/components/Select/index.js

@@ -1 +1 @@
-import{Option as x}from"./Option.js";import{Select as l}from"./Select.js";import"react/jsx-runtime";import"react-aria-components";import"../../utils/cn.js";import"react";import"framer-motion";import"../Loader/Pulse.js";export{x as Option,l as Select};
+import{DropdownSelect as x}from"./DropdownSelect.js";import{Option as l}from"./Option.js";import{Select as S}from"./Select.js";import"react/jsx-runtime";import"react-aria-components";import"../../utils/cn.js";import"react";import"framer-motion";import"../Loader/Pulse.js";export{x as DropdownSelect,l as Option,S as Select};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@clicktap/ui",
-  "version": "0.20.1",
+  "version": "0.21.0",
   "private": false,
   "author": "Clicktap",
   "description": "A library of React UI components and low-level hooks.",