@getgreenline/blaze-ui 1.0.4-5.02-beta → 1.0.4-5.03-beta

package/dist/components/checkbox.d.ts

@@ -1,5 +1,8 @@
 import * as React from "react";
 import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
-declare function Checkbox({ className, ...props }: React.ComponentProps<typeof CheckboxPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+type CheckboxShape = "square" | "circle";
+declare function Checkbox({ className, shape, ...props }: React.ComponentProps<typeof CheckboxPrimitive.Root> & {
+    shape?: CheckboxShape;
+}): import("react/jsx-runtime").JSX.Element;
 export { Checkbox };
 //# sourceMappingURL=checkbox.d.ts.map

package/dist/components/checkbox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../src/components/checkbox.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,iBAAiB,MAAM,0BAA0B,CAAA;AAK7D,iBAAS,QAAQ,CAAC,EAChB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,iBAAiB,CAAC,IAAI,CAAC,2CAkBrD;AAED,OAAO,EAAE,QAAQ,EAAE,CAAA"}
+{"version":3,"file":"checkbox.d.ts","sourceRoot":"","sources":["../../src/components/checkbox.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,iBAAiB,MAAM,0BAA0B,CAAA;AAK7D,KAAK,aAAa,GAAG,QAAQ,GAAG,QAAQ,CAAA;AAExC,iBAAS,QAAQ,CAAC,EAChB,SAAS,EACT,KAAgB,EAChB,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,iBAAiB,CAAC,IAAI,CAAC,GAAG;IACvD,KAAK,CAAC,EAAE,aAAa,CAAA;CACtB,2CAmBA;AAED,OAAO,EAAE,QAAQ,EAAE,CAAA"}

package/dist/components/checkbox.js

@@ -3,8 +3,8 @@ import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
 import { CheckIcon } from 'lucide-react';
 import { cn } from '../lib/utils.js';
 
-function Checkbox({ className, ...props }) {
-    return (jsx(CheckboxPrimitive.Root, { "data-slot": "checkbox", className: cn("tw:peer tw:!border-border tw:dark:!bg-input/30 tw:data-[state=checked]:!bg-primary tw:data-[state=checked]:!text-primary-foreground tw:dark:data-[state=checked]:!bg-primary tw:data-[state=checked]:!border-primary tw:focus-visible:!border-ring tw:focus-visible:!ring-ring/50 tw:aria-invalid:!ring-destructive/20 tw:dark:aria-invalid:!ring-destructive/40 tw:aria-invalid:!border-destructive tw:!size-4 tw:!shrink-0 tw:!rounded-[4px] tw:!border tw:!shadow-xs tw:!transition-shadow tw:!outline-none tw:focus-visible:!ring-[3px] tw:disabled:!cursor-not-allowed tw:disabled:!opacity-50 tw:data-[disabled]:!cursor-not-allowed tw:data-[disabled]:!opacity-50 tw:aria-disabled:!cursor-not-allowed tw:aria-disabled:!opacity-50 tw:!align-middle", className), ...props, children: jsx(CheckboxPrimitive.Indicator, { "data-slot": "checkbox-indicator", className: "tw:flex tw:items-center tw:justify-center tw:text-current tw:transition-none", children: jsx(CheckIcon, { className: "tw:size-[80%]" }) }) }));
+function Checkbox({ className, shape = "square", ...props }) {
+    return (jsx(CheckboxPrimitive.Root, { "data-slot": "checkbox", className: cn("tw:peer tw:!border-border tw:dark:!bg-input/30 tw:data-[state=checked]:!bg-primary tw:data-[state=checked]:!text-primary-foreground tw:dark:data-[state=checked]:!bg-primary tw:data-[state=checked]:!border-primary tw:focus-visible:!border-ring tw:focus-visible:!ring-ring/50 tw:aria-invalid:!ring-destructive/20 tw:dark:aria-invalid:!ring-destructive/40 tw:aria-invalid:!border-destructive tw:!size-4 tw:!shrink-0 tw:!border tw:!shadow-xs tw:!transition-shadow tw:!outline-none tw:focus-visible:!ring-[3px] tw:disabled:!cursor-not-allowed tw:disabled:!opacity-50 tw:data-[disabled]:!cursor-not-allowed tw:data-[disabled]:!opacity-50 tw:aria-disabled:!cursor-not-allowed tw:aria-disabled:!opacity-50 tw:!align-middle", shape === "circle" ? "tw:!rounded-full" : "tw:!rounded-[4px]", className), ...props, children: jsx(CheckboxPrimitive.Indicator, { "data-slot": "checkbox-indicator", className: "tw:flex tw:items-center tw:justify-center tw:text-current tw:transition-none", children: jsx(CheckIcon, { className: "tw:size-[80%]" }) }) }));
 }
 
 export { Checkbox };

package/dist/components/multi-search-select.d.ts

@@ -15,10 +15,11 @@ export interface MultiSearchSelectProps extends Omit<React.ComponentProps<"butto
     onSearchFunction?: (searchTerm: string) => Promise<MultiSearchSelectOption[]> | MultiSearchSelectOption[];
     minSearchChars?: number;
     searchDebounceMs?: number;
+    minSearchMessage?: string;
     maxVisibleChips?: number;
     selectedCountLabel?: string;
     selectedCountFormatter?: (count: number) => string;
 }
-declare function MultiSearchSelect({ className, options, value, onValueChange, placeholder, searchPlaceholder, emptyMessage, maxOptions, onSearchFunction, minSearchChars, searchDebounceMs, maxVisibleChips, selectedCountLabel, selectedCountFormatter, disabled, ...props }: MultiSearchSelectProps): import("react/jsx-runtime").JSX.Element;
+declare function MultiSearchSelect({ className, options, value, onValueChange, placeholder, searchPlaceholder, emptyMessage, maxOptions, onSearchFunction, minSearchChars, searchDebounceMs, minSearchMessage, maxVisibleChips, selectedCountLabel, selectedCountFormatter, disabled, ...props }: MultiSearchSelectProps): import("react/jsx-runtime").JSX.Element;
 export { MultiSearchSelect };
 //# sourceMappingURL=multi-search-select.d.ts.map

package/dist/components/multi-search-select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"multi-search-select.d.ts","sourceRoot":"","sources":["../../src/components/multi-search-select.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAO9B,MAAM,WAAW,uBAAuB;IACtC,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAClD,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,EAC9B,OAAO,GAAG,UAAU,CACrB;IACC,OAAO,EAAE,uBAAuB,EAAE,CAAA;IAClC,KAAK,EAAE,MAAM,EAAE,CAAA;IACf,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAA;IACxC,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,gBAAgB,CAAC,EAAE,CACjB,UAAU,EAAE,MAAM,KACf,OAAO,CAAC,uBAAuB,EAAE,CAAC,GAAG,uBAAuB,EAAE,CAAA;IACnE,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,sBAAsB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAA;CACnD;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,OAAO,EACP,KAAK,EACL,aAAa,EACb,WAAiC,EACjC,iBAA+B,EAC/B,YAAiC,EACjC,UAAe,EACf,gBAAgB,EAChB,cAAkB,EAClB,gBAAsB,EACtB,eAAmB,EACnB,kBAAkB,EAClB,sBAAsB,EACtB,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,sBAAsB,2CAiRxB;AAED,OAAO,EAAE,iBAAiB,EAAE,CAAA"}
+{"version":3,"file":"multi-search-select.d.ts","sourceRoot":"","sources":["../../src/components/multi-search-select.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAO9B,MAAM,WAAW,uBAAuB;IACtC,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED,MAAM,WAAW,sBAAuB,SAAQ,IAAI,CAClD,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,EAC9B,OAAO,GAAG,UAAU,CACrB;IACC,OAAO,EAAE,uBAAuB,EAAE,CAAA;IAClC,KAAK,EAAE,MAAM,EAAE,CAAA;IACf,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAA;IACxC,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,gBAAgB,CAAC,EAAE,CACjB,UAAU,EAAE,MAAM,KACf,OAAO,CAAC,uBAAuB,EAAE,CAAC,GAAG,uBAAuB,EAAE,CAAA;IACnE,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAC3B,sBAAsB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAA;CACnD;AAED,iBAAS,iBAAiB,CAAC,EACzB,SAAS,EACT,OAAO,EACP,KAAK,EACL,aAAa,EACb,WAAiC,EACjC,iBAA+B,EAC/B,YAAiC,EACjC,UAAe,EACf,gBAAgB,EAChB,cAAkB,EAClB,gBAAsB,EACtB,gBAAgB,EAChB,eAAmB,EACnB,kBAAkB,EAClB,sBAAsB,EACtB,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,sBAAsB,2CAsTxB;AAED,OAAO,EAAE,iBAAiB,EAAE,CAAA"}

package/dist/components/multi-search-select.js

@@ -5,7 +5,10 @@ import { XIcon, ChevronDownIcon, SearchIcon, CheckIcon } from 'lucide-react';
 import { Badge } from './badge.js';
 import { cn } from '../lib/utils.js';
 
-function MultiSearchSelect({ className, options, value, onValueChange, placeholder = "Select options...", searchPlaceholder = "Search...", emptyMessage = "No options found", maxOptions = 50, onSearchFunction, minSearchChars = 3, searchDebounceMs = 800, maxVisibleChips = 3, selectedCountLabel, selectedCountFormatter, disabled, ...props }) {
+function MultiSearchSelect({ className, options, value, onValueChange, placeholder = "Select options...", searchPlaceholder = "Search...", emptyMessage = "No options found", maxOptions = 50, onSearchFunction, minSearchChars = 3, searchDebounceMs = 800, minSearchMessage, maxVisibleChips = 3, selectedCountLabel, selectedCountFormatter, disabled, ...props }) {
+    const triggerId = React.useId();
+    const listboxId = React.useId();
+    const searchInputId = React.useId();
     const [open, setOpen] = React.useState(false);
     const [search, setSearch] = React.useState("");
     const [remoteOptions, setRemoteOptions] = React.useState([]);
@@ -98,6 +101,10 @@ function MultiSearchSelect({ className, options, value, onValueChange, placehold
         options,
         remoteOptions,
     ]);
+    const shouldShowMinSearchHint = Boolean(onSearchFunction) &&
+        normalizedSearch.length > 0 &&
+        normalizedSearch.length < minSearchChars;
+    const resolvedMinSearchMessage = minSearchMessage ?? `Type at least ${minSearchChars} characters to search`;
     const toggleValue = React.useCallback((optionValue) => {
         const nextValue = value.includes(optionValue)
             ? value.filter((currentValue) => currentValue !== optionValue)
@@ -112,11 +119,11 @@ function MultiSearchSelect({ className, options, value, onValueChange, placehold
             setOpen(nextOpen);
             if (!nextOpen)
                 setSearch("");
-        }, children: [jsx(PopoverPrimitive.Trigger, { asChild: true, children: jsxs("button", { type: "button", "data-slot": "multi-search-select-trigger", disabled: disabled, className: cn("tw:!flex tw:!w-full tw:!min-h-9 tw:!items-center tw:!justify-between tw:!gap-2 tw:!rounded-md tw:!border tw:!border-input tw:!bg-transparent tw:!px-3 tw:!py-2 tw:!text-[14px] tw:!shadow-xs tw:!outline-none", "focus-visible:tw:!border-ring focus-visible:tw:!ring-ring/50 focus-visible:tw:!ring-[3px]", "disabled:tw:!cursor-not-allowed disabled:tw:!opacity-50", className), ...props, children: [jsx("div", { className: "tw:!flex tw:!min-w-0 tw:!flex-1 tw:!flex-wrap tw:!items-center tw:!gap-1.5", children: selectedOptions.length === 0 ? (jsx("span", { className: "tw:!text-muted-foreground", children: placeholder })) : (jsxs(Fragment, { children: [visibleSelectedOptions.map((option) => (jsxs(Badge, { variant: "secondary", className: "tw:!max-w-full tw:!pr-1", children: [jsx("span", { className: "tw:!max-w-[140px] tw:!truncate", children: option.label }), jsx("span", { role: "button", tabIndex: -1, "aria-label": `Remove ${option.label}`, onClick: (event) => removeValue(option.value, event), className: "tw:!ml-1 tw:!inline-flex tw:!items-center tw:!justify-center", children: jsx(XIcon, { className: "tw:!size-3" }) })] }, option.value))), hiddenSelectedCount > 0 && (jsx("span", { className: "tw:!text-sm tw:!text-muted-foreground tw:!truncate", children: selectedCountText }))] })) }), jsx(ChevronDownIcon, { className: "tw:!size-4 tw:!shrink-0 tw:!opacity-50" })] }) }), jsx(PopoverPrimitive.Portal, { children: jsxs(PopoverPrimitive.Content, { "data-slot": "multi-search-select-content", align: "start", sideOffset: 4, className: "tw:!z-50 tw:!w-[var(--radix-popover-trigger-width)] tw:!rounded-md tw:!border tw:!bg-popover tw:!text-popover-foreground tw:!shadow-md tw:!outline-none", children: [jsxs("div", { className: "tw:!flex tw:!items-center tw:!gap-2 tw:!border-b tw:!px-3", children: [jsx(SearchIcon, { className: "tw:!size-4 tw:!shrink-0 tw:!text-muted-foreground" }), jsx("input", { type: "text", value: search, onChange: (event) => setSearch(event.target.value), placeholder: searchPlaceholder, className: "tw:!h-9 tw:!w-full tw:!bg-transparent tw:!text-[14px] tw:!outline-none placeholder:tw:!text-muted-foreground" })] }), jsxs("div", { className: "tw:!max-h-72 tw:!overflow-y-auto tw:!p-1", children: [onSearchFunction &&
-                                    normalizedSearch.length > 0 &&
-                                    normalizedSearch.length < minSearchChars ? (jsxs("div", { className: "tw:!px-2 tw:!py-2 tw:!text-[14px] tw:!text-muted-foreground", children: ["Type at least ", minSearchChars, " characters to search"] })) : null, isSearching ? (jsx("div", { className: "tw:!px-2 tw:!py-2 tw:!text-[14px] tw:!text-muted-foreground", children: "Searching..." })) : null, !isSearching && filteredOptions.length === 0 ? (jsx("div", { className: "tw:!px-2 tw:!py-2 tw:!text-[14px] tw:!text-muted-foreground", children: emptyMessage })) : !isSearching ? (filteredOptions.map((option) => {
+        }, children: [jsx(PopoverPrimitive.Trigger, { asChild: true, children: jsxs("button", { type: "button", id: triggerId, "data-slot": "multi-search-select-trigger", disabled: disabled, "aria-haspopup": "listbox", "aria-expanded": open, "aria-controls": listboxId, className: cn("tw:!flex tw:!w-full tw:!min-h-9 tw:!items-center tw:!justify-between tw:!gap-2 tw:!rounded-md tw:!border tw:!border-input tw:!bg-transparent tw:!px-3 tw:!py-2 tw:!text-[14px] tw:!shadow-xs tw:!outline-none", "focus-visible:tw:!border-ring focus-visible:tw:!ring-ring/50 focus-visible:tw:!ring-[3px]", "disabled:tw:!cursor-not-allowed disabled:tw:!opacity-50", className), ...props, children: [jsx("div", { className: "tw:!flex tw:!min-w-0 tw:!flex-1 tw:!flex-wrap tw:!items-center tw:!gap-1.5", children: selectedOptions.length === 0 ? (jsx("span", { className: "tw:!text-muted-foreground", children: placeholder })) : (jsxs(Fragment, { children: [visibleSelectedOptions.map((option) => (jsxs(Badge, { variant: "secondary", className: "tw:!max-w-full tw:!pr-1", children: [jsx("span", { className: "tw:!max-w-[140px] tw:!truncate", children: option.label }), jsx("button", { type: "button", "aria-label": `Remove ${option.label}`, onClick: (event) => removeValue(option.value, event), className: "tw:!ml-1 tw:!inline-flex tw:!items-center tw:!justify-center", children: jsx(XIcon, { className: "tw:!size-3" }) })] }, option.value))), hiddenSelectedCount > 0 && (jsx("span", { className: "tw:!text-sm tw:!text-muted-foreground tw:!truncate", children: selectedCountText }))] })) }), jsx(ChevronDownIcon, { className: "tw:!size-4 tw:!shrink-0 tw:!opacity-50" })] }) }), jsx(PopoverPrimitive.Portal, { children: jsxs(PopoverPrimitive.Content, { "data-slot": "multi-search-select-content", align: "start", sideOffset: 4, className: "tw:!z-50 tw:!w-[var(--radix-popover-trigger-width)] tw:!rounded-md tw:!border tw:!bg-popover tw:!text-popover-foreground tw:!shadow-md tw:!outline-none", children: [jsxs("div", { className: "tw:!flex tw:!items-center tw:!gap-2 tw:!border-b tw:!px-3", children: [jsx(SearchIcon, { className: "tw:!size-4 tw:!shrink-0 tw:!text-muted-foreground" }), jsx("input", { id: searchInputId, type: "text", value: search, onChange: (event) => setSearch(event.target.value), placeholder: searchPlaceholder, "aria-label": searchPlaceholder, className: "tw:!h-9 tw:!w-full tw:!bg-transparent tw:!text-[14px] tw:!outline-none placeholder:tw:!text-muted-foreground" })] }), jsxs("div", { id: listboxId, role: "listbox", "aria-labelledby": triggerId, "aria-describedby": searchInputId, "aria-multiselectable": "true", className: "tw:!max-h-72 tw:!overflow-y-auto tw:!p-1", children: [shouldShowMinSearchHint ? (jsx("div", { role: "status", "aria-live": "polite", className: "tw:!px-2 tw:!py-2 tw:!text-[14px] tw:!text-muted-foreground", children: resolvedMinSearchMessage })) : null, isSearching ? (jsx("div", { role: "status", "aria-live": "polite", className: "tw:!px-2 tw:!py-2 tw:!text-[14px] tw:!text-muted-foreground", children: "Searching..." })) : null, !isSearching &&
+                                    !shouldShowMinSearchHint &&
+                                    filteredOptions.length === 0 ? (jsx("div", { role: "status", "aria-live": "polite", className: "tw:!px-2 tw:!py-2 tw:!text-[14px] tw:!text-muted-foreground", children: emptyMessage })) : !isSearching ? (filteredOptions.map((option) => {
                                     const isSelected = value.includes(option.value);
-                                    return (jsxs("button", { type: "button", disabled: option.disabled, onClick: () => toggleValue(option.value), className: cn("tw:!flex tw:!w-full tw:!items-center tw:!gap-2 tw:!rounded-sm tw:!px-2 tw:!py-1.5 tw:!text-left tw:!text-[14px]", "hover:tw:!bg-accent hover:tw:!text-accent-foreground", option.disabled &&
+                                    return (jsxs("button", { type: "button", disabled: option.disabled, role: "option", "aria-selected": isSelected, onClick: () => toggleValue(option.value), className: cn("tw:!flex tw:!w-full tw:!items-center tw:!gap-2 tw:!rounded-sm tw:!px-2 tw:!py-1.5 tw:!text-left tw:!text-[14px]", "hover:tw:!bg-accent hover:tw:!text-accent-foreground", option.disabled &&
                                             "tw:!cursor-not-allowed tw:!opacity-50 hover:tw:!bg-transparent hover:tw:!text-foreground"), children: [jsx("span", { className: cn("tw:!inline-flex tw:!size-4 tw:!items-center tw:!justify-center tw:!rounded-[4px] tw:!border tw:!border-border", isSelected &&
                                                     "tw:!border-primary tw:!bg-primary tw:!text-primary-foreground"), children: isSelected ? jsx(CheckIcon, { className: "tw:!size-3" }) : null }), jsx("span", { className: "tw:!min-w-0 tw:!flex-1 tw:!truncate", children: option.label })] }, option.value));
                                 })) : null] })] }) })] }));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@getgreenline/blaze-ui",
-  "version": "1.0.45.02-beta",
+  "version": "1.0.45.03-beta",
   "type": "module",
   "dependencies": {
     "@base-ui/react": "^1.4.1",