@sth87/shadcn-design-system 0.1.1 → 0.1.2

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.
Files changed (7) hide show
  1. package/dist/cjs/components/Tooltip/Tooltip.cjs +1 -1
  2. package/dist/cjs/components/Tooltip/Tooltip.cjs.map +1 -1
  3. package/dist/cjs/styles/index.css +1 -1
  4. package/dist/esm/components/Tooltip/Tooltip.js +42 -42
  5. package/dist/esm/components/Tooltip/Tooltip.js.map +1 -1
  6. package/dist/esm/styles/index.css +1 -1
  7. package/package.json +1 -1
package/dist/esm/components/Tooltip/Tooltip.js CHANGED
@@ -1,4 +1,4 @@
1
- import { jsx as t, Fragment as _, jsxs as m } from "react/jsx-runtime";
1
+ import { jsx as s, Fragment as _, jsxs as m } from "react/jsx-runtime";
2
2
  import * as c from "react";
3
3
  import { useMemo as g, useCallback as j } from "react";
4
4
  import { TooltipProvider as S, Tooltip as W, TooltipTrigger as X, TooltipContent as A } from "../../packages/ui/src/components/tooltip.js";
@@ -8,7 +8,7 @@ import "../../packages/ui/src/components/button-group.js";
8
8
  import "../../packages/ui/src/components/input.js";
9
9
  import "../../packages/ui/src/components/textarea.js";
10
10
  import "@radix-ui/react-label";
11
- import { cn as e } from "../../packages/ui/src/lib/utils.js";
11
+ import { cn as r } from "../../packages/ui/src/lib/utils.js";
12
12
  import "../../packages/ui/src/components/select.js";
13
13
  import "../../packages/ui/src/components/combobox.js";
14
14
  import "lucide-react";
@@ -35,69 +35,69 @@ import "../../packages/ui/src/components/tabs.js";
35
35
  import "../../packages/ui/src/components/toggle.js";
36
36
  import { useMotionValue as E, useSpring as u, useTransform as f, motion as v } from "motion/react";
37
37
  import { animationClass as F } from "../../utils/animations.js";
