From bab6d8090e085c75b394dde4bf7b0ea397511ddf Mon Sep 17 00:00:00 2001 From: Claude Date: Tue, 17 Feb 2026 10:37:34 +0000 Subject: [PATCH 1/6] 0.13.14 - Added aria-friendly ProgressBar component with brand gradient https://claude.ai/code/session_01A5qHXidJ4Y5UdpbmSWSf38 --- package.json | 2 +- src/components/ui/index.ts | 3 + .../ui/progress-bar/ProgressBar.stories.ts | 97 +++++++++++++++++++ src/components/ui/progress-bar/index.ts | 3 + .../ui/progress-bar/progress-bar.tsx | 77 +++++++++++++++ 5 files changed, 181 insertions(+), 1 deletion(-) create mode 100644 src/components/ui/progress-bar/ProgressBar.stories.ts create mode 100644 src/components/ui/progress-bar/index.ts create mode 100644 src/components/ui/progress-bar/progress-bar.tsx diff --git a/package.json b/package.json index f641932..bb8d446 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@schemavaults/ui", - "version": "0.13.13", + "version": "0.13.14", "private": false, "license": "UNLICENSED", "description": "React.js UI components for SchemaVaults frontend applications", diff --git a/src/components/ui/index.ts b/src/components/ui/index.ts index b96652e..2da7daa 100644 --- a/src/components/ui/index.ts +++ b/src/components/ui/index.ts @@ -128,3 +128,6 @@ export type * from "./slider"; export * from "./switch"; export type * from "./switch"; + +export * from "./progress-bar"; +export type * from "./progress-bar"; diff --git a/src/components/ui/progress-bar/ProgressBar.stories.ts b/src/components/ui/progress-bar/ProgressBar.stories.ts new file mode 100644 index 0000000..edc32b0 --- /dev/null +++ b/src/components/ui/progress-bar/ProgressBar.stories.ts @@ -0,0 +1,97 @@ +import type { Meta, StoryObj } from "@storybook/react"; +import { ProgressBar, progressBarSizeIds } from "./progress-bar"; + +const meta = { + title: "Components/ProgressBar", + component: ProgressBar, + parameters: { + layout: "centered", + }, + tags: ["autodocs"], + argTypes: { + value: { + control: { + type: "range", + min: 0, + max: 100, + step: 1, + }, + }, + size: { + options: progressBarSizeIds, + control: { + type: "radio", + }, + }, + min: { + control: { + type: "number", + }, + }, + max: { + control: { + type: "number", + }, + }, + }, + args: { + value: 50, + label: "Progress", + min: 0, + max: 100, + }, + decorators: [ + (Story) => { + return Story({ args: { style: { width: "320px" } } }); + }, + ], +} satisfies Meta; + +export default meta; +type Story = StoryObj; + +export const Default: Story = { + args: { + value: 50, + label: "Upload progress", + }, +}; + +export const Empty: Story = { + args: { + value: 0, + label: "Upload progress", + }, +}; + +export const Full: Story = { + args: { + value: 100, + label: "Upload progress", + }, +}; + +export const Small: Story = { + args: { + value: 65, + label: "Upload progress", + size: "sm", + }, +}; + +export const Large: Story = { + args: { + value: 75, + label: "Upload progress", + size: "lg", + }, +}; + +export const CustomRange: Story = { + args: { + value: 7, + label: "Steps completed", + min: 0, + max: 10, + }, +}; diff --git a/src/components/ui/progress-bar/index.ts b/src/components/ui/progress-bar/index.ts new file mode 100644 index 0000000..15979cd --- /dev/null +++ b/src/components/ui/progress-bar/index.ts @@ -0,0 +1,3 @@ +export { ProgressBar, progressBarVariants, progressBarSizeIds } from "./progress-bar"; +export type * from "./progress-bar"; +export { ProgressBar as default } from "./progress-bar"; diff --git a/src/components/ui/progress-bar/progress-bar.tsx b/src/components/ui/progress-bar/progress-bar.tsx new file mode 100644 index 0000000..5f8662e --- /dev/null +++ b/src/components/ui/progress-bar/progress-bar.tsx @@ -0,0 +1,77 @@ +"use client"; + +import { cva, type VariantProps } from "class-variance-authority"; +import { cn } from "@/lib/utils"; +import type { ReactElement, HTMLAttributes } from "react"; + +export const progressBarVariants = cva( + "relative w-full overflow-hidden rounded-full bg-secondary", + { + variants: { + size: { + sm: "h-2", + default: "h-3", + lg: "h-5", + }, + }, + defaultVariants: { + size: "default", + }, + }, +); + +export const progressBarSizeIds = ["sm", "default", "lg"] as const; + +export type ProgressBarSizeId = (typeof progressBarSizeIds)[number]; + +export interface ProgressBarProps + extends Omit, "role">, + VariantProps { + /** Current progress value (0-100) */ + value: number; + /** Accessible label describing what the progress bar represents */ + label: string; + /** Minimum value (defaults to 0) */ + min?: number; + /** Maximum value (defaults to 100) */ + max?: number; + /** Additional classes for the filled indicator */ + indicatorClassName?: string; +} + +export function ProgressBar({ + value, + label, + min = 0, + max = 100, + size, + className, + indicatorClassName, + ...props +}: ProgressBarProps): ReactElement { + const clampedValue: number = Math.min(max, Math.max(min, value)); + const percentage: number = ((clampedValue - min) / (max - min)) * 100; + + return ( +
+
+
+ ); +} + +ProgressBar.displayName = "ProgressBar"; From 722079f0f7c9bcf9f5f4a94c73691a1ba859c30c Mon Sep 17 00:00:00 2001 From: Claude Date: Tue, 17 Feb 2026 10:40:18 +0000 Subject: [PATCH 2/6] 0.13.14 - Updated CLAUDE.md to require bun install before typecheck/lint/build https://claude.ai/code/session_01A5qHXidJ4Y5UdpbmSWSf38 --- CLAUDE.md | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/CLAUDE.md b/CLAUDE.md index ecdae1b..25154a9 100644 --- a/CLAUDE.md +++ b/CLAUDE.md @@ -8,7 +8,12 @@ This is `@schemavaults/ui`, a React component library package for SchemaVaults f ## Commands +**Important:** Always run `bun install` first before running any of the commands below. Dependencies may not be installed in a fresh environment, and typecheck/lint/build will fail without them. + ```bash +# Install dependencies (run this first) +bun install + # Build the package (compiles TypeScript and resolves path aliases) bun run build From a9bc039dd35674b9ce32b5f22c416513acdd9003 Mon Sep 17 00:00:00 2001 From: Claude Date: Tue, 17 Feb 2026 10:43:02 +0000 Subject: [PATCH 3/6] 0.13.14 - Animate ProgressBar indicator with framer-motion lazy m.div https://claude.ai/code/session_01A5qHXidJ4Y5UdpbmSWSf38 --- src/components/ui/progress-bar/progress-bar.tsx | 9 ++++++--- 1 file changed, 6 insertions(+), 3 deletions(-) diff --git a/src/components/ui/progress-bar/progress-bar.tsx b/src/components/ui/progress-bar/progress-bar.tsx index 5f8662e..9718199 100644 --- a/src/components/ui/progress-bar/progress-bar.tsx +++ b/src/components/ui/progress-bar/progress-bar.tsx @@ -1,6 +1,7 @@ "use client"; import { cva, type VariantProps } from "class-variance-authority"; +import { m } from "@/framer-motion"; import { cn } from "@/lib/utils"; import type { ReactElement, HTMLAttributes } from "react"; @@ -62,13 +63,15 @@ export function ProgressBar({ className={cn(progressBarVariants({ size }), className)} {...props} > -
); From 7555b1e0e00dd3331cd40e4ea53ec98c97153dec Mon Sep 17 00:00:00 2001 From: Claude Date: Tue, 17 Feb 2026 10:46:33 +0000 Subject: [PATCH 4/6] 0.13.14 - Wrap ProgressBar story with LazyFramerMotionProvider decorator https://claude.ai/code/session_01A5qHXidJ4Y5UdpbmSWSf38 --- ...rogressBar.stories.ts => ProgressBar.stories.tsx} | 12 ++++++++++-- 1 file changed, 10 insertions(+), 2 deletions(-) rename src/components/ui/progress-bar/{ProgressBar.stories.ts => ProgressBar.stories.tsx} (82%) diff --git a/src/components/ui/progress-bar/ProgressBar.stories.ts b/src/components/ui/progress-bar/ProgressBar.stories.tsx similarity index 82% rename from src/components/ui/progress-bar/ProgressBar.stories.ts rename to src/components/ui/progress-bar/ProgressBar.stories.tsx index edc32b0..8a53336 100644 --- a/src/components/ui/progress-bar/ProgressBar.stories.ts +++ b/src/components/ui/progress-bar/ProgressBar.stories.tsx @@ -1,4 +1,6 @@ import type { Meta, StoryObj } from "@storybook/react"; +import type { ReactElement } from "react"; +import { LazyFramerMotionProvider } from "@/providers/lazy_framer"; import { ProgressBar, progressBarSizeIds } from "./progress-bar"; const meta = { @@ -41,8 +43,14 @@ const meta = { max: 100, }, decorators: [ - (Story) => { - return Story({ args: { style: { width: "320px" } } }); + (Story): ReactElement => { + return ( + +
+ +
+ + ); }, ], } satisfies Meta; From 98ec2f04f327e69a15a35907d38576235c59f4ff Mon Sep 17 00:00:00 2001 From: Claude Date: Tue, 17 Feb 2026 10:49:14 +0000 Subject: [PATCH 5/6] 0.13.14 - Added CI workflow for lint, typecheck, and build on pull requests https://claude.ai/code/session_01A5qHXidJ4Y5UdpbmSWSf38 --- .github/workflows/ci.yml | 34 ++++++++++++++++++++++++++++++++++ 1 file changed, 34 insertions(+) create mode 100644 .github/workflows/ci.yml diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml new file mode 100644 index 0000000..cd6c00c --- /dev/null +++ b/.github/workflows/ci.yml @@ -0,0 +1,34 @@ +name: CI + +on: + pull_request: + branches: + - main + +env: + BUN_VERSION: 1.3.6 + +jobs: + ci: + name: Lint, Typecheck & Build + runs-on: ubuntu-latest + steps: + - name: Checkout + uses: actions/checkout@v4 + - name: Setup Bun + uses: oven-sh/setup-bun@v2 + with: + bun-version: ${{ env.BUN_VERSION }} + - name: Configure bun to install from GitHub Packages + run: rm -rf .npmrc + - name: Install dependencies + run: bun install + env: + SCHEMAVAULTS_GITHUB_PACKAGE_REGISTRY_USER: ${{ github.actor }} + SCHEMAVAULTS_GITHUB_PACKAGE_REGISTRY_TOKEN: ${{ secrets.GITHUB_TOKEN }} + - name: Lint + run: bun run lint + - name: Typecheck + run: bun run typecheck + - name: Build + run: bun run build From d49b85c40df1fc725ffc8fc70a931e8316164cf0 Mon Sep 17 00:00:00 2001 From: Claude Date: Tue, 17 Feb 2026 10:52:14 +0000 Subject: [PATCH 6/6] 0.13.14 - Rename CI workflow to pull_request_checks https://claude.ai/code/session_01A5qHXidJ4Y5UdpbmSWSf38 --- .github/workflows/{ci.yml => pull_request_checks.yml} | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) rename .github/workflows/{ci.yml => pull_request_checks.yml} (96%) diff --git a/.github/workflows/ci.yml b/.github/workflows/pull_request_checks.yml similarity index 96% rename from .github/workflows/ci.yml rename to .github/workflows/pull_request_checks.yml index cd6c00c..ad7b5e4 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/pull_request_checks.yml @@ -1,4 +1,4 @@ -name: CI +name: Pull Request Checks on: pull_request: