@kubetail/ui 2.0.0-rc7 → 2.0.0-rc9
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/elements/dialog.cjs +2 -0
- package/dist/elements/dialog.cjs.map +1 -0
- package/dist/elements/dialog.d.ts +15 -0
- package/dist/elements/dialog.js +118 -0
- package/dist/elements/dialog.js.map +1 -0
- package/dist/elements/dialog.stories.d.ts +17 -0
- package/dist/elements/dialog.test.d.ts +1 -0
- package/dist/index.css +1 -1
- package/package.json +12 -7
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime");require("react");const d=require("@radix-ui/react-dialog"),c=require("lucide-react"),i=require("../lib/utils.cjs");function g(t){const e=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(t){for(const n in t)if(n!=="default"){const l=Object.getOwnPropertyDescriptor(t,n);Object.defineProperty(e,n,l.get?l:{enumerable:!0,get:()=>t[n]})}}return e.default=t,Object.freeze(e)}const o=g(d);function u({...t}){return a.jsx(o.Root,{"data-slot":"dialog",...t})}function f({...t}){return a.jsx(o.Trigger,{"data-slot":"dialog-trigger",...t})}function s({...t}){return a.jsx(o.Portal,{"data-slot":"dialog-portal",...t})}function m({...t}){return a.jsx(o.Close,{"data-slot":"dialog-close",...t})}function r({className:t,...e}){return a.jsx(o.Overlay,{"data-slot":"dialog-overlay",className:i.cn("data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",t),...e})}function x({className:t,children:e,showCloseButton:n=!0,...l}){return a.jsxs(s,{"data-slot":"dialog-portal",children:[a.jsx(r,{}),a.jsxs(o.Content,{"data-slot":"dialog-content",className:i.cn("bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:max-w-lg",t),...l,children:[e,n&&a.jsxs(o.Close,{"data-slot":"dialog-close",className:"ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",children:[a.jsx(c.XIcon,{}),a.jsx("span",{className:"sr-only",children:"Close"})]})]})]})}function p({className:t,...e}){return a.jsx("div",{"data-slot":"dialog-header",className:i.cn("flex flex-col gap-2 text-center sm:text-left",t),...e})}function D({className:t,...e}){return a.jsx("div",{"data-slot":"dialog-footer",className:i.cn("flex flex-col-reverse gap-2 sm:flex-row sm:justify-end",t),...e})}function j({className:t,...e}){return a.jsx(o.Title,{"data-slot":"dialog-title",className:i.cn("text-lg leading-none font-semibold",t),...e})}function b({className:t,...e}){return a.jsx(o.Description,{"data-slot":"dialog-description",className:i.cn("text-muted-foreground text-sm",t),...e})}exports.Dialog=u;exports.DialogClose=m;exports.DialogContent=x;exports.DialogDescription=b;exports.DialogFooter=D;exports.DialogHeader=p;exports.DialogOverlay=r;exports.DialogPortal=s;exports.DialogTitle=j;exports.DialogTrigger=f;
|
|
2
|
+
//# sourceMappingURL=dialog.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dialog.cjs","sources":["../../src/elements/dialog.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport { XIcon } from 'lucide-react';\n\nimport { cn } from '@/lib/utils';\n\nfunction Dialog({ ...props }: React.ComponentProps<typeof DialogPrimitive.Root>) {\n return <DialogPrimitive.Root data-slot=\"dialog\" {...props} />;\n}\n\nfunction DialogTrigger({ ...props }: React.ComponentProps<typeof DialogPrimitive.Trigger>) {\n return <DialogPrimitive.Trigger data-slot=\"dialog-trigger\" {...props} />;\n}\n\nfunction DialogPortal({ ...props }: React.ComponentProps<typeof DialogPrimitive.Portal>) {\n return <DialogPrimitive.Portal data-slot=\"dialog-portal\" {...props} />;\n}\n\nfunction DialogClose({ ...props }: React.ComponentProps<typeof DialogPrimitive.Close>) {\n return <DialogPrimitive.Close data-slot=\"dialog-close\" {...props} />;\n}\n\nfunction DialogOverlay({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Overlay>) {\n return (\n <DialogPrimitive.Overlay\n data-slot=\"dialog-overlay\"\n className={cn(\n 'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction DialogContent({\n className,\n children,\n showCloseButton = true,\n ...props\n}: React.ComponentProps<typeof DialogPrimitive.Content> & {\n showCloseButton?: boolean;\n}) {\n return (\n <DialogPortal data-slot=\"dialog-portal\">\n <DialogOverlay />\n <DialogPrimitive.Content\n data-slot=\"dialog-content\"\n className={cn(\n 'bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:max-w-lg',\n className,\n )}\n {...props}\n >\n {children}\n {showCloseButton && (\n <DialogPrimitive.Close\n data-slot=\"dialog-close\"\n className=\"ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\"\n >\n <XIcon />\n <span className=\"sr-only\">Close</span>\n </DialogPrimitive.Close>\n )}\n </DialogPrimitive.Content>\n </DialogPortal>\n );\n}\n\nfunction DialogHeader({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"dialog-header\"\n className={cn('flex flex-col gap-2 text-center sm:text-left', className)}\n {...props}\n />\n );\n}\n\nfunction DialogFooter({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"dialog-footer\"\n className={cn('flex flex-col-reverse gap-2 sm:flex-row sm:justify-end', className)}\n {...props}\n />\n );\n}\n\nfunction DialogTitle({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Title>) {\n return (\n <DialogPrimitive.Title\n data-slot=\"dialog-title\"\n className={cn('text-lg leading-none font-semibold', className)}\n {...props}\n />\n );\n}\n\nfunction DialogDescription({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Description>) {\n return (\n <DialogPrimitive.Description\n data-slot=\"dialog-description\"\n className={cn('text-muted-foreground text-sm', className)}\n {...props}\n />\n );\n}\n\nexport {\n Dialog,\n DialogClose,\n DialogContent,\n DialogDescription,\n DialogFooter,\n DialogHeader,\n DialogOverlay,\n DialogPortal,\n DialogTitle,\n DialogTrigger,\n};\n"],"names":["Dialog","props","DialogPrimitive","DialogTrigger","DialogPortal","DialogClose","DialogOverlay","className","jsx","cn","DialogContent","children","showCloseButton","jsxs","XIcon","DialogHeader","DialogFooter","DialogTitle","DialogDescription"],"mappings":"kgBAQA,SAASA,EAAO,CAAE,GAAGC,GAA4D,CAC/E,aAAQC,EAAgB,KAAhB,CAAqB,YAAU,SAAU,GAAGD,EAAO,CAC7D,CAEA,SAASE,EAAc,CAAE,GAAGF,GAA+D,CACzF,aAAQC,EAAgB,QAAhB,CAAwB,YAAU,iBAAkB,GAAGD,EAAO,CACxE,CAEA,SAASG,EAAa,CAAE,GAAGH,GAA8D,CACvF,aAAQC,EAAgB,OAAhB,CAAuB,YAAU,gBAAiB,GAAGD,EAAO,CACtE,CAEA,SAASI,EAAY,CAAE,GAAGJ,GAA6D,CACrF,aAAQC,EAAgB,MAAhB,CAAsB,YAAU,eAAgB,GAAGD,EAAO,CACpE,CAEA,SAASK,EAAc,CAAE,UAAAC,EAAW,GAAGN,GAA+D,CACpG,OACEO,EAAAA,IAACN,EAAgB,QAAhB,CACC,YAAU,iBACV,UAAWO,EAAAA,GACT,yJACAF,CAAA,EAED,GAAGN,CAAA,CAAA,CAGV,CAEA,SAASS,EAAc,CACrB,UAAAH,EACA,SAAAI,EACA,gBAAAC,EAAkB,GAClB,GAAGX,CACL,EAEG,CACD,OACEY,EAAAA,KAACT,EAAA,CAAa,YAAU,gBACtB,SAAA,CAAAI,EAAAA,IAACF,EAAA,EAAc,EACfO,EAAAA,KAACX,EAAgB,QAAhB,CACC,YAAU,iBACV,UAAWO,EAAAA,GACT,8WACAF,CAAA,EAED,GAAGN,EAEH,SAAA,CAAAU,EACAC,GACCC,EAAAA,KAACX,EAAgB,MAAhB,CACC,YAAU,eACV,UAAU,oWAEV,SAAA,CAAAM,EAAAA,IAACM,EAAAA,MAAA,EAAM,EACPN,EAAAA,IAAC,OAAA,CAAK,UAAU,UAAU,SAAA,OAAA,CAAK,CAAA,CAAA,CAAA,CACjC,CAAA,CAAA,CAEJ,EACF,CAEJ,CAEA,SAASO,EAAa,CAAE,UAAAR,EAAW,GAAGN,GAAsC,CAC1E,OACEO,EAAAA,IAAC,MAAA,CACC,YAAU,gBACV,UAAWC,EAAAA,GAAG,+CAAgDF,CAAS,EACtE,GAAGN,CAAA,CAAA,CAGV,CAEA,SAASe,EAAa,CAAE,UAAAT,EAAW,GAAGN,GAAsC,CAC1E,OACEO,EAAAA,IAAC,MAAA,CACC,YAAU,gBACV,UAAWC,EAAAA,GAAG,yDAA0DF,CAAS,EAChF,GAAGN,CAAA,CAAA,CAGV,CAEA,SAASgB,EAAY,CAAE,UAAAV,EAAW,GAAGN,GAA6D,CAChG,OACEO,EAAAA,IAACN,EAAgB,MAAhB,CACC,YAAU,eACV,UAAWO,EAAAA,GAAG,qCAAsCF,CAAS,EAC5D,GAAGN,CAAA,CAAA,CAGV,CAEA,SAASiB,EAAkB,CAAE,UAAAX,EAAW,GAAGN,GAAmE,CAC5G,OACEO,EAAAA,IAACN,EAAgB,YAAhB,CACC,YAAU,qBACV,UAAWO,EAAAA,GAAG,gCAAiCF,CAAS,EACvD,GAAGN,CAAA,CAAA,CAGV"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import * as DialogPrimitive from '@radix-ui/react-dialog';
|
|
3
|
+
declare function Dialog({ ...props }: React.ComponentProps<typeof DialogPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
declare function DialogTrigger({ ...props }: React.ComponentProps<typeof DialogPrimitive.Trigger>): import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
declare function DialogPortal({ ...props }: React.ComponentProps<typeof DialogPrimitive.Portal>): import("react/jsx-runtime").JSX.Element;
|
|
6
|
+
declare function DialogClose({ ...props }: React.ComponentProps<typeof DialogPrimitive.Close>): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
declare function DialogOverlay({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Overlay>): import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
declare function DialogContent({ className, children, showCloseButton, ...props }: React.ComponentProps<typeof DialogPrimitive.Content> & {
|
|
9
|
+
showCloseButton?: boolean;
|
|
10
|
+
}): import("react/jsx-runtime").JSX.Element;
|
|
11
|
+
declare function DialogHeader({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
|
|
12
|
+
declare function DialogFooter({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
|
|
13
|
+
declare function DialogTitle({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Title>): import("react/jsx-runtime").JSX.Element;
|
|
14
|
+
declare function DialogDescription({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Description>): import("react/jsx-runtime").JSX.Element;
|
|
15
|
+
export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, };
|
|
@@ -0,0 +1,118 @@
|
|
|
1
|
+
import { jsx as a, jsxs as i } from "react/jsx-runtime";
|
|
2
|
+
import "react";
|
|
3
|
+
import * as e from "@radix-ui/react-dialog";
|
|
4
|
+
import { XIcon as r } from "lucide-react";
|
|
5
|
+
import { cn as n } from "../lib/utils.js";
|
|
6
|
+
function p({ ...t }) {
|
|
7
|
+
return /* @__PURE__ */ a(e.Root, { "data-slot": "dialog", ...t });
|
|
8
|
+
}
|
|
9
|
+
function x({ ...t }) {
|
|
10
|
+
return /* @__PURE__ */ a(e.Trigger, { "data-slot": "dialog-trigger", ...t });
|
|
11
|
+
}
|
|
12
|
+
function d({ ...t }) {
|
|
13
|
+
return /* @__PURE__ */ a(e.Portal, { "data-slot": "dialog-portal", ...t });
|
|
14
|
+
}
|
|
15
|
+
function v({ ...t }) {
|
|
16
|
+
return /* @__PURE__ */ a(e.Close, { "data-slot": "dialog-close", ...t });
|
|
17
|
+
}
|
|
18
|
+
function g({ className: t, ...o }) {
|
|
19
|
+
return /* @__PURE__ */ a(
|
|
20
|
+
e.Overlay,
|
|
21
|
+
{
|
|
22
|
+
"data-slot": "dialog-overlay",
|
|
23
|
+
className: n(
|
|
24
|
+
"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50",
|
|
25
|
+
t
|
|
26
|
+
),
|
|
27
|
+
...o
|
|
28
|
+
}
|
|
29
|
+
);
|
|
30
|
+
}
|
|
31
|
+
function D({
|
|
32
|
+
className: t,
|
|
33
|
+
children: o,
|
|
34
|
+
showCloseButton: l = !0,
|
|
35
|
+
...s
|
|
36
|
+
}) {
|
|
37
|
+
return /* @__PURE__ */ i(d, { "data-slot": "dialog-portal", children: [
|
|
38
|
+
/* @__PURE__ */ a(g, {}),
|
|
39
|
+
/* @__PURE__ */ i(
|
|
40
|
+
e.Content,
|
|
41
|
+
{
|
|
42
|
+
"data-slot": "dialog-content",
|
|
43
|
+
className: n(
|
|
44
|
+
"bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:max-w-lg",
|
|
45
|
+
t
|
|
46
|
+
),
|
|
47
|
+
...s,
|
|
48
|
+
children: [
|
|
49
|
+
o,
|
|
50
|
+
l && /* @__PURE__ */ i(
|
|
51
|
+
e.Close,
|
|
52
|
+
{
|
|
53
|
+
"data-slot": "dialog-close",
|
|
54
|
+
className: "ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
|
55
|
+
children: [
|
|
56
|
+
/* @__PURE__ */ a(r, {}),
|
|
57
|
+
/* @__PURE__ */ a("span", { className: "sr-only", children: "Close" })
|
|
58
|
+
]
|
|
59
|
+
}
|
|
60
|
+
)
|
|
61
|
+
]
|
|
62
|
+
}
|
|
63
|
+
)
|
|
64
|
+
] });
|
|
65
|
+
}
|
|
66
|
+
function b({ className: t, ...o }) {
|
|
67
|
+
return /* @__PURE__ */ a(
|
|
68
|
+
"div",
|
|
69
|
+
{
|
|
70
|
+
"data-slot": "dialog-header",
|
|
71
|
+
className: n("flex flex-col gap-2 text-center sm:text-left", t),
|
|
72
|
+
...o
|
|
73
|
+
}
|
|
74
|
+
);
|
|
75
|
+
}
|
|
76
|
+
function h({ className: t, ...o }) {
|
|
77
|
+
return /* @__PURE__ */ a(
|
|
78
|
+
"div",
|
|
79
|
+
{
|
|
80
|
+
"data-slot": "dialog-footer",
|
|
81
|
+
className: n("flex flex-col-reverse gap-2 sm:flex-row sm:justify-end", t),
|
|
82
|
+
...o
|
|
83
|
+
}
|
|
84
|
+
);
|
|
85
|
+
}
|
|
86
|
+
function y({ className: t, ...o }) {
|
|
87
|
+
return /* @__PURE__ */ a(
|
|
88
|
+
e.Title,
|
|
89
|
+
{
|
|
90
|
+
"data-slot": "dialog-title",
|
|
91
|
+
className: n("text-lg leading-none font-semibold", t),
|
|
92
|
+
...o
|
|
93
|
+
}
|
|
94
|
+
);
|
|
95
|
+
}
|
|
96
|
+
function N({ className: t, ...o }) {
|
|
97
|
+
return /* @__PURE__ */ a(
|
|
98
|
+
e.Description,
|
|
99
|
+
{
|
|
100
|
+
"data-slot": "dialog-description",
|
|
101
|
+
className: n("text-muted-foreground text-sm", t),
|
|
102
|
+
...o
|
|
103
|
+
}
|
|
104
|
+
);
|
|
105
|
+
}
|
|
106
|
+
export {
|
|
107
|
+
p as Dialog,
|
|
108
|
+
v as DialogClose,
|
|
109
|
+
D as DialogContent,
|
|
110
|
+
N as DialogDescription,
|
|
111
|
+
h as DialogFooter,
|
|
112
|
+
b as DialogHeader,
|
|
113
|
+
g as DialogOverlay,
|
|
114
|
+
d as DialogPortal,
|
|
115
|
+
y as DialogTitle,
|
|
116
|
+
x as DialogTrigger
|
|
117
|
+
};
|
|
118
|
+
//# sourceMappingURL=dialog.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"dialog.js","sources":["../../src/elements/dialog.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport * as DialogPrimitive from '@radix-ui/react-dialog';\nimport { XIcon } from 'lucide-react';\n\nimport { cn } from '@/lib/utils';\n\nfunction Dialog({ ...props }: React.ComponentProps<typeof DialogPrimitive.Root>) {\n return <DialogPrimitive.Root data-slot=\"dialog\" {...props} />;\n}\n\nfunction DialogTrigger({ ...props }: React.ComponentProps<typeof DialogPrimitive.Trigger>) {\n return <DialogPrimitive.Trigger data-slot=\"dialog-trigger\" {...props} />;\n}\n\nfunction DialogPortal({ ...props }: React.ComponentProps<typeof DialogPrimitive.Portal>) {\n return <DialogPrimitive.Portal data-slot=\"dialog-portal\" {...props} />;\n}\n\nfunction DialogClose({ ...props }: React.ComponentProps<typeof DialogPrimitive.Close>) {\n return <DialogPrimitive.Close data-slot=\"dialog-close\" {...props} />;\n}\n\nfunction DialogOverlay({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Overlay>) {\n return (\n <DialogPrimitive.Overlay\n data-slot=\"dialog-overlay\"\n className={cn(\n 'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/50',\n className,\n )}\n {...props}\n />\n );\n}\n\nfunction DialogContent({\n className,\n children,\n showCloseButton = true,\n ...props\n}: React.ComponentProps<typeof DialogPrimitive.Content> & {\n showCloseButton?: boolean;\n}) {\n return (\n <DialogPortal data-slot=\"dialog-portal\">\n <DialogOverlay />\n <DialogPrimitive.Content\n data-slot=\"dialog-content\"\n className={cn(\n 'bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:max-w-lg',\n className,\n )}\n {...props}\n >\n {children}\n {showCloseButton && (\n <DialogPrimitive.Close\n data-slot=\"dialog-close\"\n className=\"ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\"\n >\n <XIcon />\n <span className=\"sr-only\">Close</span>\n </DialogPrimitive.Close>\n )}\n </DialogPrimitive.Content>\n </DialogPortal>\n );\n}\n\nfunction DialogHeader({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"dialog-header\"\n className={cn('flex flex-col gap-2 text-center sm:text-left', className)}\n {...props}\n />\n );\n}\n\nfunction DialogFooter({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-slot=\"dialog-footer\"\n className={cn('flex flex-col-reverse gap-2 sm:flex-row sm:justify-end', className)}\n {...props}\n />\n );\n}\n\nfunction DialogTitle({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Title>) {\n return (\n <DialogPrimitive.Title\n data-slot=\"dialog-title\"\n className={cn('text-lg leading-none font-semibold', className)}\n {...props}\n />\n );\n}\n\nfunction DialogDescription({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Description>) {\n return (\n <DialogPrimitive.Description\n data-slot=\"dialog-description\"\n className={cn('text-muted-foreground text-sm', className)}\n {...props}\n />\n );\n}\n\nexport {\n Dialog,\n DialogClose,\n DialogContent,\n DialogDescription,\n DialogFooter,\n DialogHeader,\n DialogOverlay,\n DialogPortal,\n DialogTitle,\n DialogTrigger,\n};\n"],"names":["Dialog","props","DialogPrimitive","DialogTrigger","DialogPortal","DialogClose","DialogOverlay","className","jsx","cn","DialogContent","children","showCloseButton","jsxs","XIcon","DialogHeader","DialogFooter","DialogTitle","DialogDescription"],"mappings":";;;;;AAQA,SAASA,EAAO,EAAE,GAAGC,KAA4D;AAC/E,2BAAQC,EAAgB,MAAhB,EAAqB,aAAU,UAAU,GAAGD,GAAO;AAC7D;AAEA,SAASE,EAAc,EAAE,GAAGF,KAA+D;AACzF,2BAAQC,EAAgB,SAAhB,EAAwB,aAAU,kBAAkB,GAAGD,GAAO;AACxE;AAEA,SAASG,EAAa,EAAE,GAAGH,KAA8D;AACvF,2BAAQC,EAAgB,QAAhB,EAAuB,aAAU,iBAAiB,GAAGD,GAAO;AACtE;AAEA,SAASI,EAAY,EAAE,GAAGJ,KAA6D;AACrF,2BAAQC,EAAgB,OAAhB,EAAsB,aAAU,gBAAgB,GAAGD,GAAO;AACpE;AAEA,SAASK,EAAc,EAAE,WAAAC,GAAW,GAAGN,KAA+D;AACpG,SACE,gBAAAO;AAAA,IAACN,EAAgB;AAAA,IAAhB;AAAA,MACC,aAAU;AAAA,MACV,WAAWO;AAAA,QACT;AAAA,QACAF;AAAA,MAAA;AAAA,MAED,GAAGN;AAAA,IAAA;AAAA,EAAA;AAGV;AAEA,SAASS,EAAc;AAAA,EACrB,WAAAH;AAAA,EACA,UAAAI;AAAA,EACA,iBAAAC,IAAkB;AAAA,EAClB,GAAGX;AACL,GAEG;AACD,SACE,gBAAAY,EAACT,GAAA,EAAa,aAAU,iBACtB,UAAA;AAAA,IAAA,gBAAAI,EAACF,GAAA,EAAc;AAAA,IACf,gBAAAO;AAAA,MAACX,EAAgB;AAAA,MAAhB;AAAA,QACC,aAAU;AAAA,QACV,WAAWO;AAAA,UACT;AAAA,UACAF;AAAA,QAAA;AAAA,QAED,GAAGN;AAAA,QAEH,UAAA;AAAA,UAAAU;AAAA,UACAC,KACC,gBAAAC;AAAA,YAACX,EAAgB;AAAA,YAAhB;AAAA,cACC,aAAU;AAAA,cACV,WAAU;AAAA,cAEV,UAAA;AAAA,gBAAA,gBAAAM,EAACM,GAAA,EAAM;AAAA,gBACP,gBAAAN,EAAC,QAAA,EAAK,WAAU,WAAU,UAAA,QAAA,CAAK;AAAA,cAAA;AAAA,YAAA;AAAA,UAAA;AAAA,QACjC;AAAA,MAAA;AAAA,IAAA;AAAA,EAEJ,GACF;AAEJ;AAEA,SAASO,EAAa,EAAE,WAAAR,GAAW,GAAGN,KAAsC;AAC1E,SACE,gBAAAO;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAWC,EAAG,gDAAgDF,CAAS;AAAA,MACtE,GAAGN;AAAA,IAAA;AAAA,EAAA;AAGV;AAEA,SAASe,EAAa,EAAE,WAAAT,GAAW,GAAGN,KAAsC;AAC1E,SACE,gBAAAO;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAWC,EAAG,0DAA0DF,CAAS;AAAA,MAChF,GAAGN;AAAA,IAAA;AAAA,EAAA;AAGV;AAEA,SAASgB,EAAY,EAAE,WAAAV,GAAW,GAAGN,KAA6D;AAChG,SACE,gBAAAO;AAAA,IAACN,EAAgB;AAAA,IAAhB;AAAA,MACC,aAAU;AAAA,MACV,WAAWO,EAAG,sCAAsCF,CAAS;AAAA,MAC5D,GAAGN;AAAA,IAAA;AAAA,EAAA;AAGV;AAEA,SAASiB,EAAkB,EAAE,WAAAX,GAAW,GAAGN,KAAmE;AAC5G,SACE,gBAAAO;AAAA,IAACN,EAAgB;AAAA,IAAhB;AAAA,MACC,aAAU;AAAA,MACV,WAAWO,EAAG,iCAAiCF,CAAS;AAAA,MACvD,GAAGN;AAAA,IAAA;AAAA,EAAA;AAGV;"}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { Dialog } from './dialog';
|
|
2
|
+
declare const meta: {
|
|
3
|
+
title: string;
|
|
4
|
+
tags: string[];
|
|
5
|
+
component: typeof Dialog;
|
|
6
|
+
parameters: {
|
|
7
|
+
docs: {
|
|
8
|
+
description: {
|
|
9
|
+
component: string;
|
|
10
|
+
};
|
|
11
|
+
};
|
|
12
|
+
};
|
|
13
|
+
};
|
|
14
|
+
export default meta;
|
|
15
|
+
export declare function Demo(): import("react/jsx-runtime").JSX.Element;
|
|
16
|
+
export declare function CustomCloseButton(): import("react/jsx-runtime").JSX.Element;
|
|
17
|
+
export declare function InsideDropdownMenu(): import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
package/dist/index.css
CHANGED
|
@@ -20,7 +20,7 @@
|
|
|
20
20
|
--destructive: var(--color-red-500); /* color-bg-error-strong */
|
|
21
21
|
--destructive-foreground: var(--color-white); /* color-text-on-color */
|
|
22
22
|
--border: var(--color-zinc-200); /* color-border */
|
|
23
|
-
--input: var(--color-zinc-
|
|
23
|
+
--input: var(--color-zinc-300); /* color-border-input */
|
|
24
24
|
--ring: var(--color-blue-500); /* color-border-focusRing */
|
|
25
25
|
--chart-1: oklch(0.646 0.222 41.116);
|
|
26
26
|
--chart-2: oklch(0.6 0.118 184.704);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kubetail/ui",
|
|
3
|
-
"version": "v2.0.0-
|
|
3
|
+
"version": "v2.0.0-rc9",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"sideEffects": false,
|
|
6
6
|
"module": "./dist/index.js",
|
|
@@ -27,6 +27,7 @@
|
|
|
27
27
|
],
|
|
28
28
|
"peerDependencies": {
|
|
29
29
|
"@radix-ui/react-checkbox": "^1",
|
|
30
|
+
"@radix-ui/react-dialog": "^1",
|
|
30
31
|
"@radix-ui/react-dropdown-menu": "^2",
|
|
31
32
|
"@radix-ui/react-label": "^2",
|
|
32
33
|
"@radix-ui/react-popover": "^1",
|
|
@@ -44,6 +45,9 @@
|
|
|
44
45
|
"@radix-ui/react-checkbox": {
|
|
45
46
|
"optional": true
|
|
46
47
|
},
|
|
48
|
+
"@radix-ui/react-dialog": {
|
|
49
|
+
"optional": true
|
|
50
|
+
},
|
|
47
51
|
"@radix-ui/react-dropdown-menu": {
|
|
48
52
|
"optional": true
|
|
49
53
|
},
|
|
@@ -78,13 +82,14 @@
|
|
|
78
82
|
"@eslint/js": "^9.28.0",
|
|
79
83
|
"@fontsource-variable/roboto-flex": "^5.2.6",
|
|
80
84
|
"@microsoft/api-extractor": "^7.52.8",
|
|
81
|
-
"@radix-ui/react-checkbox": "^1.3.
|
|
82
|
-
"@radix-ui/react-
|
|
85
|
+
"@radix-ui/react-checkbox": "^1.3.3",
|
|
86
|
+
"@radix-ui/react-dialog": "^1.1.15",
|
|
87
|
+
"@radix-ui/react-dropdown-menu": "^2.1.16",
|
|
83
88
|
"@radix-ui/react-label": "^2.1.7",
|
|
84
|
-
"@radix-ui/react-popover": "^1.1.
|
|
85
|
-
"@radix-ui/react-select": "^2.2.
|
|
89
|
+
"@radix-ui/react-popover": "^1.1.15",
|
|
90
|
+
"@radix-ui/react-select": "^2.2.6",
|
|
86
91
|
"@radix-ui/react-slot": "^1.2.3",
|
|
87
|
-
"@radix-ui/react-tabs": "^1.1.
|
|
92
|
+
"@radix-ui/react-tabs": "^1.1.13",
|
|
88
93
|
"@storybook/addon-docs": "^9.0.9",
|
|
89
94
|
"@storybook/addon-links": "^9.0.9",
|
|
90
95
|
"@storybook/addon-themes": "^9.0.9",
|
|
@@ -120,7 +125,7 @@
|
|
|
120
125
|
"react-hook-form": "^7.61.1",
|
|
121
126
|
"rollup-plugin-auto-external": "^2.0.0",
|
|
122
127
|
"rollup-plugin-copy": "^3.5.0",
|
|
123
|
-
"storybook": "^9.
|
|
128
|
+
"storybook": "^9.1.6",
|
|
124
129
|
"tslib": "^2.8.1",
|
|
125
130
|
"typescript": "5.8.3",
|
|
126
131
|
"typescript-eslint": "^8.34.0",
|