npm - @mastra/playground-ui - Versions diffs - 60.0.0-alpha.8 → 60.0.0 - Mend

@mastra/playground-ui 60.0.0-alpha.8 → 60.0.0

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 (1883) hide show

package/dist/components/Steps.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Steps.cjs.js","sources":["../../src/ds/components/Steps/shared.tsx","../../src/ds/components/Steps/process-step-list-item.tsx","../../src/ds/components/Steps/process-step-list.tsx","../../src/ds/components/Steps/process-step-progress-bar.tsx"],"sourcesContent":["import { CheckIcon, XIcon } from 'lucide-react';\nimport { Spinner } from '@/ds/components/Spinner';\n\nexport function getStatusIcon(status: string) {\n switch (status) {\n case 'running':\n return <Spinner size=\"sm\" aria-hidden />;\n case 'success':\n return <CheckIcon aria-hidden />;\n case 'failed':\n return <XIcon aria-hidden />;\n default:\n return null;\n }\n}\n\nexport type ProcessStep = {\n id: string;\n status: string;\n description: string;\n title: string;\n isActive: boolean;\n};\n","import { getStatusIcon } from './shared';\nimport type { ProcessStep } from './shared';\nimport { transitions } from '@/ds/primitives/transitions';\nimport { cn } from '@/lib/utils';\n\ntype ProcessStepListItemVariant = 'default' \| 'plain';\n\n/** Same ring geometry and stroke as `<Spinner size=\"sm\" />`, so pending and running read as one shape. /\nfunction PendingRing() {\n return (\n <svg viewBox=\"0 0 24 24\" className=\"text-placeholder\" aria-hidden>\n <circle\n cx=\"12\"\n cy=\"12\"\n r=\"8.5\"\n pathLength=\"48\"\n fill=\"none\"\n stroke=\"currentcolor\"\n strokeWidth=\"2.8\"\n strokeLinecap=\"round\"\n strokeDasharray=\"3 3\"\n />\n </svg>\n );\n}\n\nfunction StepStatusMarker({ status, variant }: { status: string; variant: ProcessStepListItemVariant }) {\n if (variant === 'plain') {\n return (\n <span\n className={cn('flex size-4 items-center justify-center self-center [&>svg]:size-4', transitions.colors, {\n '[&>svg]:text-positive1': status === 'success',\n '[&>svg]:text-negative1': status === 'failed',\n })}\n >\n {status === 'pending' ? <PendingRing /> : getStatusIcon(status)}\n </span>\n );\n }\n\n return (\n <span\n className={cn(\n 'flex size-7 items-center justify-center self-center rounded-full motion-reduce:transition-none',\n transitions.colors,\n transitions.transform,\n {\n '[&>svg]:text-notice-success-fg': status === 'success',\n '[&>svg]:text-notice-destructive-fg': status === 'failed',\n 'border border-dashed border-placeholder': status === 'pending',\n '[&>svg]:size-4': status !== 'running',\n 'bg-accent1Dark': status === 'success',\n 'bg-accent2Dark': status === 'failed',\n 'scale-110': status === 'success' \|\| status === 'failed',\n },\n )}\n >\n {getStatusIcon(status)}\n </span>\n );\n}\n\nexport type ProcessStepListItemProps = {\n /* @deprecated Ignored — the heading comes from `step.title`. */\n stepId?: string;\n step: ProcessStep;\n isActive: boolean;\n position: number;\n variant?: ProcessStepListItemVariant;\n};\n\nexport function ProcessStepListItem({ step, isActive, position, variant = 'default' }: ProcessStepListItemProps) {\n return (\n <div\n className={cn(\n 'grid grid-cols-[1fr_auto] gap-6 rounded-lg px-4 py-3 motion-reduce:transition-none',\n transitions.colors,\n {\n 'border border-transparent': variant === 'default',\n 'border-dashed border-placeholder bg-card': isActive && variant === 'default',\n },\n )}\n >\n <div className=\"grid min-w-0 grid-cols-[auto_1fr] gap-2\">\n <span\n className={cn('flex min-w-6 justify-end text-body', transitions.colors, {\n 'text-foreground': isActive \|\| step.status === 'success',\n 'text-muted-foreground': !isActive && step.status !== 'success',\n })}\n >\n {position}.\n </span>\n <div className=\"min-w-0\">\n <h4\n className={cn('text-body', transitions.colors, {\n 'text-foreground': isActive \|\| step.status === 'success',\n 'text-muted-foreground': !isActive && step.status !== 'success',\n })}\n >\n {step.title}\n </h4>\n {step.description && (\n <p className={cn('-mt-0.5 text-body text-placeholder', { truncate: variant === 'plain' })}>\n {step.description}\n </p>\n )}\n </div>\n </div>\n <StepStatusMarker status={step.status} variant={variant} />\n </div>\n );\n}\n","import { ProcessStepListItem } from './process-step-list-item';\nimport type { ProcessStep } from './shared';\nimport { cn } from '@/lib/utils';\n\nexport type ProcessStepListProps = {\n currentStep: ProcessStep \| null;\n steps: ProcessStep[];\n className?: string;\n};\n\nexport function ProcessStepList({ currentStep, steps = [], className }: ProcessStepListProps) {\n return (\n <div className={cn(className)}>\n {steps.map((step: ProcessStep, idx: number) => (\n <ProcessStepListItem key={step.id} step={step} isActive={currentStep?.id === step.id} position={idx + 1} />\n ))}\n </div>\n );\n}\n","import type { ProcessStep } from './shared';\nimport { Spinner } from '@/ds/components/Spinner';\nimport { transitions } from '@/ds/primitives/transitions';\nimport { cn } from '@/lib/utils';\n\nexport type ProcessStepProgressBarProps = {\n steps: ProcessStep[];\n};\n\nexport function ProcessStepProgressBar({ steps }: ProcessStepProgressBarProps) {\n const totalSteps = steps.length;\n const completedSteps = steps.filter(step => step.status === 'success').length;\n\n return (\n <div className=\"flex w-full flex-col content-center justify-center gap-4\">\n <div className=\"grid w-full grid-cols-[0_repeat(9,1fr)]\">\n {steps.map((step: ProcessStep, idx: number) => {\n return (\n <div\n key={step.id}\n className={cn('relative flex h-8 items-center justify-end', transitions.colors, {\n 'bg-accent1Dark': step.status === 'success' && steps?.[idx - 1]?.status === 'success',\n })}\n >\n <div\n className={cn(\n 'absolute right-0 z-10 flex size-8 translate-x-1/2 items-center justify-center self-center rounded-full bg-fill text-column text-muted-foreground motion-reduce:transition-none',\n transitions.colors,\n transitions.transform,\n {\n 'border border-dashed border-placeholder': step.status === 'pending',\n 'scale-110 bg-accent1Dark text-notice-success-fg': step.status === 'success',\n 'scale-110 bg-accent2Dark text-notice-destructive-fg': step.status === 'failed',\n },\n )}\n >\n {step.status === 'running' ? <Spinner /> : idx + 1}\n </div>\n </div>\n );\n })}\n </div>\n <div className={cn('text-center text-caption text-muted-foreground', transitions.colors)}>\n {completedSteps} of {totalSteps} steps completed\n </div>\n </div>\n );\n}\n"],"names":["jsx","Spinner","CheckIcon","XIcon","cn","transitions","jsxs"],"mappings":"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"}
1	+ {"version":3,"file":"Steps.cjs.js","sources":["../../src/ds/components/Steps/shared.tsx","../../src/ds/components/Steps/process-step-list-item.tsx","../../src/ds/components/Steps/process-step-list.tsx","../../src/ds/components/Steps/process-step-progress-bar.tsx"],"sourcesContent":["import { CheckIcon, XIcon } from 'lucide-react';\nimport { Spinner } from '@/ds/components/Spinner';\n\nexport function getStatusIcon(status: string) {\n switch (status) {\n case 'running':\n return <Spinner size=\"sm\" aria-hidden />;\n case 'success':\n return <CheckIcon aria-hidden />;\n case 'failed':\n return <XIcon aria-hidden />;\n default:\n return null;\n }\n}\n\nexport type ProcessStep = {\n id: string;\n status: string;\n description: string;\n title: string;\n isActive: boolean;\n};\n","import { getStatusIcon } from './shared';\nimport type { ProcessStep } from './shared';\nimport { Txt } from '@/ds/components/Txt';\nimport { transitions } from '@/ds/primitives/transitions';\nimport { cn } from '@/lib/utils';\n\ntype ProcessStepListItemVariant = 'default' \| 'plain';\n\n/** Same ring geometry and stroke as `<Spinner size=\"sm\" />`, so pending and running read as one shape. /\nfunction PendingRing() {\n return (\n <svg viewBox=\"0 0 24 24\" className=\"text-placeholder\" aria-hidden>\n <circle\n cx=\"12\"\n cy=\"12\"\n r=\"8.5\"\n pathLength=\"48\"\n fill=\"none\"\n stroke=\"currentcolor\"\n strokeWidth=\"2.8\"\n strokeLinecap=\"round\"\n strokeDasharray=\"3 3\"\n />\n </svg>\n );\n}\n\nfunction StepStatusMarker({ status, variant }: { status: string; variant: ProcessStepListItemVariant }) {\n if (variant === 'plain') {\n return (\n <span\n className={cn('flex size-4 items-center justify-center self-center [&>svg]:size-4', transitions.colors, {\n '[&>svg]:text-success-indicator': status === 'success',\n '[&>svg]:text-destructive-indicator': status === 'failed',\n })}\n >\n {status === 'pending' ? <PendingRing /> : getStatusIcon(status)}\n </span>\n );\n }\n\n return (\n <span\n className={cn(\n 'flex size-7 items-center justify-center self-center rounded-full motion-reduce:transition-none',\n transitions.colors,\n transitions.transform,\n {\n '[&>svg]:text-success-indicator': status === 'success',\n '[&>svg]:text-destructive-indicator': status === 'failed',\n 'border border-dashed border-placeholder': status === 'pending',\n '[&>svg]:size-4': status !== 'running',\n 'bg-success-subtle': status === 'success',\n 'bg-destructive-subtle': status === 'failed',\n 'scale-110': status === 'success' \|\| status === 'failed',\n },\n )}\n >\n {getStatusIcon(status)}\n </span>\n );\n}\n\nexport type ProcessStepListItemProps = {\n /* @deprecated Ignored — the heading comes from `step.title`. */\n stepId?: string;\n step: ProcessStep;\n isActive: boolean;\n position: number;\n variant?: ProcessStepListItemVariant;\n};\n\nexport function ProcessStepListItem({ step, isActive, position, variant = 'default' }: ProcessStepListItemProps) {\n const stepTone = isActive \|\| step.status === 'success' ? 'ink' : 'muted';\n\n return (\n <div\n className={cn(\n 'grid grid-cols-[1fr_auto] gap-6 rounded-lg px-4 py-3 motion-reduce:transition-none',\n transitions.colors,\n {\n 'border border-transparent': variant === 'default',\n 'border-dashed border-placeholder bg-card': isActive && variant === 'default',\n },\n )}\n >\n <div className=\"grid min-w-0 grid-cols-[auto_1fr] gap-2\">\n <Txt as=\"span\" tone={stepTone} className={cn('flex min-w-6 justify-end', transitions.colors)}>\n {position}.\n </Txt>\n <div className=\"min-w-0\">\n <Txt as=\"h4\" tone={stepTone} className={transitions.colors}>\n {step.title}\n </Txt>\n {step.description && (\n <Txt tone=\"faint\" className={cn('-mt-0.5', { truncate: variant === 'plain' })}>\n {step.description}\n </Txt>\n )}\n </div>\n </div>\n <StepStatusMarker status={step.status} variant={variant} />\n </div>\n );\n}\n","import { ProcessStepListItem } from './process-step-list-item';\nimport type { ProcessStep } from './shared';\nimport { cn } from '@/lib/utils';\n\nexport type ProcessStepListProps = {\n currentStep: ProcessStep \| null;\n steps: ProcessStep[];\n className?: string;\n};\n\nexport function ProcessStepList({ currentStep, steps = [], className }: ProcessStepListProps) {\n return (\n <div className={cn(className)}>\n {steps.map((step: ProcessStep, idx: number) => (\n <ProcessStepListItem key={step.id} step={step} isActive={currentStep?.id === step.id} position={idx + 1} />\n ))}\n </div>\n );\n}\n","import type { ProcessStep } from './shared';\nimport { Spinner } from '@/ds/components/Spinner';\nimport { transitions } from '@/ds/primitives/transitions';\nimport { cn } from '@/lib/utils';\n\nexport type ProcessStepProgressBarProps = {\n steps: ProcessStep[];\n};\n\nexport function ProcessStepProgressBar({ steps }: ProcessStepProgressBarProps) {\n const totalSteps = steps.length;\n const completedSteps = steps.filter(step => step.status === 'success').length;\n\n return (\n <div className=\"flex w-full flex-col content-center justify-center gap-4\">\n <div className=\"grid w-full grid-cols-[0_repeat(9,1fr)]\">\n {steps.map((step: ProcessStep, idx: number) => {\n return (\n <div\n key={step.id}\n className={cn('relative flex h-8 items-center justify-end', transitions.colors, {\n 'bg-success-subtle': step.status === 'success' && steps?.[idx - 1]?.status === 'success',\n })}\n >\n <div\n className={cn(\n 'absolute right-0 z-10 flex size-8 translate-x-1/2 items-center justify-center self-center rounded-full bg-fill text-column text-muted-foreground motion-reduce:transition-none',\n transitions.colors,\n transitions.transform,\n {\n 'border border-dashed border-placeholder': step.status === 'pending',\n 'scale-110 bg-success-subtle text-success-subtle-foreground': step.status === 'success',\n 'scale-110 bg-destructive-subtle text-destructive-subtle-foreground': step.status === 'failed',\n },\n )}\n >\n {step.status === 'running' ? <Spinner /> : idx + 1}\n </div>\n </div>\n );\n })}\n </div>\n <div className={cn('text-center text-caption text-muted-foreground', transitions.colors)}>\n {completedSteps} of {totalSteps} steps completed\n </div>\n </div>\n );\n}\n"],"names":["jsx","Spinner","CheckIcon","XIcon","cn","transitions","jsxs","Txt"],"mappings":"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"}

