@getgreenline/blaze-ui 1.0.12 → 1.0.14

package/dist/components/button.d.ts

@@ -4,8 +4,10 @@ declare const buttonVariants: (props?: ({
     variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link" | null | undefined;
     size?: "default" | "sm" | "lg" | "icon" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
-declare function Button({ className, variant, size, asChild, ...props }: React.ComponentProps<"button"> & VariantProps<typeof buttonVariants> & {
+declare function Button({ className, variant, size, asChild, loading, loadingText, children, disabled: buttonDisabled, ...rest }: React.ComponentProps<"button"> & VariantProps<typeof buttonVariants> & {
     asChild?: boolean;
+    loading?: boolean;
+    loadingText?: string;
 }): import("react/jsx-runtime").JSX.Element;
 export { Button, buttonVariants };
 //# sourceMappingURL=button.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/components/button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAIjE,QAAA,MAAM,cAAc;;;8EA6BnB,CAAA;AAED,iBAAS,MAAM,CAAC,EACd,SAAS,EACT,OAAO,EACP,IAAI,EACJ,OAAe,EACf,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,GAC/B,YAAY,CAAC,OAAO,cAAc,CAAC,GAAG;IACpC,OAAO,CAAC,EAAE,OAAO,CAAA;CAClB,2CAUF;AAED,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,CAAA"}
+{"version":3,"file":"button.d.ts","sourceRoot":"","sources":["../../src/components/button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAKjE,QAAA,MAAM,cAAc;;;8EA6BnB,CAAA;AAED,iBAAS,MAAM,CAAC,EACd,SAAS,EACT,OAAO,EACP,IAAI,EACJ,OAAe,EACf,OAAe,EACf,WAAuB,EACvB,QAAQ,EACR,QAAQ,EAAE,cAAc,EACxB,GAAG,IAAI,EACR,EAAE,KAAK,CAAC,cAAc,CAAC,QAAQ,CAAC,GAC/B,YAAY,CAAC,OAAO,cAAc,CAAC,GAAG;IACpC,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,WAAW,CAAC,EAAE,MAAM,CAAA;CACrB,2CAuCF;AAED,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,CAAA"}

package/dist/components/button.js

@@ -1,9 +1,10 @@
-import { jsx } from 'react/jsx-runtime.js';
+import { jsxs, jsx } from 'react/jsx-runtime.js';
 import { Slot } from '@radix-ui/react-slot';
 import { cva } from 'class-variance-authority';
+import { LoaderCircleIcon } from 'lucide-react';
 import { cn } from '../lib/utils.js';
 
-const buttonVariants = cva("tw:inline-flex tw:items-center tw:justify-center tw:gap-2 tw:whitespace-nowrap tw:rounded-md tw:text-sm tw:font-medium tw:transition-all tw:disabled:pointer-events-none tw:disabled:opacity-50 tw:[&_svg]:pointer-events-none tw:[&_svg:not([class*='size-'])]:size-4 tw:shrink-0 tw:[&_svg]:shrink-0 tw:outline-none tw:focus-visible:border-ring tw:focus-visible:ring-ring/50 tw:focus-visible:ring-[3px] tw:aria-invalid:ring-destructive/20 tw:dark:aria-invalid:ring-destructive/40 tw:aria-invalid:border-destructive", {
+const buttonVariants = cva("tw:relative tw:inline-flex tw:items-center tw:justify-center tw:gap-2 tw:whitespace-nowrap tw:rounded-md tw:text-sm tw:font-medium tw:transition-all tw:disabled:pointer-events-none tw:data-[disabled]:pointer-events-none tw:data-[loading]:pointer-events-none tw:disabled:opacity-50 tw:data-[disabled]:opacity-50 tw:[&_svg]:pointer-events-none tw:[&_svg:not([class*='size-'])]:size-4 tw:shrink-0 tw:[&_svg]:shrink-0 tw:outline-none tw:focus-visible:border-ring tw:focus-visible:ring-ring/50 tw:focus-visible:ring-[3px] tw:aria-invalid:ring-destructive/20 tw:dark:aria-invalid:ring-destructive/40 tw:aria-invalid:border-destructive", {
     variants: {
         variant: {
             default: "tw:bg-primary tw:text-primary-foreground tw:shadow-xs tw:hover:bg-primary/90",
@@ -25,9 +26,10 @@ const buttonVariants = cva("tw:inline-flex tw:items-center tw:justify-center tw:
         size: "default",
     },
 });
-function Button({ className, variant, size, asChild = false, ...props }) {
+function Button({ className, variant, size, asChild = false, loading = false, loadingText = "Loading", children, disabled: buttonDisabled, ...rest }) {
     const Comp = asChild ? Slot : "button";
-    return (jsx(Comp, { "data-slot": "button", className: cn(buttonVariants({ variant, size, className })), ...props }));
+    const isDisabled = Boolean(buttonDisabled || loading);
+    return (jsxs(Comp, { "data-slot": "button", "data-loading": loading ? "" : undefined, "data-disabled": isDisabled ? "" : undefined, className: cn(buttonVariants({ variant, size, className }), loading && "tw:cursor-progress"), disabled: !asChild ? isDisabled : undefined, "aria-disabled": isDisabled ? true : undefined, "aria-busy": loading || undefined, ...rest, children: [jsx("span", { className: cn("tw:inline-flex tw:items-center tw:justify-center tw:gap-[inherit] tw:transition-opacity", loading && "tw:opacity-0"), children: children }), loading ? (jsxs("span", { "data-slot": "button-spinner", className: "tw:absolute tw:inset-0 tw:flex tw:items-center tw:justify-center", role: "status", "aria-live": "polite", children: [jsx(LoaderCircleIcon, { className: "tw:size-4 tw:animate-spin", "aria-hidden": "true" }), jsx("span", { className: "tw:sr-only", children: loadingText })] })) : null] }));
 }
 
 export { Button, buttonVariants };

package/dist/components/label.d.ts

@@ -1,5 +1,8 @@
 import * as React from "react";
 import * as LabelPrimitive from "@radix-ui/react-label";
-declare function Label({ className, ...props }: React.ComponentProps<typeof LabelPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+interface LabelProps extends React.ComponentProps<typeof LabelPrimitive.Root> {
+    isRequired?: boolean;
+}
+declare function Label({ className, isRequired, children, ...props }: LabelProps): import("react/jsx-runtime").JSX.Element;
 export { Label };
 //# sourceMappingURL=label.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"label.d.ts","sourceRoot":"","sources":["../../src/components/label.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,cAAc,MAAM,uBAAuB,CAAA;AAIvD,iBAAS,KAAK,CAAC,EACb,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,IAAI,CAAC,2CAWlD;AAED,OAAO,EAAE,KAAK,EAAE,CAAA"}
+{"version":3,"file":"label.d.ts","sourceRoot":"","sources":["../../src/components/label.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,cAAc,MAAM,uBAAuB,CAAA;AAIvD,UAAU,UAAW,SAAQ,KAAK,CAAC,cAAc,CAAC,OAAO,cAAc,CAAC,IAAI,CAAC;IAC3E,UAAU,CAAC,EAAE,OAAO,CAAA;CACrB;AAED,iBAAS,KAAK,CAAC,EACb,SAAS,EACT,UAAU,EACV,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,UAAU,2CAeZ;AAED,OAAO,EAAE,KAAK,EAAE,CAAA"}

package/dist/components/label.js

@@ -1,9 +1,9 @@
-import { jsx } from 'react/jsx-runtime.js';
+import { jsxs, jsx } from 'react/jsx-runtime.js';
 import * as LabelPrimitive from '@radix-ui/react-label';
 import { cn } from '../lib/utils.js';
 
-function Label({ className, ...props }) {
-    return (jsx(LabelPrimitive.Root, { "data-slot": "label", className: cn("tw:flex tw:items-center tw:gap-2 tw:text-sm tw:leading-none tw:font-medium tw:select-none tw:group-data-[disabled=true]:pointer-events-none tw:group-data-[disabled=true]:opacity-50 tw:peer-disabled:cursor-not-allowed tw:peer-disabled:opacity-50", className), ...props }));
+function Label({ className, isRequired, children, ...props }) {
+    return (jsxs(LabelPrimitive.Root, { "data-slot": "label", className: cn("tw:flex tw:items-center tw:gap-2 tw:text-sm tw:leading-none tw:font-medium tw:select-none tw:group-data-[disabled=true]:pointer-events-none tw:group-data-[disabled=true]:opacity-50 tw:peer-disabled:cursor-not-allowed tw:peer-disabled:opacity-50", className), "aria-required": isRequired, ...props, children: [children, isRequired && jsx("span", { className: "tw:text-destructive", "aria-hidden": "true", children: "*" })] }));
 }
 
 export { Label };

package/dist/components/segmented-control.d.ts

@@ -0,0 +1,24 @@
+import { type VariantProps } from "class-variance-authority";
+declare const segmentedControlVariants: (props?: ({
+    variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link" | null | undefined;
+    size?: "default" | "sm" | "lg" | "icon" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+declare const segmentedControlItemVariants: (props?: ({
+    variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link" | null | undefined;
+    size?: "default" | "sm" | "lg" | "icon" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+interface SegmentedControlOption {
+    value: string;
+    label: string;
+}
+interface SegmentedControlProps extends VariantProps<typeof segmentedControlVariants> {
+    options: SegmentedControlOption[];
+    value: string;
+    onValueChange: (value: string) => void;
+    className?: string;
+    ariaLabel?: string;
+    ariaLabelledBy?: string;
+}
+export declare function SegmentedControl({ options, value, onValueChange, className, ariaLabel, ariaLabelledBy, variant, size, }: SegmentedControlProps): import("react/jsx-runtime").JSX.Element;
+export { segmentedControlItemVariants, segmentedControlVariants };
+//# sourceMappingURL=segmented-control.d.ts.map

package/dist/components/segmented-control.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"segmented-control.d.ts","sourceRoot":"","sources":["../../src/components/segmented-control.tsx"],"names":[],"mappings":"AACA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAOjE,QAAA,MAAM,wBAAwB;;;8EAwB7B,CAAA;AAED,QAAA,MAAM,4BAA4B;;;8EA8BjC,CAAA;AAED,UAAU,sBAAsB;IAC9B,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;CACd;AAED,UAAU,qBAAsB,SAAQ,YAAY,CAAC,OAAO,wBAAwB,CAAC;IACnF,OAAO,EAAE,sBAAsB,EAAE,CAAA;IACjC,KAAK,EAAE,MAAM,CAAA;IACb,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACtC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,cAAc,CAAC,EAAE,MAAM,CAAA;CACxB;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,OAAO,EACP,KAAK,EACL,aAAa,EACb,SAAS,EACT,SAAS,EACT,cAAc,EACd,OAAO,EACP,IAAI,GACL,EAAE,qBAAqB,2CA4EvB;AAED,OAAO,EAAE,4BAA4B,EAAE,wBAAwB,EAAE,CAAA"}

package/dist/components/segmented-control.js

@@ -0,0 +1,88 @@
+import { jsx, jsxs } from 'react/jsx-runtime.js';
+import { cva } from 'class-variance-authority';
+import { useRef } from 'react';
+import { cn } from '../lib/utils.js';
+
+const segmentedControlVariants = cva("tw:inline-flex tw:items-center tw:gap-1 tw:rounded-md tw:border tw:p-1", {
+    variants: {
+        variant: {
+            default: "tw:border-transparent tw:bg-muted",
+            destructive: "tw:border-destructive/20 tw:bg-destructive/10",
+            outline: "tw:border-input tw:bg-background",
+            secondary: "tw:border-transparent tw:bg-secondary/60",
+            ghost: "tw:border-transparent tw:bg-transparent",
+            link: "tw:border-transparent tw:bg-transparent",
+        },
+        size: {
+            default: "tw:p-1",
+            sm: "tw:p-0.5",
+            lg: "tw:p-1.5",
+            icon: "tw:p-1",
+        },
+    },
+    defaultVariants: {
+        variant: "default",
+        size: "default",
+    },
+});
+const segmentedControlItemVariants = cva("tw:inline-flex tw:items-center tw:justify-center tw:gap-2 tw:rounded-md tw:text-sm tw:font-medium tw:transition-all tw:duration-200 tw:outline-none tw:focus-visible:border-ring tw:focus-visible:ring-ring/50 tw:focus-visible:ring-[3px] tw:focus-visible:ring-offset-2 tw:focus-visible:ring-offset-background tw:focus:z-10 tw:disabled:pointer-events-none tw:disabled:opacity-50", {
+    variants: {
+        variant: {
+            default: "tw:text-foreground/70 tw:hover:text-primary tw:hover:bg-primary/10 tw:data-[state=active]:bg-primary tw:data-[state=active]:text-primary-foreground tw:data-[state=active]:shadow-xs",
+            destructive: "tw:text-destructive tw:hover:text-destructive tw:hover:bg-destructive/10 tw:data-[state=active]:bg-destructive tw:data-[state=active]:text-white tw:data-[state=active]:shadow-xs",
+            outline: "tw:text-foreground/70 tw:hover:text-foreground tw:hover:bg-muted/50 tw:data-[state=active]:border tw:data-[state=active]:border-input tw:data-[state=active]:bg-background tw:data-[state=active]:text-foreground tw:data-[state=active]:shadow-xs",
+            secondary: "tw:text-secondary-foreground/80 tw:hover:text-secondary-foreground tw:hover:bg-secondary/60 tw:data-[state=active]:bg-secondary tw:data-[state=active]:text-secondary-foreground tw:data-[state=active]:shadow-xs",
+            ghost: "tw:text-foreground/80 tw:hover:text-foreground tw:hover:bg-accent/50 tw:data-[state=active]:bg-accent tw:data-[state=active]:text-accent-foreground tw:data-[state=active]:shadow-xs",
+            link: "tw:text-primary tw:hover:underline tw:data-[state=active]:text-primary tw:data-[state=active]:underline tw:data-[state=active]:shadow-none",
+        },
+        size: {
+            default: "tw:px-4 tw:py-2 tw:text-sm",
+            sm: "tw:px-3 tw:py-1.5 tw:text-xs",
+            lg: "tw:px-5 tw:py-2.5 tw:text-base",
+            icon: "tw:px-2 tw:py-2 tw:text-sm",
+        },
+    },
+    defaultVariants: {
+        variant: "default",
+        size: "default",
+    },
+});
+function SegmentedControl({ options, value, onValueChange, className, ariaLabel, ariaLabelledBy, variant, size, }) {
+    const resolvedVariant = variant ?? "default";
+    const resolvedSize = size ?? "default";
+    const containerRef = useRef(null);
+    const handleKeyDown = (event, currentIndex) => {
+        let newIndex = currentIndex;
+        switch (event.key) {
+            case "ArrowLeft":
+            case "ArrowUp":
+                event.preventDefault();
+                newIndex = currentIndex > 0 ? currentIndex - 1 : options.length - 1;
+                break;
+            case "ArrowRight":
+            case "ArrowDown":
+                event.preventDefault();
+                newIndex = currentIndex < options.length - 1 ? currentIndex + 1 : 0;
+                break;
+            case "Home":
+                event.preventDefault();
+                newIndex = 0;
+                break;
+            case "End":
+                event.preventDefault();
+                newIndex = options.length - 1;
+                break;
+            default:
+                return;
+        }
+        onValueChange(options[newIndex]?.value ?? "");
+        const buttons = containerRef.current?.querySelectorAll("button");
+        buttons?.[newIndex]?.focus();
+    };
+    return (jsx("div", { ref: containerRef, className: cn(segmentedControlVariants({ variant, size }), className), role: "tablist", "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, "aria-orientation": "horizontal", "data-slot": "segmented-control", "data-variant": resolvedVariant, "data-size": resolvedSize, children: options.map((option, index) => {
+            const isSelected = value === option.value;
+            return (jsxs("button", { type: "button", role: "tab", "aria-selected": isSelected, "aria-controls": `panel-${option.value}`, id: `tab-${option.value}`, tabIndex: isSelected ? 0 : -1, onClick: () => onValueChange(option.value), onKeyDown: (e) => handleKeyDown(e, index), className: segmentedControlItemVariants({ variant, size }), "aria-describedby": isSelected ? `${option.value}-description` : undefined, "data-state": isSelected ? "active" : "inactive", "data-variant": resolvedVariant, "data-slot": "segmented-control-item", children: [option.label, isSelected && jsx("span", { className: "tw:sr-only", children: ", currently selected" })] }, option.value));
+        }) }));
+}
+
+export { SegmentedControl, segmentedControlItemVariants, segmentedControlVariants };

package/dist/globals.css

@@ -164,4 +164,256 @@
   body {
     @apply tw:bg-background tw:text-foreground;
   }
+}
+
+/* Overrides of styles for homi-web */
+.blaze-ui-homi button[data-slot='button'] {
+  color: initial;
+  background-color: initial;
+  border: none;
+  box-shadow: none;
+}
+
+.blaze-ui-homi button[data-slot='button'] {
+  @apply tw:rounded-md;
+}
+
+.blaze-ui-homi button[data-slot='switch'] {
+  @apply tw:rounded-full;
+}
+
+.blaze-ui-homi button[data-slot='button'].tw\:bg-primary {
+  @apply tw:bg-primary;
+}
+
+.blaze-ui-homi button[data-slot='button'].tw\:bg-destructive {
+  @apply tw:bg-destructive;
+}
+
+.blaze-ui-homi button[data-slot='button'].tw\:bg-secondary {
+  @apply tw:bg-secondary;
+}
+
+.blaze-ui-homi button[data-slot='button'].tw\:bg-background {
+  @apply tw:bg-background;
+}
+
+.blaze-ui-homi button[data-slot='button'].tw\:text-primary-foreground {
+  @apply tw:text-primary-foreground;
+}
+
+.blaze-ui-homi button[data-slot='button'].tw\:text-white {
+  @apply tw:text-white;
+}
+
+.blaze-ui-homi button[data-slot='button'].tw\:text-secondary-foreground {
+  @apply tw:text-secondary-foreground;
+}
+
+.blaze-ui-homi button[data-slot='button'].tw\:text-primary {
+  @apply tw:text-primary;
+}
+
+.blaze-ui-homi button[data-slot='button'].tw\:shadow-xs,
+.blaze-ui-homi button[data-slot='switch'].tw\:shadow-xs {
+  @apply tw:shadow-xs;
+}
+
+.blaze-ui-homi button[data-slot='button'].tw\:border,
+.blaze-ui-homi button[data-slot='switch'].tw\:border {
+  @apply tw:border tw:border-border;
+}
+
+/* Overrides of styles for  */
+.blaze-ui-420 {
+  --blaze-420-font-sm: 14px;
+  --blaze-420-font-base: 16px;
+  --blaze-420-line-sm: 20px;
+  --blaze-420-line-base: 24px;
+  --blaze-420-radius-md: 6px;
+  --blaze-420-radius-full: 9999px;
+  --blaze-420-space-1: 4px;
+  --blaze-420-space-2: 8px;
+  --blaze-420-space-3: 12px;
+  --blaze-420-space-4: 16px;
+  --blaze-420-space-6: 24px;
+  --blaze-420-height-9: 36px;
+  --blaze-420-switch-height: 18.4px;
+  --blaze-420-switch-width: 32px;
+  --blaze-420-thumb-size: 16px;
+  @apply tw:text-foreground tw:font-sans;
+}
+
+.blaze-ui-420 button[data-slot='button'],
+.blaze-ui-420 button[data-slot='switch'] {
+  color: inherit;
+  background-color: transparent;
+  border: none;
+  box-shadow: none;
+  font: inherit;
+}
+
+.blaze-ui-420 button[data-slot='button'] {
+  min-height: var(--blaze-420-height-9);
+  height: var(--blaze-420-height-9);
+  padding: var(--blaze-420-space-2) var(--blaze-420-space-4);
+  border-radius: var(--blaze-420-radius-md);
+  gap: var(--blaze-420-space-2);
+  font-size: var(--blaze-420-font-sm);
+  line-height: var(--blaze-420-line-sm);
+}
+
+.blaze-ui-420 button[data-slot='button'].tw\:has-\[\>svg\]\:px-3,
+.blaze-ui-420 button[data-slot='button']:has(> svg) {
+  padding-left: var(--blaze-420-space-3);
+  padding-right: var(--blaze-420-space-3);
+}
+
+.blaze-ui-420 button[data-slot='switch'] {
+  width: var(--blaze-420-switch-width);
+  min-width: var(--blaze-420-switch-width);
+  height: var(--blaze-420-switch-height);
+  padding: 0;
+  border-radius: var(--blaze-420-radius-full);
+}
+
+.blaze-ui-420 button[data-slot='switch']>[data-slot='switch-thumb'] {
+  width: var(--blaze-420-thumb-size);
+  height: var(--blaze-420-thumb-size);
+}
+
+.blaze-ui-420 button[data-slot='button'].tw\:bg-primary {
+  @apply tw:bg-primary;
+}
+
+.blaze-ui-420 button[data-slot='button'].tw\:bg-destructive {
+  @apply tw:bg-destructive;
+}
+
+.blaze-ui-420 button[data-slot='button'].tw\:bg-secondary {
+  @apply tw:bg-secondary;
+}
+
+.blaze-ui-420 button[data-slot='button'].tw\:bg-background {
+  @apply tw:bg-background;
+}
+
+.blaze-ui-420 button[data-slot='button'].tw\:text-primary-foreground {
+  @apply tw:text-primary-foreground;
+}
+
+.blaze-ui-420 button[data-slot='button'].tw\:text-white {
+  @apply tw:text-white;
+}
+
+.blaze-ui-420 button[data-slot='button'].tw\:text-secondary-foreground {
+  @apply tw:text-secondary-foreground;
+}
+
+.blaze-ui-420 button[data-slot='button'].tw\:text-primary {
+  @apply tw:text-primary;
+}
+
+.blaze-ui-420 button[data-slot='button'].tw\:shadow-xs,
+.blaze-ui-420 button[data-slot='switch'].tw\:shadow-xs {
+  @apply tw:shadow-xs;
+}
+
+.blaze-ui-420 button[data-slot='button'].tw\:border,
+.blaze-ui-420 button[data-slot='switch'].tw\:border {
+  @apply tw:border tw:border-border;
+}
+
+.blaze-ui-420 .tw\:rounded-md {
+  border-radius: var(--blaze-420-radius-md);
+}
+
+.blaze-ui-420 .tw\:gap-1 {
+  gap: var(--blaze-420-space-1);
+}
+
+.blaze-ui-420 .tw\:gap-2 {
+  gap: var(--blaze-420-space-2);
+}
+
+.blaze-ui-420 .tw\:gap-6 {
+  gap: var(--blaze-420-space-6);
+}
+
+.blaze-ui-420 .tw\:p-1 {
+  padding: var(--blaze-420-space-1);
+}
+
+.blaze-ui-420 .tw\:p-4 {
+  padding: var(--blaze-420-space-4);
+}
+
+.blaze-ui-420 .tw\:px-3 {
+  padding-left: var(--blaze-420-space-3);
+  padding-right: var(--blaze-420-space-3);
+}
+
+.blaze-ui-420 .tw\:px-4 {
+  padding-left: var(--blaze-420-space-4);
+  padding-right: var(--blaze-420-space-4);
+}
+
+.blaze-ui-420 .tw\:py-1 {
+  padding-top: var(--blaze-420-space-1);
+  padding-bottom: var(--blaze-420-space-1);
+}
+
+.blaze-ui-420 .tw\:py-2 {
+  padding-top: var(--blaze-420-space-2);
+  padding-bottom: var(--blaze-420-space-2);
+}
+
+.blaze-ui-420 .tw\:mr-4 {
+  margin-right: var(--blaze-420-space-4);
+}
+
+.blaze-ui-420 .tw\:h-9 {
+  height: var(--blaze-420-height-9);
+}
+
+.blaze-ui-420 .tw\:min-h-9 {
+  min-height: var(--blaze-420-height-9);
+}
+
+.blaze-ui-420 .tw\:size-4 {
+  width: var(--blaze-420-thumb-size);
+  height: var(--blaze-420-thumb-size);
+}
+
+.blaze-ui-420 .tw\:w-8 {
+  width: var(--blaze-420-switch-width);
+}
+
+.blaze-ui-420 .tw\:h-\[1\.15rem\] {
+  height: var(--blaze-420-switch-height);
+}
+
+.blaze-ui-420 .tw\:text-sm {
+  font-size: var(--blaze-420-font-sm);
+  line-height: var(--blaze-420-line-sm);
+}
+
+.blaze-ui-420 .tw\:text-base {
+  font-size: var(--blaze-420-font-base);
+  line-height: var(--blaze-420-line-base);
+}
+
+@media (min-width: 768px) {
+  .blaze-ui-420 .tw\:md\:text-sm {
+    font-size: var(--blaze-420-font-sm);
+    line-height: var(--blaze-420-line-sm);
+  }
+}
+
+.blaze-ui-420 .tw\:underline-offset-4 {
+  text-underline-offset: 4px;
+}
+
+.blaze-ui-420 a.tw\:ml-auto {
+  @apply tw:text-primary tw:hover:text-primary/90;
 }

package/dist/index.d.ts

@@ -11,5 +11,6 @@ export * from "./components/radio-group";
 export * from "./components/scroll-area";
 export * from "./components/select";
 export * from "./components/sheet";
+export * from "./components/segmented-control";
 export * from "./lib/utils";
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAA;AACnC,cAAc,2BAA2B,CAAA;AACzC,cAAc,oBAAoB,CAAA;AAClC,cAAc,mBAAmB,CAAA;AACjC,cAAc,uBAAuB,CAAA;AACrC,cAAc,oBAAoB,CAAA;AAClC,cAAc,oBAAoB,CAAA;AAClC,cAAc,sBAAsB,CAAA;AACpC,cAAc,qBAAqB,CAAA;AACnC,cAAc,0BAA0B,CAAA;AACxC,cAAc,0BAA0B,CAAA;AACxC,cAAc,qBAAqB,CAAA;AACnC,cAAc,oBAAoB,CAAA;AAClC,cAAc,aAAa,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,qBAAqB,CAAA;AACnC,cAAc,2BAA2B,CAAA;AACzC,cAAc,oBAAoB,CAAA;AAClC,cAAc,mBAAmB,CAAA;AACjC,cAAc,uBAAuB,CAAA;AACrC,cAAc,oBAAoB,CAAA;AAClC,cAAc,oBAAoB,CAAA;AAClC,cAAc,sBAAsB,CAAA;AACpC,cAAc,qBAAqB,CAAA;AACnC,cAAc,0BAA0B,CAAA;AACxC,cAAc,0BAA0B,CAAA;AACxC,cAAc,qBAAqB,CAAA;AACnC,cAAc,oBAAoB,CAAA;AAClC,cAAc,gCAAgC,CAAA;AAC9C,cAAc,aAAa,CAAA"}

package/dist/index.js

@@ -11,4 +11,5 @@ export { RadioGroup, RadioGroupItem } from './components/radio-group.js';
 export { ScrollArea, ScrollBar } from './components/scroll-area.js';
 export { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue } from './components/select.js';
 export { Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger } from './components/sheet.js';
+export { SegmentedControl, segmentedControlItemVariants, segmentedControlVariants } from './components/segmented-control.js';
 export { cn } from './lib/utils.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@getgreenline/blaze-ui",
-  "version": "1.0.12",
+  "version": "1.0.14",
   "type": "module",
   "dependencies": {
     "@radix-ui/react-alert-dialog": "^1.1.15",