@kubetail/ui 2.3.0 → 2.4.1

package/dist/elements/avatar.cjs

@@ -0,0 +1,2 @@
+"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(`../_virtual/_rolldown/runtime.cjs`),t=require(`../lib/utils.cjs`);let n=require(`react/jsx-runtime`),r=require(`react`);r=e.__toESM(r);let i=require(`@radix-ui/react-avatar`);i=e.__toESM(i);function a({className:e,size:r=`default`,...a}){return(0,n.jsx)(i.Root,{"data-slot":`avatar`,"data-size":r,className:t.cn(`group/avatar relative flex size-8 shrink-0 rounded-full select-none data-[size=lg]:size-10 data-[size=sm]:size-6`,e),...a})}function o({className:e,...r}){return(0,n.jsx)(i.Image,{"data-slot":`avatar-image`,className:t.cn(`aspect-square size-full rounded-full`,e),...r})}function s({className:e,...r}){return(0,n.jsx)(i.Fallback,{"data-slot":`avatar-fallback`,className:t.cn(`flex size-full items-center justify-center rounded-full bg-muted text-sm text-muted-foreground group-data-[size=sm]/avatar:text-xs`,e),...r})}function c({className:e,...r}){return(0,n.jsx)(`span`,{"data-slot":`avatar-badge`,className:t.cn(`absolute right-0 bottom-0 z-10 inline-flex items-center justify-center rounded-full bg-primary text-primary-foreground ring-2 ring-background select-none`,`group-data-[size=sm]/avatar:size-2 group-data-[size=sm]/avatar:[&>svg]:hidden`,`group-data-[size=default]/avatar:size-2.5 group-data-[size=default]/avatar:[&>svg]:size-2`,`group-data-[size=lg]/avatar:size-3 group-data-[size=lg]/avatar:[&>svg]:size-2`,e),...r})}function l({className:e,...r}){return(0,n.jsx)(`div`,{"data-slot":`avatar-group`,className:t.cn(`group/avatar-group flex -space-x-2 *:data-[slot=avatar]:ring-2 *:data-[slot=avatar]:ring-background`,e),...r})}function u({className:e,...r}){return(0,n.jsx)(`div`,{"data-slot":`avatar-group-count`,className:t.cn(`relative flex size-8 shrink-0 items-center justify-center rounded-full bg-muted text-sm text-muted-foreground ring-2 ring-background group-has-data-[size=lg]/avatar-group:size-10 group-has-data-[size=sm]/avatar-group:size-6 [&>svg]:size-4 group-has-data-[size=lg]/avatar-group:[&>svg]:size-5 group-has-data-[size=sm]/avatar-group:[&>svg]:size-3`,e),...r})}exports.Avatar=a,exports.AvatarBadge=c,exports.AvatarFallback=s,exports.AvatarGroup=l,exports.AvatarGroupCount=u,exports.AvatarImage=o;
+//# sourceMappingURL=avatar.cjs.map