package/dist/components/Steps.es.js CHANGED Viewed

@@ -1,6 +1,7 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { XIcon, CheckIcon } from 'lucide-react';
 import { S as Spinner } from '../spinner-ylbE0TJA.js';
+import { T as Txt } from '../Txt-BP1SRHmL.js';
 import { transitions } from '../primitives/transitions.es.js';
 import { c as cn } from '../cn-65Adrsfj.js';
@@ -39,8 +40,8 @@ function StepStatusMarker({ status, variant }) {
       "span",
       {
         className: cn("flex size-4 items-center justify-center self-center [&>svg]:size-4", transitions.colors, {
-          "[&>svg]:text-positive1": status === "success",
-          "[&>svg]:text-negative1": status === "failed"
+          "[&>svg]:text-success-indicator": status === "success",
+          "[&>svg]:text-destructive-indicator": status === "failed"
         }),
         children: status === "pending" ? /* @__PURE__ */ jsx(PendingRing, {}) : getStatusIcon(status)
       }
@@ -54,12 +55,12 @@ function StepStatusMarker({ status, variant }) {
         transitions.colors,
         transitions.transform,
         {
-          "[&>svg]:text-notice-success-fg": status === "success",
-          "[&>svg]:text-notice-destructive-fg": status === "failed",
+          "[&>svg]:text-success-indicator": status === "success",
+          "[&>svg]:text-destructive-indicator": status === "failed",
           "border border-dashed border-placeholder": status === "pending",
           "[&>svg]:size-4": status !== "running",
-          "bg-accent1Dark": status === "success",
-          "bg-accent2Dark": status === "failed",
+          "bg-success-subtle": status === "success",
+          "bg-destructive-subtle": status === "failed",
           "scale-110": status === "success" || status === "failed"
         }
       ),
@@ -68,6 +69,7 @@ function StepStatusMarker({ status, variant }) {
   );
 }
 function ProcessStepListItem({ step, isActive, position, variant = "default" }) {
+  const stepTone = isActive || step.status === "success" ? "ink" : "muted";
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -81,31 +83,13 @@ function ProcessStepListItem({ step, isActive, position, variant = "default" })
       ),
       children: [
         /* @__PURE__ */ jsxs("div", { className: "grid min-w-0 grid-cols-[auto_1fr] gap-2", children: [
-          /* @__PURE__ */ jsxs(
-            "span",
-            {
-              className: cn("flex min-w-6 justify-end text-body", transitions.colors, {
-                "text-foreground": isActive || step.status === "success",
-                "text-muted-foreground": !isActive && step.status !== "success"
-              }),
-              children: [
-                position,
-                "."
-              ]
-            }
-          ),
+          /* @__PURE__ */ jsxs(Txt, { as: "span", tone: stepTone, className: cn("flex min-w-6 justify-end", transitions.colors), children: [
+            position,
+            "."
+          ] }),
           /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
-            /* @__PURE__ */ jsx(
-              "h4",
-              {
-                className: cn("text-body", transitions.colors, {
-                  "text-foreground": isActive || step.status === "success",
-                  "text-muted-foreground": !isActive && step.status !== "success"
-                }),
-                children: step.title
-              }
-            ),
-            step.description && /* @__PURE__ */ jsx("p", { className: cn("-mt-0.5 text-body text-placeholder", { truncate: variant === "plain" }), children: step.description })
+            /* @__PURE__ */ jsx(Txt, { as: "h4", tone: stepTone, className: transitions.colors, children: step.title }),
+            step.description && /* @__PURE__ */ jsx(Txt, { tone: "faint", className: cn("-mt-0.5", { truncate: variant === "plain" }), children: step.description })
           ] })
         ] }),
         /* @__PURE__ */ jsx(StepStatusMarker, { status: step.status, variant })
