@taiv/ui 1.11.0 → 1.13.0

package/dist/docs/design/Colors.stories.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Group } from '../../components/Layout/Group/Group';
+import { Stack } from '../../components/Layout/Stack/Stack';
+import { Text } from '../../components/Typography/Text/Text';
+import { colors, primitives } from '../../constants/colors';
+const meta = {
+    title: 'Design/Colors',
+    tags: ['!dev'],
+    parameters: {
+        layout: 'centered',
+    },
+};
+export default meta;
+const Swatch = ({ color, label }) => (_jsxs(Stack, { gap: "0.4rem", align: "center", children: [_jsx("div", { style: {
+                width: '64px',
+                height: '64px',
+                borderRadius: '8px',
+                backgroundColor: color,
+                border: '1px solid rgba(0,0,0,0.1)',
+            } }), _jsx(Text, { size: "xs", color: "dimmed", children: label }), _jsx(Text, { size: "xs", color: "dimmed", children: color })] }));
+const ThemeRow = ({ semantic, primitive, shades, }) => (_jsxs(Stack, { gap: "0.8rem", children: [_jsxs(Group, { gap: "0.4rem", children: [_jsx(Text, { weight: "bold", children: semantic }), _jsxs(Text, { children: ["(", primitive, ")"] })] }), _jsx(Group, { gap: "1.6rem", children: Object.entries(shades).map(([shade, hex]) => (_jsx(Swatch, { color: hex, label: shade }, shade))) })] }));
+const ColorRow = ({ name, shades }) => (_jsxs(Stack, { gap: "0.8rem", children: [_jsx(Text, { weight: "bold", transform: "capitalize", children: name }), _jsx(Group, { gap: "1.6rem", children: Object.entries(shades).map(([shade, hex]) => (_jsx(Swatch, { color: hex, label: shade }, shade))) })] }));
+export const TaivLight = {
+    render: () => (_jsxs(Stack, { gap: "2.4rem", align: "flex-start", children: [_jsxs(Group, { gap: "1.6rem", children: [_jsx(Swatch, { color: "#000000", label: "black" }), _jsx(Swatch, { color: "#FFFFFF", label: "white" })] }), _jsx(ThemeRow, { semantic: "primary", primitive: "blue", shades: colors.primary }), _jsx(ThemeRow, { semantic: "neutral", primitive: "gray", shades: colors.neutral }), _jsx(ThemeRow, { semantic: "success", primitive: "green", shades: colors.success }), _jsx(ThemeRow, { semantic: "warning", primitive: "yellow", shades: colors.warning }), _jsx(ThemeRow, { semantic: "error", primitive: "red", shades: colors.error })] })),
+};
+export const AdditionalPrimitives = {
+    render: () => (_jsxs(Stack, { gap: "2.4rem", children: [_jsx(ColorRow, { name: "purple", shades: primitives.purple }), _jsx(ColorRow, { name: "salmon", shades: primitives.salmon })] })),
+};

package/dist/docs/hooks/Copy.stories.d.ts

@@ -0,0 +1,6 @@
+import type { Meta, StoryObj } from '@storybook/react-vite';
+declare const meta: Meta;
+export default meta;
+type Story = StoryObj;
+export declare const Default: Story;
+//# sourceMappingURL=Copy.stories.d.ts.map

package/dist/docs/hooks/Copy.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Copy.stories.d.ts","sourceRoot":"","sources":["../../../src/docs/hooks/Copy.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAK5D,QAAA,MAAM,IAAI,EAAE,IAqCX,CAAC;AAEF,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC;AAuBtB,eAAO,MAAM,OAAO,EAAE,KAQrB,CAAC"}

package/dist/docs/hooks/Copy.stories.js

@@ -0,0 +1,61 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCopy } from '../../hooks/useCopy';
+import { Button } from '../../components/Inputs/Buttons/Button/Button';
+import { IconCopy } from '@tabler/icons-react';
+const meta = {
+    title: 'Hooks/Copy',
+    tags: ['!dev'],
+    parameters: {
+        layout: 'centered',
+    },
+    argTypes: {
+        value: {
+            control: { type: 'text' },
+            description: 'The value to copy',
+            table: {
+                type: { summary: 'string' },
+            },
+        },
+        label: {
+            control: { type: 'text' },
+            description: 'Optional label for what the value is',
+            table: {
+                type: { summary: 'string' },
+            },
+        },
+        showNotification: {
+            control: { type: 'boolean' },
+            description: 'Show notification after copy',
+            table: {
+                type: { summary: 'boolean' },
+                defaultValue: { summary: 'true' },
+            },
+        },
+        notificationMessage: {
+            control: { type: 'text' },
+            description: 'Custom notification message override - use this sparingly',
+            table: {
+                type: { summary: 'string' },
+            },
+        },
+    },
+};
+export default meta;
+const DefaultDemo = (args) => {
+    const { copy } = useCopy();
+    return (_jsxs(Button, { variant: "secondary", leftIcon: _jsx(IconCopy, {}), onClick: () => copy({
+            value: args.value,
+            label: args.label || undefined,
+            showNotification: args.showNotification,
+            notificationMessage: args.notificationMessage || undefined,
+        }), children: ["Copy ", args.label] }));
+};
+export const Default = {
+    args: {
+        value: '12345',
+        label: undefined,
+        showNotification: true,
+        notificationMessage: undefined,
+    },
+    render: (args) => _jsx(DefaultDemo, { ...args }),
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@taiv/ui",
-  "version": "1.11.0",
+  "version": "1.13.0",
   "author": "Taiv",
   "description": "Taiv's web UI Toolkit built on Mantine v6",
   "main": "dist/index.js",
@@ -26,7 +26,7 @@
     "@mantine/hooks": "^6.0.0",
     "@mantine/modals": "^6.0.0",
     "@mantine/notifications": "^6.0.0",
-    "@tabler/icons-react": "^2.47.0",
+    "@tabler/icons-react": "^3.41.1",
     "dayjs": "^1.11.18",
     "recharts": "^2.8.0"
   },
@@ -35,13 +35,13 @@
     "react-dom": "^17.0.0"
   },
   "devDependencies": {
-    "@storybook/addon-docs": "^9.1.10",
-    "@storybook/addon-onboarding": "^9.1.10",
-    "@storybook/react-vite": "^9.1.10",
+    "@storybook/addon-docs": "^10.3.3",
+    "@storybook/addon-onboarding": "^10.3.3",
+    "@storybook/react-vite": "^10.3.3",
     "@types/react": "^17.0.87",
     "@types/react-dom": "^17.0.26",
     "chromatic": "^13.3.0",
-    "storybook": "^9.1.10",
+    "storybook": "^10.3.3",
     "typescript": "^5.0.2"
   },
   "exports": {