the-omelet-ui 1.6.2 → 1.6.5

package/dist/entries/menu.js

@@ -1 +1 @@
-import {a}from'../chunk-6GLPXMGB.js';import {memo,useCallback}from'react';import {cva}from'class-variance-authority';import {jsx,jsxs,Fragment}from'react/jsx-runtime';var h=cva("flex items-center gap-3 h-8 px-4 text-left transition-colors duration-150 focus:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2",{variants:{active:{true:"bg-blue-50 text-blue-600  border-blue-600 rounded-[5px]",false:"text-gray-700"},disabled:{true:"opacity-50 cursor-not-allowed",false:"cursor-pointer"},orientation:{vertical:"",horizontal:"flex-shrink-0"}},compoundVariants:[{active:false,disabled:false,class:"hover:bg-gray-50"}],defaultVariants:{active:false,disabled:false,orientation:"vertical"}}),M=cva("flex",{variants:{orientation:{vertical:"flex-col",horizontal:"flex-row flex-wrap"}},defaultVariants:{orientation:"vertical"}}),c=memo(({items:u,activeId:f,onItemClick:n,className:b,activeClassName:p,itemClassName:m,disabledClassName:v,renderItem:o,orientation:i="vertical"})=>{let r=useCallback(e=>{e.disabled||n&&n(e);},[n]),x=useCallback((e,a)=>{a.disabled||(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),r(a));},[r]),g=(e,a)=>jsxs(Fragment,{children:[e.icon&&jsx("span",{className:"flex-shrink-0 flex items-center",children:e.icon}),jsx("span",{className:"flex-1",children:e.label})]});return jsx("nav",{className:a(M({orientation:i}),b),role:"menu","aria-orientation":i,children:u.map(e=>{let a$1=f===e.id;return jsx("button",{role:"menuitem","aria-current":a$1?"page":void 0,disabled:e.disabled,onClick:()=>r(e),onKeyDown:y=>x(y,e),style:{height:32,borderRadius:5},className:a(h({active:a$1&&!e.disabled,disabled:e.disabled,orientation:i}),a$1&&!e.disabled&&p,!a$1&&!e.disabled&&m,e.disabled&&v),children:o?o(e,a$1):g(e)},e.id)})})});c.displayName="Menu";var I=c;export{I as default};
+import {a}from'../chunk-6GLPXMGB.js';import {memo,useCallback}from'react';import {cva}from'class-variance-authority';import {jsx,jsxs,Fragment}from'react/jsx-runtime';var h=cva("flex items-center gap-3 h-8 px-4 text-left transition-colors duration-150 focus:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2",{variants:{active:{true:"bg-blue-50 text-blue-600  border-blue-600 rounded-[5px]",false:"text-gray-700"},disabled:{true:"opacity-50 cursor-not-allowed",false:"cursor-pointer"},orientation:{vertical:"",horizontal:"flex-shrink-0"}},compoundVariants:[{active:false,disabled:false,class:"hover:bg-gray-50"}],defaultVariants:{active:false,disabled:false,orientation:"vertical"}}),M=cva("flex gap-2",{variants:{orientation:{vertical:"flex-col",horizontal:"flex-row flex-wrap"}},defaultVariants:{orientation:"vertical"}}),c=memo(({items:u,activeId:f,onItemClick:n,className:b,activeClassName:p,itemClassName:m,disabledClassName:v,renderItem:o,orientation:i="vertical"})=>{let r=useCallback(e=>{e.disabled||n&&n(e);},[n]),g=useCallback((e,a)=>{a.disabled||(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),r(a));},[r]),x=(e,a)=>jsxs(Fragment,{children:[e.icon&&jsx("span",{className:"flex-shrink-0 flex items-center",children:e.icon}),jsx("span",{className:"flex-1",children:e.label})]});return jsx("nav",{className:a(M({orientation:i}),b),role:"menu","aria-orientation":i,children:u.map(e=>{let a$1=f===e.id;return jsx("button",{role:"menuitem","aria-current":a$1?"page":void 0,disabled:e.disabled,onClick:()=>r(e),onKeyDown:y=>g(y,e),style:{height:32,borderRadius:5},className:a(h({active:a$1&&!e.disabled,disabled:e.disabled,orientation:i}),a$1&&!e.disabled&&p,!a$1&&!e.disabled&&m,e.disabled&&v),children:o?o(e,a$1):x(e)},e.id)})})});c.displayName="Menu";var I=c;export{I as default};

package/dist/entries/table.d.ts

@@ -1,6 +1,11 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ReactNode } from 'react';
 
