@agent-native/toolkit 0.22.3 → 0.23.0-nightly-20260927213438
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/composer/AgentSuggestionBar.js +1 -1
- package/dist/composer/AgentSuggestionBar.js.map +1 -1
- package/dist/design-system/default-adapter.d.ts.map +1 -1
- package/dist/design-system/default-adapter.js +5 -2
- package/dist/design-system/default-adapter.js.map +1 -1
- package/dist/ui/alert-dialog.d.ts +5 -2
- package/dist/ui/alert-dialog.d.ts.map +1 -1
- package/dist/ui/alert-dialog.js +6 -2
- package/dist/ui/alert-dialog.js.map +1 -1
- package/dist/ui/alert.js +2 -2
- package/dist/ui/alert.js.map +1 -1
- package/dist/ui/button.d.ts +2 -2
- package/dist/ui/button.d.ts.map +1 -1
- package/dist/ui/button.js +22 -8
- package/dist/ui/button.js.map +1 -1
- package/dist/ui/index.d.ts +1 -0
- package/dist/ui/index.d.ts.map +1 -1
- package/dist/ui/index.js +1 -0
- package/dist/ui/index.js.map +1 -1
- package/dist/ui/input-group.d.ts +21 -0
- package/dist/ui/input-group.d.ts.map +1 -0
- package/dist/ui/input-group.js +59 -0
- package/dist/ui/input-group.js.map +1 -0
- package/dist/ui/input.d.ts +4 -1
- package/dist/ui/input.d.ts.map +1 -1
- package/dist/ui/input.js +2 -2
- package/dist/ui/input.js.map +1 -1
- package/dist/ui/select.d.ts +3 -1
- package/dist/ui/select.d.ts.map +1 -1
- package/dist/ui/select.js +1 -1
- package/dist/ui/select.js.map +1 -1
- package/dist/ui/sidebar.d.ts +3 -1
- package/dist/ui/sidebar.d.ts.map +1 -1
- package/dist/ui/switch.d.ts +3 -1
- package/dist/ui/switch.d.ts.map +1 -1
- package/dist/ui/switch.js +1 -1
- package/dist/ui/switch.js.map +1 -1
- package/dist/ui/tabs.js +2 -2
- package/dist/ui/tabs.js.map +1 -1
- package/dist/ui/toggle.js +3 -3
- package/dist/ui/toggle.js.map +1 -1
- package/package.json +1 -1
- package/src/composer/AgentSuggestionBar.tsx +1 -1
- package/src/design-system/default-adapter.tsx +5 -1
- package/src/ui/alert-dialog.tsx +21 -10
- package/src/ui/alert.tsx +2 -2
- package/src/ui/button.tsx +24 -8
- package/src/ui/index.ts +1 -0
- package/src/ui/input-group.tsx +167 -0
- package/src/ui/input.tsx +12 -3
- package/src/ui/select.tsx +8 -3
- package/src/ui/switch.tsx +14 -6
- package/src/ui/tabs.tsx +2 -2
- package/src/ui/toggle.tsx +3 -3
package/dist/ui/sidebar.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sidebar.d.ts","sourceRoot":"","sources":["../../src/ui/sidebar.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,YAAY,EAAO,MAAM,0BAA0B,CAAC;AAC7D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAa/B,KAAK,cAAc,GAAG;IACpB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB,CAAC;AASF,KAAK,cAAc,GAAG;IACpB,KAAK,EAAE,UAAU,GAAG,WAAW,CAAC;IAChC,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACjC,UAAU,EAAE,OAAO,CAAC;IACpB,aAAa,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,QAAQ,EAAE,OAAO,CAAC;IAClB,aAAa,EAAE,MAAM,IAAI,CAAC;CAC3B,CAAC;AAEF,QAAA,MAAM,cAAc,sCAAmD,CAAC;AAExE,iBAAS,UAAU,mBAOlB;AAED,QAAA,MAAM,eAAe;kBAGH,OAAO;WACd,OAAO;mBACC,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI;gDAoGzC,CAAC;AAGF,QAAA,MAAM,OAAO;WAGF,MAAM,GAAG,OAAO;cACb,SAAS,GAAG,UAAU,GAAG,OAAO;kBAC5B,WAAW,GAAG,MAAM,GAAG,MAAM;gDAkG9C,CAAC;AAGF,QAAA,MAAM,cAAc,mKAuBlB,CAAC;AAGH,QAAA,MAAM,WAAW,kLA+Bf,CAAC;AAGH,QAAA,MAAM,YAAY,6JAehB,CAAC;AAGH,QAAA,MAAM,YAAY,
|
|
1
|
+
{"version":3,"file":"sidebar.d.ts","sourceRoot":"","sources":["../../src/ui/sidebar.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,YAAY,EAAO,MAAM,0BAA0B,CAAC;AAC7D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAa/B,KAAK,cAAc,GAAG;IACpB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB,CAAC;AASF,KAAK,cAAc,GAAG;IACpB,KAAK,EAAE,UAAU,GAAG,WAAW,CAAC;IAChC,IAAI,EAAE,OAAO,CAAC;IACd,OAAO,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACjC,UAAU,EAAE,OAAO,CAAC;IACpB,aAAa,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IACvC,QAAQ,EAAE,OAAO,CAAC;IAClB,aAAa,EAAE,MAAM,IAAI,CAAC;CAC3B,CAAC;AAEF,QAAA,MAAM,cAAc,sCAAmD,CAAC;AAExE,iBAAS,UAAU,mBAOlB;AAED,QAAA,MAAM,eAAe;kBAGH,OAAO;WACd,OAAO;mBACC,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI;gDAoGzC,CAAC;AAGF,QAAA,MAAM,OAAO;WAGF,MAAM,GAAG,OAAO;cACb,SAAS,GAAG,UAAU,GAAG,OAAO;kBAC5B,WAAW,GAAG,MAAM,GAAG,MAAM;gDAkG9C,CAAC;AAGF,QAAA,MAAM,cAAc,mKAuBlB,CAAC;AAGH,QAAA,MAAM,WAAW,kLA+Bf,CAAC;AAGH,QAAA,MAAM,YAAY,6JAehB,CAAC;AAGH,QAAA,MAAM,YAAY;;kGAehB,CAAC;AAGH,QAAA,MAAM,aAAa,mKAYjB,CAAC;AAGH,QAAA,MAAM,aAAa,mKAYjB,CAAC;AAGH,QAAA,MAAM,gBAAgB,iOAYpB,CAAC;AAGH,QAAA,MAAM,cAAc,mKAelB,CAAC;AAGH,QAAA,MAAM,YAAY,mKAYhB,CAAC;AAGH,QAAA,MAAM,iBAAiB;cAEqB,OAAO;gDAgBjD,CAAC;AAGH,QAAA,MAAM,kBAAkB;cAEuB,OAAO;mDAiBpD,CAAC;AAGH,QAAA,MAAM,mBAAmB,mKAUvB,CAAC;AAGH,QAAA,MAAM,WAAW,yKAUf,CAAC;AAGH,QAAA,MAAM,eAAe,kKAUnB,CAAC;AAyBH,QAAA,MAAM,iBAAiB;cAGT,OAAO;eACN,OAAO;cACR,MAAM,GAAG,cAAc;;;;iIA8CpC,CAAC;AAGF,QAAA,MAAM,iBAAiB;cAGT,OAAO;kBACH,OAAO;mDAuBvB,CAAC;AAGH,QAAA,MAAM,gBAAgB,mKAkBpB,CAAC;AAGH,QAAA,MAAM,mBAAmB;eAGV,OAAO;gDAiCpB,CAAC;AAGH,QAAA,MAAM,cAAc,yKAclB,CAAC;AAGH,QAAA,MAAM,kBAAkB,kKAG6B,CAAC;AAGtD,QAAA,MAAM,oBAAoB;cAGZ,OAAO;WACV,IAAI,GAAG,IAAI;eACP,OAAO;mDAsBpB,CAAC;AAGH,OAAO,EACL,OAAO,EACP,cAAc,EACd,aAAa,EACb,YAAY,EACZ,kBAAkB,EAClB,mBAAmB,EACnB,iBAAiB,EACjB,aAAa,EACb,YAAY,EACZ,YAAY,EACZ,WAAW,EACX,iBAAiB,EACjB,gBAAgB,EAChB,iBAAiB,EACjB,eAAe,EACf,mBAAmB,EACnB,cAAc,EACd,oBAAoB,EACpB,kBAAkB,EAClB,eAAe,EACf,WAAW,EACX,gBAAgB,EAChB,cAAc,EACd,UAAU,GACX,CAAC"}
|
package/dist/ui/switch.d.ts
CHANGED
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import * as SwitchPrimitives from "@radix-ui/react-switch";
|
|
2
2
|
import * as React from "react";
|
|
3
|
-
declare const Switch: React.ForwardRefExoticComponent<Omit<SwitchPrimitives.SwitchProps & React.RefAttributes<HTMLButtonElement>, "ref"> &
|
|
3
|
+
declare const Switch: React.ForwardRefExoticComponent<Omit<SwitchPrimitives.SwitchProps & React.RefAttributes<HTMLButtonElement>, "ref"> & {
|
|
4
|
+
size?: "sm" | "default";
|
|
5
|
+
} & React.RefAttributes<HTMLButtonElement>>;
|
|
4
6
|
export { Switch };
|
|
5
7
|
//# sourceMappingURL=switch.d.ts.map
|
package/dist/ui/switch.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../src/ui/switch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,gBAAgB,MAAM,wBAAwB,CAAC;AAC3D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../src/ui/switch.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,gBAAgB,MAAM,wBAAwB,CAAC;AAC3D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAU/B,QAAA,MAAM,MAAM;WAHH,IAAI,GAAG,SAAS;2CAuBvB,CAAC;AAGH,OAAO,EAAE,MAAM,EAAE,CAAC"}
|
package/dist/ui/switch.js
CHANGED
|
@@ -2,7 +2,7 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
2
2
|
import * as SwitchPrimitives from "@radix-ui/react-switch";
|
|
3
3
|
import * as React from "react";
|
|
4
4
|
import { cn } from "../utils.js";
|
|
5
|
-
const Switch = React.forwardRef(({ className, ...props }, ref) => (_jsx(SwitchPrimitives.Root, { className: cn("peer inline-flex
|
|
5
|
+
const Switch = React.forwardRef(({ className, size = "default", ...props }, ref) => (_jsx(SwitchPrimitives.Root, { "data-slot": "switch", "data-size": size, className: cn("peer group/switch inline-flex shrink-0 cursor-pointer items-center rounded-full border border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input", size === "sm" ? "h-3.5 w-6" : "h-[1.15rem] w-8", className), ...props, ref: ref, children: _jsx(SwitchPrimitives.Thumb, { "data-slot": "switch-thumb", className: "pointer-events-none block rounded-full bg-background shadow-sm ring-0 transition-transform group-data-[size=default]/switch:size-4 group-data-[size=sm]/switch:size-3 data-[state=checked]:translate-x-[calc(100%-2px)] data-[state=unchecked]:translate-x-0" }) })));
|
|
6
6
|
Switch.displayName = SwitchPrimitives.Root.displayName;
|
|
7
7
|
export { Switch };
|
|
8
8
|
//# sourceMappingURL=switch.js.map
|
package/dist/ui/switch.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"switch.js","sourceRoot":"","sources":["../../src/ui/switch.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,gBAAgB,MAAM,wBAAwB,CAAC;AAC3D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;
|
|
1
|
+
{"version":3,"file":"switch.js","sourceRoot":"","sources":["../../src/ui/switch.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,gBAAgB,MAAM,wBAAwB,CAAC;AAC3D,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AAQjC,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CAG7B,CAAC,EAAE,SAAS,EAAE,IAAI,GAAG,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACpD,KAAC,gBAAgB,CAAC,IAAI,iBACV,QAAQ,eACP,IAAI,EACf,SAAS,EAAE,EAAE,CACX,sXAAsX,EACtX,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,iBAAiB,EAC/C,SAAS,CACV,KACG,KAAK,EACT,GAAG,EAAE,GAAG,YAER,KAAC,gBAAgB,CAAC,KAAK,iBACX,cAAc,EACxB,SAAS,EAAC,8PAA8P,GACxQ,GACoB,CACzB,CAAC,CAAC;AACH,MAAM,CAAC,WAAW,GAAG,gBAAgB,CAAC,IAAI,CAAC,WAAW,CAAC;AAEvD,OAAO,EAAE,MAAM,EAAE,CAAC"}
|
package/dist/ui/tabs.js
CHANGED
|
@@ -3,9 +3,9 @@ import * as TabsPrimitive from "@radix-ui/react-tabs";
|
|
|
3
3
|
import * as React from "react";
|
|
4
4
|
import { cn } from "../utils.js";
|
|
5
5
|
const Tabs = TabsPrimitive.Root;
|
|
6
|
-
const TabsList = React.forwardRef(({ className, ...props }, ref) => (_jsx(TabsPrimitive.List, { ref: ref, className: cn("inline-flex h-
|
|
6
|
+
const TabsList = React.forwardRef(({ className, ...props }, ref) => (_jsx(TabsPrimitive.List, { ref: ref, className: cn("inline-flex h-9 items-center justify-center rounded-md bg-muted p-1 text-muted-foreground", className), ...props })));
|
|
7
7
|
TabsList.displayName = TabsPrimitive.List.displayName;
|
|
8
|
-
const TabsTrigger = React.forwardRef(({ className, ...props }, ref) => (_jsx(TabsPrimitive.Trigger, { ref: ref, className: cn("inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1
|
|
8
|
+
const TabsTrigger = React.forwardRef(({ className, ...props }, ref) => (_jsx(TabsPrimitive.Trigger, { ref: ref, className: cn("inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1 text-sm font-medium ring-offset-background transition-[color,background-color,box-shadow] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm", className), ...props })));
|
|
9
9
|
TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
|
|
10
10
|
const TabsContent = React.forwardRef(({ className, ...props }, ref) => (_jsx(TabsPrimitive.Content, { ref: ref, className: cn("mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2", className), ...props })));
|
|
11
11
|
TabsContent.displayName = TabsPrimitive.Content.displayName;
|
package/dist/ui/tabs.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../src/ui/tabs.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,aAAa,MAAM,sBAAsB,CAAC;AACtD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AAEjC,MAAM,IAAI,GAAG,aAAa,CAAC,IAAI,CAAC;AAEhC,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CAG/B,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAClC,KAAC,aAAa,CAAC,IAAI,IACjB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACX,
|
|
1
|
+
{"version":3,"file":"tabs.js","sourceRoot":"","sources":["../../src/ui/tabs.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,aAAa,MAAM,sBAAsB,CAAC;AACtD,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AAEjC,MAAM,IAAI,GAAG,aAAa,CAAC,IAAI,CAAC;AAEhC,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CAG/B,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAClC,KAAC,aAAa,CAAC,IAAI,IACjB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACX,2FAA2F,EAC3F,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAC,CAAC;AACH,QAAQ,CAAC,WAAW,GAAG,aAAa,CAAC,IAAI,CAAC,WAAW,CAAC;AAEtD,MAAM,WAAW,GAAG,KAAK,CAAC,UAAU,CAGlC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAClC,KAAC,aAAa,CAAC,OAAO,IACpB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACX,maAAma,EACna,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAC,CAAC;AACH,WAAW,CAAC,WAAW,GAAG,aAAa,CAAC,OAAO,CAAC,WAAW,CAAC;AAE5D,MAAM,WAAW,GAAG,KAAK,CAAC,UAAU,CAGlC,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CAClC,KAAC,aAAa,CAAC,OAAO,IACpB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CACX,iIAAiI,EACjI,SAAS,CACV,KACG,KAAK,GACT,CACH,CAAC,CAAC;AACH,WAAW,CAAC,WAAW,GAAG,aAAa,CAAC,OAAO,CAAC,WAAW,CAAC;AAE5D,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,WAAW,EAAE,WAAW,EAAE,CAAC"}
|
package/dist/ui/toggle.js
CHANGED
|
@@ -10,9 +10,9 @@ const toggleVariants = cva("inline-flex items-center justify-center rounded-md t
|
|
|
10
10
|
outline: "border border-input bg-transparent hover:bg-accent hover:text-accent-foreground",
|
|
11
11
|
},
|
|
12
12
|
size: {
|
|
13
|
-
default: "h-
|
|
14
|
-
sm: "h-
|
|
15
|
-
lg: "h-
|
|
13
|
+
default: "h-9 px-2 min-w-9",
|
|
14
|
+
sm: "h-8 px-1.5 min-w-8",
|
|
15
|
+
lg: "h-10 px-2.5 min-w-10",
|
|
16
16
|
},
|
|
17
17
|
},
|
|
18
18
|
defaultVariants: {
|
package/dist/ui/toggle.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"toggle.js","sourceRoot":"","sources":["../../src/ui/toggle.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAC;AAC1D,OAAO,EAAE,GAAG,EAAqB,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AAEjC,MAAM,cAAc,GAAG,GAAG,CACxB,obAAob,EACpb;IACE,QAAQ,EAAE;QACR,OAAO,EAAE;YACP,OAAO,EAAE,gBAAgB;YACzB,OAAO,EACL,iFAAiF;SACpF;QACD,IAAI,EAAE;YACJ,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"toggle.js","sourceRoot":"","sources":["../../src/ui/toggle.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAC;AAC1D,OAAO,EAAE,GAAG,EAAqB,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AAEjC,MAAM,cAAc,GAAG,GAAG,CACxB,obAAob,EACpb;IACE,QAAQ,EAAE;QACR,OAAO,EAAE;YACP,OAAO,EAAE,gBAAgB;YACzB,OAAO,EACL,iFAAiF;SACpF;QACD,IAAI,EAAE;YACJ,OAAO,EAAE,kBAAkB;YAC3B,EAAE,EAAE,oBAAoB;YACxB,EAAE,EAAE,sBAAsB;SAC3B;KACF;IACD,eAAe,EAAE;QACf,OAAO,EAAE,SAAS;QAClB,IAAI,EAAE,SAAS;KAChB;CACF,CACF,CAAC;AAEF,MAAM,MAAM,GAAG,KAAK,CAAC,UAAU,CAI7B,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,IAAI,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE,CAAC,CACjD,KAAC,eAAe,CAAC,IAAI,IACnB,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,EAAE,CAAC,cAAc,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,CAAC,CAAC,KACvD,KAAK,GACT,CACH,CAAC,CAAC;AAEH,MAAM,CAAC,WAAW,GAAG,eAAe,CAAC,IAAI,CAAC,WAAW,CAAC;AAEtD,OAAO,EAAE,MAAM,EAAE,cAAc,EAAE,CAAC"}
|
package/package.json
CHANGED
|
@@ -75,7 +75,11 @@ function buttonVariant(
|
|
|
75
75
|
) {
|
|
76
76
|
if (inset && emphasis === "ghost") return "ghost-inset" as const;
|
|
77
77
|
if (emphasis === "ghost") return "ghost" as const;
|
|
78
|
-
if (emphasis === "outline")
|
|
78
|
+
if (emphasis === "outline") {
|
|
79
|
+
return intent === "danger"
|
|
80
|
+
? ("outline-destructive" as const)
|
|
81
|
+
: ("outline" as const);
|
|
82
|
+
}
|
|
79
83
|
if (intent === "primary") return "default" as const;
|
|
80
84
|
if (intent === "danger") return "destructive" as const;
|
|
81
85
|
return "secondary" as const;
|
package/src/ui/alert-dialog.tsx
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import * as AlertDialogPrimitive from "@radix-ui/react-alert-dialog";
|
|
2
|
+
import type { VariantProps } from "class-variance-authority";
|
|
2
3
|
import * as React from "react";
|
|
3
4
|
|
|
4
5
|
import { cn } from "../utils.js";
|
|
@@ -98,13 +99,21 @@ const AlertDialogDescription = React.forwardRef<
|
|
|
98
99
|
AlertDialogDescription.displayName =
|
|
99
100
|
AlertDialogPrimitive.Description.displayName;
|
|
100
101
|
|
|
102
|
+
type AlertDialogButtonProps = VariantProps<typeof buttonVariants>;
|
|
103
|
+
|
|
104
|
+
// With `asChild`, the child (usually a Button) owns its own variant and size;
|
|
105
|
+
// merging button classes onto it would fight the child's.
|
|
101
106
|
const AlertDialogAction = React.forwardRef<
|
|
102
107
|
React.ElementRef<typeof AlertDialogPrimitive.Action>,
|
|
103
|
-
React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Action>
|
|
104
|
-
|
|
108
|
+
React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Action> &
|
|
109
|
+
AlertDialogButtonProps
|
|
110
|
+
>(({ className, variant, size, asChild, ...props }, ref) => (
|
|
105
111
|
<AlertDialogPrimitive.Action
|
|
106
112
|
ref={ref}
|
|
107
|
-
|
|
113
|
+
asChild={asChild}
|
|
114
|
+
className={
|
|
115
|
+
asChild ? className : cn(buttonVariants({ variant, size }), className)
|
|
116
|
+
}
|
|
108
117
|
{...props}
|
|
109
118
|
/>
|
|
110
119
|
));
|
|
@@ -112,15 +121,17 @@ AlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName;
|
|
|
112
121
|
|
|
113
122
|
const AlertDialogCancel = React.forwardRef<
|
|
114
123
|
React.ElementRef<typeof AlertDialogPrimitive.Cancel>,
|
|
115
|
-
React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Cancel>
|
|
116
|
-
|
|
124
|
+
React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Cancel> &
|
|
125
|
+
AlertDialogButtonProps
|
|
126
|
+
>(({ className, variant = "outline", size, asChild, ...props }, ref) => (
|
|
117
127
|
<AlertDialogPrimitive.Cancel
|
|
118
128
|
ref={ref}
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
129
|
+
asChild={asChild}
|
|
130
|
+
className={
|
|
131
|
+
asChild
|
|
132
|
+
? cn("mt-2 sm:mt-0", className)
|
|
133
|
+
: cn(buttonVariants({ variant, size }), "mt-2 sm:mt-0", className)
|
|
134
|
+
}
|
|
124
135
|
{...props}
|
|
125
136
|
/>
|
|
126
137
|
));
|
package/src/ui/alert.tsx
CHANGED
|
@@ -4,7 +4,7 @@ import * as React from "react";
|
|
|
4
4
|
import { cn } from "../utils.js";
|
|
5
5
|
|
|
6
6
|
const alertVariants = cva(
|
|
7
|
-
"relative w-full rounded-lg border p-4 [&>svg~*]:ps-7 [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:start-4 [&>svg]:top-4 [&>svg]:text-foreground",
|
|
7
|
+
"relative w-full rounded-lg border p-4 text-sm [&>svg~*]:ps-7 [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:start-4 [&>svg]:top-4 [&>svg]:text-foreground",
|
|
8
8
|
{
|
|
9
9
|
variants: {
|
|
10
10
|
variant: {
|
|
@@ -50,7 +50,7 @@ const AlertDescription = React.forwardRef<
|
|
|
50
50
|
>(({ className, ...props }, ref) => (
|
|
51
51
|
<div
|
|
52
52
|
ref={ref}
|
|
53
|
-
className={cn("text-sm
|
|
53
|
+
className={cn("text-sm leading-relaxed", className)}
|
|
54
54
|
{...props}
|
|
55
55
|
/>
|
|
56
56
|
));
|
package/src/ui/button.tsx
CHANGED
|
@@ -24,7 +24,12 @@ const buttonVariants = cva(
|
|
|
24
24
|
default: "bg-primary text-primary-foreground hover:bg-primary/90",
|
|
25
25
|
destructive:
|
|
26
26
|
"bg-destructive text-destructive-foreground hover:bg-destructive/90",
|
|
27
|
-
outline:
|
|
27
|
+
outline:
|
|
28
|
+
"border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50",
|
|
29
|
+
// A destructive action that sits among ordinary row actions: the
|
|
30
|
+
// outline keeps the row calm; red text says what it does.
|
|
31
|
+
"outline-destructive":
|
|
32
|
+
"border bg-background text-destructive shadow-xs hover:bg-destructive/10 dark:border-input dark:bg-input/30 dark:hover:bg-destructive/20",
|
|
28
33
|
secondary:
|
|
29
34
|
"bg-secondary text-secondary-foreground hover:bg-secondary/80",
|
|
30
35
|
ghost: "hover:bg-accent hover:text-accent-foreground",
|
|
@@ -33,10 +38,14 @@ const buttonVariants = cva(
|
|
|
33
38
|
link: "text-primary underline-offset-4 hover:underline",
|
|
34
39
|
},
|
|
35
40
|
size: {
|
|
36
|
-
default: "h-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
41
|
+
default: "h-9 px-4 py-2 has-[>svg]:px-3",
|
|
42
|
+
xs: "h-6 gap-1 rounded-md px-2 text-xs has-[>svg]:px-1.5 [&_svg]:size-3",
|
|
43
|
+
sm: "h-8 gap-1.5 rounded-md px-3 has-[>svg]:px-2.5",
|
|
44
|
+
lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
|
|
45
|
+
icon: "size-9",
|
|
46
|
+
"icon-xs": "size-6 rounded-md [&_svg]:size-3",
|
|
47
|
+
"icon-sm": "size-8",
|
|
48
|
+
"icon-lg": "size-10",
|
|
40
49
|
},
|
|
41
50
|
},
|
|
42
51
|
defaultVariants: {
|
|
@@ -101,7 +110,7 @@ const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
|
|
|
101
110
|
if (DesignSystemActionButton && !asChild && !isRenderingLegacyButton) {
|
|
102
111
|
const semanticIntent =
|
|
103
112
|
intent ??
|
|
104
|
-
(variant === "destructive"
|
|
113
|
+
(variant === "destructive" || variant === "outline-destructive"
|
|
105
114
|
? "danger"
|
|
106
115
|
: variant === "default"
|
|
107
116
|
? "primary"
|
|
@@ -110,7 +119,7 @@ const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
|
|
|
110
119
|
emphasis === "ghost-inset"
|
|
111
120
|
? "ghost"
|
|
112
121
|
: (emphasis ??
|
|
113
|
-
(variant === "outline"
|
|
122
|
+
(variant === "outline" || variant === "outline-destructive"
|
|
114
123
|
? "outline"
|
|
115
124
|
: variant === "ghost-inset"
|
|
116
125
|
? "ghost"
|
|
@@ -122,7 +131,14 @@ const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
|
|
|
122
131
|
(emphasis === "ghost-inset" ||
|
|
123
132
|
(!emphasis && variant === "ghost-inset"));
|
|
124
133
|
const semanticSize =
|
|
125
|
-
size === "sm"
|
|
134
|
+
size === "sm" ||
|
|
135
|
+
size === "xs" ||
|
|
136
|
+
size === "icon-sm" ||
|
|
137
|
+
size === "icon-xs"
|
|
138
|
+
? "compact"
|
|
139
|
+
: size === "lg" || size === "icon-lg"
|
|
140
|
+
? "large"
|
|
141
|
+
: "default";
|
|
126
142
|
return (
|
|
127
143
|
<DesignSystemErrorBoundary component="ActionButton" fallback={fallback}>
|
|
128
144
|
<DesignSystemActionButton
|
package/src/ui/index.ts
CHANGED
|
@@ -23,6 +23,7 @@ export * from "./empty.js";
|
|
|
23
23
|
export * from "./filter-trigger.js";
|
|
24
24
|
export * from "./form.js";
|
|
25
25
|
export * from "./hover-card.js";
|
|
26
|
+
export * from "./input-group.js";
|
|
26
27
|
export * from "./input-otp.js";
|
|
27
28
|
export * from "./input.js";
|
|
28
29
|
export * from "./item.js";
|
|
@@ -0,0 +1,167 @@
|
|
|
1
|
+
import { cva, type VariantProps } from "class-variance-authority";
|
|
2
|
+
import * as React from "react";
|
|
3
|
+
|
|
4
|
+
import { cn } from "../utils.js";
|
|
5
|
+
import { Button } from "./button.js";
|
|
6
|
+
import { Input } from "./input.js";
|
|
7
|
+
import { Textarea } from "./textarea.js";
|
|
8
|
+
|
|
9
|
+
// shadcn new-york-v4 InputGroup. The group draws the border and focus ring;
|
|
10
|
+
// its control is borderless, so the ring must stay on the group or focus
|
|
11
|
+
// shows twice.
|
|
12
|
+
function InputGroup({
|
|
13
|
+
className,
|
|
14
|
+
size = "default",
|
|
15
|
+
...props
|
|
16
|
+
}: React.ComponentProps<"div"> & { size?: "sm" | "default" }) {
|
|
17
|
+
return (
|
|
18
|
+
<div
|
|
19
|
+
data-slot="input-group"
|
|
20
|
+
data-size={size}
|
|
21
|
+
role="group"
|
|
22
|
+
className={cn(
|
|
23
|
+
"group/input-group relative flex w-full min-w-0 items-center rounded-md border border-input bg-background ring-offset-background transition-[color,box-shadow] outline-none has-[>textarea]:h-auto",
|
|
24
|
+
size === "sm" ? "h-8" : "h-9",
|
|
25
|
+
"has-[>[data-align=inline-start]]:[&>input]:ps-2",
|
|
26
|
+
"has-[>[data-align=inline-end]]:[&>input]:pe-2",
|
|
27
|
+
"has-[>[data-align=block-start]]:h-auto has-[>[data-align=block-start]]:flex-col has-[>[data-align=block-start]]:[&>input]:pb-3",
|
|
28
|
+
"has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-end]]:[&>input]:pt-3",
|
|
29
|
+
"has-[[data-slot=input-group-control]:focus-visible]:ring-2 has-[[data-slot=input-group-control]:focus-visible]:ring-ring has-[[data-slot=input-group-control]:focus-visible]:ring-offset-2",
|
|
30
|
+
"has-[[data-slot][aria-invalid=true]]:border-destructive",
|
|
31
|
+
className,
|
|
32
|
+
)}
|
|
33
|
+
{...props}
|
|
34
|
+
/>
|
|
35
|
+
);
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
const inputGroupAddonVariants = cva(
|
|
39
|
+
"flex h-auto cursor-text items-center justify-center gap-2 py-1.5 text-sm font-medium text-muted-foreground select-none group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4",
|
|
40
|
+
{
|
|
41
|
+
variants: {
|
|
42
|
+
align: {
|
|
43
|
+
"inline-start":
|
|
44
|
+
"order-first ps-3 has-[>button]:ms-[-0.45rem] has-[>kbd]:ms-[-0.35rem]",
|
|
45
|
+
"inline-end":
|
|
46
|
+
"order-last pe-3 has-[>button]:me-[-0.45rem] has-[>kbd]:me-[-0.35rem]",
|
|
47
|
+
"block-start":
|
|
48
|
+
"order-first w-full justify-start px-3 pt-3 group-has-[>input]/input-group:pt-2.5 [.border-b]:pb-3",
|
|
49
|
+
"block-end":
|
|
50
|
+
"order-last w-full justify-start px-3 pb-3 group-has-[>input]/input-group:pb-2.5 [.border-t]:pt-3",
|
|
51
|
+
},
|
|
52
|
+
},
|
|
53
|
+
defaultVariants: {
|
|
54
|
+
align: "inline-start",
|
|
55
|
+
},
|
|
56
|
+
},
|
|
57
|
+
);
|
|
58
|
+
|
|
59
|
+
function InputGroupAddon({
|
|
60
|
+
className,
|
|
61
|
+
align = "inline-start",
|
|
62
|
+
...props
|
|
63
|
+
}: React.ComponentProps<"div"> & VariantProps<typeof inputGroupAddonVariants>) {
|
|
64
|
+
return (
|
|
65
|
+
<div
|
|
66
|
+
role="group"
|
|
67
|
+
data-slot="input-group-addon"
|
|
68
|
+
data-align={align}
|
|
69
|
+
className={cn(inputGroupAddonVariants({ align }), className)}
|
|
70
|
+
onClick={(e) => {
|
|
71
|
+
if ((e.target as HTMLElement).closest("button")) return;
|
|
72
|
+
e.currentTarget.parentElement?.querySelector("input")?.focus();
|
|
73
|
+
}}
|
|
74
|
+
{...props}
|
|
75
|
+
/>
|
|
76
|
+
);
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
const inputGroupButtonVariants = cva(
|
|
80
|
+
"flex items-center gap-2 text-sm shadow-none",
|
|
81
|
+
{
|
|
82
|
+
variants: {
|
|
83
|
+
size: {
|
|
84
|
+
xs: "h-6 gap-1 rounded-[calc(var(--radius)-5px)] px-2 has-[>svg]:px-2 [&>svg:not([class*='size-'])]:size-3.5",
|
|
85
|
+
sm: "h-8 gap-1.5 rounded-md px-2.5 has-[>svg]:px-2.5",
|
|
86
|
+
"icon-xs":
|
|
87
|
+
"size-6 rounded-[calc(var(--radius)-5px)] p-0 has-[>svg]:p-0",
|
|
88
|
+
"icon-sm": "size-8 p-0 has-[>svg]:p-0",
|
|
89
|
+
},
|
|
90
|
+
},
|
|
91
|
+
defaultVariants: {
|
|
92
|
+
size: "xs",
|
|
93
|
+
},
|
|
94
|
+
},
|
|
95
|
+
);
|
|
96
|
+
|
|
97
|
+
function InputGroupButton({
|
|
98
|
+
className,
|
|
99
|
+
type = "button",
|
|
100
|
+
variant = "ghost",
|
|
101
|
+
size = "xs",
|
|
102
|
+
...props
|
|
103
|
+
}: Omit<React.ComponentProps<typeof Button>, "size"> &
|
|
104
|
+
VariantProps<typeof inputGroupButtonVariants>) {
|
|
105
|
+
return (
|
|
106
|
+
<Button
|
|
107
|
+
type={type}
|
|
108
|
+
data-size={size}
|
|
109
|
+
variant={variant}
|
|
110
|
+
className={cn(inputGroupButtonVariants({ size }), className)}
|
|
111
|
+
{...props}
|
|
112
|
+
/>
|
|
113
|
+
);
|
|
114
|
+
}
|
|
115
|
+
|
|
116
|
+
function InputGroupText({ className, ...props }: React.ComponentProps<"span">) {
|
|
117
|
+
return (
|
|
118
|
+
<span
|
|
119
|
+
className={cn(
|
|
120
|
+
"flex items-center gap-2 text-sm text-muted-foreground [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4",
|
|
121
|
+
className,
|
|
122
|
+
)}
|
|
123
|
+
{...props}
|
|
124
|
+
/>
|
|
125
|
+
);
|
|
126
|
+
}
|
|
127
|
+
|
|
128
|
+
function InputGroupInput({
|
|
129
|
+
className,
|
|
130
|
+
...props
|
|
131
|
+
}: React.ComponentProps<typeof Input>) {
|
|
132
|
+
return (
|
|
133
|
+
<Input
|
|
134
|
+
data-slot="input-group-control"
|
|
135
|
+
className={cn(
|
|
136
|
+
"h-full flex-1 rounded-none border-0 bg-transparent shadow-none focus-visible:ring-0 focus-visible:ring-offset-0",
|
|
137
|
+
className,
|
|
138
|
+
)}
|
|
139
|
+
{...props}
|
|
140
|
+
/>
|
|
141
|
+
);
|
|
142
|
+
}
|
|
143
|
+
|
|
144
|
+
function InputGroupTextarea({
|
|
145
|
+
className,
|
|
146
|
+
...props
|
|
147
|
+
}: React.ComponentProps<typeof Textarea>) {
|
|
148
|
+
return (
|
|
149
|
+
<Textarea
|
|
150
|
+
data-slot="input-group-control"
|
|
151
|
+
className={cn(
|
|
152
|
+
"flex-1 resize-none rounded-none border-0 bg-transparent py-3 shadow-none focus-visible:ring-0 focus-visible:ring-offset-0",
|
|
153
|
+
className,
|
|
154
|
+
)}
|
|
155
|
+
{...props}
|
|
156
|
+
/>
|
|
157
|
+
);
|
|
158
|
+
}
|
|
159
|
+
|
|
160
|
+
export {
|
|
161
|
+
InputGroup,
|
|
162
|
+
InputGroupAddon,
|
|
163
|
+
InputGroupButton,
|
|
164
|
+
InputGroupText,
|
|
165
|
+
InputGroupInput,
|
|
166
|
+
InputGroupTextarea,
|
|
167
|
+
};
|
package/src/ui/input.tsx
CHANGED
|
@@ -2,13 +2,22 @@ import * as React from "react";
|
|
|
2
2
|
|
|
3
3
|
import { cn } from "../utils.js";
|
|
4
4
|
|
|
5
|
-
|
|
6
|
-
|
|
5
|
+
// `size` is the control height, matching SelectTrigger. The native `size`
|
|
6
|
+
// attribute (a width in characters) is not supported; use a width class.
|
|
7
|
+
type InputProps = Omit<React.ComponentProps<"input">, "size"> & {
|
|
8
|
+
size?: "sm" | "default";
|
|
9
|
+
};
|
|
10
|
+
|
|
11
|
+
const Input = React.forwardRef<HTMLInputElement, InputProps>(
|
|
12
|
+
({ className, type, size = "default", ...props }, ref) => {
|
|
7
13
|
return (
|
|
8
14
|
<input
|
|
9
15
|
type={type}
|
|
16
|
+
data-slot="input"
|
|
17
|
+
data-size={size}
|
|
10
18
|
className={cn(
|
|
11
|
-
"flex
|
|
19
|
+
"flex w-full rounded-md border border-input bg-background px-3 py-1 text-base ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive md:text-sm",
|
|
20
|
+
size === "sm" ? "h-8" : "h-9",
|
|
12
21
|
className,
|
|
13
22
|
)}
|
|
14
23
|
ref={ref}
|
package/src/ui/select.tsx
CHANGED
|
@@ -12,12 +12,17 @@ const SelectValue = SelectPrimitive.Value;
|
|
|
12
12
|
|
|
13
13
|
const SelectTrigger = React.forwardRef<
|
|
14
14
|
React.ElementRef<typeof SelectPrimitive.Trigger>,
|
|
15
|
-
React.ComponentPropsWithoutRef<typeof SelectPrimitive.Trigger>
|
|
16
|
-
|
|
15
|
+
React.ComponentPropsWithoutRef<typeof SelectPrimitive.Trigger> & {
|
|
16
|
+
size?: "sm" | "default";
|
|
17
|
+
}
|
|
18
|
+
>(({ className, children, size = "default", ...props }, ref) => (
|
|
17
19
|
<SelectPrimitive.Trigger
|
|
18
20
|
ref={ref}
|
|
21
|
+
data-slot="select-trigger"
|
|
22
|
+
data-size={size}
|
|
19
23
|
className={cn(
|
|
20
|
-
"flex
|
|
24
|
+
"flex w-full items-center justify-between gap-2 rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive [&>span]:line-clamp-1",
|
|
25
|
+
size === "sm" ? "h-8" : "h-9",
|
|
21
26
|
className,
|
|
22
27
|
)}
|
|
23
28
|
{...props}
|
package/src/ui/switch.tsx
CHANGED
|
@@ -3,22 +3,30 @@ import * as React from "react";
|
|
|
3
3
|
|
|
4
4
|
import { cn } from "../utils.js";
|
|
5
5
|
|
|
6
|
+
type SwitchProps = React.ComponentPropsWithoutRef<
|
|
7
|
+
typeof SwitchPrimitives.Root
|
|
8
|
+
> & {
|
|
9
|
+
size?: "sm" | "default";
|
|
10
|
+
};
|
|
11
|
+
|
|
6
12
|
const Switch = React.forwardRef<
|
|
7
13
|
React.ElementRef<typeof SwitchPrimitives.Root>,
|
|
8
|
-
|
|
9
|
-
>(({ className, ...props }, ref) => (
|
|
14
|
+
SwitchProps
|
|
15
|
+
>(({ className, size = "default", ...props }, ref) => (
|
|
10
16
|
<SwitchPrimitives.Root
|
|
17
|
+
data-slot="switch"
|
|
18
|
+
data-size={size}
|
|
11
19
|
className={cn(
|
|
12
|
-
"peer inline-flex
|
|
20
|
+
"peer group/switch inline-flex shrink-0 cursor-pointer items-center rounded-full border border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input",
|
|
21
|
+
size === "sm" ? "h-3.5 w-6" : "h-[1.15rem] w-8",
|
|
13
22
|
className,
|
|
14
23
|
)}
|
|
15
24
|
{...props}
|
|
16
25
|
ref={ref}
|
|
17
26
|
>
|
|
18
27
|
<SwitchPrimitives.Thumb
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
)}
|
|
28
|
+
data-slot="switch-thumb"
|
|
29
|
+
className="pointer-events-none block rounded-full bg-background shadow-sm ring-0 transition-transform group-data-[size=default]/switch:size-4 group-data-[size=sm]/switch:size-3 data-[state=checked]:translate-x-[calc(100%-2px)] data-[state=unchecked]:translate-x-0"
|
|
22
30
|
/>
|
|
23
31
|
</SwitchPrimitives.Root>
|
|
24
32
|
));
|
package/src/ui/tabs.tsx
CHANGED
|
@@ -12,7 +12,7 @@ const TabsList = React.forwardRef<
|
|
|
12
12
|
<TabsPrimitive.List
|
|
13
13
|
ref={ref}
|
|
14
14
|
className={cn(
|
|
15
|
-
"inline-flex h-
|
|
15
|
+
"inline-flex h-9 items-center justify-center rounded-md bg-muted p-1 text-muted-foreground",
|
|
16
16
|
className,
|
|
17
17
|
)}
|
|
18
18
|
{...props}
|
|
@@ -27,7 +27,7 @@ const TabsTrigger = React.forwardRef<
|
|
|
27
27
|
<TabsPrimitive.Trigger
|
|
28
28
|
ref={ref}
|
|
29
29
|
className={cn(
|
|
30
|
-
"inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1
|
|
30
|
+
"inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1 text-sm font-medium ring-offset-background transition-[color,background-color,box-shadow] focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm",
|
|
31
31
|
className,
|
|
32
32
|
)}
|
|
33
33
|
{...props}
|
package/src/ui/toggle.tsx
CHANGED
|
@@ -14,9 +14,9 @@ const toggleVariants = cva(
|
|
|
14
14
|
"border border-input bg-transparent hover:bg-accent hover:text-accent-foreground",
|
|
15
15
|
},
|
|
16
16
|
size: {
|
|
17
|
-
default: "h-
|
|
18
|
-
sm: "h-
|
|
19
|
-
lg: "h-
|
|
17
|
+
default: "h-9 px-2 min-w-9",
|
|
18
|
+
sm: "h-8 px-1.5 min-w-8",
|
|
19
|
+
lg: "h-10 px-2.5 min-w-10",
|
|
20
20
|
},
|
|
21
21
|
},
|
|
22
22
|
defaultVariants: {
|