@polastack/design-system 0.1.11 → 0.1.13

package/README.md

@@ -63,7 +63,7 @@ function App() {
 ## コンポーネント一覧
 
 ### コアアトム
-Button, Badge, Avatar, Separator, Skeleton, Spinner, Card, Tooltip, Toast
+Button, Badge, Avatar, AvatarGroup, Separator, Skeleton, Spinner, Card, Tooltip, Toast
 
 ### フォーム
 Label, Input, Textarea, Checkbox, RadioGroup, Switch, Select, Combobox, DatePicker, NumberInput, FormField, DynamicFormField, FormLayout
@@ -77,6 +77,9 @@ Popover, DropdownMenu, Dialog, CommandPalette, Drawer, AppShell
 ### PWA
 BottomNavigation, OfflineIndicator, InstallPrompt, PullToRefresh
 
+### チャート / ダッシュボード
+StatCard, ChartContainer, chartColors (tokens)
+
 ### テーマ
 ThemeProvider, useTheme
 

package/dist/index.js

@@ -572,11 +572,11 @@ Skeleton.displayName = "Skeleton";
 import * as React9 from "react";
 import { cva as cva4 } from "class-variance-authority";
 import { jsx as jsx8, jsxs as jsxs2 } from "react/jsx-runtime";
-var spinnerVariants = cva4("animate-spin", {
+var spinnerVariants = cva4("", {
   variants: {
     size: {
       sm: "h-4 w-4",
-      md: "h-6 w-6",
+      md: "h-5 w-5",
       lg: "h-8 w-8"
     }
   },
@@ -584,36 +584,33 @@ var spinnerVariants = cva4("animate-spin", {
     size: "md"
   }
 });
+var BARS = 8;
 var Spinner = React9.forwardRef(
   ({ className, size, ...props }, ref) => /* @__PURE__ */ jsxs2("div", { ref, role: "status", "aria-label": "Loading", ...props, children: [
-    /* @__PURE__ */ jsxs2(
+    /* @__PURE__ */ jsx8(
       "svg",
       {
         className: cn(spinnerVariants({ size }), className),
-        xmlns: "http://www.w3.org/2000/svg",
-        fill: "none",
         viewBox: "0 0 24 24",
-        children: [
-          /* @__PURE__ */ jsx8(
-            "circle",
-            {
-              className: "opacity-25",
-              cx: "12",
-              cy: "12",
-              r: "10",
-              stroke: "currentColor",
-              strokeWidth: "4"
-            }
-          ),
-          /* @__PURE__ */ jsx8(
-            "path",
-            {
-              className: "opacity-75",
-              fill: "currentColor",
-              d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
+        xmlns: "http://www.w3.org/2000/svg",
+        fill: "currentColor",
+        children: Array.from({ length: BARS }, (_, i) => /* @__PURE__ */ jsx8(
+          "rect",
+          {
+            x: "11",
+            y: "2",
+            width: "2",
+            height: "6",
+            rx: "1",
+            opacity: 1 - i * (0.85 / BARS),
+            transform: `rotate(${i * (360 / BARS)} 12 12)`,
+            style: {
+              animation: "spinner-fade 0.8s ease-in-out infinite",
+              animationDelay: `${-i * 0.1}s`
             }
-          )
-        ]
+          },
+          i
+        ))
       }
     ),
     /* @__PURE__ */ jsx8("span", { className: "sr-only", children: "Loading..." })