+type SortDirection = "asc" | "desc";
+interface SortState {
+    key: string;
+    direction: SortDirection;
+}
 interface Column<T = any> {
     /**
      * Unique key for the column
@@ -38,6 +43,10 @@ interface Column<T = any> {
      * Whether column is sortable
      */
     sortable?: boolean;
+    /**
+     * Custom sort function
+     */
+    sortFn?: (a: T, b: T, direction: SortDirection) => number;
 }
 interface TableProps<T = any> {
     /**
@@ -101,8 +110,21 @@ interface TableProps<T = any> {
      * Max height for scrollable table
      */
     maxHeight?: string | number;
+    /**
+     * Enable sorting
+     * @default false
+     */
+    enableSort?: boolean;
+    /**
+     * Default sort state
+     */
+    defaultSort?: SortState;
+    /**
+     * Callback when sort changes
+     */
+    onSortChange?: (sort: SortState) => void;
 }
-declare function Table<T = any>({ columns, data, className, variant, headerVariant, size, hoverable, striped, caption, emptyMessage, onRowClick, rowKey, stickyHeader, maxHeight, }: TableProps<T>): react_jsx_runtime.JSX.Element;
+declare function Table<T = any>({ columns, data, className, variant, headerVariant, size, hoverable, striped, caption, emptyMessage, onRowClick, rowKey, stickyHeader, maxHeight, enableSort, defaultSort, onSortChange, }: TableProps<T>): react_jsx_runtime.JSX.Element;
 declare const MemoizedTable: typeof Table;
 
-export { type Column, type TableProps, MemoizedTable as default };
+export { type Column, type SortDirection, type SortState, type TableProps, MemoizedTable as default };

package/dist/entries/table.js