38
- const xt = c.memo(function({
39
- content: n,
40
- children: o,
38
+ const xs = c.memo(function({
39
+ content: a,
40
+ children: e,
41
41
  sideOffset: b = 4,
42
42
  delayDuration: h = 0,
43
- className: s,
43
+ className: o,
44
44
  childClassName: x,
45
45
  position: y = "top",
46
46
  noArrow: w = !1,
47
47
  animation: i,
48
- ...a
48
+ ...d
49
49
  }) {
50
- const l = { stiffness: 100, damping: 5 }, k = g(() => F(i, s), [i, s]), d = g(() => {
51
- switch (a.color) {
50
+ const n = { stiffness: 100, damping: 5 }, k = g(() => F(i, o), [i, o]), l = g(() => {
51
+ switch (d.color) {
52
52
  case "primary":
53
- return "bg-primary text-primary-foreground [&>span>svg]:bg-primary [&>span>svg]:fill-primary";
53
+ return "ds:bg-primary ds:text-primary-foreground ds:[&>span>svg]:bg-primary ds:[&>span>svg]:fill-primary";
54
54
  case "secondary":
55
- return "bg-secondary text-secondary-foreground [&>span>svg]:bg-secondary [&>span>svg]:fill-secondary";
55
+ return "ds:bg-secondary ds:text-secondary-foreground ds:[&>span>svg]:bg-secondary ds:[&>span>svg]:fill-secondary";
56
56
  case "dark":
57
57
  return "";
58
58
  case "light":
59
- return "bg-neutral-200 text-neutral-950 [&_svg]:bg-neutral-200 [&_svg]:fill-neutral-200";
59
+ return "ds:bg-neutral-200 ds:text-neutral-950 ds:[&_svg]:bg-neutral-200 ds:[&_svg]:fill-neutral-200";
60
60
  case "inverted":
61
- return "dark:bg-white dark:text-black dark:[&_svg]:bg-white dark:[&_svg]:fill-white";
61
+ return "ds:dark:bg-white ds:dark:text-black ds:dark:[&_svg]:bg-white ds:dark:[&_svg]:fill-white";
62
62
  case "success":
63
- return "bg-success text-success-foreground [&>span>svg]:bg-success [&>span>svg]:fill-success";
63
+ return "ds:bg-success ds:text-success-foreground ds:[&>span>svg]:bg-success ds:[&>span>svg]:fill-success";
64
64
  case "warning":
65
- return "bg-warning text-warning-foreground [&>span>svg]:bg-warning [&>span>svg]:fill-warning";
65
+ return "ds:bg-warning ds:text-warning-foreground ds:[&>span>svg]:bg-warning ds:[&>span>svg]:fill-warning";
66
66
  case "error":
67
- return "bg-error text-error-foreground [&>span>svg]:bg-error [&>span>svg]:fill-error";
67
+ return "ds:bg-error ds:text-error-foreground ds:[&>span>svg]:bg-error ds:[&>span>svg]:fill-error";
68
68
  case "glass":
69
- return "bg-white/15 text-foreground backdrop-blur-sm shadow-lg [&>span>svg]:bg-white/15 [&>span>svg]:fill-white/15";
69
+ return "ds:bg-white/15 ds:text-foreground ds:backdrop-blur-sm ds:shadow-lg ds:[&>span>svg]:bg-white/15 ds:[&>span>svg]:fill-white/15";
70
70
  default:
71
- return "bg-foreground text-background animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance";
71
+ return "ds:bg-foreground ds:text-background ds:animate-in ds:fade-in-0 ds:zoom-in-95 ds:data-[state=closed]:animate-out ds:data-[state=closed]:fade-out-0 ds:data-[state=closed]:zoom-out-95 ds:data-[side=bottom]:slide-in-from-top-2 ds:data-[side=left]:slide-in-from-right-2 ds:data-[side=right]:slide-in-from-left-2 ds:data-[side=top]:slide-in-from-bottom-2 ds:z-50 ds:w-fit ds:origin-(--radix-tooltip-content-transform-origin) ds:rounded-md ds:px-3 ds:py-1.5 ds:text-xs ds:text-balance";
72
72
  }
73
- }, [a?.color]), r = E(0), T = u(
74
- f(r, [-100, 100], [-45, 45]),
75
- l
73
+ }, [d?.color]), t = E(0), T = u(
74
+ f(t, [-100, 100], [-45, 45]),
75
+ n
76
76
  ), C = u(
77
- f(r, [-100, 100], [-50, 50]),
78
- l
77
+ f(t, [-100, 100], [-50, 50]),
78
+ n
79
79
  ), M = j(
80
80
  (p) => {
81
81
  const N = p.target.offsetWidth / 2;
82
- r.set(p.nativeEvent.offsetX - N);
82
+ t.set(p.nativeEvent.offsetX - N);
83
83
  },
84
- [r]
85
- ), z = c.memo(() => o ? /* @__PURE__ */ t(
84
+ [t]
85
+ ), z = c.memo(() => e ? /* @__PURE__ */ s(
86
86
  "span",
87
87
  {
88
88
  onMouseMove: M,
89
- className: e("ds:inline-block", x),
90
- children: o
89
+ className: r("ds:inline-block", x),
90
+ children: e
91
91
  }
92
- ) : /* @__PURE__ */ t(_, {}));
92
+ ) : /* @__PURE__ */ s(_, {}));
93
93
  return i === "spec" ? /* @__PURE__ */ m(
94
94
  v.div,
95
95
  {
96
- className: e("ds:relative ds:-me-2.5 ds:inline-block", s),
96
+ className: r("ds:relative ds:-me-2.5 ds:inline-block", o),
97
97
  whileHover: "hover",
98
98
  initial: "initial",
99
99
  children: [
100
- /* @__PURE__ */ t(
100
+ /* @__PURE__ */ s(
101
101
  v.div,
102
102
  {
103
103
  variants: {
@@ -118,33 +118,33 @@ const xt = c.memo(function({
118
118
  rotate: T,
119
119
  whiteSpace: "nowrap"
120
120
  },
121
- className: e(
121
+ className: r(
122
122
  "ds:absolute ds:-top-2 ds:left-1/2 ds:z-50 ds:flex ds:-translate-x-1/2 ds:-translate-y-full ds:flex-col ds:items-center ds:justify-center ds:rounded-md ds:px-4 ds:py-2 ds:text-xs ds:shadow-xl",
123
- d
123
+ l
124
124
  ),
125
- children: /* @__PURE__ */ t("div", { className: "ds:relative ds:z-1", children: n })
125
+ children: /* @__PURE__ */ s("div", { className: "ds:relative ds:z-1", children: a })
126
126
  }
127
127
  ),
128
- /* @__PURE__ */ t(z, {})
128
+ /* @__PURE__ */ s(z, {})
129
129
  ]
130
130
  }
131
- ) : /* @__PURE__ */ t(S, { delayDuration: h, children: /* @__PURE__ */ m(W, { children: [
132
- /* @__PURE__ */ t(X, { asChild: !0, children: o }),
133
- /* @__PURE__ */ t(
131
+ ) : /* @__PURE__ */ s(S, { delayDuration: h, children: /* @__PURE__ */ m(W, { children: [
132
+ /* @__PURE__ */ s(X, { asChild: !0, children: e }),
133
+ /* @__PURE__ */ s(
134
134
  A,
135
135
  {
136
- ...a,
136
+ ...d,
137
137
  side: y,
138
138
  sideOffset: b,
139
- className: e(k?.className, d, {
139
+ className: r(k?.className, l, {
140
140
  "ds:[&>span>svg]:invisible": w
141
141
  }),
142
- children: n
142
+ children: a
143
143
  }
144
144
  )
145
145
  ] }) });
146
146
  });
147
147
  export {
148
- xt as Tooltip
148
+ xs as Tooltip
149
149
  };
150
150
  //# sourceMappingURL=Tooltip.js.map
package/dist/esm/components/Tooltip/Tooltip.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Tooltip.js","sources":["../../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import * as React from \"react\";\nimport {\n Tooltip as DsTooltip,\n TooltipTrigger,\n TooltipContent,\n TooltipProvider,\n type TooltipContentProps,\n} from \"@dsui/ui/components/tooltip\";\nimport { cn } from \"@dsui/ui/index\";\nimport { motion, useMotionValue, useSpring, useTransform } from \"motion/react\";\nimport type { BasicAnimation, BasicColor } from \"@/types/variables\";\nimport { useMemo, useCallback } from \"react\";\nimport { animationClass } from \"@/utils/animations\";\n\ntype Color = BasicColor | \"dark\" | \"light\" | \"inverted\";\n\nexport type TooltipProps = TooltipContentProps & {\n content: React.ReactNode;\n children: React.ReactNode;\n sideOffset?: number;\n delayDuration?: number;\n position?: \"top\" | \"right\" | \"bottom\" | \"left\";\n className?: string;\n childClassName?: string;\n noArrow?: boolean;\n animation?: BasicAnimation;\n color?: Color;\n};\n\nexport const Tooltip = React.memo(function Tooltip({\n content,\n children,\n sideOffset = 4,\n delayDuration = 0,\n className,\n childClassName,\n position = \"top\",\n noArrow = false,\n animation,\n ...props\n}: TooltipProps) {\n const springConfig = { stiffness: 100, damping: 5 };\n\n const tooltipAnimation = useMemo<{ className?: string } | null>(() => {\n return animationClass(animation, className);\n }, [animation, className]);\n\n const tooltipColor = useMemo<string>(() => {\n switch (props.color) {\n case \"primary\":\n return \"bg-primary text-primary-foreground [&>span>svg]:bg-primary [&>span>svg]:fill-primary\";\n case \"secondary\":\n return \"bg-secondary text-secondary-foreground [&>span>svg]:bg-secondary [&>span>svg]:fill-secondary\";\n case \"dark\":\n return \"\";\n case \"light\":\n return \"bg-neutral-200 text-neutral-950 [&_svg]:bg-neutral-200 [&_svg]:fill-neutral-200\";\n case \"inverted\":\n return \"dark:bg-white dark:text-black dark:[&_svg]:bg-white dark:[&_svg]:fill-white\";\n case \"success\":\n return \"bg-success text-success-foreground [&>span>svg]:bg-success [&>span>svg]:fill-success\";\n case \"warning\":\n return \"bg-warning text-warning-foreground [&>span>svg]:bg-warning [&>span>svg]:fill-warning\";\n case \"error\":\n return \"bg-error text-error-foreground [&>span>svg]:bg-error [&>span>svg]:fill-error\";\n case \"glass\":\n return \"bg-white/15 text-foreground backdrop-blur-sm shadow-lg [&>span>svg]:bg-white/15 [&>span>svg]:fill-white/15\";\n default:\n return \"bg-foreground text-background animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit origin-(--radix-tooltip-content-transform-origin) rounded-md px-3 py-1.5 text-xs text-balance\";\n }\n }, [props?.color]);\n\n // on mouse move\n const x = useMotionValue(0);\n // rotate the tooltip\n const rotate = useSpring(\n useTransform(x, [-100, 100], [-45, 45]),\n springConfig\n );\n // translate the tooltip\n const translateX = useSpring(\n useTransform(x, [-100, 100], [-50, 50]),\n springConfig\n );\n\n const handleMouseMove = useCallback(\n (event: React.MouseEvent) => {\n const halfWidth = (event.target as HTMLElement).offsetWidth / 2;\n x.set(event.nativeEvent.offsetX - halfWidth);\n },\n [x]\n );\n\n const ChildComp = React.memo(() => {\n if (!children) return <></>;\n\n return (\n <span\n onMouseMove={handleMouseMove}\n className={cn(\"ds:inline-block\", childClassName)}\n >\n {children}\n </span>\n );\n });\n\n if (animation === \"spec\") {\n return (\n <motion.div\n className={cn(\"ds:relative ds:-me-2.5 ds:inline-block\", className)}\n whileHover=\"hover\"\n initial=\"initial\"\n >\n <motion.div\n variants={{\n initial: { opacity: 0, y: 20, scale: 0 },\n hover: {\n opacity: 1,\n y: -5,\n scale: 1,\n transition: {\n type: \"tween\",\n duration: 0.2,\n ease: \"easeOut\",\n },\n },\n }}\n style={{\n translateX: translateX,\n rotate: rotate,\n whiteSpace: \"nowrap\",\n }}\n className={cn(\n \"ds:absolute ds:-top-2 ds:left-1/2 ds:z-50 ds:flex ds:-translate-x-1/2 ds:-translate-y-full ds:flex-col ds:items-center ds:justify-center ds:rounded-md ds:px-4 ds:py-2 ds:text-xs ds:shadow-xl\",\n tooltipColor\n )}\n >\n <div className=\"ds:relative ds:z-1\">{content}</div>\n </motion.div>\n\n <ChildComp />\n </motion.div>\n );\n }\n\n return (\n <TooltipProvider delayDuration={delayDuration}>\n <DsTooltip>\n <TooltipTrigger asChild>{children}</TooltipTrigger>\n <TooltipContent\n {...props}\n side={position}\n sideOffset={sideOffset}\n className={cn(tooltipAnimation?.className, tooltipColor, {\n \"ds:[&>span>svg]:invisible\": noArrow,\n })}\n >\n {content}\n </TooltipContent>\n </DsTooltip>\n </TooltipProvider>\n );\n});\n"],"names":["Tooltip","React","content","children","sideOffset","delayDuration","className","childClassName","position","noArrow","animation","props","springConfig","tooltipAnimation","useMemo","animationClass","tooltipColor","x","useMotionValue","rotate","useSpring","useTransform","translateX","handleMouseMove","useCallback","event","halfWidth","ChildComp","jsx","cn","Fragment","jsxs","motion","TooltipProvider","DsTooltip","TooltipTrigger","TooltipContent"],"mappings":"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"}
1
+ {"version":3,"file":"Tooltip.js","sources":["../../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import * as React from \"react\";\nimport {\n Tooltip as DsTooltip,\n TooltipTrigger,\n TooltipContent,\n TooltipProvider,\n type TooltipContentProps,\n} from \"@dsui/ui/components/tooltip\";\nimport { cn } from \"@dsui/ui/index\";\nimport { motion, useMotionValue, useSpring, useTransform } from \"motion/react\";\nimport type { BasicAnimation, BasicColor } from \"@/types/variables\";\nimport { useMemo, useCallback } from \"react\";\nimport { animationClass } from \"@/utils/animations\";\n\ntype Color = BasicColor | \"dark\" | \"light\" | \"inverted\";\n\nexport type TooltipProps = TooltipContentProps & {\n content: React.ReactNode;\n children: React.ReactNode;\n sideOffset?: number;\n delayDuration?: number;\n position?: \"top\" | \"right\" | \"bottom\" | \"left\";\n className?: string;\n childClassName?: string;\n noArrow?: boolean;\n animation?: BasicAnimation;\n color?: Color;\n};\n\nexport const Tooltip = React.memo(function Tooltip({\n content,\n children,\n sideOffset = 4,\n delayDuration = 0,\n className,\n childClassName,\n position = \"top\",\n noArrow = false,\n animation,\n ...props\n}: TooltipProps) {\n const springConfig = { stiffness: 100, damping: 5 };\n\n const tooltipAnimation = useMemo<{ className?: string } | null>(() => {\n return animationClass(animation, className);\n }, [animation, className]);\n\n const tooltipColor = useMemo<string>(() => {\n switch (props.color) {\n case \"primary\":\n return \"ds:bg-primary ds:text-primary-foreground ds:[&>span>svg]:bg-primary ds:[&>span>svg]:fill-primary\";\n case \"secondary\":\n return \"ds:bg-secondary ds:text-secondary-foreground ds:[&>span>svg]:bg-secondary ds:[&>span>svg]:fill-secondary\";\n case \"dark\":\n return \"\";\n case \"light\":\n return \"ds:bg-neutral-200 ds:text-neutral-950 ds:[&_svg]:bg-neutral-200 ds:[&_svg]:fill-neutral-200\";\n case \"inverted\":\n return \"ds:dark:bg-white ds:dark:text-black ds:dark:[&_svg]:bg-white ds:dark:[&_svg]:fill-white\";\n case \"success\":\n return \"ds:bg-success ds:text-success-foreground ds:[&>span>svg]:bg-success ds:[&>span>svg]:fill-success\";\n case \"warning\":\n return \"ds:bg-warning ds:text-warning-foreground ds:[&>span>svg]:bg-warning ds:[&>span>svg]:fill-warning\";\n case \"error\":\n return \"ds:bg-error ds:text-error-foreground ds:[&>span>svg]:bg-error ds:[&>span>svg]:fill-error\";\n case \"glass\":\n return \"ds:bg-white/15 ds:text-foreground ds:backdrop-blur-sm ds:shadow-lg ds:[&>span>svg]:bg-white/15 ds:[&>span>svg]:fill-white/15\";\n default:\n return \"ds:bg-foreground ds:text-background ds:animate-in ds:fade-in-0 ds:zoom-in-95 ds:data-[state=closed]:animate-out ds:data-[state=closed]:fade-out-0 ds:data-[state=closed]:zoom-out-95 ds:data-[side=bottom]:slide-in-from-top-2 ds:data-[side=left]:slide-in-from-right-2 ds:data-[side=right]:slide-in-from-left-2 ds:data-[side=top]:slide-in-from-bottom-2 ds:z-50 ds:w-fit ds:origin-(--radix-tooltip-content-transform-origin) ds:rounded-md ds:px-3 ds:py-1.5 ds:text-xs ds:text-balance\";\n }\n }, [props?.color]);\n\n // on mouse move\n const x = useMotionValue(0);\n // rotate the tooltip\n const rotate = useSpring(\n useTransform(x, [-100, 100], [-45, 45]),\n springConfig\n );\n // translate the tooltip\n const translateX = useSpring(\n useTransform(x, [-100, 100], [-50, 50]),\n springConfig\n );\n\n const handleMouseMove = useCallback(\n (event: React.MouseEvent) => {\n const halfWidth = (event.target as HTMLElement).offsetWidth / 2;\n x.set(event.nativeEvent.offsetX - halfWidth);\n },\n [x]\n );\n\n const ChildComp = React.memo(() => {\n if (!children) return <></>;\n\n return (\n <span\n onMouseMove={handleMouseMove}\n className={cn(\"ds:inline-block\", childClassName)}\n >\n {children}\n </span>\n );\n });\n\n if (animation === \"spec\") {\n return (\n <motion.div\n className={cn(\"ds:relative ds:-me-2.5 ds:inline-block\", className)}\n whileHover=\"hover\"\n initial=\"initial\"\n >\n <motion.div\n variants={{\n initial: { opacity: 0, y: 20, scale: 0 },\n hover: {\n opacity: 1,\n y: -5,\n scale: 1,\n transition: {\n type: \"tween\",\n duration: 0.2,\n ease: \"easeOut\",\n },\n },\n }}\n style={{\n translateX: translateX,\n rotate: rotate,\n whiteSpace: \"nowrap\",\n }}\n className={cn(\n \"ds:absolute ds:-top-2 ds:left-1/2 ds:z-50 ds:flex ds:-translate-x-1/2 ds:-translate-y-full ds:flex-col ds:items-center ds:justify-center ds:rounded-md ds:px-4 ds:py-2 ds:text-xs ds:shadow-xl\",\n tooltipColor\n )}\n >\n <div className=\"ds:relative ds:z-1\">{content}</div>\n </motion.div>\n\n <ChildComp />\n </motion.div>\n );\n }\n\n return (\n <TooltipProvider delayDuration={delayDuration}>\n <DsTooltip>\n <TooltipTrigger asChild>{children}</TooltipTrigger>\n <TooltipContent\n {...props}\n side={position}\n sideOffset={sideOffset}\n className={cn(tooltipAnimation?.className, tooltipColor, {\n \"ds:[&>span>svg]:invisible\": noArrow,\n })}\n >\n {content}\n </TooltipContent>\n </DsTooltip>\n </TooltipProvider>\n );\n});\n"],"names":["Tooltip","React","content","children","sideOffset","delayDuration","className","childClassName","position","noArrow","animation","props","springConfig","tooltipAnimation","useMemo","animationClass","tooltipColor","x","useMotionValue","rotate","useSpring","useTransform","translateX","handleMouseMove","useCallback","event","halfWidth","ChildComp","jsx","cn","Fragment","jsxs","motion","TooltipProvider","DsTooltip","TooltipTrigger","TooltipContent"],"mappings":"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"}