@szum-tech/design-system 3.8.1 → 3.10.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@szum-tech/design-system",
-  "version": "3.8.1",
+  "version": "3.10.0",
   "description": "Szum-Tech design system with tailwindcss support",
   "keywords": [
     "szum-tech",
@@ -78,16 +78,6 @@
         "require": "./dist/hooks/index.cjs"
       }
     },
-    "./contexts": {
-      "import": {
-        "types": "./dist/contexts/index.d.ts",
-        "import": "./dist/contexts/index.js"
-      },
-      "require": {
-        "types": "./dist/contexts/index.d.cts",
-        "require": "./dist/contexts/index.cjs"
-      }
-    },
     "./tailwind/*.css": "./tailwind/*.css",
     "./package.json": "./package.json"
   },
@@ -122,63 +112,61 @@
   "dependencies": {
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
-    "lucide-react": "^0.556.0",
+    "lucide-react": "^0.562.0",
+    "motion": "^12.27.1",
     "radix-ui": "^1.4.3",
     "sonner": "^2.0.7",
-    "tailwind-merge": "^3.3.1",
+    "tailwind-merge": "^3.4.0",
     "tailwindcss-animate": "^1.0.7"
   },
   "devDependencies": {
-    "@storybook-community/storybook-dark-mode": "^7.0.3",
-    "@storybook/addon-a11y": "^10.1.4",
-    "@storybook/addon-docs": "^10.1.4",
-    "@storybook/addon-vitest": "^10.1.4",
-    "@storybook/builder-vite": "^10.1.4",
-    "@storybook/react-vite": "^10.1.4",
-    "@szum-tech/eslint-config": "^2.1.7",
-    "@szum-tech/prettier-config": "^1.6.2",
-    "@szum-tech/semantic-release-config": "^2.3.1",
-    "@tailwindcss/vite": "^4.1.11",
+    "@storybook-community/storybook-dark-mode": "^7.1.0",
+    "@storybook/addon-a11y": "^10.1.11",
+    "@storybook/addon-docs": "^10.1.11",
+    "@storybook/addon-vitest": "^10.1.11",
+    "@storybook/builder-vite": "^10.1.11",
+    "@storybook/react-vite": "^10.1.11",
+    "@szum-tech/eslint-config": "^2.1.15",
+    "@szum-tech/prettier-config": "^1.6.5",
+    "@szum-tech/semantic-release-config": "^2.3.7",
+    "@tailwindcss/vite": "^4.1.18",
     "@testing-library/dom": "^10.4.1",
-    "@testing-library/jest-dom": "^6.6.4",
-    "@testing-library/react": "^16.3.0",
+    "@testing-library/jest-dom": "^6.9.1",
+    "@testing-library/react": "^16.3.2",
     "@testing-library/user-event": "^14.6.1",
-    "@types/node": "^24.10.1",
-    "@types/react": "^19.2.7",
+    "@types/node": "^25.0.9",
+    "@types/react": "^19.2.8",
     "@types/react-dom": "^19.2.3",
-    "@vitejs/plugin-react": "^5.1.1",
-    "@vitest/browser": "^4.0.13",
-    "@vitest/browser-playwright": "^4.0.15",
-    "@vitest/coverage-v8": "^4.0.15",
-    "@vitest/ui": "^4.0.15",
+    "@vitejs/plugin-react": "^5.1.2",
+    "@vitest/browser": "^4.0.17",
+    "@vitest/browser-playwright": "^4.0.17",
+    "@vitest/coverage-v8": "^4.0.17",
+    "@vitest/ui": "^4.0.17",
     "cpy-cli": "^6.0.0",
-    "eslint": "^9.39.1",
-    "happy-dom": "^20.0.2",
-    "playwright": "^1.56.1",
-    "prettier": "^3.7.4",
-    "react": "^19.2.1",
-    "react-docgen": "^8.0.0",
+    "eslint": "^9.39.2",
+    "happy-dom": "^20.3.3",
+    "playwright": "^1.57.0",
+    "prettier": "^3.8.0",
+    "react": "^19.2.3",
+    "react-docgen": "^8.0.2",
     "react-docgen-typescript": "^2.4.0",
-    "react-dom": "^19.2.1",
+    "react-dom": "^19.2.3",
     "semantic-release": "^25.0.2",
-    "serve": "^14.2.4",
-    "storybook": "^10.1.4",
-    "storybook-addon-tag-badges": "^3.0.2",
-    "tailwindcss": "^4.1.11",
+    "serve": "^14.2.5",
+    "storybook": "^10.1.11",
+    "storybook-addon-tag-badges": "^3.0.4",
+    "tailwindcss": "^4.1.18",
     "tsup": "^8.5.1",
     "typescript": "^5.9.3",
-    "vite": "^7.2.4",
-    "vite-tsconfig-paths": "^5.1.4",
-    "vitest": "^4.0.15"
+    "vite": "^7.3.1",
+    "vite-tsconfig-paths": "^6.0.4",
+    "vitest": "^4.0.17"
   },
   "peerDependencies": {
     "react": ">=19",
     "react-dom": ">=19",
     "tailwindcss": ">=4"
   },