package/dist/elements/avatar.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"avatar.cjs","names":[],"sources":["../../src/elements/avatar.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport * as AvatarPrimitive from '@radix-ui/react-avatar';\n\nimport { cn } from '@/lib/utils';\n\nfunction Avatar({\n  className,\n  size = 'default',\n  ...props\n}: React.ComponentProps<typeof AvatarPrimitive.Root> & {\n  size?: 'default' | 'sm' | 'lg';\n}) {\n  return (\n    <AvatarPrimitive.Root\n      data-slot=\"avatar\"\n      data-size={size}\n      className={cn(\n        'group/avatar relative flex size-8 shrink-0 rounded-full select-none data-[size=lg]:size-10 data-[size=sm]:size-6',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AvatarImage({ className, ...props }: React.ComponentProps<typeof AvatarPrimitive.Image>) {\n  return (\n    <AvatarPrimitive.Image\n      data-slot=\"avatar-image\"\n      className={cn('aspect-square size-full rounded-full', className)}\n      {...props}\n    />\n  );\n}\n\nfunction AvatarFallback({ className, ...props }: React.ComponentProps<typeof AvatarPrimitive.Fallback>) {\n  return (\n    <AvatarPrimitive.Fallback\n      data-slot=\"avatar-fallback\"\n      className={cn(\n        'flex size-full items-center justify-center rounded-full bg-muted text-sm text-muted-foreground group-data-[size=sm]/avatar:text-xs',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AvatarBadge({ className, ...props }: React.ComponentProps<'span'>) {\n  return (\n    <span\n      data-slot=\"avatar-badge\"\n      className={cn(\n        'absolute right-0 bottom-0 z-10 inline-flex items-center justify-center rounded-full bg-primary text-primary-foreground ring-2 ring-background select-none',\n        'group-data-[size=sm]/avatar:size-2 group-data-[size=sm]/avatar:[&>svg]:hidden',\n        'group-data-[size=default]/avatar:size-2.5 group-data-[size=default]/avatar:[&>svg]:size-2',\n        'group-data-[size=lg]/avatar:size-3 group-data-[size=lg]/avatar:[&>svg]:size-2',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AvatarGroup({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"avatar-group\"\n      className={cn(\n        'group/avatar-group flex -space-x-2 *:data-[slot=avatar]:ring-2 *:data-[slot=avatar]:ring-background',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AvatarGroupCount({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"avatar-group-count\"\n      className={cn(\n        'relative flex size-8 shrink-0 items-center justify-center rounded-full bg-muted text-sm text-muted-foreground ring-2 ring-background group-has-data-[size=lg]/avatar-group:size-10 group-has-data-[size=sm]/avatar-group:size-6 [&>svg]:size-4 group-has-data-[size=lg]/avatar-group:[&>svg]:size-5 group-has-data-[size=sm]/avatar-group:[&>svg]:size-3',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Avatar, AvatarImage, AvatarFallback, AvatarBadge, AvatarGroup, AvatarGroupCount };\n"],"mappings":"+RAOA,SAAS,EAAO,CACd,YACA,OAAO,UACP,GAAG,GAGF,CACD,OAAA,EAAA,EAAA,KACG,EAAgB,KAAjB,CACE,YAAU,SACV,YAAW,EACX,UAAW,EAAA,GACT,mHACA,EACD,CACD,GAAI,EACJ,CAAA,CAIN,SAAS,EAAY,CAAE,YAAW,GAAG,GAA6D,CAChG,OAAA,EAAA,EAAA,KACG,EAAgB,MAAjB,CACE,YAAU,eACV,UAAW,EAAA,GAAG,uCAAwC,EAAU,CAChE,GAAI,EACJ,CAAA,CAIN,SAAS,EAAe,CAAE,YAAW,GAAG,GAAgE,CACtG,OAAA,EAAA,EAAA,KACG,EAAgB,SAAjB,CACE,YAAU,kBACV,UAAW,EAAA,GACT,qIACA,EACD,CACD,GAAI,EACJ,CAAA,CAIN,SAAS,EAAY,CAAE,YAAW,GAAG,GAAuC,CAC1E,OAAA,EAAA,EAAA,KACG,OAAD,CACE,YAAU,eACV,UAAW,EAAA,GACT,4JACA,gFACA,4FACA,gFACA,EACD,CACD,GAAI,EACJ,CAAA,CAIN,SAAS,EAAY,CAAE,YAAW,GAAG,GAAsC,CACzE,OAAA,EAAA,EAAA,KACG,MAAD,CACE,YAAU,eACV,UAAW,EAAA,GACT,sGACA,EACD,CACD,GAAI,EACJ,CAAA,CAIN,SAAS,EAAiB,CAAE,YAAW,GAAG,GAAsC,CAC9E,OAAA,EAAA,EAAA,KACG,MAAD,CACE,YAAU,qBACV,UAAW,EAAA,GACT,2VACA,EACD,CACD,GAAI,EACJ,CAAA"}