@@ -1 +1,2 @@
-import {a}from'../chunk-6GLPXMGB.js';import {memo}from'react';import {cva}from'class-variance-authority';import {jsxs,jsx}from'react/jsx-runtime';var P=cva("w-full border-collapse",{variants:{variant:{default:"border border-gray-200",bordered:"border-2 border-gray-300",borderless:""},size:{sm:"text-sm",md:"text-base",lg:"text-lg"}},defaultVariants:{variant:"default",size:"md"}}),M=cva("border-b-2 font-semibold text-left",{variants:{variant:{default:"bg-white border-gray-200",primary:"bg-blue-50 border-blue-200",dark:"bg-gray-800 text-white border-gray-700"}},defaultVariants:{variant:"default"}}),m=cva("px-4 py-3 border-b border-gray-200",{variants:{align:{left:"text-left",center:"text-center",right:"text-right"}},defaultVariants:{align:"left"}}),j=cva("transition-colors",{variants:{hoverable:{true:"hover:bg-gray-50",false:""},striped:{true:"even:bg-gray-100",false:""}},defaultVariants:{hoverable:true,striped:false}});function w({columns:l,data:o,className:c,variant:p="default",headerVariant:h="default",size:v="md",hoverable:T=true,striped:x=false,caption:b,emptyMessage:N="\u0E44\u0E21\u0E48\u0E1E\u0E1A\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25",onRowClick:i,rowKey:f,stickyHeader:g=false,maxHeight:d}){let C=(e,t)=>f?f(e,t):typeof e=="object"&&e!==null&&"id"in e?e.id:t,k=(e,t)=>e.accessor?e.accessor(t):typeof t=="object"&&t!==null&&e.key in t?t[e.key]:"",V=(e,t,r)=>{let u=k(e,t);return e.render?e.render(u,t,r):u},R=(e,t)=>{i&&i(e,t);},y=jsxs("table",{className:a(P({variant:p,size:v}),c),children:[b&&jsx("caption",{className:"px-4 py-3 text-left text-sm text-gray-600",children:b}),jsx("thead",{className:a(M({variant:h}),g&&"sticky top-0 z-10"),children:jsx("tr",{children:l.map(e=>jsx("th",{className:a(m({align:e.align}),e.headerClassName),style:e.width?{width:e.width}:void 0,children:e.header},e.key))})}),jsx("tbody",{children:o.length===0?jsx("tr",{children:jsx("td",{colSpan:l.length,className:"px-4 py-8 text-center text-gray-500",children:N})}):o.map((e,t)=>jsx("tr",{className:a(j({hoverable:T,striped:x}),i&&"cursor-pointer"),onClick:()=>R(e,t),children:l.map(r=>jsx("td",{className:a(m({align:r.align}),r.cellClassName),children:V(r,e,t)},r.key))},C(e,t)))})]});return d||g?jsx("div",{className:"overflow-auto",style:d?{maxHeight:d}:void 0,children:y}):y}var K=memo(w),S=K;export{S as default};
+import {a}from'../chunk-6GLPXMGB.js';import {forwardRef,memo,useState,useMemo}from'react';import {cva}from'class-variance-authority';import {jsxs,jsx}from'react/jsx-runtime';var W=({title:n,titleId:o,...c},f)=>jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 16 16",width:"1em",height:"1em",ref:f,"aria-labelledby":o,...c,children:[n?jsx("title",{id:o,children:n}):null,jsx("path",{fill:"currentColor",d:"M14.795 4.185a.715.715 0 0 1 1.025.07.755.755 0 0 1-.068 1.049L8.48 11.816a.715.715 0 0 1-.958 0L.249 5.305.195 5.25a.76.76 0 0 1-.015-.996.717.717 0 0 1 .968-.118l.058.047L8 10.267z"})]}),X=forwardRef(W),Y=memo(X),w=Y;var ee=({title:n,titleId:o,...c},f)=>jsxs("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 16 16",width:"1em",height:"1em",ref:f,"aria-labelledby":o,...c,children:[n?jsx("title",{id:o,children:n}):null,jsx("path",{fill:"currentColor",d:"M7.63 4.104a.715.715 0 0 1 .85.08l7.272 6.512c.302.271.332.74.068 1.05a.715.715 0 0 1-.968.117l-.057-.047L8 5.732l-6.795 6.084a.716.716 0 0 1-1.027-.07.757.757 0 0 1 .07-1.05l7.274-6.512z"})]}),te=forwardRef(ee),re=memo(te),z=re;var oe=cva("w-full border-collapse",{variants:{variant:{default:"border border-gray-200",bordered:"border-2 border-gray-300",borderless:""},size:{sm:"text-sm",md:"text-base",lg:"text-lg"}},defaultVariants:{variant:"default",size:"md"}}),ie=cva("border-b-2 font-semibold text-left",{variants:{variant:{default:"bg-white border-gray-200",primary:"bg-blue-50 border-blue-200",dark:"bg-gray-800 text-white border-gray-700"}},defaultVariants:{variant:"default"}}),R=cva("px-4 py-3 border-b border-gray-200 text-[#606876]",{variants:{align:{left:"text-left",center:"text-center",right:"text-right"}},defaultVariants:{align:"left"}}),se=cva("transition-colors",{variants:{hoverable:{true:"hover:bg-gray-50",false:""},striped:{true:"even:bg-gray-100",false:""}},defaultVariants:{hoverable:true,striped:false}}),j=memo(({direction:n,size:o=12})=>n==="asc"?jsx(z,{fontSize:o,className:"text-[#606876]"}):jsx(w,{fontSize:o,className:"text-[#606876]"}));j.displayName="SortIcon";function le({columns:n,data:o,className:c,variant:f="default",headerVariant:M="default",size:F="md",hoverable:P=true,striped:B=false,caption:h,emptyMessage:I="\u0E44\u0E21\u0E48\u0E1E\u0E1A\u0E02\u0E49\u0E2D\u0E21\u0E39\u0E25",onRowClick:p,rowKey:v,stickyHeader:x=false,maxHeight:g,enableSort:u=false,defaultSort:K,onSortChange:U}){let[i,q]=useState(K||null),A=(e,t)=>v?v(e,t):typeof e=="object"&&e!==null&&"id"in e?e.id:t,y=(e,t)=>e.accessor?e.accessor(t):typeof t=="object"&&t!==null&&e.key in t?t[e.key]:"",E=(e,t,r)=>{let b=y(e,t);return e.render?e.render(b,t,r):b},G=(e,t)=>{p&&p(e,t);},H=e=>{if(!u||!e.sortable)return;let t="asc";i?.key===e.key&&(t=i.direction==="asc"?"desc":"asc");let r={key:e.key,direction:t};q(r),U?.(r);},S=useMemo(()=>{if(!u||!i)return o;let e=n.find(r=>r.key===i.key);return e?[...o].sort((r,b)=>{if(e.sortFn)return e.sortFn(r,b,i.direction);let s=y(e,r),l=y(e,b);if(s===l)return 0;if(s==null)return 1;if(l==null)return  -1;if(typeof s=="number"&&typeof l=="number")return i.direction==="asc"?s-l:l-s;let T=String(s).toLowerCase(),k=String(l).toLowerCase();return i.direction==="asc"?T.localeCompare(k):k.localeCompare(T)}):o},[o,i,n,u]),C=jsxs("table",{className:a(oe({variant:f,size:F}),c),children:[h&&jsx("caption",{className:"px-4 py-3 text-left text-sm text-gray-600",children:h}),jsx("thead",{className:a(ie({variant:M}),x&&"sticky top-0 z-10"),children:jsx("tr",{children:n.map(e=>{let t=u&&e.sortable,r=i?.key===e.key;return jsx("th",{className:a(R({align:e.align}),e.headerClassName,t&&"cursor-pointer select-none hover:bg-gray-100 transition-colors text-[#606876]"),style:e.width?{width:e.width}:void 0,onClick:()=>H(e),children:jsxs("div",{className:"flex items-center gap-2",children:[jsx("span",{children:e.header}),t&&r&&jsx(j,{direction:i.direction})]})},e.key)})})}),jsx("tbody",{children:S.length===0?jsx("tr",{children:jsx("td",{colSpan:n.length,className:"px-4 py-8 text-center text-gray-500",children:I})}):S.map((e,t)=>jsx("tr",{className:a(se({hoverable:P,striped:B}),p&&"cursor-pointer"),onClick:()=>G(e,t),children:n.map(r=>jsx("td",{className:a(R({align:r.align}),r.cellClassName),children:E(r,e,t)},r.key))},A(e,t)))})]});return g||x?jsx("div",{className:"overflow-auto",style:g?{maxHeight:g}:void 0,children:C}):C}var de=memo(le),ce=de;
+export{ce as default};

package/dist/entries/textAreaInput.js

@@ -5,6 +5,7 @@ import {a}from'../chunk-FK7R34ZH.js';import {forwardRef}from'react';import {jsxs
               resize-none
               transition-colors
               focus:outline-none
+              bg-white
               ${t?"border-red-500":"border-gray-300"}
               ${s}
-            `,...n})}),t&&jsx("small",{className:"text-red-500 text-xs",children:t})]}));l.displayName="TextAreaInput";var i=l;export{i as default};
+            `,...n})}),t&&jsx("small",{className:"text-red-500 text-xs",children:t})]}));l.displayName="TextAreaInput";var x=l;export{x as default};