-  "engines": {
-    "node": ">=24"
-  },
   "publishConfig": {
     "access": "public"
   }

package/tailwind/animation.css

@@ -1,6 +1,6 @@
 @import "tailwindcss";
 
-@theme {
+@theme inline {
   /* Components */
   /* Tooltip */
   --animate-slideDownAndFade: slideDownAndFade 400ms cubic-bezier(0.16, 1, 0.3, 1);
@@ -50,4 +50,26 @@
       transform: translateX(0);
     }
   }
+
+  /* Marquee */
+  --animate-marquee: marquee var(--duration) infinite linear;
+  --animate-marquee-vertical: marquee-vertical var(--duration) linear infinite;
+
+  @keyframes marquee {
+    from {
+      transform: translateX(0);
+    }
+    to {
+      transform: translateX(calc(-100% - var(--gap)));
+    }
+  }
+
+  @keyframes marquee-vertical {
+    from {
+      transform: translateY(0);
+    }
+    to {
+      transform: translateY(calc(-100% - var(--gap)));
+    }
+  }
 }

package/tailwind/global.css

@@ -7,12 +7,17 @@
 
 @plugin "tailwindcss-animate";
 
+@custom-variant dark (&:is(.dark *));
+
 @layer base {
   button:not(:disabled),
   [role="button"]:not(:disabled) {
     cursor: pointer;
   }
 
+  * {
+    @apply border-border outline-ring/50;
+  }
   body {
     @apply bg-background font-poppins text-foreground text-body-default antialiased;
   }

package/tailwind/palette.css

@@ -6,7 +6,7 @@
   --background: oklch(1 0 0);
   --foreground: oklch(0.145 0 0);
 
-  --primary: var(--color-blue-700);
+  --primary: var(--color-blue-600);
   --primary-foreground: var(--color-blue-50);
 
   --secondary: oklch(0.97 0 0);
@@ -59,7 +59,7 @@
   --background: oklch(0.145 0 0);
   --foreground: oklch(0.985 0 0);
 
-  --primary: var(--color-blue-700);
+  --primary: var(--color-blue-600);
   --primary-foreground: var(--color-blue-50);
 
   --secondary: oklch(0.269 0 0);

package/dist/chunk-EW6TE3N5.cjs

@@ -1,38 +0,0 @@
-'use strict';
-
-var React = require('react');
-
-function _interopNamespace(e) {
-  if (e && e.__esModule) return e;
-  var n = Object.create(null);
-  if (e) {
-    Object.keys(e).forEach(function (k) {
-      if (k !== 'default') {
-        var d = Object.getOwnPropertyDescriptor(e, k);
-        Object.defineProperty(n, k, d.get ? d : {
-          enumerable: true,
-          get: function () { return e[k]; }
-        });
-      }
-    });
-  }
-  n.default = e;
-  return Object.freeze(n);
-}
-
-var React__namespace = /*#__PURE__*/_interopNamespace(React);
-
-// src/contexts/directon.tsx
-var Direction = {
-  LTR: "ltr",
-  RTL: "rtl"
-};
-var DirectionContext = React__namespace.createContext(void 0);
-function useDirection(dirProp) {
-  const contextDir = React__namespace.useContext(DirectionContext);
-  return dirProp ?? contextDir ?? Direction.LTR;
-}
-
-exports.Direction = Direction;
-exports.DirectionContext = DirectionContext;
-exports.useDirection = useDirection;

package/dist/chunk-GR37JJQK.cjs

@@ -1,43 +0,0 @@
-'use strict';
-
-var radixUi = require('radix-ui');
-var jsxRuntime = require('react/jsx-runtime');
-
-// src/components/tooltip/tooltip.tsx
-function Tooltip({
-  defaultOpen,
-  content,
-  open,
-  onOpenChange,
-  children,
-  side,
-  align,
-  collisionPadding = 8,
-  sideOffset = 8,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxRuntime.jsxs(radixUi.Tooltip.Root, { delayDuration: 0, open, defaultOpen, onOpenChange, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(radixUi.Tooltip.Trigger, { asChild: true, children }),
-    content ? /* @__PURE__ */ jsxRuntime.jsx(radixUi.Tooltip.Portal, { children: /* @__PURE__ */ jsxRuntime.jsxs(
-      radixUi.Tooltip.Content,
-      {
-        className: "text-body-1 data-[state=delayed-open]:data-[side=bottom]:animate-slideUpAndFade data-[state=delayed-open]:data-[side=left]:animate-slideRightAndFade data-[state=delayed-open]:data-[side=right]:animate-slideLeftAndFade data-[state=delayed-open]:data-[side=top]:animate-slideDownAndFade rounded bg-white p-2 text-gray-100 will-change-[transform,opacity] select-none",
-        sideOffset,
-        side,
-        align,
-        collisionPadding,
-        ...props,
-        children: [
-          content,
-          /* @__PURE__ */ jsxRuntime.jsx(radixUi.Tooltip.Arrow, { width: 8, height: 4, className: "fill-white" })
-        ]
-      }
-    ) }) : null
-  ] });
-}
-function TooltipProvider({ children, skipDelayDuration = 500, ...props }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(radixUi.Tooltip.Provider, { skipDelayDuration, ...props, children });
-}
-
-exports.Tooltip = Tooltip;
-exports.TooltipProvider = TooltipProvider;

package/dist/chunk-H5O5L6XT.js

@@ -1,14 +0,0 @@
-import * as React from 'react';
-
-// src/contexts/directon.tsx
-var Direction = {
-  LTR: "ltr",
-  RTL: "rtl"
-};
-var DirectionContext = React.createContext(void 0);
-function useDirection(dirProp) {
-  const contextDir = React.useContext(DirectionContext);
-  return dirProp ?? contextDir ?? Direction.LTR;
-}
-
-export { Direction, DirectionContext, useDirection };

package/dist/chunk-HJJPEVIH.js

@@ -1,40 +0,0 @@
-import { Tooltip as Tooltip$1 } from 'radix-ui';
-import { jsxs, jsx } from 'react/jsx-runtime';
-
-// src/components/tooltip/tooltip.tsx
-function Tooltip({
-  defaultOpen,
-  content,
-  open,
-  onOpenChange,
-  children,
-  side,
-  align,
-  collisionPadding = 8,
-  sideOffset = 8,
-  ...props
-}) {
-  return /* @__PURE__ */ jsxs(Tooltip$1.Root, { delayDuration: 0, open, defaultOpen, onOpenChange, children: [
-    /* @__PURE__ */ jsx(Tooltip$1.Trigger, { asChild: true, children }),
-    content ? /* @__PURE__ */ jsx(Tooltip$1.Portal, { children: /* @__PURE__ */ jsxs(
-      Tooltip$1.Content,
-      {
-        className: "text-body-1 data-[state=delayed-open]:data-[side=bottom]:animate-slideUpAndFade data-[state=delayed-open]:data-[side=left]:animate-slideRightAndFade data-[state=delayed-open]:data-[side=right]:animate-slideLeftAndFade data-[state=delayed-open]:data-[side=top]:animate-slideDownAndFade rounded bg-white p-2 text-gray-100 will-change-[transform,opacity] select-none",
-        sideOffset,
-        side,
-        align,
-        collisionPadding,
-        ...props,
-        children: [
-          content,
-          /* @__PURE__ */ jsx(Tooltip$1.Arrow, { width: 8, height: 4, className: "fill-white" })
-        ]
-      }
-    ) }) : null
-  ] });
-}
-function TooltipProvider({ children, skipDelayDuration = 500, ...props }) {
-  return /* @__PURE__ */ jsx(Tooltip$1.Provider, { skipDelayDuration, ...props, children });
-}
-
-export { Tooltip, TooltipProvider };

package/dist/contexts/index.cjs

@@ -1,18 +0,0 @@
-'use strict';
-
-var chunkEW6TE3N5_cjs = require('../chunk-EW6TE3N5.cjs');
-
-
-
-Object.defineProperty(exports, "Direction", {
-  enumerable: true,
-  get: function () { return chunkEW6TE3N5_cjs.Direction; }
-});
-Object.defineProperty(exports, "DirectionContext", {
-  enumerable: true,
-  get: function () { return chunkEW6TE3N5_cjs.DirectionContext; }
-});
-Object.defineProperty(exports, "useDirection", {
-  enumerable: true,
-  get: function () { return chunkEW6TE3N5_cjs.useDirection; }
-});

package/dist/contexts/index.d.cts

@@ -1,11 +0,0 @@
-import * as React from 'react';
-
-declare const Direction: {
-    readonly LTR: "ltr";
-    readonly RTL: "rtl";
-};
-type Direction = (typeof Direction)[keyof typeof Direction];
-declare const DirectionContext: React.Context<Direction | undefined>;
-declare function useDirection(dirProp?: Direction): Direction;
-
-export { Direction, DirectionContext, useDirection };

package/dist/contexts/index.d.ts

@@ -1,11 +0,0 @@
-import * as React from 'react';
-
-declare const Direction: {
-    readonly LTR: "ltr";
-    readonly RTL: "rtl";
-};
-type Direction = (typeof Direction)[keyof typeof Direction];
-declare const DirectionContext: React.Context<Direction | undefined>;
-declare function useDirection(dirProp?: Direction): Direction;
-
-export { Direction, DirectionContext, useDirection };

package/dist/contexts/index.js

@@ -1 +0,0 @@
-export { Direction, DirectionContext, useDirection } from '../chunk-H5O5L6XT.js';