package/dist/elements/avatar.d.ts

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import * as AvatarPrimitive from '@radix-ui/react-avatar';
+declare function Avatar({ className, size, ...props }: React.ComponentProps<typeof AvatarPrimitive.Root> & {
+    size?: 'default' | 'sm' | 'lg';
+}): import("react/jsx-runtime").JSX.Element;
+declare function AvatarImage({ className, ...props }: React.ComponentProps<typeof AvatarPrimitive.Image>): import("react/jsx-runtime").JSX.Element;
+declare function AvatarFallback({ className, ...props }: React.ComponentProps<typeof AvatarPrimitive.Fallback>): import("react/jsx-runtime").JSX.Element;
+declare function AvatarBadge({ className, ...props }: React.ComponentProps<'span'>): import("react/jsx-runtime").JSX.Element;
+declare function AvatarGroup({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+declare function AvatarGroupCount({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
+export { Avatar, AvatarImage, AvatarFallback, AvatarBadge, AvatarGroup, AvatarGroupCount };

package/dist/elements/avatar.js

@@ -0,0 +1,53 @@
+"use client";
+import { cn as e } from "../lib/utils.js";
+import { jsx as t } from "react/jsx-runtime";
+import "react";
+import * as n from "@radix-ui/react-avatar";
+//#region src/elements/avatar.tsx
+function r({ className: r, size: i = "default", ...a }) {
+	return /* @__PURE__ */ t(n.Root, {
+		"data-slot": "avatar",
+		"data-size": i,
+		className: e("group/avatar relative flex size-8 shrink-0 rounded-full select-none data-[size=lg]:size-10 data-[size=sm]:size-6", r),
+		...a
+	});
+}
+function i({ className: r, ...i }) {
+	return /* @__PURE__ */ t(n.Image, {
+		"data-slot": "avatar-image",
+		className: e("aspect-square size-full rounded-full", r),
+		...i
+	});
+}
+function a({ className: r, ...i }) {
+	return /* @__PURE__ */ t(n.Fallback, {
+		"data-slot": "avatar-fallback",
+		className: e("flex size-full items-center justify-center rounded-full bg-muted text-sm text-muted-foreground group-data-[size=sm]/avatar:text-xs", r),
+		...i
+	});
+}
+function o({ className: n, ...r }) {
+	return /* @__PURE__ */ t("span", {
+		"data-slot": "avatar-badge",
+		className: e("absolute right-0 bottom-0 z-10 inline-flex items-center justify-center rounded-full bg-primary text-primary-foreground ring-2 ring-background select-none", "group-data-[size=sm]/avatar:size-2 group-data-[size=sm]/avatar:[&>svg]:hidden", "group-data-[size=default]/avatar:size-2.5 group-data-[size=default]/avatar:[&>svg]:size-2", "group-data-[size=lg]/avatar:size-3 group-data-[size=lg]/avatar:[&>svg]:size-2", n),
+		...r
+	});
+}
+function s({ className: n, ...r }) {
+	return /* @__PURE__ */ t("div", {
+		"data-slot": "avatar-group",
+		className: e("group/avatar-group flex -space-x-2 *:data-[slot=avatar]:ring-2 *:data-[slot=avatar]:ring-background", n),
+		...r
+	});
+}
+function c({ className: n, ...r }) {
+	return /* @__PURE__ */ t("div", {
+		"data-slot": "avatar-group-count",
+		className: e("relative flex size-8 shrink-0 items-center justify-center rounded-full bg-muted text-sm text-muted-foreground ring-2 ring-background group-has-data-[size=lg]/avatar-group:size-10 group-has-data-[size=sm]/avatar-group:size-6 [&>svg]:size-4 group-has-data-[size=lg]/avatar-group:[&>svg]:size-5 group-has-data-[size=sm]/avatar-group:[&>svg]:size-3", n),
+		...r
+	});
+}
+//#endregion
+export { r as Avatar, o as AvatarBadge, a as AvatarFallback, s as AvatarGroup, c as AvatarGroupCount, i as AvatarImage };
+
+//# sourceMappingURL=avatar.js.map

package/dist/elements/avatar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"avatar.js","names":[],"sources":["../../src/elements/avatar.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport * as AvatarPrimitive from '@radix-ui/react-avatar';\n\nimport { cn } from '@/lib/utils';\n\nfunction Avatar({\n  className,\n  size = 'default',\n  ...props\n}: React.ComponentProps<typeof AvatarPrimitive.Root> & {\n  size?: 'default' | 'sm' | 'lg';\n}) {\n  return (\n    <AvatarPrimitive.Root\n      data-slot=\"avatar\"\n      data-size={size}\n      className={cn(\n        'group/avatar relative flex size-8 shrink-0 rounded-full select-none data-[size=lg]:size-10 data-[size=sm]:size-6',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AvatarImage({ className, ...props }: React.ComponentProps<typeof AvatarPrimitive.Image>) {\n  return (\n    <AvatarPrimitive.Image\n      data-slot=\"avatar-image\"\n      className={cn('aspect-square size-full rounded-full', className)}\n      {...props}\n    />\n  );\n}\n\nfunction AvatarFallback({ className, ...props }: React.ComponentProps<typeof AvatarPrimitive.Fallback>) {\n  return (\n    <AvatarPrimitive.Fallback\n      data-slot=\"avatar-fallback\"\n      className={cn(\n        'flex size-full items-center justify-center rounded-full bg-muted text-sm text-muted-foreground group-data-[size=sm]/avatar:text-xs',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AvatarBadge({ className, ...props }: React.ComponentProps<'span'>) {\n  return (\n    <span\n      data-slot=\"avatar-badge\"\n      className={cn(\n        'absolute right-0 bottom-0 z-10 inline-flex items-center justify-center rounded-full bg-primary text-primary-foreground ring-2 ring-background select-none',\n        'group-data-[size=sm]/avatar:size-2 group-data-[size=sm]/avatar:[&>svg]:hidden',\n        'group-data-[size=default]/avatar:size-2.5 group-data-[size=default]/avatar:[&>svg]:size-2',\n        'group-data-[size=lg]/avatar:size-3 group-data-[size=lg]/avatar:[&>svg]:size-2',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AvatarGroup({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"avatar-group\"\n      className={cn(\n        'group/avatar-group flex -space-x-2 *:data-[slot=avatar]:ring-2 *:data-[slot=avatar]:ring-background',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction AvatarGroupCount({ className, ...props }: React.ComponentProps<'div'>) {\n  return (\n    <div\n      data-slot=\"avatar-group-count\"\n      className={cn(\n        'relative flex size-8 shrink-0 items-center justify-center rounded-full bg-muted text-sm text-muted-foreground ring-2 ring-background group-has-data-[size=lg]/avatar-group:size-10 group-has-data-[size=sm]/avatar-group:size-6 [&>svg]:size-4 group-has-data-[size=lg]/avatar-group:[&>svg]:size-5 group-has-data-[size=sm]/avatar-group:[&>svg]:size-3',\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Avatar, AvatarImage, AvatarFallback, AvatarBadge, AvatarGroup, AvatarGroupCount };\n"],"mappings":";;;;;;AAOA,SAAS,EAAO,EACd,cACA,UAAO,WACP,GAAG,KAGF;AACD,QACE,kBAAC,EAAgB,MAAjB;EACE,aAAU;EACV,aAAW;EACX,WAAW,EACT,oHACA,EACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,EAAY,EAAE,cAAW,GAAG,KAA6D;AAChG,QACE,kBAAC,EAAgB,OAAjB;EACE,aAAU;EACV,WAAW,EAAG,wCAAwC,EAAU;EAChE,GAAI;EACJ,CAAA;;AAIN,SAAS,EAAe,EAAE,cAAW,GAAG,KAAgE;AACtG,QACE,kBAAC,EAAgB,UAAjB;EACE,aAAU;EACV,WAAW,EACT,sIACA,EACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,EAAY,EAAE,cAAW,GAAG,KAAuC;AAC1E,QACE,kBAAC,QAAD;EACE,aAAU;EACV,WAAW,EACT,6JACA,iFACA,6FACA,iFACA,EACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,EAAY,EAAE,cAAW,GAAG,KAAsC;AACzE,QACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAW,EACT,uGACA,EACD;EACD,GAAI;EACJ,CAAA;;AAIN,SAAS,EAAiB,EAAE,cAAW,GAAG,KAAsC;AAC9E,QACE,kBAAC,OAAD;EACE,aAAU;EACV,WAAW,EACT,4VACA,EACD;EACD,GAAI;EACJ,CAAA"}

package/dist/elements/avatar.stories.d.ts

@@ -0,0 +1,15 @@
+import { Avatar } from './avatar';
+declare const meta: {
+    title: string;
+    tags: string[];
+    component: typeof Avatar;
+    parameters: {
+        docs: {
+            description: {
+                component: string;
+            };
+        };
+    };
+};
+export default meta;
+export declare function Demo(): import("react/jsx-runtime").JSX.Element;

package/dist/elements/button.d.ts

@@ -1,6 +1,6 @@
 import { VariantProps } from 'class-variance-authority';
 declare const buttonVariants: (props?: ({
-    variant?: "default" | "destructive" | "outline" | "secondary" | "ghost" | "link" | null | undefined;
+    variant?: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | null | undefined;
     size?: "default" | "sm" | "lg" | "icon" | "icon-sm" | "icon-lg" | null | undefined;
 } & import('class-variance-authority/types').ClassProp) | undefined) => string;
 export type ButtonVariantProps = VariantProps<typeof buttonVariants>;

package/dist/elements/calendar.stories.d.ts

@@ -12,6 +12,3 @@ declare const meta: {
 };
 export default meta;
 export declare function Default(): import("react/jsx-runtime").JSX.Element;
-export declare namespace Default {
-    var storyName: string;
-}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kubetail/ui",
-  "version": "v2.3.0",
+  "version": "v2.4.1",
   "repository": {
     "type": "git",
     "url": "https://github.com/kubetail-org/kubetail-ui"
@@ -34,6 +34,7 @@
     "/dist"
   ],
   "peerDependencies": {
+    "@radix-ui/react-avatar": "^1",
     "@radix-ui/react-checkbox": "^1",
     "@radix-ui/react-dialog": "^1",
     "@radix-ui/react-dropdown-menu": "^2",
@@ -54,6 +55,9 @@
     "tailwindcss": "^4"
   },
   "peerDependenciesMeta": {
+    "@radix-ui/react-avatar": {
+      "optional": true
+    },
     "@radix-ui/react-checkbox": {
       "optional": true
     },
@@ -101,11 +105,12 @@
     }
   },
   "devDependencies": {
-    "@chromatic-com/storybook": "^5.0.1",
+    "@chromatic-com/storybook": "^5.1.1",
     "@eslint/compat": "^2.0.3",
     "@eslint/js": "^9.39.1",
     "@fontsource-variable/roboto-flex": "^5.2.8",
     "@microsoft/api-extractor": "^7.57.7",
+    "@radix-ui/react-avatar": "^1.1.11",
     "@radix-ui/react-checkbox": "^1.3.3",
     "@radix-ui/react-dialog": "^1.1.15",
     "@radix-ui/react-dropdown-menu": "^2.1.16",
@@ -118,11 +123,11 @@
     "@radix-ui/react-tabs": "^1.1.13",
     "@radix-ui/react-toggle": "^1.1.10",
     "@radix-ui/react-tooltip": "^1.2.8",
-    "@storybook/addon-docs": "^10.2.19",
-    "@storybook/addon-links": "^10.2.19",
-    "@storybook/addon-themes": "^10.2.19",
-    "@storybook/builder-vite": "^10.2.9",
-    "@storybook/react-vite": "^10.2.9",
+    "@storybook/addon-docs": "^10.3.4",
+    "@storybook/addon-links": "^10.3.4",
+    "@storybook/addon-themes": "^10.3.4",
+    "@storybook/builder-vite": "^10.3.4",
+    "@storybook/react-vite": "^10.3.4",
     "@stylistic/eslint-plugin": "^3.1.0",
     "@tailwindcss/vite": "^4.2.1",
     "@testing-library/jest-dom": "^6.9.1",
@@ -153,7 +158,7 @@
     "react-hook-form": "^7.71.2",
     "rollup-plugin-auto-external": "^2.0.0",
     "rollup-plugin-copy": "^3.5.0",
-    "storybook": "^10.2.9",
+    "storybook": "^10.3.4",
     "tailwindcss": "^4.2.1",
     "tslib": "^2.8.1",
     "typescript": "~5.9.3",
@@ -161,7 +166,8 @@
     "unplugin-dts": "1.0.0-beta.6",
     "unplugin-fonts": "^1.4.0",
     "vite": "^8.0.0",
-    "vitest": "^4.1.0"
+    "vitest": "^4.1.0",
+    "eslint-plugin-storybook": "10.3.4"
   },
   "dependencies": {
     "class-variance-authority": "^0.7.1",