@@ -127,7 +111,7 @@ function ProcessStepProgressBar({ steps }) {
         "div",
         {
           className: cn("relative flex h-8 items-center justify-end", transitions.colors, {
-            "bg-accent1Dark": step.status === "success" && steps?.[idx - 1]?.status === "success"
+            "bg-success-subtle": step.status === "success" && steps?.[idx - 1]?.status === "success"
           }),
           children: /* @__PURE__ */ jsx(
             "div",
@@ -138,8 +122,8 @@ function ProcessStepProgressBar({ steps }) {
                 transitions.transform,
                 {
                   "border border-dashed border-placeholder": step.status === "pending",
-                  "scale-110 bg-accent1Dark text-notice-success-fg": step.status === "success",
-                  "scale-110 bg-accent2Dark text-notice-destructive-fg": step.status === "failed"
+                  "scale-110 bg-success-subtle text-success-subtle-foreground": step.status === "success",
+                  "scale-110 bg-destructive-subtle text-destructive-subtle-foreground": step.status === "failed"
                 }
               ),
               children: step.status === "running" ? /* @__PURE__ */ jsx(Spinner, {}) : idx + 1

package/dist/components/Steps.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Steps.es.js","sources":["../../src/ds/components/Steps/shared.tsx","../../src/ds/components/Steps/process-step-list-item.tsx","../../src/ds/components/Steps/process-step-list.tsx","../../src/ds/components/Steps/process-step-progress-bar.tsx"],"sourcesContent":["import { CheckIcon, XIcon } from 'lucide-react';\nimport { Spinner } from '@/ds/components/Spinner';\n\nexport function getStatusIcon(status: string) {\n switch (status) {\n case 'running':\n return <Spinner size=\"sm\" aria-hidden />;\n case 'success':\n return <CheckIcon aria-hidden />;\n case 'failed':\n return <XIcon aria-hidden />;\n default:\n return null;\n }\n}\n\nexport type ProcessStep = {\n id: string;\n status: string;\n description: string;\n title: string;\n isActive: boolean;\n};\n","import { getStatusIcon } from './shared';\nimport type { ProcessStep } from './shared';\nimport { transitions } from '@/ds/primitives/transitions';\nimport { cn } from '@/lib/utils';\n\ntype ProcessStepListItemVariant = 'default' \| 'plain';\n\n/** Same ring geometry and stroke as `<Spinner size=\"sm\" />`, so pending and running read as one shape. /\nfunction PendingRing() {\n return (\n <svg viewBox=\"0 0 24 24\" className=\"text-placeholder\" aria-hidden>\n <circle\n cx=\"12\"\n cy=\"12\"\n r=\"8.5\"\n pathLength=\"48\"\n fill=\"none\"\n stroke=\"currentcolor\"\n strokeWidth=\"2.8\"\n strokeLinecap=\"round\"\n strokeDasharray=\"3 3\"\n />\n </svg>\n );\n}\n\nfunction StepStatusMarker({ status, variant }: { status: string; variant: ProcessStepListItemVariant }) {\n if (variant === 'plain') {\n return (\n <span\n className={cn('flex size-4 items-center justify-center self-center [&>svg]:size-4', transitions.colors, {\n '[&>svg]:text-positive1': status === 'success',\n '[&>svg]:text-negative1': status === 'failed',\n })}\n >\n {status === 'pending' ? <PendingRing /> : getStatusIcon(status)}\n </span>\n );\n }\n\n return (\n <span\n className={cn(\n 'flex size-7 items-center justify-center self-center rounded-full motion-reduce:transition-none',\n transitions.colors,\n transitions.transform,\n {\n '[&>svg]:text-notice-success-fg': status === 'success',\n '[&>svg]:text-notice-destructive-fg': status === 'failed',\n 'border border-dashed border-placeholder': status === 'pending',\n '[&>svg]:size-4': status !== 'running',\n 'bg-accent1Dark': status === 'success',\n 'bg-accent2Dark': status === 'failed',\n 'scale-110': status === 'success' \|\| status === 'failed',\n },\n )}\n >\n {getStatusIcon(status)}\n </span>\n );\n}\n\nexport type ProcessStepListItemProps = {\n /* @deprecated Ignored — the heading comes from `step.title`. */\n stepId?: string;\n step: ProcessStep;\n isActive: boolean;\n position: number;\n variant?: ProcessStepListItemVariant;\n};\n\nexport function ProcessStepListItem({ step, isActive, position, variant = 'default' }: ProcessStepListItemProps) {\n return (\n <div\n className={cn(\n 'grid grid-cols-[1fr_auto] gap-6 rounded-lg px-4 py-3 motion-reduce:transition-none',\n transitions.colors,\n {\n 'border border-transparent': variant === 'default',\n 'border-dashed border-placeholder bg-card': isActive && variant === 'default',\n },\n )}\n >\n <div className=\"grid min-w-0 grid-cols-[auto_1fr] gap-2\">\n <span\n className={cn('flex min-w-6 justify-end text-body', transitions.colors, {\n 'text-foreground': isActive \|\| step.status === 'success',\n 'text-muted-foreground': !isActive && step.status !== 'success',\n })}\n >\n {position}.\n </span>\n <div className=\"min-w-0\">\n <h4\n className={cn('text-body', transitions.colors, {\n 'text-foreground': isActive \|\| step.status === 'success',\n 'text-muted-foreground': !isActive && step.status !== 'success',\n })}\n >\n {step.title}\n </h4>\n {step.description && (\n <p className={cn('-mt-0.5 text-body text-placeholder', { truncate: variant === 'plain' })}>\n {step.description}\n </p>\n )}\n </div>\n </div>\n <StepStatusMarker status={step.status} variant={variant} />\n </div>\n );\n}\n","import { ProcessStepListItem } from './process-step-list-item';\nimport type { ProcessStep } from './shared';\nimport { cn } from '@/lib/utils';\n\nexport type ProcessStepListProps = {\n currentStep: ProcessStep \| null;\n steps: ProcessStep[];\n className?: string;\n};\n\nexport function ProcessStepList({ currentStep, steps = [], className }: ProcessStepListProps) {\n return (\n <div className={cn(className)}>\n {steps.map((step: ProcessStep, idx: number) => (\n <ProcessStepListItem key={step.id} step={step} isActive={currentStep?.id === step.id} position={idx + 1} />\n ))}\n </div>\n );\n}\n","import type { ProcessStep } from './shared';\nimport { Spinner } from '@/ds/components/Spinner';\nimport { transitions } from '@/ds/primitives/transitions';\nimport { cn } from '@/lib/utils';\n\nexport type ProcessStepProgressBarProps = {\n steps: ProcessStep[];\n};\n\nexport function ProcessStepProgressBar({ steps }: ProcessStepProgressBarProps) {\n const totalSteps = steps.length;\n const completedSteps = steps.filter(step => step.status === 'success').length;\n\n return (\n <div className=\"flex w-full flex-col content-center justify-center gap-4\">\n <div className=\"grid w-full grid-cols-[0_repeat(9,1fr)]\">\n {steps.map((step: ProcessStep, idx: number) => {\n return (\n <div\n key={step.id}\n className={cn('relative flex h-8 items-center justify-end', transitions.colors, {\n 'bg-accent1Dark': step.status === 'success' && steps?.[idx - 1]?.status === 'success',\n })}\n >\n <div\n className={cn(\n 'absolute right-0 z-10 flex size-8 translate-x-1/2 items-center justify-center self-center rounded-full bg-fill text-column text-muted-foreground motion-reduce:transition-none',\n transitions.colors,\n transitions.transform,\n {\n 'border border-dashed border-placeholder': step.status === 'pending',\n 'scale-110 bg-accent1Dark text-notice-success-fg': step.status === 'success',\n 'scale-110 bg-accent2Dark text-notice-destructive-fg': step.status === 'failed',\n },\n )}\n >\n {step.status === 'running' ? <Spinner /> : idx + 1}\n </div>\n </div>\n );\n })}\n </div>\n <div className={cn('text-center text-caption text-muted-foreground', transitions.colors)}>\n {completedSteps} of {totalSteps} steps completed\n </div>\n </div>\n );\n}\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"Steps.es.js","sources":["../../src/ds/components/Steps/shared.tsx","../../src/ds/components/Steps/process-step-list-item.tsx","../../src/ds/components/Steps/process-step-list.tsx","../../src/ds/components/Steps/process-step-progress-bar.tsx"],"sourcesContent":["import { CheckIcon, XIcon } from 'lucide-react';\nimport { Spinner } from '@/ds/components/Spinner';\n\nexport function getStatusIcon(status: string) {\n switch (status) {\n case 'running':\n return <Spinner size=\"sm\" aria-hidden />;\n case 'success':\n return <CheckIcon aria-hidden />;\n case 'failed':\n return <XIcon aria-hidden />;\n default:\n return null;\n }\n}\n\nexport type ProcessStep = {\n id: string;\n status: string;\n description: string;\n title: string;\n isActive: boolean;\n};\n","import { getStatusIcon } from './shared';\nimport type { ProcessStep } from './shared';\nimport { Txt } from '@/ds/components/Txt';\nimport { transitions } from '@/ds/primitives/transitions';\nimport { cn } from '@/lib/utils';\n\ntype ProcessStepListItemVariant = 'default' \| 'plain';\n\n/** Same ring geometry and stroke as `<Spinner size=\"sm\" />`, so pending and running read as one shape. /\nfunction PendingRing() {\n return (\n <svg viewBox=\"0 0 24 24\" className=\"text-placeholder\" aria-hidden>\n <circle\n cx=\"12\"\n cy=\"12\"\n r=\"8.5\"\n pathLength=\"48\"\n fill=\"none\"\n stroke=\"currentcolor\"\n strokeWidth=\"2.8\"\n strokeLinecap=\"round\"\n strokeDasharray=\"3 3\"\n />\n </svg>\n );\n}\n\nfunction StepStatusMarker({ status, variant }: { status: string; variant: ProcessStepListItemVariant }) {\n if (variant === 'plain') {\n return (\n <span\n className={cn('flex size-4 items-center justify-center self-center [&>svg]:size-4', transitions.colors, {\n '[&>svg]:text-success-indicator': status === 'success',\n '[&>svg]:text-destructive-indicator': status === 'failed',\n })}\n >\n {status === 'pending' ? <PendingRing /> : getStatusIcon(status)}\n </span>\n );\n }\n\n return (\n <span\n className={cn(\n 'flex size-7 items-center justify-center self-center rounded-full motion-reduce:transition-none',\n transitions.colors,\n transitions.transform,\n {\n '[&>svg]:text-success-indicator': status === 'success',\n '[&>svg]:text-destructive-indicator': status === 'failed',\n 'border border-dashed border-placeholder': status === 'pending',\n '[&>svg]:size-4': status !== 'running',\n 'bg-success-subtle': status === 'success',\n 'bg-destructive-subtle': status === 'failed',\n 'scale-110': status === 'success' \|\| status === 'failed',\n },\n )}\n >\n {getStatusIcon(status)}\n </span>\n );\n}\n\nexport type ProcessStepListItemProps = {\n /* @deprecated Ignored — the heading comes from `step.title`. */\n stepId?: string;\n step: ProcessStep;\n isActive: boolean;\n position: number;\n variant?: ProcessStepListItemVariant;\n};\n\nexport function ProcessStepListItem({ step, isActive, position, variant = 'default' }: ProcessStepListItemProps) {\n const stepTone = isActive \|\| step.status === 'success' ? 'ink' : 'muted';\n\n return (\n <div\n className={cn(\n 'grid grid-cols-[1fr_auto] gap-6 rounded-lg px-4 py-3 motion-reduce:transition-none',\n transitions.colors,\n {\n 'border border-transparent': variant === 'default',\n 'border-dashed border-placeholder bg-card': isActive && variant === 'default',\n },\n )}\n >\n <div className=\"grid min-w-0 grid-cols-[auto_1fr] gap-2\">\n <Txt as=\"span\" tone={stepTone} className={cn('flex min-w-6 justify-end', transitions.colors)}>\n {position}.\n </Txt>\n <div className=\"min-w-0\">\n <Txt as=\"h4\" tone={stepTone} className={transitions.colors}>\n {step.title}\n </Txt>\n {step.description && (\n <Txt tone=\"faint\" className={cn('-mt-0.5', { truncate: variant === 'plain' })}>\n {step.description}\n </Txt>\n )}\n </div>\n </div>\n <StepStatusMarker status={step.status} variant={variant} />\n </div>\n );\n}\n","import { ProcessStepListItem } from './process-step-list-item';\nimport type { ProcessStep } from './shared';\nimport { cn } from '@/lib/utils';\n\nexport type ProcessStepListProps = {\n currentStep: ProcessStep \| null;\n steps: ProcessStep[];\n className?: string;\n};\n\nexport function ProcessStepList({ currentStep, steps = [], className }: ProcessStepListProps) {\n return (\n <div className={cn(className)}>\n {steps.map((step: ProcessStep, idx: number) => (\n <ProcessStepListItem key={step.id} step={step} isActive={currentStep?.id === step.id} position={idx + 1} />\n ))}\n </div>\n );\n}\n","import type { ProcessStep } from './shared';\nimport { Spinner } from '@/ds/components/Spinner';\nimport { transitions } from '@/ds/primitives/transitions';\nimport { cn } from '@/lib/utils';\n\nexport type ProcessStepProgressBarProps = {\n steps: ProcessStep[];\n};\n\nexport function ProcessStepProgressBar({ steps }: ProcessStepProgressBarProps) {\n const totalSteps = steps.length;\n const completedSteps = steps.filter(step => step.status === 'success').length;\n\n return (\n <div className=\"flex w-full flex-col content-center justify-center gap-4\">\n <div className=\"grid w-full grid-cols-[0_repeat(9,1fr)]\">\n {steps.map((step: ProcessStep, idx: number) => {\n return (\n <div\n key={step.id}\n className={cn('relative flex h-8 items-center justify-end', transitions.colors, {\n 'bg-success-subtle': step.status === 'success' && steps?.[idx - 1]?.status === 'success',\n })}\n >\n <div\n className={cn(\n 'absolute right-0 z-10 flex size-8 translate-x-1/2 items-center justify-center self-center rounded-full bg-fill text-column text-muted-foreground motion-reduce:transition-none',\n transitions.colors,\n transitions.transform,\n {\n 'border border-dashed border-placeholder': step.status === 'pending',\n 'scale-110 bg-success-subtle text-success-subtle-foreground': step.status === 'success',\n 'scale-110 bg-destructive-subtle text-destructive-subtle-foreground': step.status === 'failed',\n },\n )}\n >\n {step.status === 'running' ? <Spinner /> : idx + 1}\n </div>\n </div>\n );\n })}\n </div>\n <div className={cn('text-center text-caption text-muted-foreground', transitions.colors)}>\n {completedSteps} of {totalSteps} steps completed\n </div>\n </div>\n );\n}\n"],"names":[],"mappings":"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"}

package/dist/components/Switch.cjs.js CHANGED Viewed

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-const _switch = require('../switch-6125Oajw.cjs');
+const _switch = require('../switch-Swt75_Sb.cjs');

package/dist/components/Switch.es.js CHANGED Viewed

@@ -1,2 +1,2 @@
-export { S as Switch } from '../switch-CE9jTpUG.js';
+export { S as Switch } from '../switch-88fWFfVz.js';
 //# sourceMappingURL=Switch.es.js.map

package/dist/components/Table.cjs.js CHANGED Viewed

@@ -4,6 +4,7 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 const jsxRuntime = require('react/jsx-runtime');
 const React = require('react');
+const primitives_transitions = require('../primitives/transitions.cjs.js');
 const utils_cn = require('../cn-DG0X1KEP.cjs');
 const icons_Icon = require('../icons/Icon.cjs.js');
 const Txt = require('../Txt-DPmEpNbp.cjs');
@@ -65,8 +66,8 @@ const Row = React.forwardRef(
           // Smooth hover transition
           "transition-colors duration-normal ease-out-custom",
           "hover:bg-fill-subtle",
-          // Focus state
-          "focus:bg-fill-subtle focus:ring-1 focus:ring-accent1/50 focus:outline-hidden focus:ring-inset",
+          "focus:bg-fill-subtle",
+          primitives_transitions.focusRingInset,
           selected && "bg-fill-hover",
           onClick && "cursor-pointer",
           className

package/dist/components/Table.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Table.cjs.js","sources":["../../src/ds/components/Table/Table.tsx","../../src/ds/components/Table/Cells.tsx","../../src/ds/components/Table/use-table-keyboard-navigation.ts"],"sourcesContent":["import type { CSSProperties, HTMLAttributes, ReactNode, ThHTMLAttributes } from 'react';\nimport { forwardRef, useEffect, useRef } from 'react';\nimport { cn } from '@/lib/utils';\n\nexport interface TableProps {\n className?: string;\n children: ReactNode;\n size?: 'default' \| 'small';\n style?: CSSProperties;\n}\n\nconst rowSize = {\n default: '[&>tbody>tr]:h-table-row',\n small: '[&>tbody>tr]:h-table-row-small',\n};\n\nexport const Table = ({ className, children, size = 'default', style }: TableProps) => {\n return (\n <table className={cn('w-full', rowSize[size], className)} style={style}>\n {children}\n </table>\n );\n};\n\nexport interface TheadProps {\n className?: string;\n children: ReactNode;\n}\n\nexport const Thead = ({ className, children }: TheadProps) => {\n return (\n <thead>\n <tr className={cn('h-table-header border-b border-border bg-card', className)}>{children}</tr>\n </thead>\n );\n};\n\nexport interface ThProps extends ThHTMLAttributes<HTMLTableCellElement> {\n className?: string;\n style?: CSSProperties;\n children: ReactNode;\n}\n\nexport const Th = ({ className, children, ...props }: ThProps) => {\n return (\n <th\n className={cn(\n 'h-full text-left text-meta tracking-wide whitespace-nowrap text-placeholder uppercase first:pl-3 last:pr-3',\n className,\n )}\n {...props}\n >\n {children}\n </th>\n );\n};\n\nexport interface TbodyProps extends HTMLAttributes<HTMLTableSectionElement> {\n className?: string;\n children: ReactNode;\n}\n\nexport const Tbody = ({ className, children, ...props }: TbodyProps) => {\n return (\n <tbody className={cn('', className)} {...props}>\n {children}\n </tbody>\n );\n};\n\nexport interface RowProps {\n className?: string;\n children: ReactNode;\n selected?: boolean;\n style?: CSSProperties;\n onClick?: () => void;\n tabIndex?: number;\n /** When true, row receives focus and scrolls into view /\n isActive?: boolean;\n}\n\nexport const Row = forwardRef<HTMLTableRowElement, RowProps>(\n ({ className, children, selected = false, style, onClick, isActive = false, ...props }, ref) => {\n const internalRef = useRef<HTMLTableRowElement>(null);\n\n // Merge forwarded ref with internal ref\n useEffect(() => {\n if (!ref) return;\n if (typeof ref === 'function') {\n ref(internalRef.current);\n } else {\n ref.current = internalRef.current;\n }\n }, [ref]);\n\n // Focus and scroll into view when active\n useEffect(() => {\n if (isActive && internalRef.current) {\n internalRef.current.focus();\n internalRef.current.scrollIntoView({ block: 'nearest' });\n }\n }, [isActive]);\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLTableRowElement>) => {\n if (event.key === 'Enter' && onClick) {\n onClick();\n }\n };\n\n return (\n <tr\n className={cn(\n 'border-b border-border',\n // Smooth hover transition\n 'transition-colors duration-normal ease-out-custom',\n 'hover:bg-fill-subtle',\n // Focus state\n 'focus:bg-fill-subtle focus:ring-1 focus:ring-accent1/50 focus:outline-hidden focus:ring-inset',\n selected && 'bg-fill-hover',\n onClick && 'cursor-pointer',\n className,\n )}\n style={style}\n onClick={onClick}\n ref={internalRef}\n tabIndex={onClick ? 0 : undefined}\n onKeyDown={handleKeyDown}\n data-active={isActive \|\| undefined}\n {...props}\n >\n {children}\n </tr>\n );\n },\n);\n","import React from 'react';\n\nimport { Icon } from '../../icons/Icon';\nimport { Txt } from '../Txt';\nimport { cn } from '@/lib/utils';\nimport { formatDate } from '@/utils/date-format';\n\nexport interface CellProps extends React.TdHTMLAttributes<HTMLTableCellElement> {\n className?: string;\n children: React.ReactNode;\n}\n\nexport const Cell = ({ className, children, ...props }: CellProps) => {\n return (\n <td className={cn('text-foreground first:pl-3 last:pr-3', className)} {...props}>\n <div className={cn('flex size-full shrink-0 items-center')}>{children}</div>\n </td>\n );\n};\n\nexport const TxtCell = ({ className, children }: CellProps) => {\n return (\n <Cell className={className}>\n <Txt as=\"span\" variant=\"body-sm\" className=\"w-full truncate\">\n {children}\n </Txt>\n </Cell>\n );\n};\n\nexport interface DateTimeCellProps extends Omit<CellProps, 'children'> {\n dateTime: Date;\n}\n\nexport const DateTimeCell = ({ dateTime, ...props }: DateTimeCellProps) => {\n return (\n <Cell {...props}>\n <Txt as=\"span\" variant=\"body\" className=\"shrink-0\">\n {formatDate(dateTime, 'date-time-seconds')}\n </Txt>\n </Cell>\n );\n};\n\nexport interface EntryCellProps extends Omit<CellProps, 'children'> {\n name: React.ReactNode;\n description?: React.ReactNode;\n icon?: React.ReactNode;\n meta?: React.ReactNode;\n}\n\nexport const EntryCell = ({ name, description, icon, meta, ...props }: EntryCellProps) => {\n return (\n <Cell {...props}>\n <div className=\"flex items-center gap-3.5\">\n {icon && (\n <Icon size=\"lg\" className=\"text-foreground\">\n {icon}\n </Icon>\n )}\n\n <div className=\"flex flex-col gap-0\">\n <Txt as=\"span\" variant=\"body\" tone=\"ink\">\n {name}\n </Txt>\n {description && (\n <Txt as=\"span\" variant=\"meta\" tone=\"muted\" className=\"w-full max-w-75 truncate pt-1\">\n {description}\n </Txt>\n )}\n </div>\n {meta}\n </div>\n </Cell>\n );\n};\n","import { useState, useCallback, useEffect } from 'react';\n\nexport interface UseTableKeyboardNavigationOptions {\n /* Number of items in the list /\n itemCount: number;\n /* Initial active index (-1 = none) /\n initialIndex?: number;\n /* Wrap around at boundaries /\n wrap?: boolean;\n /* Callback when Enter pressed on active row /\n onSelect?: (index: number) => void;\n /* When true, registers keyboard handlers globally on the document /\n global?: boolean;\n}\n\nexport interface UseTableKeyboardNavigationReturn {\n /* Currently active index (-1 if none) /\n activeIndex: number;\n /* Set active index programmatically /\n setActiveIndex: React.Dispatch<React.SetStateAction<number>>;\n /* Returns props to spread on the Tbody element. Returns null when global is true. */\n getKeyboardProps: () => { onKeyDown: (e: React.KeyboardEvent) => void; tabIndex: number } \| null;\n}\n\nexport function useTableKeyboardNavigation({\n itemCount,\n initialIndex = -1,\n wrap = false,\n onSelect,\n global = false,\n}: UseTableKeyboardNavigationOptions): UseTableKeyboardNavigationReturn {\n const [activeIndex, setActiveIndex] = useState(initialIndex);\n\n const handleKeyDown = useCallback(\n (e: KeyboardEvent \| React.KeyboardEvent) => {\n // No-op for empty list\n if (itemCount === 0) return;\n\n switch (e.key) {\n case 'ArrowDown': {\n e.preventDefault();\n setActiveIndex(prev => {\n if (prev === -1) return 0;\n if (prev >= itemCount - 1) {\n return wrap ? 0 : itemCount - 1;\n }\n return prev + 1;\n });\n break;\n }\n case 'ArrowUp': {\n e.preventDefault();\n setActiveIndex(prev => {\n if (prev === -1) return itemCount - 1;\n if (prev <= 0) {\n return wrap ? itemCount - 1 : 0;\n }\n return prev - 1;\n });\n break;\n }\n case 'Home': {\n e.preventDefault();\n setActiveIndex(0);\n break;\n }\n case 'End': {\n e.preventDefault();\n setActiveIndex(itemCount - 1);\n break;\n }\n case 'Enter': {\n if (activeIndex >= 0 && onSelect) {\n e.preventDefault();\n onSelect(activeIndex);\n }\n break;\n }\n }\n },\n [itemCount, wrap, activeIndex, onSelect],\n );\n\n // Register global keyboard handlers when global option is enabled\n useEffect(() => {\n if (!global) return;\n\n document.addEventListener('keydown', handleKeyDown);\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n };\n }, [global, handleKeyDown]);\n\n const getKeyboardProps = useCallback(() => {\n if (global) return null;\n return { onKeyDown: handleKeyDown as (e: React.KeyboardEvent) => void, tabIndex: 0 };\n }, [global, handleKeyDown]);\n\n return {\n activeIndex,\n setActiveIndex,\n getKeyboardProps,\n };\n}\n"],"names":["jsx","cn","forwardRef","useRef","useEffect","Txt","formatDate","jsxs","Icon","useState","useCallback"],"mappings":"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"}
1	+ {"version":3,"file":"Table.cjs.js","sources":["../../src/ds/components/Table/Table.tsx","../../src/ds/components/Table/Cells.tsx","../../src/ds/components/Table/use-table-keyboard-navigation.ts"],"sourcesContent":["import type { CSSProperties, HTMLAttributes, ReactNode, ThHTMLAttributes } from 'react';\nimport { forwardRef, useEffect, useRef } from 'react';\nimport { focusRingInset } from '@/ds/primitives/transitions';\nimport { cn } from '@/lib/utils';\n\nexport interface TableProps {\n className?: string;\n children: ReactNode;\n size?: 'default' \| 'small';\n style?: CSSProperties;\n}\n\nconst rowSize = {\n default: '[&>tbody>tr]:h-table-row',\n small: '[&>tbody>tr]:h-table-row-small',\n};\n\nexport const Table = ({ className, children, size = 'default', style }: TableProps) => {\n return (\n <table className={cn('w-full', rowSize[size], className)} style={style}>\n {children}\n </table>\n );\n};\n\nexport interface TheadProps {\n className?: string;\n children: ReactNode;\n}\n\nexport const Thead = ({ className, children }: TheadProps) => {\n return (\n <thead>\n <tr className={cn('h-table-header border-b border-border bg-card', className)}>{children}</tr>\n </thead>\n );\n};\n\nexport interface ThProps extends ThHTMLAttributes<HTMLTableCellElement> {\n className?: string;\n style?: CSSProperties;\n children: ReactNode;\n}\n\nexport const Th = ({ className, children, ...props }: ThProps) => {\n return (\n <th\n className={cn(\n 'h-full text-left text-meta tracking-wide whitespace-nowrap text-placeholder uppercase first:pl-3 last:pr-3',\n className,\n )}\n {...props}\n >\n {children}\n </th>\n );\n};\n\nexport interface TbodyProps extends HTMLAttributes<HTMLTableSectionElement> {\n className?: string;\n children: ReactNode;\n}\n\nexport const Tbody = ({ className, children, ...props }: TbodyProps) => {\n return (\n <tbody className={cn('', className)} {...props}>\n {children}\n </tbody>\n );\n};\n\nexport interface RowProps {\n className?: string;\n children: ReactNode;\n selected?: boolean;\n style?: CSSProperties;\n onClick?: () => void;\n tabIndex?: number;\n /** When true, row receives focus and scrolls into view /\n isActive?: boolean;\n}\n\nexport const Row = forwardRef<HTMLTableRowElement, RowProps>(\n ({ className, children, selected = false, style, onClick, isActive = false, ...props }, ref) => {\n const internalRef = useRef<HTMLTableRowElement>(null);\n\n // Merge forwarded ref with internal ref\n useEffect(() => {\n if (!ref) return;\n if (typeof ref === 'function') {\n ref(internalRef.current);\n } else {\n ref.current = internalRef.current;\n }\n }, [ref]);\n\n // Focus and scroll into view when active\n useEffect(() => {\n if (isActive && internalRef.current) {\n internalRef.current.focus();\n internalRef.current.scrollIntoView({ block: 'nearest' });\n }\n }, [isActive]);\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLTableRowElement>) => {\n if (event.key === 'Enter' && onClick) {\n onClick();\n }\n };\n\n return (\n <tr\n className={cn(\n 'border-b border-border',\n // Smooth hover transition\n 'transition-colors duration-normal ease-out-custom',\n 'hover:bg-fill-subtle',\n 'focus:bg-fill-subtle',\n focusRingInset,\n selected && 'bg-fill-hover',\n onClick && 'cursor-pointer',\n className,\n )}\n style={style}\n onClick={onClick}\n ref={internalRef}\n tabIndex={onClick ? 0 : undefined}\n onKeyDown={handleKeyDown}\n data-active={isActive \|\| undefined}\n {...props}\n >\n {children}\n </tr>\n );\n },\n);\n","import React from 'react';\n\nimport { Icon } from '../../icons/Icon';\nimport { Txt } from '../Txt';\nimport { cn } from '@/lib/utils';\nimport { formatDate } from '@/utils/date-format';\n\nexport interface CellProps extends React.TdHTMLAttributes<HTMLTableCellElement> {\n className?: string;\n children: React.ReactNode;\n}\n\nexport const Cell = ({ className, children, ...props }: CellProps) => {\n return (\n <td className={cn('text-foreground first:pl-3 last:pr-3', className)} {...props}>\n <div className={cn('flex size-full shrink-0 items-center')}>{children}</div>\n </td>\n );\n};\n\nexport const TxtCell = ({ className, children }: CellProps) => {\n return (\n <Cell className={className}>\n <Txt as=\"span\" variant=\"body-sm\" className=\"w-full truncate\">\n {children}\n </Txt>\n </Cell>\n );\n};\n\nexport interface DateTimeCellProps extends Omit<CellProps, 'children'> {\n dateTime: Date;\n}\n\nexport const DateTimeCell = ({ dateTime, ...props }: DateTimeCellProps) => {\n return (\n <Cell {...props}>\n <Txt as=\"span\" variant=\"body\" className=\"shrink-0\">\n {formatDate(dateTime, 'date-time-seconds')}\n </Txt>\n </Cell>\n );\n};\n\nexport interface EntryCellProps extends Omit<CellProps, 'children'> {\n name: React.ReactNode;\n description?: React.ReactNode;\n icon?: React.ReactNode;\n meta?: React.ReactNode;\n}\n\nexport const EntryCell = ({ name, description, icon, meta, ...props }: EntryCellProps) => {\n return (\n <Cell {...props}>\n <div className=\"flex items-center gap-3.5\">\n {icon && (\n <Icon size=\"lg\" className=\"text-foreground\">\n {icon}\n </Icon>\n )}\n\n <div className=\"flex flex-col gap-0\">\n <Txt as=\"span\" variant=\"body\" tone=\"ink\">\n {name}\n </Txt>\n {description && (\n <Txt as=\"span\" variant=\"meta\" tone=\"muted\" className=\"w-full max-w-75 truncate pt-1\">\n {description}\n </Txt>\n )}\n </div>\n {meta}\n </div>\n </Cell>\n );\n};\n","import { useState, useCallback, useEffect } from 'react';\n\nexport interface UseTableKeyboardNavigationOptions {\n /* Number of items in the list /\n itemCount: number;\n /* Initial active index (-1 = none) /\n initialIndex?: number;\n /* Wrap around at boundaries /\n wrap?: boolean;\n /* Callback when Enter pressed on active row /\n onSelect?: (index: number) => void;\n /* When true, registers keyboard handlers globally on the document /\n global?: boolean;\n}\n\nexport interface UseTableKeyboardNavigationReturn {\n /* Currently active index (-1 if none) /\n activeIndex: number;\n /* Set active index programmatically /\n setActiveIndex: React.Dispatch<React.SetStateAction<number>>;\n /* Returns props to spread on the Tbody element. Returns null when global is true. */\n getKeyboardProps: () => { onKeyDown: (e: React.KeyboardEvent) => void; tabIndex: number } \| null;\n}\n\nexport function useTableKeyboardNavigation({\n itemCount,\n initialIndex = -1,\n wrap = false,\n onSelect,\n global = false,\n}: UseTableKeyboardNavigationOptions): UseTableKeyboardNavigationReturn {\n const [activeIndex, setActiveIndex] = useState(initialIndex);\n\n const handleKeyDown = useCallback(\n (e: KeyboardEvent \| React.KeyboardEvent) => {\n // No-op for empty list\n if (itemCount === 0) return;\n\n switch (e.key) {\n case 'ArrowDown': {\n e.preventDefault();\n setActiveIndex(prev => {\n if (prev === -1) return 0;\n if (prev >= itemCount - 1) {\n return wrap ? 0 : itemCount - 1;\n }\n return prev + 1;\n });\n break;\n }\n case 'ArrowUp': {\n e.preventDefault();\n setActiveIndex(prev => {\n if (prev === -1) return itemCount - 1;\n if (prev <= 0) {\n return wrap ? itemCount - 1 : 0;\n }\n return prev - 1;\n });\n break;\n }\n case 'Home': {\n e.preventDefault();\n setActiveIndex(0);\n break;\n }\n case 'End': {\n e.preventDefault();\n setActiveIndex(itemCount - 1);\n break;\n }\n case 'Enter': {\n if (activeIndex >= 0 && onSelect) {\n e.preventDefault();\n onSelect(activeIndex);\n }\n break;\n }\n }\n },\n [itemCount, wrap, activeIndex, onSelect],\n );\n\n // Register global keyboard handlers when global option is enabled\n useEffect(() => {\n if (!global) return;\n\n document.addEventListener('keydown', handleKeyDown);\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n };\n }, [global, handleKeyDown]);\n\n const getKeyboardProps = useCallback(() => {\n if (global) return null;\n return { onKeyDown: handleKeyDown as (e: React.KeyboardEvent) => void, tabIndex: 0 };\n }, [global, handleKeyDown]);\n\n return {\n activeIndex,\n setActiveIndex,\n getKeyboardProps,\n };\n}\n"],"names":["jsx","cn","forwardRef","useRef","useEffect","focusRingInset","Txt","formatDate","jsxs","Icon","useState","useCallback"],"mappings":"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"}

package/dist/components/Table.es.js CHANGED Viewed

@@ -1,5 +1,6 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { forwardRef, useRef, useEffect, useState, useCallback } from 'react';
+import { focusRingInset } from '../primitives/transitions.es.js';
 import { c as cn } from '../cn-65Adrsfj.js';
 import { Icon } from '../icons/Icon.es.js';
 import { T as Txt } from '../Txt-BP1SRHmL.js';
@@ -61,8 +62,8 @@ const Row = forwardRef(
           // Smooth hover transition
           "transition-colors duration-normal ease-out-custom",
           "hover:bg-fill-subtle",
-          // Focus state
-          "focus:bg-fill-subtle focus:ring-1 focus:ring-accent1/50 focus:outline-hidden focus:ring-inset",
+          "focus:bg-fill-subtle",
+          focusRingInset,
           selected && "bg-fill-hover",
           onClick && "cursor-pointer",
           className

package/dist/components/Table.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Table.es.js","sources":["../../src/ds/components/Table/Table.tsx","../../src/ds/components/Table/Cells.tsx","../../src/ds/components/Table/use-table-keyboard-navigation.ts"],"sourcesContent":["import type { CSSProperties, HTMLAttributes, ReactNode, ThHTMLAttributes } from 'react';\nimport { forwardRef, useEffect, useRef } from 'react';\nimport { cn } from '@/lib/utils';\n\nexport interface TableProps {\n className?: string;\n children: ReactNode;\n size?: 'default' \| 'small';\n style?: CSSProperties;\n}\n\nconst rowSize = {\n default: '[&>tbody>tr]:h-table-row',\n small: '[&>tbody>tr]:h-table-row-small',\n};\n\nexport const Table = ({ className, children, size = 'default', style }: TableProps) => {\n return (\n <table className={cn('w-full', rowSize[size], className)} style={style}>\n {children}\n </table>\n );\n};\n\nexport interface TheadProps {\n className?: string;\n children: ReactNode;\n}\n\nexport const Thead = ({ className, children }: TheadProps) => {\n return (\n <thead>\n <tr className={cn('h-table-header border-b border-border bg-card', className)}>{children}</tr>\n </thead>\n );\n};\n\nexport interface ThProps extends ThHTMLAttributes<HTMLTableCellElement> {\n className?: string;\n style?: CSSProperties;\n children: ReactNode;\n}\n\nexport const Th = ({ className, children, ...props }: ThProps) => {\n return (\n <th\n className={cn(\n 'h-full text-left text-meta tracking-wide whitespace-nowrap text-placeholder uppercase first:pl-3 last:pr-3',\n className,\n )}\n {...props}\n >\n {children}\n </th>\n );\n};\n\nexport interface TbodyProps extends HTMLAttributes<HTMLTableSectionElement> {\n className?: string;\n children: ReactNode;\n}\n\nexport const Tbody = ({ className, children, ...props }: TbodyProps) => {\n return (\n <tbody className={cn('', className)} {...props}>\n {children}\n </tbody>\n );\n};\n\nexport interface RowProps {\n className?: string;\n children: ReactNode;\n selected?: boolean;\n style?: CSSProperties;\n onClick?: () => void;\n tabIndex?: number;\n /** When true, row receives focus and scrolls into view /\n isActive?: boolean;\n}\n\nexport const Row = forwardRef<HTMLTableRowElement, RowProps>(\n ({ className, children, selected = false, style, onClick, isActive = false, ...props }, ref) => {\n const internalRef = useRef<HTMLTableRowElement>(null);\n\n // Merge forwarded ref with internal ref\n useEffect(() => {\n if (!ref) return;\n if (typeof ref === 'function') {\n ref(internalRef.current);\n } else {\n ref.current = internalRef.current;\n }\n }, [ref]);\n\n // Focus and scroll into view when active\n useEffect(() => {\n if (isActive && internalRef.current) {\n internalRef.current.focus();\n internalRef.current.scrollIntoView({ block: 'nearest' });\n }\n }, [isActive]);\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLTableRowElement>) => {\n if (event.key === 'Enter' && onClick) {\n onClick();\n }\n };\n\n return (\n <tr\n className={cn(\n 'border-b border-border',\n // Smooth hover transition\n 'transition-colors duration-normal ease-out-custom',\n 'hover:bg-fill-subtle',\n // Focus state\n 'focus:bg-fill-subtle focus:ring-1 focus:ring-accent1/50 focus:outline-hidden focus:ring-inset',\n selected && 'bg-fill-hover',\n onClick && 'cursor-pointer',\n className,\n )}\n style={style}\n onClick={onClick}\n ref={internalRef}\n tabIndex={onClick ? 0 : undefined}\n onKeyDown={handleKeyDown}\n data-active={isActive \|\| undefined}\n {...props}\n >\n {children}\n </tr>\n );\n },\n);\n","import React from 'react';\n\nimport { Icon } from '../../icons/Icon';\nimport { Txt } from '../Txt';\nimport { cn } from '@/lib/utils';\nimport { formatDate } from '@/utils/date-format';\n\nexport interface CellProps extends React.TdHTMLAttributes<HTMLTableCellElement> {\n className?: string;\n children: React.ReactNode;\n}\n\nexport const Cell = ({ className, children, ...props }: CellProps) => {\n return (\n <td className={cn('text-foreground first:pl-3 last:pr-3', className)} {...props}>\n <div className={cn('flex size-full shrink-0 items-center')}>{children}</div>\n </td>\n );\n};\n\nexport const TxtCell = ({ className, children }: CellProps) => {\n return (\n <Cell className={className}>\n <Txt as=\"span\" variant=\"body-sm\" className=\"w-full truncate\">\n {children}\n </Txt>\n </Cell>\n );\n};\n\nexport interface DateTimeCellProps extends Omit<CellProps, 'children'> {\n dateTime: Date;\n}\n\nexport const DateTimeCell = ({ dateTime, ...props }: DateTimeCellProps) => {\n return (\n <Cell {...props}>\n <Txt as=\"span\" variant=\"body\" className=\"shrink-0\">\n {formatDate(dateTime, 'date-time-seconds')}\n </Txt>\n </Cell>\n );\n};\n\nexport interface EntryCellProps extends Omit<CellProps, 'children'> {\n name: React.ReactNode;\n description?: React.ReactNode;\n icon?: React.ReactNode;\n meta?: React.ReactNode;\n}\n\nexport const EntryCell = ({ name, description, icon, meta, ...props }: EntryCellProps) => {\n return (\n <Cell {...props}>\n <div className=\"flex items-center gap-3.5\">\n {icon && (\n <Icon size=\"lg\" className=\"text-foreground\">\n {icon}\n </Icon>\n )}\n\n <div className=\"flex flex-col gap-0\">\n <Txt as=\"span\" variant=\"body\" tone=\"ink\">\n {name}\n </Txt>\n {description && (\n <Txt as=\"span\" variant=\"meta\" tone=\"muted\" className=\"w-full max-w-75 truncate pt-1\">\n {description}\n </Txt>\n )}\n </div>\n {meta}\n </div>\n </Cell>\n );\n};\n","import { useState, useCallback, useEffect } from 'react';\n\nexport interface UseTableKeyboardNavigationOptions {\n /* Number of items in the list /\n itemCount: number;\n /* Initial active index (-1 = none) /\n initialIndex?: number;\n /* Wrap around at boundaries /\n wrap?: boolean;\n /* Callback when Enter pressed on active row /\n onSelect?: (index: number) => void;\n /* When true, registers keyboard handlers globally on the document /\n global?: boolean;\n}\n\nexport interface UseTableKeyboardNavigationReturn {\n /* Currently active index (-1 if none) /\n activeIndex: number;\n /* Set active index programmatically /\n setActiveIndex: React.Dispatch<React.SetStateAction<number>>;\n /* Returns props to spread on the Tbody element. Returns null when global is true. */\n getKeyboardProps: () => { onKeyDown: (e: React.KeyboardEvent) => void; tabIndex: number } \| null;\n}\n\nexport function useTableKeyboardNavigation({\n itemCount,\n initialIndex = -1,\n wrap = false,\n onSelect,\n global = false,\n}: UseTableKeyboardNavigationOptions): UseTableKeyboardNavigationReturn {\n const [activeIndex, setActiveIndex] = useState(initialIndex);\n\n const handleKeyDown = useCallback(\n (e: KeyboardEvent \| React.KeyboardEvent) => {\n // No-op for empty list\n if (itemCount === 0) return;\n\n switch (e.key) {\n case 'ArrowDown': {\n e.preventDefault();\n setActiveIndex(prev => {\n if (prev === -1) return 0;\n if (prev >= itemCount - 1) {\n return wrap ? 0 : itemCount - 1;\n }\n return prev + 1;\n });\n break;\n }\n case 'ArrowUp': {\n e.preventDefault();\n setActiveIndex(prev => {\n if (prev === -1) return itemCount - 1;\n if (prev <= 0) {\n return wrap ? itemCount - 1 : 0;\n }\n return prev - 1;\n });\n break;\n }\n case 'Home': {\n e.preventDefault();\n setActiveIndex(0);\n break;\n }\n case 'End': {\n e.preventDefault();\n setActiveIndex(itemCount - 1);\n break;\n }\n case 'Enter': {\n if (activeIndex >= 0 && onSelect) {\n e.preventDefault();\n onSelect(activeIndex);\n }\n break;\n }\n }\n },\n [itemCount, wrap, activeIndex, onSelect],\n );\n\n // Register global keyboard handlers when global option is enabled\n useEffect(() => {\n if (!global) return;\n\n document.addEventListener('keydown', handleKeyDown);\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n };\n }, [global, handleKeyDown]);\n\n const getKeyboardProps = useCallback(() => {\n if (global) return null;\n return { onKeyDown: handleKeyDown as (e: React.KeyboardEvent) => void, tabIndex: 0 };\n }, [global, handleKeyDown]);\n\n return {\n activeIndex,\n setActiveIndex,\n getKeyboardProps,\n };\n}\n"],"names":[],"mappings":";;;;;;;AAWA,MAAM,OAAA,GAAU;AAAA,EACd,OAAA,EAAS,0BAAA;AAAA,EACT,KAAA,EAAO;AACT,CAAA;AAEO,MAAM,KAAA,GAAQ,CAAC,EAAE,SAAA,EAAW,UAAU,IAAA,GAAO,SAAA,EAAW,OAAM,KAAkB;AACrF,EAAA,uBACE,GAAA,CAAC,OAAA,EAAA,EAAM,SAAA,EAAW,EAAA,CAAG,QAAA,EAAU,OAAA,CAAQ,IAAI,CAAA,EAAG,SAAS,CAAA,EAAG,KAAA,EACvD,QAAA,EACH,CAAA;AAEJ;AAOO,MAAM,KAAA,GAAQ,CAAC,EAAE,SAAA,EAAW,UAAS,KAAkB;AAC5D,EAAA,uBACE,GAAA,CAAC,OAAA,EAAA,EACC,QAAA,kBAAA,GAAA,CAAC,IAAA,EAAA,EAAG,SAAA,EAAW,GAAG,+CAAA,EAAiD,SAAS,CAAA,EAAI,QAAA,EAAS,CAAA,EAC3F,CAAA;AAEJ;AAQO,MAAM,KAAK,CAAC,EAAE,WAAW,QAAA,EAAU,GAAG,OAAM,KAAe;AAChE,EAAA,uBACE,GAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,SAAA,EAAW,EAAA;AAAA,QACT,4GAAA;AAAA,QACA;AAAA,OACF;AAAA,MACC,GAAG,KAAA;AAAA,MAEH;AAAA;AAAA,GACH;AAEJ;AAOO,MAAM,QAAQ,CAAC,EAAE,WAAW,QAAA,EAAU,GAAG,OAAM,KAAkB;AACtE,EAAA,uBACE,GAAA,CAAC,WAAM,SAAA,EAAW,EAAA,CAAG,IAAI,SAAS,CAAA,EAAI,GAAG,KAAA,EACtC,QAAA,EACH,CAAA;AAEJ;AAaO,MAAM,GAAA,GAAM,UAAA;AAAA,EACjB,CAAC,EAAE,SAAA,EAAW,QAAA,EAAU,QAAA,GAAW,KAAA,EAAO,KAAA,EAAO,OAAA,EAAS,QAAA,GAAW,KAAA,EAAO,GAAG,KAAA,IAAS,GAAA,KAAQ;AAC9F,IAAA,MAAM,WAAA,GAAc,OAA4B,IAAI,CAAA;AAGpD,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,CAAC,GAAA,EAAK;AACV,MAAA,IAAI,OAAO,QAAQ,UAAA,EAAY;AAC7B,QAAA,GAAA,CAAI,YAAY,OAAO,CAAA;AAAA,MACzB,CAAA,MAAO;AACL,QAAA,GAAA,CAAI,UAAU,WAAA,CAAY,OAAA;AAAA,MAC5B;AAAA,IACF,CAAA,EAAG,CAAC,GAAG,CAAC,CAAA;AAGR,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,QAAA,IAAY,YAAY,OAAA,EAAS;AACnC,QAAA,WAAA,CAAY,QAAQ,KAAA,EAAM;AAC1B,QAAA,WAAA,CAAY,OAAA,CAAQ,cAAA,CAAe,EAAE,KAAA,EAAO,WAAW,CAAA;AAAA,MACzD;AAAA,IACF,CAAA,EAAG,CAAC,QAAQ,CAAC,CAAA;AAEb,IAAA,MAAM,aAAA,GAAgB,CAAC,KAAA,KAAoD;AACzE,MAAA,IAAI,KAAA,CAAM,GAAA,KAAQ,OAAA,IAAW,OAAA,EAAS;AACpC,QAAA,OAAA,EAAQ;AAAA,MACV;AAAA,IACF,CAAA;AAEA,IAAA,uBACE,GAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,EAAA;AAAA,UACT,wBAAA;AAAA;AAAA,UAEA,mDAAA;AAAA,UACA,sBAAA;AAAA;AAAA,UAEA,+FAAA;AAAA,UACA,QAAA,IAAY,eAAA;AAAA,UACZ,OAAA,IAAW,gBAAA;AAAA,UACX;AAAA,SACF;AAAA,QACA,KAAA;AAAA,QACA,OAAA;AAAA,QACA,GAAA,EAAK,WAAA;AAAA,QACL,QAAA,EAAU,UAAU,CAAA,GAAI,MAAA;AAAA,QACxB,SAAA,EAAW,aAAA;AAAA,QACX,eAAa,QAAA,IAAY,MAAA;AAAA,QACxB,GAAG,KAAA;AAAA,QAEH;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;;AC1HO,MAAM,OAAO,CAAC,EAAE,WAAW,QAAA,EAAU,GAAG,OAAM,KAAiB;AACpE,EAAA,2BACG,IAAA,EAAA,EAAG,SAAA,EAAW,EAAA,CAAG,sCAAA,EAAwC,SAAS,CAAA,EAAI,GAAG,KAAA,EACxE,QAAA,kBAAA,GAAA,CAAC,SAAI,SAAA,EAAW,EAAA,CAAG,sCAAsC,CAAA,EAAI,UAAS,CAAA,EACxE,CAAA;AAEJ;AAEO,MAAM,OAAA,GAAU,CAAC,EAAE,SAAA,EAAW,UAAS,KAAiB;AAC7D,EAAA,uBACE,GAAA,CAAC,IAAA,EAAA,EAAK,SAAA,EACJ,QAAA,kBAAA,GAAA,CAAC,GAAA,EAAA,EAAI,EAAA,EAAG,MAAA,EAAO,OAAA,EAAQ,SAAA,EAAU,SAAA,EAAU,iBAAA,EACxC,QAAA,EACH,CAAA,EACF,CAAA;AAEJ;AAMO,MAAM,eAAe,CAAC,EAAE,QAAA,EAAU,GAAG,OAAM,KAAyB;AACzE,EAAA,2BACG,IAAA,EAAA,EAAM,GAAG,KAAA,EACR,QAAA,kBAAA,GAAA,CAAC,OAAI,EAAA,EAAG,MAAA,EAAO,OAAA,EAAQ,MAAA,EAAO,WAAU,UAAA,EACrC,QAAA,EAAA,UAAA,CAAW,QAAA,EAAU,mBAAmB,GAC3C,CAAA,EACF,CAAA;AAEJ;AASO,MAAM,SAAA,GAAY,CAAC,EAAE,IAAA,EAAM,aAAa,IAAA,EAAM,IAAA,EAAM,GAAG,KAAA,EAAM,KAAsB;AACxF,EAAA,2BACG,IAAA,EAAA,EAAM,GAAG,OACR,QAAA,kBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,2BAAA,EACZ,QAAA,EAAA;AAAA,IAAA,IAAA,wBACE,IAAA,EAAA,EAAK,IAAA,EAAK,IAAA,EAAK,SAAA,EAAU,mBACvB,QAAA,EAAA,IAAA,EACH,CAAA;AAAA,oBAGF,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,qBAAA,EACb,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,OAAI,EAAA,EAAG,MAAA,EAAO,SAAQ,MAAA,EAAO,IAAA,EAAK,OAChC,QAAA,EAAA,IAAA,EACH,CAAA;AAAA,MACC,WAAA,oBACC,GAAA,CAAC,GAAA,EAAA,EAAI,EAAA,EAAG,MAAA,EAAO,OAAA,EAAQ,MAAA,EAAO,IAAA,EAAK,OAAA,EAAQ,SAAA,EAAU,+BAAA,EAClD,QAAA,EAAA,WAAA,EACH;AAAA,KAAA,EAEJ,CAAA;AAAA,IACC;AAAA,GAAA,EACH,CAAA,EACF,CAAA;AAEJ;;ACnDO,SAAS,0BAAA,CAA2B;AAAA,EACzC,SAAA;AAAA,EACA,YAAA,GAAe,EAAA;AAAA,EACf,IAAA,GAAO,KAAA;AAAA,EACP,QAAA;AAAA,EACA,MAAA,GAAS;AACX,CAAA,EAAwE;AACtE,EAAA,MAAM,CAAC,WAAA,EAAa,cAAc,CAAA,GAAI,SAAS,YAAY,CAAA;AAE3D,EAAA,MAAM,aAAA,GAAgB,WAAA;AAAA,IACpB,CAAC,CAAA,KAA2C;AAE1C,MAAA,IAAI,cAAc,CAAA,EAAG;AAErB,MAAA,QAAQ,EAAE,GAAA;AAAK,QACb,KAAK,WAAA,EAAa;AAChB,UAAA,CAAA,CAAE,cAAA,EAAe;AACjB,UAAA,cAAA,CAAe,CAAA,IAAA,KAAQ;AACrB,YAAA,IAAI,IAAA,KAAS,IAAI,OAAO,CAAA;AACxB,YAAA,IAAI,IAAA,IAAQ,YAAY,CAAA,EAAG;AACzB,cAAA,OAAO,IAAA,GAAO,IAAI,SAAA,GAAY,CAAA;AAAA,YAChC;AACA,YAAA,OAAO,IAAA,GAAO,CAAA;AAAA,UAChB,CAAC,CAAA;AACD,UAAA;AAAA,QACF;AAAA,QACA,KAAK,SAAA,EAAW;AACd,UAAA,CAAA,CAAE,cAAA,EAAe;AACjB,UAAA,cAAA,CAAe,CAAA,IAAA,KAAQ;AACrB,YAAA,IAAI,IAAA,KAAS,EAAA,EAAI,OAAO,SAAA,GAAY,CAAA;AACpC,YAAA,IAAI,QAAQ,CAAA,EAAG;AACb,cAAA,OAAO,IAAA,GAAO,YAAY,CAAA,GAAI,CAAA;AAAA,YAChC;AACA,YAAA,OAAO,IAAA,GAAO,CAAA;AAAA,UAChB,CAAC,CAAA;AACD,UAAA;AAAA,QACF;AAAA,QACA,KAAK,MAAA,EAAQ;AACX,UAAA,CAAA,CAAE,cAAA,EAAe;AACjB,UAAA,cAAA,CAAe,CAAC,CAAA;AAChB,UAAA;AAAA,QACF;AAAA,QACA,KAAK,KAAA,EAAO;AACV,UAAA,CAAA,CAAE,cAAA,EAAe;AACjB,UAAA,cAAA,CAAe,YAAY,CAAC,CAAA;AAC5B,UAAA;AAAA,QACF;AAAA,QACA,KAAK,OAAA,EAAS;AACZ,UAAA,IAAI,WAAA,IAAe,KAAK,QAAA,EAAU;AAChC,YAAA,CAAA,CAAE,cAAA,EAAe;AACjB,YAAA,QAAA,CAAS,WAAW,CAAA;AAAA,UACtB;AACA,UAAA;AAAA,QACF;AAAA;AACF,IACF,CAAA;AAAA,IACA,CAAC,SAAA,EAAW,IAAA,EAAM,WAAA,EAAa,QAAQ;AAAA,GACzC;AAGA,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,CAAC,MAAA,EAAQ;AAEb,IAAA,QAAA,CAAS,gBAAA,CAAiB,WAAW,aAAa,CAAA;AAClD,IAAA,OAAO,MAAM;AACX,MAAA,QAAA,CAAS,mBAAA,CAAoB,WAAW,aAAa,CAAA;AAAA,IACvD,CAAA;AAAA,EACF,CAAA,EAAG,CAAC,MAAA,EAAQ,aAAa,CAAC,CAAA;AAE1B,EAAA,MAAM,gBAAA,GAAmB,YAAY,MAAM;AACzC,IAAA,IAAI,QAAQ,OAAO,IAAA;AACnB,IAAA,OAAO,EAAE,SAAA,EAAW,aAAA,EAAmD,QAAA,EAAU,CAAA,EAAE;AAAA,EACrF,CAAA,EAAG,CAAC,MAAA,EAAQ,aAAa,CAAC,CAAA;AAE1B,EAAA,OAAO;AAAA,IACL,WAAA;AAAA,IACA,cAAA;AAAA,IACA;AAAA,GACF;AACF;;;;"}
1	+ {"version":3,"file":"Table.es.js","sources":["../../src/ds/components/Table/Table.tsx","../../src/ds/components/Table/Cells.tsx","../../src/ds/components/Table/use-table-keyboard-navigation.ts"],"sourcesContent":["import type { CSSProperties, HTMLAttributes, ReactNode, ThHTMLAttributes } from 'react';\nimport { forwardRef, useEffect, useRef } from 'react';\nimport { focusRingInset } from '@/ds/primitives/transitions';\nimport { cn } from '@/lib/utils';\n\nexport interface TableProps {\n className?: string;\n children: ReactNode;\n size?: 'default' \| 'small';\n style?: CSSProperties;\n}\n\nconst rowSize = {\n default: '[&>tbody>tr]:h-table-row',\n small: '[&>tbody>tr]:h-table-row-small',\n};\n\nexport const Table = ({ className, children, size = 'default', style }: TableProps) => {\n return (\n <table className={cn('w-full', rowSize[size], className)} style={style}>\n {children}\n </table>\n );\n};\n\nexport interface TheadProps {\n className?: string;\n children: ReactNode;\n}\n\nexport const Thead = ({ className, children }: TheadProps) => {\n return (\n <thead>\n <tr className={cn('h-table-header border-b border-border bg-card', className)}>{children}</tr>\n </thead>\n );\n};\n\nexport interface ThProps extends ThHTMLAttributes<HTMLTableCellElement> {\n className?: string;\n style?: CSSProperties;\n children: ReactNode;\n}\n\nexport const Th = ({ className, children, ...props }: ThProps) => {\n return (\n <th\n className={cn(\n 'h-full text-left text-meta tracking-wide whitespace-nowrap text-placeholder uppercase first:pl-3 last:pr-3',\n className,\n )}\n {...props}\n >\n {children}\n </th>\n );\n};\n\nexport interface TbodyProps extends HTMLAttributes<HTMLTableSectionElement> {\n className?: string;\n children: ReactNode;\n}\n\nexport const Tbody = ({ className, children, ...props }: TbodyProps) => {\n return (\n <tbody className={cn('', className)} {...props}>\n {children}\n </tbody>\n );\n};\n\nexport interface RowProps {\n className?: string;\n children: ReactNode;\n selected?: boolean;\n style?: CSSProperties;\n onClick?: () => void;\n tabIndex?: number;\n /** When true, row receives focus and scrolls into view /\n isActive?: boolean;\n}\n\nexport const Row = forwardRef<HTMLTableRowElement, RowProps>(\n ({ className, children, selected = false, style, onClick, isActive = false, ...props }, ref) => {\n const internalRef = useRef<HTMLTableRowElement>(null);\n\n // Merge forwarded ref with internal ref\n useEffect(() => {\n if (!ref) return;\n if (typeof ref === 'function') {\n ref(internalRef.current);\n } else {\n ref.current = internalRef.current;\n }\n }, [ref]);\n\n // Focus and scroll into view when active\n useEffect(() => {\n if (isActive && internalRef.current) {\n internalRef.current.focus();\n internalRef.current.scrollIntoView({ block: 'nearest' });\n }\n }, [isActive]);\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLTableRowElement>) => {\n if (event.key === 'Enter' && onClick) {\n onClick();\n }\n };\n\n return (\n <tr\n className={cn(\n 'border-b border-border',\n // Smooth hover transition\n 'transition-colors duration-normal ease-out-custom',\n 'hover:bg-fill-subtle',\n 'focus:bg-fill-subtle',\n focusRingInset,\n selected && 'bg-fill-hover',\n onClick && 'cursor-pointer',\n className,\n )}\n style={style}\n onClick={onClick}\n ref={internalRef}\n tabIndex={onClick ? 0 : undefined}\n onKeyDown={handleKeyDown}\n data-active={isActive \|\| undefined}\n {...props}\n >\n {children}\n </tr>\n );\n },\n);\n","import React from 'react';\n\nimport { Icon } from '../../icons/Icon';\nimport { Txt } from '../Txt';\nimport { cn } from '@/lib/utils';\nimport { formatDate } from '@/utils/date-format';\n\nexport interface CellProps extends React.TdHTMLAttributes<HTMLTableCellElement> {\n className?: string;\n children: React.ReactNode;\n}\n\nexport const Cell = ({ className, children, ...props }: CellProps) => {\n return (\n <td className={cn('text-foreground first:pl-3 last:pr-3', className)} {...props}>\n <div className={cn('flex size-full shrink-0 items-center')}>{children}</div>\n </td>\n );\n};\n\nexport const TxtCell = ({ className, children }: CellProps) => {\n return (\n <Cell className={className}>\n <Txt as=\"span\" variant=\"body-sm\" className=\"w-full truncate\">\n {children}\n </Txt>\n </Cell>\n );\n};\n\nexport interface DateTimeCellProps extends Omit<CellProps, 'children'> {\n dateTime: Date;\n}\n\nexport const DateTimeCell = ({ dateTime, ...props }: DateTimeCellProps) => {\n return (\n <Cell {...props}>\n <Txt as=\"span\" variant=\"body\" className=\"shrink-0\">\n {formatDate(dateTime, 'date-time-seconds')}\n </Txt>\n </Cell>\n );\n};\n\nexport interface EntryCellProps extends Omit<CellProps, 'children'> {\n name: React.ReactNode;\n description?: React.ReactNode;\n icon?: React.ReactNode;\n meta?: React.ReactNode;\n}\n\nexport const EntryCell = ({ name, description, icon, meta, ...props }: EntryCellProps) => {\n return (\n <Cell {...props}>\n <div className=\"flex items-center gap-3.5\">\n {icon && (\n <Icon size=\"lg\" className=\"text-foreground\">\n {icon}\n </Icon>\n )}\n\n <div className=\"flex flex-col gap-0\">\n <Txt as=\"span\" variant=\"body\" tone=\"ink\">\n {name}\n </Txt>\n {description && (\n <Txt as=\"span\" variant=\"meta\" tone=\"muted\" className=\"w-full max-w-75 truncate pt-1\">\n {description}\n </Txt>\n )}\n </div>\n {meta}\n </div>\n </Cell>\n );\n};\n","import { useState, useCallback, useEffect } from 'react';\n\nexport interface UseTableKeyboardNavigationOptions {\n /* Number of items in the list /\n itemCount: number;\n /* Initial active index (-1 = none) /\n initialIndex?: number;\n /* Wrap around at boundaries /\n wrap?: boolean;\n /* Callback when Enter pressed on active row /\n onSelect?: (index: number) => void;\n /* When true, registers keyboard handlers globally on the document /\n global?: boolean;\n}\n\nexport interface UseTableKeyboardNavigationReturn {\n /* Currently active index (-1 if none) /\n activeIndex: number;\n /* Set active index programmatically /\n setActiveIndex: React.Dispatch<React.SetStateAction<number>>;\n /* Returns props to spread on the Tbody element. Returns null when global is true. */\n getKeyboardProps: () => { onKeyDown: (e: React.KeyboardEvent) => void; tabIndex: number } \| null;\n}\n\nexport function useTableKeyboardNavigation({\n itemCount,\n initialIndex = -1,\n wrap = false,\n onSelect,\n global = false,\n}: UseTableKeyboardNavigationOptions): UseTableKeyboardNavigationReturn {\n const [activeIndex, setActiveIndex] = useState(initialIndex);\n\n const handleKeyDown = useCallback(\n (e: KeyboardEvent \| React.KeyboardEvent) => {\n // No-op for empty list\n if (itemCount === 0) return;\n\n switch (e.key) {\n case 'ArrowDown': {\n e.preventDefault();\n setActiveIndex(prev => {\n if (prev === -1) return 0;\n if (prev >= itemCount - 1) {\n return wrap ? 0 : itemCount - 1;\n }\n return prev + 1;\n });\n break;\n }\n case 'ArrowUp': {\n e.preventDefault();\n setActiveIndex(prev => {\n if (prev === -1) return itemCount - 1;\n if (prev <= 0) {\n return wrap ? itemCount - 1 : 0;\n }\n return prev - 1;\n });\n break;\n }\n case 'Home': {\n e.preventDefault();\n setActiveIndex(0);\n break;\n }\n case 'End': {\n e.preventDefault();\n setActiveIndex(itemCount - 1);\n break;\n }\n case 'Enter': {\n if (activeIndex >= 0 && onSelect) {\n e.preventDefault();\n onSelect(activeIndex);\n }\n break;\n }\n }\n },\n [itemCount, wrap, activeIndex, onSelect],\n );\n\n // Register global keyboard handlers when global option is enabled\n useEffect(() => {\n if (!global) return;\n\n document.addEventListener('keydown', handleKeyDown);\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n };\n }, [global, handleKeyDown]);\n\n const getKeyboardProps = useCallback(() => {\n if (global) return null;\n return { onKeyDown: handleKeyDown as (e: React.KeyboardEvent) => void, tabIndex: 0 };\n }, [global, handleKeyDown]);\n\n return {\n activeIndex,\n setActiveIndex,\n getKeyboardProps,\n };\n}\n"],"names":[],"mappings":"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"}

package/dist/components/Tabs.cjs.js CHANGED Viewed

@@ -2,9 +2,9 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-const tabsRoot = require('../tabs-root-5s72GhmI.cjs');
-const tabsTab = require('../tabs-tab-BzurlE52.cjs');
-const tabsContent = require('../tabs-content-DKELc1lK.cjs');
+const tabsRoot = require('../tabs-root-BqC8X_h6.cjs');
+const tabsTab = require('../tabs-tab-lm4xyjtD.cjs');
+const tabsContent = require('../tabs-content-DQNRMjup.cjs');

package/dist/components/Tabs.es.js CHANGED Viewed

@@ -1,4 +1,4 @@
-export { T as TabList, a as Tabs } from '../tabs-root-Dh-McKbO.js';
-export { T as Tab } from '../tabs-tab-BDdO7sWN.js';
-export { T as TabContent } from '../tabs-content-C3x4OoZ_.js';
+export { T as TabList, a as Tabs } from '../tabs-root-4vL8SHCO.js';
+export { T as Tab } from '../tabs-tab-7e2as-AV.js';
+export { T as TabContent } from '../tabs-content-h2qqD8t-.js';
 //# sourceMappingURL=Tabs.es.js.map

package/dist/components/Text.cjs.js CHANGED Viewed

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-const textAndIcon = require('../text-and-icon-BcHVl157.cjs');
+const textAndIcon = require('../text-and-icon-4eVhfmbb.cjs');
 const utils_id = require('../utils/id.cjs.js');

package/dist/components/Text.es.js CHANGED Viewed

@@ -1,3 +1,3 @@
-export { T as TextAndIcon } from '../text-and-icon-wzPA3yr_.js';
+export { T as TextAndIcon } from '../text-and-icon-CuBm-Wjm.js';
 export { getShortId } from '../utils/id.es.js';
 //# sourceMappingURL=Text.es.js.map

package/dist/components/ThreadList.cjs.js CHANGED Viewed

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-const threadList = require('../thread-list-RfLw5JAn.cjs');
+const threadList = require('../thread-list-DwASH1Vl.cjs');

package/dist/components/ThreadList.es.js CHANGED Viewed

@@ -1,2 +1,2 @@
-export { T as ThreadList, a as ThreadListEmpty, b as ThreadListItem, c as ThreadListItems, d as ThreadListNewItem, e as ThreadListSeparator } from '../thread-list-D7x7cggy.js';
+export { T as ThreadList, a as ThreadListEmpty, b as ThreadListItem, c as ThreadListItems, d as ThreadListNewItem, e as ThreadListSeparator } from '../thread-list-DGI6M6if.js';
 //# sourceMappingURL=ThreadList.es.js.map