package/dist/entries/toggle.d.ts

@@ -1,21 +1,40 @@
+import * as class_variance_authority_types from 'class-variance-authority/types';
 import * as React from 'react';
+import { VariantProps } from 'class-variance-authority';
 
-type Size = "sm" | "md" | "lg";
+declare const toggleTrackVariants: (props?: ({
+    size?: "sm" | "md" | "lg" | null | undefined;
+    colorScheme?: "red" | "green" | "blue" | "purple" | "orange" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type ToggleVariants = VariantProps<typeof toggleTrackVariants>;
 type LabelPos = "right" | "left";
 type ToggleProps = {
     checked?: boolean;
     defaultChecked?: boolean;
     onCheckedChange?: (checked: boolean) => void;
     disabled?: boolean;
+    required?: boolean;
+    name?: string;
+    value?: string;
     id?: string;
-    size?: Size;
+    size?: ToggleVariants["size"];
+    colorScheme?: ToggleVariants["colorScheme"];
+    /**
+     * Custom background color when checked
+     * @example "bg-pink-500" or "bg-gradient-to-r from-pink-500 to-purple-500"
+     */
+    checkedBg?: string;
+    /**
+     * Custom background color when unchecked
+     * @example "bg-gray-200"
+     */
+    uncheckedBg?: string;
     label?: string;
     labelPosition?: LabelPos;
     className?: string;
     trackClassName?: string;
     thumbClassName?: string;
     labelClassName?: string;
-    required?: boolean;
 };
 declare const _default: React.NamedExoticComponent<ToggleProps & React.RefAttributes<HTMLButtonElement>>;
 

package/dist/entries/toggle.js

@@ -1 +1 @@
-import {a}from'../chunk-FK7R34ZH.js';import {a as a$1}from'../chunk-6GLPXMGB.js';import*as e from'react';import*as o from'@radix-ui/react-switch';import {jsx,jsxs}from'react/jsx-runtime';var N={sm:{track:"h-[20px] w-[36px] p-[2px] rounded-full",thumb:"h-[16px] w-[16px] rounded-full"},md:{track:"h-[24px] w-[44px] p-[2px] rounded-full",thumb:"h-[20px] w-[20px] rounded-full"},lg:{track:"h-[28px] w-[56px] p-[2px] rounded-full",thumb:"h-[24px] w-[24px] rounded-full"}},S=e.memo(function({label:t,required:r}){return t==null?null:jsx(a,{label:t,required:r})}),u=e.forwardRef(function({checked:t,defaultChecked:r,onCheckedChange:s,disabled:n=false,id:b,size:m="md",label:p,labelPosition:f="right",className:g,trackClassName:h,thumbClassName:x,required:w},k){let i=N[m],y=e.useCallback(R=>s?.(R),[s]),C=e.useMemo(()=>a$1("inline-flex shrink-0 items-center transition-all duration-200  disabled:bg-gray-300 disabled:cursor-not-allowed disabled:opacity-50","data-[state=unchecked]:justify-start data-[state=checked]:justify-end","focus:outline-none focus-visible:ring-2 ring-black/20 disabled:cursor-not-allowed disabled:opacity-50",{"bg-blue-500":t,"bg-gray-300":!t}),[t]);return jsxs("label",{className:a$1("inline-flex select-none items-center gap-3",f==="left"&&"flex-row-reverse justify-end",g),children:[jsx(o.Root,{ref:k,id:b,checked:t,defaultChecked:r,onCheckedChange:y,disabled:n,className:a$1(C,i.track,h),children:jsx(o.Thumb,{"aria-disabled":n,className:a$1("bg-white shadow-sm transition-transform duration-200",i.thumb,x)})}),jsx(S,{label:p,required:w})]})});u.displayName="Toggle";var T=e.memo(u);export{T as default};
+import {a}from'../chunk-FK7R34ZH.js';import {a as a$1}from'../chunk-6GLPXMGB.js';import*as e from'react';import*as s from'@radix-ui/react-switch';import {cva}from'class-variance-authority';import {jsx,jsxs}from'react/jsx-runtime';var R=cva(["inline-flex shrink-0 items-center transition-all duration-200","focus:outline-none focus-visible:ring-2 ring-black/20","disabled:cursor-not-allowed disabled:opacity-50 disabled:!bg-gray-300","data-[state=unchecked]:justify-start data-[state=checked]:justify-end"],{variants:{size:{sm:"h-[20px] w-[36px] p-[2px] rounded-full",md:"h-[24px] w-[44px] p-[2px] rounded-full",lg:"h-[28px] w-[56px] p-[2px] rounded-full"},colorScheme:{blue:"data-[state=checked]:bg-blue-500 data-[state=unchecked]:bg-gray-300",red:"data-[state=checked]:bg-red-500 data-[state=unchecked]:bg-gray-300",green:"data-[state=checked]:bg-green-500 data-[state=unchecked]:bg-gray-300",purple:"data-[state=checked]:bg-purple-500 data-[state=unchecked]:bg-gray-300",orange:"data-[state=checked]:bg-orange-500 data-[state=unchecked]:bg-gray-300"}},defaultVariants:{size:"md",colorScheme:"blue"}}),P=cva("bg-white shadow-sm transition-transform duration-200",{variants:{size:{sm:"h-[16px] w-[16px] rounded-full",md:"h-[20px] w-[20px] rounded-full",lg:"h-[24px] w-[24px] rounded-full"}},defaultVariants:{size:"md"}}),L=e.memo(function({label:t,required:n}){return t==null?null:jsx(a,{label:t,required:n})}),m=e.forwardRef(function({checked:t,defaultChecked:n,onCheckedChange:p,disabled:h=false,required:i=false,name:f,value:k,id:x,size:c="md",colorScheme:y="blue",checkedBg:l,uncheckedBg:o,label:w,labelPosition:C="right",className:T,trackClassName:V,thumbClassName:N,labelClassName:M},S){let d=!!(l||o),v=e.useMemo(()=>d?a$1(l&&`data-[state=checked]:${l}`,o&&`data-[state=unchecked]:${o}`):null,[l,o,d]);return jsxs("label",{className:a$1("inline-flex select-none items-center gap-3",C==="left"&&"flex-row-reverse justify-end",T),children:[jsx(s.Root,{ref:S,id:x,name:f,value:k,checked:t,defaultChecked:n,onCheckedChange:p,disabled:h,required:i,className:a$1(R({size:c,colorScheme:d?void 0:y}),v,V),children:jsx(s.Thumb,{className:a$1(P({size:c}),N)})}),jsx(L,{label:w,required:i})]})});m.displayName="Toggle";var z=e.memo(m);export{z as default};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "the-omelet-ui",
-  "version": "1.6.2",
+  "version": "1.6.5",
   "private": false,
   "license": "MIT",
   "type": "module",