{ "$schema": "https://ui.shadcn.com/schema/registry.json", "name": "siteplane", "homepage": "https://ui.siteplane.io", "items": [ { "name": "base", "title": "Siteplane UI Base", "description": "Provider-free baseline styles and utilities.", "dependencies": [ "@base-ui/react@1.7.0", "clsx@2.1.1", "tailwind-merge@3.6.0" ], "devDependencies": [ "tailwindcss@4.3.3" ], "registryDependencies": [], "files": [ { "path": "packages/ui/src/system/styles/base.css", "type": "registry:file", "target": "~/src/siteplane/system/styles/base.css" }, { "path": "packages/ui/src/system/styles/defaults.css", "type": "registry:file", "target": "~/src/siteplane/system/styles/defaults.css" }, { "path": "packages/ui/src/system/styles/motion.css", "type": "registry:file", "target": "~/src/siteplane/system/styles/motion.css" }, { "path": "packages/ui/src/system/styles/design-rework.css", "type": "registry:file", "target": "~/src/siteplane/system/styles/design-rework.css" }, { "path": "packages/ui/src/system/styles/recipes.css", "type": "registry:file", "target": "~/src/siteplane/system/styles/recipes.css" }, { "path": "packages/ui/src/system/styles/surface.ts", "type": "registry:file", "target": "~/src/siteplane/system/styles/surface.ts" }, { "path": "packages/ui/src/system/styles/choice-menu-item.tsx", "type": "registry:file", "target": "~/src/siteplane/system/styles/choice-menu-item.tsx" }, { "path": "packages/ui/src/system/styles/checkbox-glyph.tsx", "type": "registry:file", "target": "~/src/siteplane/system/styles/checkbox-glyph.tsx" }, { "path": "packages/ui/src/system/styles/generated/tokens.css", "type": "registry:file", "target": "~/src/siteplane/system/styles/generated/tokens.css" }, { "path": "packages/ui/src/system/styles/generated/tailwind.css", "type": "registry:file", "target": "~/src/siteplane/system/styles/generated/tailwind.css" }, { "path": "packages/ui/src/system/tokens/primitives.tokens.json", "type": "registry:file", "target": "~/src/siteplane/system/tokens/primitives.tokens.json" }, { "path": "packages/ui/src/system/tokens/semantic.tokens.json", "type": "registry:file", "target": "~/src/siteplane/system/tokens/semantic.tokens.json" }, { "path": "packages/ui/src/system/tokens/component.tokens.json", "type": "registry:file", "target": "~/src/siteplane/system/tokens/component.tokens.json" }, { "path": "packages/ui/src/system/tokens/themes/light.tokens.json", "type": "registry:file", "target": "~/src/siteplane/system/tokens/themes/light.tokens.json" }, { "path": "packages/ui/src/system/tokens/themes/dark.tokens.json", "type": "registry:file", "target": "~/src/siteplane/system/tokens/themes/dark.tokens.json" }, { "path": "packages/ui/src/system/utils/cn.ts", "type": "registry:file", "target": "~/src/siteplane/system/utils/cn.ts" }, { "path": "packages/ui/src/system/utils/slot-class.ts", "type": "registry:file", "target": "~/src/siteplane/system/utils/slot-class.ts" }, { "path": "packages/ui/src/system/utils/text-runs.tsx", "type": "registry:file", "target": "~/src/siteplane/system/utils/text-runs.tsx" }, { "path": "packages/ui/src/system/recipes/index.ts", "type": "registry:file", "target": "~/src/siteplane/system/recipes/index.ts" }, { "path": "packages/ui/src/system/recipes/focus-ring.recipe.ts", "type": "registry:file", "target": "~/src/siteplane/system/recipes/focus-ring.recipe.ts" }, { "path": "packages/ui/src/system/provider/visual-scope-context.tsx", "type": "registry:file", "target": "~/src/siteplane/system/provider/visual-scope-context.tsx" }, { "path": "packages/ui/src/system/provider/siteplane-ui-provider.tsx", "type": "registry:file", "target": "~/src/siteplane/system/provider/siteplane-ui-provider.tsx" }, { "path": "packages/ui/src/system/motion/siteplane-motion-provider.tsx", "type": "registry:file", "target": "~/src/siteplane/system/motion/siteplane-motion-provider.tsx" }, { "path": "packages/ui/src/system/motion/use-reduced-motion-preference.ts", "type": "registry:file", "target": "~/src/siteplane/system/motion/use-reduced-motion-preference.ts" }, { "path": "packages/ui/src/system/form/use-form-reset.ts", "type": "registry:file", "target": "~/src/siteplane/system/form/use-form-reset.ts" }, { "path": "packages/ui/src/system/form/aria-invalid.ts", "type": "registry:file", "target": "~/src/siteplane/system/form/aria-invalid.ts" }, { "path": "packages/ui/src/system/date/native-day.ts", "type": "registry:file", "target": "~/src/siteplane/system/date/native-day.ts" }, { "path": "packages/ui/src/system/locale/formatted-text.ts", "type": "registry:file", "target": "~/src/siteplane/system/locale/formatted-text.ts" }, { "path": "packages/ui/src/system/hooks/use-media-query.ts", "type": "registry:file", "target": "~/src/siteplane/system/hooks/use-media-query.ts" }, { "path": "packages/ui/src/system/hooks/use-truncated.ts", "type": "registry:file", "target": "~/src/siteplane/system/hooks/use-truncated.ts" }, { "path": "LICENSE", "type": "registry:file", "target": "~/LICENSE.siteplane-ui" }, { "path": "TRADEMARKS.md", "type": "registry:file", "target": "~/TRADEMARKS.siteplane-ui.md" } ], "type": "registry:base" }, { "name": "action-icons", "title": "Action Icons", "description": "The animated copy icon, selection check and reveal eye that CopyButton, Code and Resource List draw. Install copy-button to copy a value.", "dependencies": [ "lucide-react@1.18.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/action-icons/action-icons.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/action-icons/action-icons.tsx" }, { "path": "packages/ui/src/components/action-icons/action-icons.css", "type": "registry:ui", "target": "~/src/siteplane/components/action-icons/action-icons.css" }, { "path": "packages/ui/src/components/action-icons/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/action-icons/index.ts" } ], "type": "registry:ui" }, { "name": "button", "title": "Button", "description": "Action family with variants, sizes, loading behavior, single-line icon labels, and accessible disabled states.", "dependencies": [ "@base-ui/react@1.7.0", "class-variance-authority@0.7.1" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/spinner.json", "https://ui.siteplane.io/registry/v/1.4.2/badge.json" ], "files": [ { "path": "packages/ui/src/components/button/button.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/button/button.tsx" }, { "path": "packages/ui/src/components/button/button-internal.ts", "type": "registry:ui", "target": "~/src/siteplane/components/button/button-internal.ts" }, { "path": "packages/ui/src/components/button/button-recipes.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/button/button-recipes.tsx" }, { "path": "packages/ui/src/components/button/button.css", "type": "registry:ui", "target": "~/src/siteplane/components/button/button.css" }, { "path": "packages/ui/src/components/button/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/button/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/button.md", "categories": [ "Actions" ], "meta": { "avoidWhen": [ "Avoid for a state that stays pressed; use Toggle.", "Avoid for a link inside running text; use a plain link." ], "description": "Action family with variants, sizes, loading behavior, single-line icon labels, and accessible disabled states.", "knownLimitations": [], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "button" ], "useWhen": [ "Use for any action people trigger, such as submit, open, save or delete. Pass a link through render when the action navigates." ] } }, { "name": "color-picker", "title": "Color Picker", "description": "Color editor with saturation, hue, hex and RGB controls.", "dependencies": [ "react-aria-components@1.20.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/copy-button.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/color-swatch-picker.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "files": [ { "path": "packages/ui/src/components/color-picker/color-picker.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/color-picker/color-picker.tsx" }, { "path": "packages/ui/src/components/color-picker/color-picker.css", "type": "registry:ui", "target": "~/src/siteplane/components/color-picker/color-picker.css" }, { "path": "packages/ui/src/components/color-picker/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/color-picker/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/color-picker.md", "categories": [ "Date & color" ], "meta": { "avoidWhen": [ "Avoid when selection is limited to a named palette; use Color Swatch Picker." ], "description": "Color editor with saturation, hue, hex and RGB controls.", "knownLimitations": [ "Alpha, locale and popup placement are not exposed.", "An invalid hex value falls back to the normalized default, then to black." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "color-picker", "color" ], "useWhen": [ "Use when users need to choose an arbitrary color." ] } }, { "name": "color-swatch-picker", "title": "Color Swatch Picker", "description": "Single-selection palette of named color swatches.", "dependencies": [ "react-aria-components@1.20.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "files": [ { "path": "packages/ui/src/components/color-swatch-picker/color-swatch-picker.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/color-swatch-picker/color-swatch-picker.tsx" }, { "path": "packages/ui/src/components/color-swatch-picker/color-swatch-face.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/color-swatch-picker/color-swatch-face.tsx" }, { "path": "packages/ui/src/components/color-swatch-picker/color-swatch-picker.css", "type": "registry:ui", "target": "~/src/siteplane/components/color-swatch-picker/color-swatch-picker.css" }, { "path": "packages/ui/src/components/color-swatch-picker/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/color-swatch-picker/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/color-swatch-picker.md", "categories": [ "Date & color" ], "meta": { "avoidWhen": [ "Avoid when people need to enter an arbitrary color; use Color Picker." ], "description": "Single-selection palette of named color swatches.", "knownLimitations": [ "The palette is owned by the application; arbitrary children and a native onChange are not part of the wrapper." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "color-swatch-picker", "color" ], "useWhen": [ "Use when users choose one color from a predefined palette." ] } }, { "name": "input", "title": "Input and Field", "description": "Base UI-backed text input and accessible field boundary.", "dependencies": [ "@base-ui/react@1.7.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/motion.json", "https://ui.siteplane.io/registry/v/1.4.2/tooltip.json" ], "files": [ { "path": "packages/ui/src/components/input/input.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/input/input.tsx" }, { "path": "packages/ui/src/components/input/input-internal.ts", "type": "registry:ui", "target": "~/src/siteplane/components/input/input-internal.ts" }, { "path": "packages/ui/src/components/input/input.css", "type": "registry:ui", "target": "~/src/siteplane/components/input/input.css" }, { "path": "packages/ui/src/components/input/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/input/index.ts" }, { "path": "packages/ui/src/components/field/field.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/field/field.tsx" }, { "path": "packages/ui/src/components/field/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/field/index.ts" }, { "path": "packages/ui/src/components/field/field-control-bridge.ts", "type": "registry:ui", "target": "~/src/siteplane/components/field/field-control-bridge.ts" }, { "path": "packages/ui/src/components/field/field-error-presence.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/field/field-error-presence.tsx" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/input.md", "categories": [ "Forms & selection" ], "meta": { "avoidWhen": [ "Avoid for several lines of text; use Textarea.", "Avoid for a number with stepping; use Number Field." ], "description": "Base UI-backed text input and accessible field boundary.", "knownLimitations": [ "A controlled Input does not reset with its form; reset your state in onReset." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "input" ], "useWhen": [ "Use for a single line of text or a native input value, such as an email address, a password or a file." ] } }, { "name": "calendar", "title": "Calendar", "description": "Locale-aware inline calendar with single, contiguous range and multiple date selection.", "dependencies": [ "@internationalized/date@3.12.3", "lucide-react@1.18.0", "react-aria-components@1.20.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/locale.json", "https://ui.siteplane.io/registry/v/1.4.2/popover.json" ], "files": [ { "path": "packages/ui/src/components/calendar/calendar.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/calendar/calendar.tsx" }, { "path": "packages/ui/src/components/calendar/calendar.css", "type": "registry:ui", "target": "~/src/siteplane/components/calendar/calendar.css" }, { "path": "packages/ui/src/components/calendar/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/calendar/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/calendar.md", "categories": [ "Date & color" ], "meta": { "avoidWhen": [ "Avoid when a date field or picker already owns the complete date-entry workflow." ], "description": "Locale-aware inline calendar with single, contiguous range and multiple date selection.", "knownLimitations": [ "The month heading button, its picker and the group of range shortcuts use English accessible labels in every locale.", "Values are native Date objects at local midnight, like the date pickers'; only the day counts, so persist it deliberately, for example as YYYY-MM-DD." ], "providerNotes": [ "Use the locale prop for this calendar, or SiteplaneLocaleProvider for a shared locale. SiteplaneUIProvider configures visual defaults, not locale." ], "releaseStatus": "stable", "searchTerms": [ "calendar", "date", "range", "selection" ], "useWhen": [ "Use when dates should be selected from an always-visible calendar grid." ] } }, { "name": "date-field", "title": "Date Field", "description": "Segmented, locale-aware date entry with optional Calendar action and native form serialization.", "dependencies": [ "@internationalized/date@3.12.3", "lucide-react@1.18.0", "react-aria-components@1.20.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/calendar.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/input-group.json", "https://ui.siteplane.io/registry/v/1.4.2/locale.json", "https://ui.siteplane.io/registry/v/1.4.2/popover.json" ], "files": [ { "path": "packages/ui/src/components/date-field/date-field.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/date-field/date-field.tsx" }, { "path": "packages/ui/src/components/date-field/date-field.css", "type": "registry:ui", "target": "~/src/siteplane/components/date-field/date-field.css" }, { "path": "packages/ui/src/components/date-field/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/date-field/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/date-field.md", "categories": [ "Date & color" ], "meta": { "avoidWhen": [ "Avoid when a compact button-triggered date choice is sufficient; use DatePicker instead." ], "description": "Segmented, locale-aware date entry with optional Calendar action and native form serialization.", "knownLimitations": [ "Values use native Date calendar fields in the local time zone; the locale changes formatting, not the zone." ], "providerNotes": [ "Use the locale prop for this field, or SiteplaneLocaleProvider for a shared locale. SiteplaneUIProvider configures visual defaults, not locale." ], "releaseStatus": "stable", "searchTerms": [ "date", "field", "calendar", "form" ], "useWhen": [ "Use when users should type a date by segment and may also choose it from a calendar." ] } }, { "name": "time-field", "title": "Time Field", "description": "Segmented, locale-aware time entry with an optional compact hour and minute selector. Search terms: hours, minutes, form.", "dependencies": [ "@internationalized/date@3.12.3", "lucide-react@1.18.0", "motion@12.43.0", "react-aria-components@1.20.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/input-group.json", "https://ui.siteplane.io/registry/v/1.4.2/list-box.json", "https://ui.siteplane.io/registry/v/1.4.2/popover.json", "https://ui.siteplane.io/registry/v/1.4.2/scroll-area.json", "https://ui.siteplane.io/registry/v/1.4.2/motion.json" ], "files": [ { "path": "packages/ui/src/components/time-field/time-field.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/time-field/time-field.tsx" }, { "path": "packages/ui/src/components/time-field/time-field.css", "type": "registry:ui", "target": "~/src/siteplane/components/time-field/time-field.css" }, { "path": "packages/ui/src/components/time-field/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/time-field/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/time-field.md", "categories": [ "Date & color" ], "meta": { "avoidWhen": [ "Avoid when a date must be edited and submitted with the time; use DateTimePicker instead." ], "description": "Segmented, locale-aware time entry with an optional compact hour and minute selector.", "knownLimitations": [ "Supports hour and minute values only, in 24-hour time with HH:mm form serialization; hourCycle={12} changes the display, not the value. No seconds." ], "providerNotes": [ "SiteplaneLocaleProvider supplies the React Aria locale; TimeField has no locale prop and keeps a 24-hour hour/minute contract. Translate hourLabel, minuteLabel, hoursLabel, minutesLabel and openPickerLabel explicitly." ], "releaseStatus": "stable", "searchTerms": [ "time", "field", "hours", "minutes", "form" ], "useWhen": [ "Use when users should type a time by segment and may also choose hour and minute values." ] } }, { "name": "date-picker", "title": "Date Picker", "description": "Button-triggered, locale-aware single-date picker with Calendar overlay.", "dependencies": [ "@internationalized/date@3.12.3", "lucide-react@1.18.0", "react-aria-components@1.20.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/calendar.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/locale.json" ], "files": [ { "path": "packages/ui/src/components/date-picker/date-picker.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/date-picker/date-picker.tsx" }, { "path": "packages/ui/src/components/date-picker/date-picker.css", "type": "registry:ui", "target": "~/src/siteplane/components/date-picker/date-picker.css" }, { "path": "packages/ui/src/components/date-picker/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/date-picker/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/date-picker.md", "categories": [ "Date & color" ], "meta": { "avoidWhen": [ "Avoid when direct segmented date entry is required; use DateField instead." ], "description": "Button-triggered, locale-aware single-date picker with Calendar overlay.", "knownLimitations": [ "Values use native Date calendar fields in the local time zone; the locale changes formatting, not the zone.", "Formatting changes only the visible label; the form value stays YYYY-MM-DD.", "No readOnly prop: React Aria disables the trigger of a read-only picker, so it would look disabled. Use DateField for a read-only date." ], "providerNotes": [ "Use the locale prop for this picker, or SiteplaneLocaleProvider for a shared locale. SiteplaneUIProvider configures visual defaults, not locale." ], "releaseStatus": "stable", "searchTerms": [ "date", "picker", "calendar" ], "useWhen": [ "Use when one date should be selected from a compact Calendar disclosure." ] } }, { "name": "date-range-picker", "title": "Date Range Picker", "description": "Segmented, locale-aware date-range picker with one Calendar action and two native form values.", "dependencies": [ "@internationalized/date@3.12.3", "lucide-react@1.18.0", "react-aria-components@1.20.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/calendar.json", "https://ui.siteplane.io/registry/v/1.4.2/date-field.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/input-group.json", "https://ui.siteplane.io/registry/v/1.4.2/locale.json" ], "files": [ { "path": "packages/ui/src/components/date-range-picker/date-range-picker.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/date-range-picker/date-range-picker.tsx" }, { "path": "packages/ui/src/components/date-range-picker/date-range-picker.css", "type": "registry:ui", "target": "~/src/siteplane/components/date-range-picker/date-range-picker.css" }, { "path": "packages/ui/src/components/date-range-picker/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/date-range-picker/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/date-range-picker.md", "categories": [ "Date & color" ], "meta": { "avoidWhen": [ "Avoid for a single date or a date and time; use DateField, DatePicker or DateTimePicker instead." ], "description": "Segmented, locale-aware date-range picker with one Calendar action and two native form values.", "knownLimitations": [ "Values use native Date calendar fields in the local time zone; the locale changes formatting, not the zone.", "The control commits a complete range, not a start date alone." ], "providerNotes": [ "Use the locale prop for this picker, or SiteplaneLocaleProvider for a shared locale. SiteplaneUIProvider configures visual defaults, not locale." ], "releaseStatus": "stable", "searchTerms": [ "date", "range", "picker", "calendar", "form" ], "useWhen": [ "Use when users must choose and submit a contiguous start and end date." ] } }, { "name": "date-time-picker", "title": "Date Time Picker", "description": "Combined locale-aware date and time picker with separate disclosures and one native form value. Search terms: calendar.", "dependencies": [ "@internationalized/date@3.12.3", "lucide-react@1.18.0", "react-aria-components@1.20.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/calendar.json", "https://ui.siteplane.io/registry/v/1.4.2/date-field.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/input-group.json", "https://ui.siteplane.io/registry/v/1.4.2/locale.json", "https://ui.siteplane.io/registry/v/1.4.2/time-field.json" ], "files": [ { "path": "packages/ui/src/components/date-time-picker/date-time-picker.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/date-time-picker/date-time-picker.tsx" }, { "path": "packages/ui/src/components/date-time-picker/date-time-picker.css", "type": "registry:ui", "target": "~/src/siteplane/components/date-time-picker/date-time-picker.css" }, { "path": "packages/ui/src/components/date-time-picker/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/date-time-picker/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/date-time-picker.md", "categories": [ "Date & color" ], "meta": { "avoidWhen": [ "Avoid when date and time are independent values or only one of them is required." ], "description": "Combined locale-aware date and time picker with separate disclosures and one native form value.", "knownLimitations": [ "Values use native Date calendar fields in the local time zone; there is no time zone selector and no conversion between zones.", "The time button stays disabled until a date is set." ], "providerNotes": [ "Use the locale prop for this picker, or SiteplaneLocaleProvider for a shared locale. SiteplaneUIProvider configures visual defaults, not locale." ], "releaseStatus": "stable", "searchTerms": [ "date", "time", "picker", "calendar", "form" ], "useWhen": [ "Use when one local appointment date and time should be edited and submitted together." ] } }, { "name": "input-group", "title": "Input Group", "description": "Composite for related Input and Textarea controls, add-ons, segments, and focus routing.", "dependencies": [ "class-variance-authority@0.7.1" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/textarea.json" ], "files": [ { "path": "packages/ui/src/components/input-group/input-group.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/input-group/input-group.tsx" }, { "path": "packages/ui/src/components/input-group/input-group.css", "type": "registry:ui", "target": "~/src/siteplane/components/input-group/input-group.css" }, { "path": "packages/ui/src/components/input-group/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/input-group/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/input-group.md", "categories": [ "Forms & selection" ], "meta": { "avoidWhen": [ "Avoid for a plain input with a label; use Input.", "Avoid for joined buttons without a text field; use Group." ], "description": "Composite for related Input and Textarea controls, add-ons, segments, and focus routing.", "knownLimitations": [ "Addon text is not a label or a description; connect them with Label, Field or aria-describedby.", "The group manages no values, does not disable its children and neither validates nor submits." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "input-group", "input", "group" ], "useWhen": [ "Use to attach text, icons, buttons or other addons to an Input or Textarea so that they share one surface and focus ring." ] } }, { "name": "label", "title": "Label", "description": "Polymorphic native label for standalone control association.", "dependencies": [ "@base-ui/react@1.7.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/label/label.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/label/label.tsx" }, { "path": "packages/ui/src/components/label/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/label/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/label.md", "categories": [ "Forms & selection" ], "meta": { "avoidWhen": [ "Avoid inside a Field: FieldLabel associates the control automatically and carries its validation state." ], "description": "Polymorphic native label for standalone control association.", "knownLimitations": [], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "label" ], "useWhen": [ "Use to give a standalone native form control a visible name." ] } }, { "name": "list-box", "title": "List Box", "description": "React Aria single-selection list with check or row-fill appearance, keyboard navigation and rich options.", "dependencies": [ "react-aria-components@1.20.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json" ], "files": [ { "path": "packages/ui/src/components/list-box/list-box.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/list-box/list-box.tsx" }, { "path": "packages/ui/src/components/list-box/list-box.css", "type": "registry:ui", "target": "~/src/siteplane/components/list-box/list-box.css" }, { "path": "packages/ui/src/components/list-box/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/list-box/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/list-box.md", "categories": [ "Forms & selection" ], "meta": { "avoidWhen": [ "Avoid when choices should stay collapsed until the user opens a Select or Combobox." ], "description": "React Aria single-selection list with check or row-fill appearance, keyboard navigation and rich options.", "knownLimitations": [ "The list submits no native form value; serialize the selected state yourself." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "list-box", "selection", "options" ], "useWhen": [ "Use when a persistent visible list of options allows exactly one selection." ] } }, { "name": "form", "title": "Form", "description": "Base UI form root for validation, submission, reset, and server errors.", "dependencies": [ "@base-ui/react@1.7.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/form/form.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/form/form.tsx" }, { "path": "packages/ui/src/components/form/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/form/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/form.md", "categories": [ "Forms & selection" ], "meta": { "avoidWhen": [ "Avoid for a single control whose change applies at once, such as a Switch in a settings row." ], "description": "Base UI form root for validation, submission, reset, and server errors.", "knownLimitations": [ "Kit Buttons default to type=\"button\"; give the submit button type=\"submit\".", "An async Field validate does not stop onSubmit from running; await a server check in the submission handler." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "form" ], "useWhen": [ "Use to submit related fields together, with validation, a reset and errors returned by the server." ] } }, { "name": "fieldset", "title": "Fieldset", "description": "Base UI fieldset and legend primitives for semantic control groups, with a description the fieldset names in aria-describedby.", "dependencies": [ "@base-ui/react@1.7.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/fieldset/fieldset.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/fieldset/fieldset.tsx" }, { "path": "packages/ui/src/components/fieldset/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/fieldset/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/fieldset.md", "categories": [ "Forms & selection" ], "meta": { "avoidWhen": [ "Avoid for visual grouping only; use Card or Frame.", "Avoid expecting it to submit, validate or save: compose it within Form." ], "description": "Base UI fieldset and legend primitives for semantic control groups, with a description the fieldset names in aria-describedby.", "knownLimitations": [], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "fieldset" ], "useWhen": [ "Use to group related fields under a shared legend, such as an address or a set of notification options." ] } }, { "name": "icon-morphs", "title": "Icon Morphs", "description": "Menu button whose bars morph into a close icon. Search terms: actions.", "dependencies": [], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json" ], "files": [ { "path": "packages/ui/src/components/icon-morphs/icon-morphs.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/icon-morphs/icon-morphs.tsx" }, { "path": "packages/ui/src/components/icon-morphs/icon-morphs.css", "type": "registry:ui", "target": "~/src/siteplane/components/icon-morphs/icon-morphs.css" }, { "path": "packages/ui/src/components/icon-morphs/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/icon-morphs/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/icon-morphs.md", "categories": [ "Animated" ], "meta": { "avoidWhen": [ "Avoid for a toggle that does not open a menu or navigation; use Toggle." ], "description": "Menu button whose bars morph into a close icon.", "knownLimitations": [], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "icon-morphs", "icon morphs", "actions", "icon", "morphs" ], "useWhen": [ "Use for a menu button whose bars morph into a close icon while the navigation it controls is open." ] } }, { "name": "frame", "title": "Frame", "description": "Layered surface with headers, panels, descriptions and footers.", "dependencies": [], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/frame/frame.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/frame/frame.tsx" }, { "path": "packages/ui/src/components/frame/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/frame/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/frame.md", "categories": [ "Layout & utilities" ], "meta": { "avoidWhen": [ "Avoid for a single card with its own header and actions; use Card.", "Avoid for cards joined in a surrounding surface; use CardFrame." ], "description": "Layered surface with headers, panels, descriptions and footers.", "knownLimitations": [ "Frame owns presentation only: it holds no state and no behavior." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "frame" ], "useWhen": [ "Use to group raised panels, with a header and a footer, inside one shared surface." ] } }, { "name": "group", "title": "Group", "description": "Composition for visually joined controls, text segments, and separators.", "dependencies": [ "@base-ui/react@1.7.0", "class-variance-authority@0.7.1" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/separator.json" ], "files": [ { "path": "packages/ui/src/components/group/group.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/group/group.tsx" }, { "path": "packages/ui/src/components/group/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/group/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/group.md", "categories": [ "Forms & selection" ], "meta": { "avoidWhen": [ "Avoid when the controls need shared roving focus; use Toolbar.", "Avoid when the controls share a pressed selection; use Toggle Group." ], "description": "Composition for visually joined controls, text segments, and separators.", "knownLimitations": [ "Controls keep their own behavior and focus stops; Group adds no roving focus and no shared selection." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "group" ], "useWhen": [ "Use to join related controls, text segments and separators into one visual unit, such as a button beside an input." ] } }, { "name": "dialog", "title": "Dialog", "description": "Base UI-backed modal task boundary.", "dependencies": [ "@base-ui/react@1.7.0", "lucide-react@1.18.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/scroll-area.json" ], "files": [ { "path": "packages/ui/src/components/dialog/dialog.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/dialog/dialog.tsx" }, { "path": "packages/ui/src/components/dialog/dialog-internal.ts", "type": "registry:ui", "target": "~/src/siteplane/components/dialog/dialog-internal.ts" }, { "path": "packages/ui/src/components/dialog/dialog.css", "type": "registry:ui", "target": "~/src/siteplane/components/dialog/dialog.css" }, { "path": "packages/ui/src/components/dialog/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/dialog/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/dialog.md", "categories": [ "Overlays & disclosure" ], "meta": { "avoidWhen": [ "Avoid for a decision that must be made before continuing; use Alert Dialog.", "Avoid for short contextual content beside a trigger; use Popover." ], "description": "Base UI-backed modal task boundary.", "knownLimitations": [ "Do not wrap a submit button in DialogClose: it closes the dialog before the submission has succeeded." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "dialog" ], "useWhen": [ "Use for a focused task or a form in an overlay, with a title and a clear close action." ] } }, { "name": "combobox", "title": "Combobox", "description": "Searchable single- and multi-selection control with animated chips, grouped results and form integration.", "dependencies": [ "@base-ui/react@1.7.0", "lucide-react@1.18.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/scroll-area.json", "https://ui.siteplane.io/registry/v/1.4.2/motion.json" ], "files": [ { "path": "packages/ui/src/components/combobox/combobox.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/combobox/combobox.tsx" }, { "path": "packages/ui/src/components/combobox/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/combobox/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/combobox.md", "categories": [ "Forms & selection" ], "meta": { "avoidWhen": [ "Avoid when the options are few and need no search; use Select.", "Avoid when the text may differ from the suggestions; use Autocomplete." ], "description": "Searchable single- and multi-selection control with animated chips, grouped results and form integration.", "knownLimitations": [ "For async options the application owns fetching, stale results and the pending and error states." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "combobox" ], "useWhen": [ "Use to choose one or several options from a known list with search, such as assigning people or tags." ] } }, { "name": "locale", "title": "Locale Provider", "description": "React Aria locale boundary for localized components.", "dependencies": [ "react-aria-components@1.20.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/system/locale/siteplane-locale-provider.tsx", "type": "registry:lib", "target": "~/src/siteplane/system/locale/siteplane-locale-provider.tsx" } ], "type": "registry:lib" }, { "name": "avatar", "title": "Avatar", "description": "Image and fallback avatar compound component.", "dependencies": [ "@base-ui/react@1.7.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/avatar/avatar.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/avatar/avatar.tsx" }, { "path": "packages/ui/src/components/avatar/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/avatar/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/avatar.md", "categories": [ "Data display" ], "meta": { "avoidWhen": [ "Avoid for a decorative picture or a logo that is not an account; use an image.", "Avoid overlapping several avatars by hand; Avatar Group draws the overlap, the ring and the overflow count." ], "description": "Image and fallback avatar compound component.", "knownLimitations": [ "An image needs a meaningful alt. An avatar that shows only initials or an icon can take role=\"img\" and an aria-label.", "Navigation and upload are not managed, and the application supplies the status that the status dot shows." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "avatar" ], "useWhen": [ "Use to represent a person, team or account with an image that falls back to initials or an icon." ] } }, { "name": "avatar-group", "title": "Avatar Group", "description": "Show several people as a row of overlapping avatars with an optional overflow count. Search terms: avatar stack, facepile, members.", "dependencies": [ "@base-ui/react@1.7.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/badge.json" ], "files": [ { "path": "packages/ui/src/components/avatar-group/avatar-group.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/avatar-group/avatar-group.tsx" }, { "path": "packages/ui/src/components/avatar-group/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/avatar-group/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/avatar-group.md", "categories": [ "Data display" ], "meta": { "avoidWhen": [ "Avoid when every person needs a name on screen; list them, for example in a Resource List.", "Avoid for a single person; use Avatar." ], "description": "Show several people as a row of overlapping avatars with an optional overflow count.", "knownLimitations": [ "The application decides how many avatars to show and what the count says; the group does not measure or cut its children.", "The ring takes the color of the kit surface the group sits on, such as a Card, Dialog or Popover, and the page background elsewhere.", "The size prop sizes every avatar and the count, 24, 32, 40 or 48 px, and the overlap is a quarter of it; a size class on one avatar changes that avatar alone.", "The count needs an accessible name that says what it counts, for example visually hidden text after the number." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "avatar-group", "avatar group", "avatar stack", "facepile", "members", "people", "overflow count" ], "useWhen": [ "Use to show the people of a project, a team or a conversation in little space.", "Use with a count when a group has more members than it shows." ] } }, { "name": "badge", "title": "Badge", "description": "Polymorphic badge with semantic variants and responsive sizes.", "dependencies": [ "@base-ui/react@1.7.0", "class-variance-authority@0.7.1" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/badge/badge.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/badge/badge.tsx" }, { "path": "packages/ui/src/components/badge/badge.css", "type": "registry:ui", "target": "~/src/siteplane/components/badge/badge.css" }, { "path": "packages/ui/src/components/badge/badge-internal.ts", "type": "registry:ui", "target": "~/src/siteplane/components/badge/badge-internal.ts" }, { "path": "packages/ui/src/components/badge/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/badge/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/badge.md", "categories": [ "Data display" ], "meta": { "avoidWhen": [ "Avoid for the main action of a view; use Button.", "Avoid for feedback that must be announced: a badge is not a live region. Use Alert or Toast." ], "description": "Polymorphic badge with semantic variants and responsive sizes.", "knownLimitations": [ "A change of status is not announced; put changing feedback in a live region.", "A count needs a contextual accessible name, and decorative icons should be hidden from assistive technology." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "badge" ], "useWhen": [ "Use to label a status, a category or a count next to other content." ] } }, { "name": "card", "title": "Card", "description": "Structured application surface for related content and actions.", "dependencies": [ "@base-ui/react@1.7.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/card/card.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/card/card.tsx" }, { "path": "packages/ui/src/components/card/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/card/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/card.md", "categories": [ "Data display" ], "meta": { "avoidWhen": [ "Avoid turning a card that contains buttons into one large button; keep the controls separate.", "Avoid for raised panels that share one surface; use Frame." ], "description": "Structured application surface for related content and actions.", "knownLimitations": [ "The title parts render divs. Pass render={

} when the title belongs in the document outline." ], "providerNotes": [ "Card takes the density of SiteplaneUIProvider: \"compact\" pads its parts by 16 px instead of 20 px. The density prop of a card wins over the provider, and the --sp-rw-card-inset tokens win over both." ], "releaseStatus": "stable", "searchTerms": [ "card" ], "useWhen": [ "Use to group related content and actions on one surface, with an optional header, content and footer." ] } }, { "name": "alert", "title": "Alert", "description": "Persistent feedback with semantic tone, optional actions and an optional close control, inline, as a page banner or as a card band. Search terms: notice.", "dependencies": [ "class-variance-authority@0.7.1", "lucide-react@1.18.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/motion.json" ], "files": [ { "path": "packages/ui/src/components/alert/alert.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/alert/alert.tsx" }, { "path": "packages/ui/src/components/alert/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/alert/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/alert.md", "categories": [ "Feedback" ], "meta": { "avoidWhen": [ "Avoid for consequential modal decisions; use Alert Dialog.", "Avoid for transient status outside the content flow; use Toast." ], "description": "Persistent feedback with semantic tone, optional actions and an optional close control, inline, as a page banner or as a card band.", "knownLimitations": [], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "alert", "banner", "notice", "band" ], "useWhen": [ "Use for a message about the state of a page or a form that stays in the content flow, with a tone and optional actions.", "Use layout=\"banner\" for a problem that concerns the whole page, at its top, and layout=\"band\" for a problem of one card, under its header." ] } }, { "name": "empty-state", "title": "Empty State", "description": "Empty application-state explanation with media and actions.", "dependencies": [ "class-variance-authority@0.7.1" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/empty-state/empty-state.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/empty-state/empty-state.tsx" }, { "path": "packages/ui/src/components/empty-state/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/empty-state/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/empty-state.md", "categories": [ "Feedback" ], "meta": { "avoidWhen": [ "Avoid while data is loading; use Skeleton or Spinner.", "Avoid for an error on a page that still has content; use Alert." ], "description": "Empty application-state explanation with media and actions.", "knownLimitations": [], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "empty-state", "empty state", "empty", "state" ], "useWhen": [ "Use after loading has settled, to explain why a collection is empty and what to do next, with optional media and actions." ] } }, { "name": "skeleton", "title": "Skeleton", "description": "Decorative loading placeholder with consumer-owned geometry.", "dependencies": [], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/skeleton/skeleton.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/skeleton/skeleton.tsx" }, { "path": "packages/ui/src/components/skeleton/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/skeleton/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/skeleton.md", "categories": [ "Feedback" ], "meta": { "avoidWhen": [ "Avoid for an operation with measurable progress; use Progress.", "Avoid when the layout of the result is unknown; use Spinner." ], "description": "Decorative loading placeholder with consumer-owned geometry.", "knownLimitations": [ "Skeletons are decorative and hidden from assistive technology; the surrounding region owns the busy state and the loading announcement." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "skeleton" ], "useWhen": [ "Use to reserve space for content that is loading, sized like the content that replaces it." ] } }, { "name": "spinner", "title": "Spinner", "description": "Indeterminate loading status with seven visual variants and reduced-motion behavior.", "dependencies": [ "lucide-react@1.18.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/spinner/spinner.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/spinner/spinner.tsx" }, { "path": "packages/ui/src/components/spinner/spinner.css", "type": "registry:ui", "target": "~/src/siteplane/components/spinner/spinner.css" }, { "path": "packages/ui/src/components/spinner/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/spinner/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/spinner.md", "categories": [ "Feedback" ], "meta": { "avoidWhen": [ "Avoid when completion is measurable; use Progress.", "Avoid for content that loads into a known layout; use Skeleton." ], "description": "Indeterminate loading status with seven visual variants and reduced-motion behavior.", "knownLimitations": [ "A spinner does not start, cancel or finish a request; the application owns the pending and error state." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "spinner" ], "useWhen": [ "Use to show that an operation is in progress when its length is unknown, on its own, inside a button or in an input." ] } }, { "name": "stepper", "title": "Stepper", "description": "Ordered workflow progress with read-only and native button items.", "dependencies": [ "class-variance-authority@0.7.1", "lucide-react@1.18.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/motion.json" ], "files": [ { "path": "packages/ui/src/components/stepper/stepper.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/stepper/stepper.tsx" }, { "path": "packages/ui/src/components/stepper/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/stepper/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/stepper.md", "categories": [ "Data display" ], "meta": { "avoidWhen": [ "Avoid for panels that people switch between freely; use Tabs.", "Avoid for a plain percentage of completion; use Progress." ], "description": "Ordered workflow progress with read-only and native button items.", "knownLimitations": [ "Keep one item per step mounted between renders, with a stable key. The marker, the description and the connector then change in place and the content opens and closes; replacing one item component with another remounts the step.", "A step's content is the children of its item. A body that is closing is inert, so focus inside it is lost when it closes; move focus first." ], "providerNotes": [ "Depends on the motion component, which the registry installs with the stepper.", "SiteplaneMotionProvider preset=\"reduced\" and the system setting make every change instant." ], "releaseStatus": "stable", "searchTerms": [ "stepper" ], "useWhen": [ "Use to show ordered steps and which are done, current or blocked, with optional content for the open step." ] } }, { "name": "code", "title": "Code", "description": "Inline and block code with optional reveal and clipboard actions.", "dependencies": [ "class-variance-authority@0.7.1" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/action-icons.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/copy-button.json" ], "files": [ { "path": "packages/ui/src/components/code/code.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/code/code.tsx" }, { "path": "packages/ui/src/components/code/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/code/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/code.md", "categories": [ "Layout & utilities" ], "meta": { "avoidWhen": [ "Avoid for syntax-highlighted listings; Code does not highlight.", "Avoid masking as protection for a secret: a masked value still reaches the browser." ], "description": "Inline and block code with optional reveal and clipboard actions.", "knownLimitations": [ "Copying depends on browser permissions and a secure context; a failed copy is shown on the button.", "A reveal by the person survives a new value and resets when mask changes." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "code" ], "useWhen": [ "Use to show inline code, or a block of text that people can copy and that can stay masked until revealed." ] } }, { "name": "kbd", "title": "Keyboard Key", "description": "Keyboard input notation for keys and grouped shortcuts.", "dependencies": [], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/kbd/kbd.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/kbd/kbd.tsx" }, { "path": "packages/ui/src/components/kbd/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/kbd/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/kbd.md", "categories": [ "Layout & utilities" ], "meta": { "avoidWhen": [ "Avoid showing a shortcut as the only way to discover an action.", "Avoid for code; use Code." ], "description": "Keyboard input notation for keys and grouped shortcuts.", "knownLimitations": [], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "kbd", "keyboard key" ], "useWhen": [ "Use to show a key or a keyboard shortcut inside text, a button or a menu item." ] } }, { "name": "separator", "title": "Separator", "description": "Base UI separator with horizontal and vertical orientation.", "dependencies": [ "@base-ui/react@1.7.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/separator/separator.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/separator/separator.tsx" }, { "path": "packages/ui/src/components/separator/separator-internal.ts", "type": "registry:ui", "target": "~/src/siteplane/components/separator/separator-internal.ts" }, { "path": "packages/ui/src/components/separator/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/separator/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/separator.md", "categories": [ "Layout & utilities" ], "meta": { "avoidWhen": [ "Avoid as the only structure of a page; name content groups with headings.", "Avoid for spacing alone; use gap or margin." ], "description": "Base UI separator with horizontal and vertical orientation.", "knownLimitations": [], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "separator" ], "useWhen": [ "Use to divide related sections or controls with a horizontal or vertical line." ] } }, { "name": "progress", "title": "Progress", "description": "Native determinate or indeterminate task progress.", "dependencies": [ "@base-ui/react@1.7.0", "class-variance-authority@0.7.1" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/progress/progress.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/progress/progress.tsx" }, { "path": "packages/ui/src/components/progress/progress.css", "type": "registry:ui", "target": "~/src/siteplane/components/progress/progress.css" }, { "path": "packages/ui/src/components/progress/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/progress/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/progress.md", "categories": [ "Feedback" ], "meta": { "avoidWhen": [ "Avoid for a measurement within a known range, such as storage used; use Meter.", "Avoid for a short wait without measurable progress; use Spinner." ], "description": "Native determinate or indeterminate task progress.", "knownLimitations": [ "Timing, cancellation and failures belong to the application; keep the accessible label stable as the value changes." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "progress" ], "useWhen": [ "Use to show how much of an operation has completed, or that it is running when the amount is unknown." ] } }, { "name": "meter", "title": "Meter", "description": "Show a measurement within a known range, such as storage used, with an optional status tone.", "dependencies": [ "@base-ui/react@1.7.0", "class-variance-authority@0.7.1" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/meter/meter.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/meter/meter.tsx" }, { "path": "packages/ui/src/components/meter/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/meter/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/meter.md", "categories": [ "Feedback" ], "meta": { "avoidWhen": [ "Avoid for the completion of a task; use Progress.", "Avoid for an unknown or loading state, which Meter has no display for." ], "description": "Show a measurement within a known range, such as storage used, with an optional status tone.", "knownLimitations": [ "There are no low, high or optimum thresholds; the application sets the tone." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "meter" ], "useWhen": [ "Use to show a measurement within a known range, such as storage used or a score." ] } }, { "name": "textarea", "title": "Textarea", "description": "Base UI-backed multi-line text control.", "dependencies": [ "@base-ui/react@1.7.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "files": [ { "path": "packages/ui/src/components/textarea/textarea.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/textarea/textarea.tsx" }, { "path": "packages/ui/src/components/textarea/textarea-internal.ts", "type": "registry:ui", "target": "~/src/siteplane/components/textarea/textarea-internal.ts" }, { "path": "packages/ui/src/components/textarea/textarea.css", "type": "registry:ui", "target": "~/src/siteplane/components/textarea/textarea.css" }, { "path": "packages/ui/src/components/textarea/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/textarea/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/textarea.md", "categories": [ "Forms & selection" ], "meta": { "avoidWhen": [ "Avoid for a single line; use Input.", "Avoid for formatted text: Textarea edits plain text." ], "description": "Base UI-backed multi-line text control.", "knownLimitations": [ "There is no autoGrow prop: the field grows with its content through field-sizing: content, where the browser supports it, and shows no resize grip there; elsewhere it keeps a vertical grip." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "textarea" ], "useWhen": [ "Use for text of several lines, such as a message or a description, that grows with its content." ] } }, { "name": "checkbox", "title": "Checkbox", "description": "Base UI-backed Boolean form choice.", "dependencies": [ "@base-ui/react@1.7.0", "class-variance-authority@0.7.1" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/checkbox/checkbox.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/checkbox/checkbox.tsx" }, { "path": "packages/ui/src/components/checkbox/checkbox-internal.ts", "type": "registry:ui", "target": "~/src/siteplane/components/checkbox/checkbox-internal.ts" }, { "path": "packages/ui/src/components/checkbox/checkbox.css", "type": "registry:ui", "target": "~/src/siteplane/components/checkbox/checkbox.css" }, { "path": "packages/ui/src/components/checkbox/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/checkbox/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/checkbox.md", "categories": [ "Forms & selection" ], "meta": { "avoidWhen": [ "Avoid for several related choices; use Checkbox Group.", "Avoid for exactly one choice from a set; use Radio Group.", "Avoid for a setting that applies at once; use Switch." ], "description": "Base UI-backed Boolean form choice.", "knownLimitations": [], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "checkbox" ], "useWhen": [ "Use for an independent yes-or-no choice, such as accepting terms or selecting a row." ] } }, { "name": "checkbox-group", "title": "Checkbox Group", "description": "Base UI-backed related multi-selection group.", "dependencies": [ "@base-ui/react@1.7.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/checkbox.json" ], "files": [ { "path": "packages/ui/src/components/checkbox-group/checkbox-group.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/checkbox-group/checkbox-group.tsx" }, { "path": "packages/ui/src/components/checkbox-group/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/checkbox-group/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/checkbox-group.md", "categories": [ "Forms & selection" ], "meta": { "avoidWhen": [ "Avoid for one independent choice; use Checkbox.", "Avoid when only one option may be chosen; use Radio Group." ], "description": "Base UI-backed related multi-selection group.", "knownLimitations": [], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "checkbox-group", "checkbox group", "checkbox", "group" ], "useWhen": [ "Use for any number of related options that share a label, with an optional parent checkbox that selects all." ] } }, { "name": "radio-group", "title": "Radio Group", "description": "Base UI-backed single-selection form group.", "dependencies": [ "@base-ui/react@1.7.0", "class-variance-authority@0.7.1" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/radio-group/radio-group.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/radio-group/radio-group.tsx" }, { "path": "packages/ui/src/components/radio-group/radio-group-internal.ts", "type": "registry:ui", "target": "~/src/siteplane/components/radio-group/radio-group-internal.ts" }, { "path": "packages/ui/src/components/radio-group/radio-group.css", "type": "registry:ui", "target": "~/src/siteplane/components/radio-group/radio-group.css" }, { "path": "packages/ui/src/components/radio-group/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/radio-group/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/radio-group.md", "categories": [ "Forms & selection" ], "meta": { "avoidWhen": [ "Avoid for several independent choices; use Checkbox Group.", "Avoid for a long list of options; use Select." ], "description": "Base UI-backed single-selection form group.", "knownLimitations": [], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "radio-group", "radio group", "radio", "group" ], "useWhen": [ "Use to choose exactly one option from a short, visible set." ] } }, { "name": "switch", "title": "Switch", "description": "Base UI-backed on/off preference control.", "dependencies": [ "@base-ui/react@1.7.0", "class-variance-authority@0.7.1" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/switch/switch.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/switch/switch.tsx" }, { "path": "packages/ui/src/components/switch/switch-internal.ts", "type": "registry:ui", "target": "~/src/siteplane/components/switch/switch-internal.ts" }, { "path": "packages/ui/src/components/switch/switch.css", "type": "registry:ui", "target": "~/src/siteplane/components/switch/switch.css" }, { "path": "packages/ui/src/components/switch/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/switch/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/switch.md", "categories": [ "Forms & selection" ], "meta": { "avoidWhen": [ "Avoid for a choice that applies only after a submit; use Checkbox.", "Avoid for several related choices; use Checkbox Group, or Radio Group for exactly one." ], "description": "Base UI-backed on/off preference control.", "knownLimitations": [ "Switch has no indeterminate state." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "switch" ], "useWhen": [ "Use for a setting that is on or off and applies at once, such as a notification preference." ] } }, { "name": "toggle", "title": "Toggle", "description": "Base UI-backed pressed-state action.", "dependencies": [ "@base-ui/react@1.7.0", "class-variance-authority@0.7.1" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/toggle/toggle.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/toggle/toggle.tsx" }, { "path": "packages/ui/src/components/toggle/toggle-internal.ts", "type": "registry:ui", "target": "~/src/siteplane/components/toggle/toggle-internal.ts" }, { "path": "packages/ui/src/components/toggle/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/toggle/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/toggle.md", "categories": [ "Actions" ], "meta": { "avoidWhen": [ "Avoid for a setting in a form; use Switch or Checkbox.", "Avoid for a single action; use Button." ], "description": "Base UI-backed pressed-state action.", "knownLimitations": [ "Toggle submits no boolean form value; use Checkbox or Switch, or serialize the state yourself." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "toggle" ], "useWhen": [ "Use for a button that stays pressed or unpressed, such as bold in a toolbar." ] } }, { "name": "toggle-group", "title": "Toggle Group", "description": "Base UI-backed single or multiple pressed selection.", "dependencies": [ "@base-ui/react@1.7.0", "class-variance-authority@0.7.1" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/separator.json", "https://ui.siteplane.io/registry/v/1.4.2/toggle.json" ], "files": [ { "path": "packages/ui/src/components/toggle-group/toggle-group.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/toggle-group/toggle-group.tsx" }, { "path": "packages/ui/src/components/toggle-group/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/toggle-group/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/toggle-group.md", "categories": [ "Actions" ], "meta": { "avoidWhen": [ "Avoid for switching content panels; use Tabs.", "Avoid for a form choice that is submitted; use Radio Group or Checkbox Group." ], "description": "Base UI-backed single or multiple pressed selection.", "knownLimitations": [ "Unlike Radio Group, a single selected item can be cleared." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "toggle-group", "toggle group", "toggle", "group" ], "useWhen": [ "Use for a set of related pressed-state buttons with single or multiple selection, such as text alignment or a view mode." ] } }, { "name": "number-field", "title": "Number Field", "description": "Base UI-backed numeric entry and stepping.", "dependencies": [ "@base-ui/react@1.7.0", "lucide-react@1.18.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/label.json" ], "files": [ { "path": "packages/ui/src/components/number-field/number-field.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/number-field/number-field.tsx" }, { "path": "packages/ui/src/components/number-field/number-field.css", "type": "registry:ui", "target": "~/src/siteplane/components/number-field/number-field.css" }, { "path": "packages/ui/src/components/number-field/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/number-field/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/number-field.md", "categories": [ "Forms & selection" ], "meta": { "avoidWhen": [ "Avoid for a value chosen along a range where precision is not needed; use Slider.", "Avoid for digit codes such as a PIN; use OTP Field." ], "description": "Base UI-backed numeric entry and stepping.", "knownLimitations": [], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "number-field", "number field", "number", "field" ], "useWhen": [ "Use for a number that people type, step with the arrow keys or buttons, or scrub, such as a quantity." ] } }, { "name": "otp-field", "title": "OTP Field", "description": "Segmented fixed-length input for one-time passwords, verification codes and recovery codes. Search terms: joined.", "dependencies": [ "@base-ui/react@1.7.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/input-group.json", "https://ui.siteplane.io/registry/v/1.4.2/label.json", "https://ui.siteplane.io/registry/v/1.4.2/separator.json" ], "files": [ { "path": "packages/ui/src/components/otp-field/otp-field.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/otp-field/otp-field.tsx" }, { "path": "packages/ui/src/components/otp-field/otp-field.css", "type": "registry:ui", "target": "~/src/siteplane/components/otp-field/otp-field.css" }, { "path": "packages/ui/src/components/otp-field/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/otp-field/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/otp-field.md", "categories": [ "Forms & selection" ], "meta": { "avoidWhen": [ "Avoid for a code of variable length or free text; use Input." ], "description": "Segmented fixed-length input for one-time passwords, verification codes and recovery codes.", "knownLimitations": [ "A completed code is not verified: the server validates it and limits retries." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "otp-field", "otp field", "otp", "field", "joined" ], "useWhen": [ "Use to enter a short code of fixed length, such as a one-time password, a verification code or a recovery code." ] } }, { "name": "slider", "title": "Slider", "description": "Scalar, range, discrete-label and form slider.", "dependencies": [ "@base-ui/react@1.7.0", "class-variance-authority@0.7.1" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/slider/slider.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/slider/slider.tsx" }, { "path": "packages/ui/src/components/slider/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/slider/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/slider.md", "categories": [ "Forms & selection" ], "meta": { "avoidWhen": [ "Avoid when people need to enter a precise value; use Number Field.", "Avoid for a choice among a few named options; use Radio Group or Toggle Group." ], "description": "Scalar, range, discrete-label and form slider.", "knownLimitations": [ "Chromium may report the hidden native range input as missing an accessible label." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "slider" ], "useWhen": [ "Use to choose a number or a range by moving one or more thumbs when an approximate value is enough." ] } }, { "name": "alert-dialog", "title": "Alert Dialog", "description": "Modal confirmation dialog for consequential actions.", "dependencies": [ "@base-ui/react@1.7.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/alert-dialog/alert-dialog.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/alert-dialog/alert-dialog.tsx" }, { "path": "packages/ui/src/components/alert-dialog/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/alert-dialog/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/alert-dialog.md", "categories": [ "Overlays & disclosure" ], "meta": { "avoidWhen": [ "Avoid for a task with fields or several steps; use Dialog.", "Avoid for a message that asks for no decision; use Alert or Toast." ], "description": "Modal confirmation dialog for consequential actions.", "knownLimitations": [ "The dialog does not run or await the confirmed action. For an asynchronous confirmation, keep the root controlled and close it after the request succeeds." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "alert-dialog", "alert dialog", "alert", "dialog" ], "useWhen": [ "Use for a decision people must make before they continue, such as deleting a project or discarding changes." ] } }, { "name": "drawer", "title": "Drawer", "description": "Swipe-aware modal panel anchored to a viewport edge.", "dependencies": [ "@base-ui/react@1.7.0", "lucide-react@1.18.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/checkbox.json", "https://ui.siteplane.io/registry/v/1.4.2/menu.json", "https://ui.siteplane.io/registry/v/1.4.2/radio-group.json", "https://ui.siteplane.io/registry/v/1.4.2/scroll-area.json", "https://ui.siteplane.io/registry/v/1.4.2/switch.json" ], "files": [ { "path": "packages/ui/src/components/drawer/drawer.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/drawer/drawer.tsx" }, { "path": "packages/ui/src/components/drawer/drawer.css", "type": "registry:ui", "target": "~/src/siteplane/components/drawer/drawer.css" }, { "path": "packages/ui/src/components/drawer/drawer-menu-shared.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/drawer/drawer-menu-shared.tsx" }, { "path": "packages/ui/src/components/drawer/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/drawer/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/drawer.md", "categories": [ "Overlays & disclosure" ], "meta": { "avoidWhen": [ "Avoid when swipe dismissal is not wanted; use Sheet.", "Avoid for a centered task; use Dialog." ], "description": "Swipe-aware modal panel anchored to a viewport edge.", "knownLimitations": [ "Swipe is not the only way to close: keep a visible close action." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "drawer" ], "useWhen": [ "Use for a panel that slides in from a viewport edge and closes with a swipe, such as a mobile menu or a list of actions." ] } }, { "name": "sheet", "title": "Sheet", "description": "Dialog-backed edge flyout for forms and save/cancel workflows.", "dependencies": [ "@base-ui/react@1.7.0", "lucide-react@1.18.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/scroll-area.json" ], "files": [ { "path": "packages/ui/src/components/sheet/sheet.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/sheet/sheet.tsx" }, { "path": "packages/ui/src/components/sheet/sheet-internal.ts", "type": "registry:ui", "target": "~/src/siteplane/components/sheet/sheet-internal.ts" }, { "path": "packages/ui/src/components/sheet/sheet.css", "type": "registry:ui", "target": "~/src/siteplane/components/sheet/sheet.css" }, { "path": "packages/ui/src/components/sheet/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/sheet/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/sheet.md", "categories": [ "Overlays & disclosure" ], "meta": { "avoidWhen": [ "Avoid for a decision that needs an answer before continuing; use Alert Dialog.", "Avoid when swipe dismissal is wanted; use Drawer." ], "description": "Dialog-backed edge flyout for forms and save/cancel workflows.", "knownLimitations": [], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "sheet" ], "useWhen": [ "Use for a form or a short task in a panel at the edge of the screen, with save and cancel actions." ] } }, { "name": "popover", "title": "Popover", "description": "Anchored non-modal surface for contextual content.", "dependencies": [ "@base-ui/react@1.7.0", "lucide-react@1.18.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json" ], "files": [ { "path": "packages/ui/src/components/popover/popover.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/popover/popover.tsx" }, { "path": "packages/ui/src/components/popover/popover-motion.ts", "type": "registry:ui", "target": "~/src/siteplane/components/popover/popover-motion.ts" }, { "path": "packages/ui/src/components/popover/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/popover/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/popover.md", "categories": [ "Overlays & disclosure" ], "meta": { "avoidWhen": [ "Avoid for a short label on hover or focus; use Tooltip.", "Avoid for a task or a decision that needs the whole focus of the screen; use Dialog." ], "description": "Anchored non-modal surface for contextual content.", "knownLimitations": [], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "popover" ], "useWhen": [ "Use for contextual content beside a trigger that people can interact with, such as fields, buttons or a short form." ] } }, { "name": "tooltip", "title": "Tooltip", "description": "Short contextual label for hoverable or focusable controls.", "dependencies": [ "@base-ui/react@1.7.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/tooltip/tooltip.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/tooltip/tooltip.tsx" }, { "path": "packages/ui/src/components/tooltip/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/tooltip/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/tooltip.md", "categories": [ "Overlays & disclosure" ], "meta": { "avoidWhen": [ "Avoid for interactive content; use Popover.", "Avoid for essential instructions: do not make them hover-only." ], "description": "Short contextual label for hoverable or focusable controls.", "knownLimitations": [], "providerNotes": [ "Mount TooltipProvider once at the application root. It defaults to a 700ms opening delay and a 550ms warm re-hover window; both remain configurable." ], "releaseStatus": "stable", "searchTerms": [ "tooltip" ], "useWhen": [ "Use for a short, non-essential label on a control that people hover or focus, such as the name of an icon button." ] } }, { "name": "preview-card", "title": "Preview Card", "description": "Anchored hover and focus preview for linked content.", "dependencies": [ "@base-ui/react@1.7.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/preview-card/preview-card.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/preview-card/preview-card.tsx" }, { "path": "packages/ui/src/components/preview-card/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/preview-card/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/preview-card.md", "categories": [ "Overlays & disclosure" ], "meta": { "avoidWhen": [ "Avoid for required content or actions: the card is supplementary. Use Popover or Dialog.", "Avoid when the link is not understandable without the preview." ], "description": "Anchored hover and focus preview for linked content.", "knownLimitations": [], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "preview-card", "preview card", "preview", "card" ], "useWhen": [ "Use to preview the destination of a link on hover or focus without leaving the page." ] } }, { "name": "menu", "title": "Menu", "description": "Keyboard-navigable action and selection menu.", "dependencies": [ "@base-ui/react@1.7.0", "lucide-react@1.18.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/switch.json" ], "files": [ { "path": "packages/ui/src/components/menu/menu.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/menu/menu.tsx" }, { "path": "packages/ui/src/components/menu/menu-shared.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/menu/menu-shared.tsx" }, { "path": "packages/ui/src/components/menu/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/menu/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/menu.md", "categories": [ "Overlays & disclosure" ], "meta": { "avoidWhen": [ "Avoid for site navigation with panels of links; use Navigation Menu.", "Avoid for choosing a value in a form; use Select." ], "description": "Keyboard-navigable action and selection menu.", "knownLimitations": [ "Selection in the menu is menu state, not native form submission." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "menu" ], "useWhen": [ "Use for a compact list of actions or choices opened from a button, such as an account menu or the actions of a row." ] } }, { "name": "context-menu", "title": "Context Menu", "description": "Pointer and keyboard context menu sharing Menu presentation.", "dependencies": [ "@base-ui/react@1.7.0", "lucide-react@1.18.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/menu.json", "https://ui.siteplane.io/registry/v/1.4.2/switch.json" ], "files": [ { "path": "packages/ui/src/components/context-menu/context-menu.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/context-menu/context-menu.tsx" }, { "path": "packages/ui/src/components/context-menu/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/context-menu/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/context-menu.md", "categories": [ "Overlays & disclosure" ], "meta": { "avoidWhen": [ "Avoid as the only way to reach an action; people who do not find right-click need a visible Menu button as well.", "Avoid for navigation; use real links or Navigation Menu." ], "description": "Pointer and keyboard context menu sharing Menu presentation.", "knownLimitations": [ "Selection in the menu is menu state, not native form submission." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "context-menu", "context menu", "context", "menu" ], "useWhen": [ "Use for secondary actions on an element, opened by right-click or long press." ] } }, { "name": "accordion", "title": "Accordion", "description": "Single or multiple expandable disclosure sections.", "dependencies": [ "@base-ui/react@1.7.0", "lucide-react@1.18.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json" ], "files": [ { "path": "packages/ui/src/components/accordion/accordion.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/accordion/accordion.tsx" }, { "path": "packages/ui/src/components/accordion/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/accordion/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/accordion.md", "categories": [ "Overlays & disclosure" ], "meta": { "avoidWhen": [ "Avoid for a single disclosure; use Collapsible.", "Avoid when readers need to compare the content of several sections at once, since closed sections hide it." ], "description": "Single or multiple expandable disclosure sections.", "knownLimitations": [ "Enter or Space toggles a focused trigger and Tab moves between the triggers; arrow keys do not move focus.", "A trigger takes no other interactive control inside it." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "accordion" ], "useWhen": [ "Use for a list of related sections that people open one or several at a time, such as an FAQ or a group of settings." ] } }, { "name": "collapsible", "title": "Collapsible", "description": "Compact disclosure for a single section of content.", "dependencies": [ "@base-ui/react@1.7.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json" ], "files": [ { "path": "packages/ui/src/components/collapsible/collapsible.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/collapsible/collapsible.tsx" }, { "path": "packages/ui/src/components/collapsible/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/collapsible/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/collapsible.md", "categories": [ "Overlays & disclosure" ], "meta": { "avoidWhen": [ "Avoid for a related list of sections; use Accordion.", "Avoid expecting navigation or data loading: Collapsible only toggles visibility." ], "description": "Compact disclosure for a single section of content.", "knownLimitations": [], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "collapsible" ], "useWhen": [ "Use to show or hide one section of content, such as advanced options or a branch of a file tree." ] } }, { "name": "tabs", "title": "Tabs", "description": "Keyboard-navigable single-selection content panels.", "dependencies": [ "@base-ui/react@1.7.0", "lucide-react@1.18.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/motion.json" ], "files": [ { "path": "packages/ui/src/components/tabs/tabs.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/tabs/tabs.tsx" }, { "path": "packages/ui/src/components/tabs/tabs-overflow.ts", "type": "registry:ui", "target": "~/src/siteplane/components/tabs/tabs-overflow.ts" }, { "path": "packages/ui/src/components/tabs/tabs-geometry.ts", "type": "registry:ui", "target": "~/src/siteplane/components/tabs/tabs-geometry.ts" }, { "path": "packages/ui/src/components/tabs/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/tabs/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/tabs.md", "categories": [ "Navigation" ], "meta": { "avoidWhen": [ "Avoid for navigation between pages; use Navigation Menu or links.", "Avoid for a related list of expandable sections; use Accordion." ], "description": "Keyboard-navigable single-selection content panels.", "knownLimitations": [ "Hidden panels unmount unless keepMounted is set; keep costly state outside the panel.", "Switching tabs swaps the panels: the panel that leaves stays mounted until it has faded out and is taken out of the flow where it sits. The element that holds the panels follows the new height and is clipped while it does; a container that scrolls keeps its own height." ], "providerNotes": [ "Panel swaps and the scroll of a list whose tabs overflow use the motion package, which the registry installs with the component.", "SiteplaneMotionProvider preset=\"reduced\" and the system setting make a swap instant." ], "releaseStatus": "stable", "searchTerms": [ "tabs" ], "useWhen": [ "Use to switch between associated content panels, one visible at a time, within a page." ] } }, { "name": "toolbar", "title": "Toolbar", "description": "Keyboard-navigable group of application controls.", "dependencies": [ "@base-ui/react@1.7.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/separator.json" ], "files": [ { "path": "packages/ui/src/components/toolbar/toolbar.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/toolbar/toolbar.tsx" }, { "path": "packages/ui/src/components/toolbar/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/toolbar/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/toolbar.md", "categories": [ "Actions" ], "meta": { "avoidWhen": [ "Avoid for a few unrelated buttons; use plain Buttons or Group.", "Avoid for choosing among options; use Toggle Group." ], "description": "Keyboard-navigable group of application controls.", "knownLimitations": [], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "toolbar" ], "useWhen": [ "Use for a group of related actions that share one tab stop and arrow-key navigation, such as the formatting controls of an editor." ] } }, { "name": "toast", "title": "Toast", "description": "Transient status messages managed through a scoped provider.", "dependencies": [ "@base-ui/react@1.7.0", "lucide-react@1.18.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/spinner.json" ], "files": [ { "path": "packages/ui/src/components/toast/toast.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/toast/toast.tsx" }, { "path": "packages/ui/src/components/toast/toast.css", "type": "registry:ui", "target": "~/src/siteplane/components/toast/toast.css" }, { "path": "packages/ui/src/components/toast/toast-stack.ts", "type": "registry:ui", "target": "~/src/siteplane/components/toast/toast-stack.ts" }, { "path": "packages/ui/src/components/toast/toast-surface.ts", "type": "registry:ui", "target": "~/src/siteplane/components/toast/toast-surface.ts" }, { "path": "packages/ui/src/components/toast/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/toast/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/toast.md", "categories": [ "Feedback" ], "meta": { "avoidWhen": [ "Avoid for an error that blocks a task; keep it beside the field or use Alert Dialog.", "Avoid as the only place for a persistent form error." ], "description": "Transient status messages managed through a scoped provider.", "knownLimitations": [ "Each provider keeps its own toasts; with several providers at one position, the stack that received a toast last takes the edge." ], "providerNotes": [ "Mount ToastProvider once near the application root." ], "releaseStatus": "stable", "searchTerms": [ "toast" ], "useWhen": [ "Use for a short message after an action, such as Saved or Upload complete, that goes away by itself." ] } }, { "name": "scroll-area", "title": "Scroll Area", "description": "Bounded overflow region with native overlay scrollbars, optional edge fades and gutter handling.", "dependencies": [ "@base-ui/react@1.7.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/scroll-area/scroll-area.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/scroll-area/scroll-area.tsx" }, { "path": "packages/ui/src/components/scroll-area/scroll-area.css", "type": "registry:ui", "target": "~/src/siteplane/components/scroll-area/scroll-area.css" }, { "path": "packages/ui/src/components/scroll-area/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/scroll-area/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/scroll-area.md", "categories": [ "Layout & utilities" ], "meta": { "avoidWhen": [ "Avoid when the page itself can scroll; a nested scroll region adds a second place to scroll.", "Avoid hiding the scrollbars of content that people must find by scrolling." ], "description": "Bounded overflow region with native overlay scrollbars, optional edge fades and gutter handling.", "knownLimitations": [ "The viewport joins the tab order while its content overflows; name it with aria-label or aria-labelledby." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "scroll-area", "scroll area", "scroll", "area" ], "useWhen": [ "Use to constrain overflowing content to a fixed region, with styled scrollbars and optional edge fades." ] } }, { "name": "sidebar", "title": "Sidebar", "description": "Application navigation sidebar with desktop collapse and a mobile sheet.", "dependencies": [ "@base-ui/react@1.7.0", "lucide-react@1.18.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/scroll-area.json", "https://ui.siteplane.io/registry/v/1.4.2/separator.json", "https://ui.siteplane.io/registry/v/1.4.2/sheet.json", "https://ui.siteplane.io/registry/v/1.4.2/skeleton.json", "https://ui.siteplane.io/registry/v/1.4.2/tooltip.json" ], "files": [ { "path": "packages/ui/src/components/sidebar/sidebar.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/sidebar/sidebar.tsx" }, { "path": "packages/ui/src/components/sidebar/sidebar-internal.ts", "type": "registry:ui", "target": "~/src/siteplane/components/sidebar/sidebar-internal.ts" }, { "path": "packages/ui/src/components/sidebar/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/sidebar/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/sidebar.md", "categories": [ "Navigation" ], "meta": { "avoidWhen": [ "Avoid for a few top-level pages; a row of links with Navigation Menu is lighter." ], "description": "Application navigation sidebar with desktop collapse and a mobile sheet.", "knownLimitations": [ "The desktop state is written to the sidebar_state cookie but not read back; pass defaultOpen from the server or the application. stateCookie renames the cookie, and stateCookie={false} turns it off.", "The provider registers Ctrl/Cmd+B unless keyboardShortcut is false." ], "providerNotes": [ "Wrap the sidebar and the content beside it in one SidebarProvider, which holds the open state." ], "releaseStatus": "stable", "searchTerms": [ "sidebar" ], "useWhen": [ "Use for the main navigation of an application, such as grouped links with a workspace switcher and an account menu. It collapses on desktop and opens as a sheet on mobile." ] } }, { "name": "dropdown-menu", "title": "Dropdown Menu", "description": "The Menu under DropdownMenu-prefixed part names.", "dependencies": [], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/menu.json" ], "files": [ { "path": "packages/ui/src/components/dropdown-menu/dropdown-menu.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/dropdown-menu/dropdown-menu.tsx" }, { "path": "packages/ui/src/components/dropdown-menu/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/dropdown-menu/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/dropdown-menu.md", "categories": [ "Overlays & disclosure" ], "meta": { "avoidWhen": [ "Avoid mixing it with the Menu part names in one menu; both are the same component." ], "description": "The Menu under DropdownMenu-prefixed part names.", "knownLimitations": [ "DropdownMenu re-exports Menu. Its behavior, styling and API are Menu's, and only the part names differ." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "dropdown-menu", "dropdown menu", "dropdown", "menu" ], "useWhen": [ "Use when you want DropdownMenu-prefixed part names, such as DropdownMenuContent, for a menu opened from a button." ] } }, { "name": "select", "title": "Select", "description": "Single- and multiple-selection popup with grouped, polymorphic and form-integrated controls.", "dependencies": [ "@base-ui/react@1.7.0", "lucide-react@1.18.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/separator.json" ], "files": [ { "path": "packages/ui/src/components/select/select.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/select/select.tsx" }, { "path": "packages/ui/src/components/select/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/select/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/select.md", "categories": [ "Forms & selection" ], "meta": { "avoidWhen": [ "Avoid when people need to search the options; use Combobox.", "Avoid for text that may differ from the options; use Autocomplete." ], "description": "Single- and multiple-selection popup with grouped, polymorphic and form-integrated controls.", "knownLimitations": [], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "select" ], "useWhen": [ "Use to choose one or several options from a fixed list, without text filtering." ] } }, { "name": "autocomplete", "title": "Autocomplete", "description": "Text input with suggestions and no selection state.", "dependencies": [ "@base-ui/react@1.7.0", "lucide-react@1.18.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/scroll-area.json", "https://ui.siteplane.io/registry/v/1.4.2/separator.json" ], "files": [ { "path": "packages/ui/src/components/autocomplete/autocomplete.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/autocomplete/autocomplete.tsx" }, { "path": "packages/ui/src/components/autocomplete/autocomplete-internal.ts", "type": "registry:ui", "target": "~/src/siteplane/components/autocomplete/autocomplete-internal.ts" }, { "path": "packages/ui/src/components/autocomplete/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/autocomplete/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/autocomplete.md", "categories": [ "Forms & selection" ], "meta": { "avoidWhen": [ "Avoid when the value must be one of the options; use Combobox.", "Avoid when there is no typing and the options are fixed; use Select." ], "description": "Text input with suggestions and no selection state.", "knownLimitations": [ "The value is the text itself and there is no selected item. Use Combobox when the value must come from the list.", "Fetching, stale results and pending or error states for async suggestions belong to the application." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "autocomplete" ], "useWhen": [ "Use for a text input that suggests completions while it still accepts free text, such as a search box or an address line." ] } }, { "name": "timeline", "title": "Timeline", "description": "Ordered event history with semantic and shaped markers.", "dependencies": [ "class-variance-authority@0.7.1" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/motion.json" ], "files": [ { "path": "packages/ui/src/components/timeline/timeline.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/timeline/timeline.tsx" }, { "path": "packages/ui/src/components/timeline/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/timeline/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/timeline.md", "categories": [ "Data display" ], "meta": { "avoidWhen": [ "Avoid for steps that people move through; use Stepper.", "Avoid for history that people sort or filter; use Table." ], "description": "Ordered event history with semantic and shaped markers.", "knownLimitations": [ "Added, removed and reordered events animate on their own. Give every event a stable key: an index as the key makes a removed event leave as its neighbor.", "Events must be direct children of the timeline, not wrapped in a fragment; a fragment around several events is treated as one.", "A leaving event is inert, so focus inside it is lost when it leaves. Move focus before removing it." ], "providerNotes": [ "Depends on the motion component, which the registry installs with the timeline.", "SiteplaneMotionProvider preset=\"reduced\" and the system setting make every change instant." ], "releaseStatus": "stable", "searchTerms": [ "timeline" ], "useWhen": [ "Use to present events in chronological order with markers, such as an order history or an audit trail." ] } }, { "name": "table", "title": "Table", "description": "React Aria table with composable rows and cells plus optional sorting, row or checkbox selection, captions and footers.", "dependencies": [ "lucide-react@1.18.0", "react-aria-components@1.20.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/table/table.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/table/table.tsx" }, { "path": "packages/ui/src/components/table/table-shared.ts", "type": "registry:ui", "target": "~/src/siteplane/components/table/table-shared.ts" }, { "path": "packages/ui/src/components/table/table.css", "type": "registry:ui", "target": "~/src/siteplane/components/table/table.css" }, { "path": "packages/ui/src/components/table/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/table/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/table.md", "categories": [ "Data display" ], "meta": { "avoidWhen": [ "Avoid for a short list of labeled values or resources; use Settings List or Resource List." ], "description": "React Aria table with composable rows and cells plus optional sorting, row or checkbox selection, captions and footers.", "knownLimitations": [ "The table renders every row it is given and does not virtualize; page or virtualize large collections in the application." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "table", "sorting", "selection" ], "useWhen": [ "Use when structured tabular data needs accessible navigation with optional sorting or selection." ] } }, { "name": "tag-group", "title": "Tag Group", "description": "React Aria tag collection with controlled or uncontrolled selection, accessible removal and focus recovery. Search terms: tags, labels.", "dependencies": [ "lucide-react@1.18.0", "motion@12.43.0", "react-aria-components@1.20.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/badge.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/motion.json" ], "files": [ { "path": "packages/ui/src/components/tag-group/tag-group.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/tag-group/tag-group.tsx" }, { "path": "packages/ui/src/components/tag-group/tag-group-leaving.ts", "type": "registry:ui", "target": "~/src/siteplane/components/tag-group/tag-group-leaving.ts" }, { "path": "packages/ui/src/components/tag-group/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/tag-group/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/tag-group.md", "categories": [ "Data display" ], "meta": { "avoidWhen": [ "Avoid when every item is a persistent toggle and removal is not part of the collection workflow." ], "description": "React Aria tag collection with controlled or uncontrolled selection, accessible removal and focus recovery.", "knownLimitations": [ "Give every Tag a stable key. An index as the key makes a removed tag leave as its neighbor.", "A tag that has been removed stays on screen as a picture, inert and hidden from assistive technology, until it has faded out. Focus has moved on as soon as it is removed.", "Each tag sits in a wrapper element inside the grid, so a selector that expects the tags to be direct children of the group does not match." ], "providerNotes": [ "Depends on the motion component, which the registry installs with the TagGroup.", "SiteplaneMotionProvider preset=\"reduced\" and the system setting make added and removed tags change at once." ], "releaseStatus": "stable", "searchTerms": [ "tag-group", "tags", "labels", "selection", "removal" ], "useWhen": [ "Use when a compact visible collection of labels can be selected, removed or both.", "Use when labels are added and removed over time and the group should neither jump nor push the content below it." ] } }, { "name": "command", "title": "Command", "description": "Searchable keyboard-first action collection.", "dependencies": [], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/autocomplete.json", "https://ui.siteplane.io/registry/v/1.4.2/dialog.json", "https://ui.siteplane.io/registry/v/1.4.2/kbd.json", "https://ui.siteplane.io/registry/v/1.4.2/separator.json" ], "files": [ { "path": "packages/ui/src/components/command/command.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/command/command.tsx" }, { "path": "packages/ui/src/components/command/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/command/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/command.md", "categories": [ "Navigation" ], "meta": { "avoidWhen": [ "Avoid for a short fixed list of actions; use Menu.", "Avoid for text suggestions in a form field; use Autocomplete." ], "description": "Searchable keyboard-first action collection.", "knownLimitations": [ "Command registers no global shortcut, runs no command, keeps no history and navigates nothing by itself; the application wires these up." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "command" ], "useWhen": [ "Use for a searchable list of actions that people run with the keyboard, inline or in a dialog." ] } }, { "name": "pagination", "title": "Pagination", "description": "Navigation between the pages of a long list or table, built from Button links.", "dependencies": [ "lucide-react@1.18.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json" ], "files": [ { "path": "packages/ui/src/components/pagination/pagination.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/pagination/pagination.tsx" }, { "path": "packages/ui/src/components/pagination/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/pagination/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/pagination.md", "categories": [ "Navigation" ], "meta": { "avoidWhen": [ "Avoid for infinite scrolling or a Load more action; use Button.", "Avoid for a handful of sections; use Tabs." ], "description": "Navigation between the pages of a long list or table, built from Button links.", "knownLimitations": [ "Page count, slicing, URL state and data fetching are not built in; the application owns them." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "pagination" ], "useWhen": [ "Use to move between the pages of a long list or table when the application owns the page state." ] } }, { "name": "breadcrumb", "title": "Breadcrumb", "description": "Semantic hierarchy trail with native navigation links.", "dependencies": [ "@base-ui/react@1.7.0", "lucide-react@1.18.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/breadcrumb/breadcrumb.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/breadcrumb/breadcrumb.tsx" }, { "path": "packages/ui/src/components/breadcrumb/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/breadcrumb/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/breadcrumb.md", "categories": [ "Navigation" ], "meta": { "avoidWhen": [ "Avoid for steps in a process; use Stepper.", "Avoid as the only navigation of an application: it shows one path, not the structure." ], "description": "Semantic hierarchy trail with native navigation links.", "knownLimitations": [], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "breadcrumb" ], "useWhen": [ "Use to show where the current page sits in a hierarchy and to link to the levels above it." ] } }, { "name": "dashboard-shell", "title": "Dashboard Shell", "description": "Responsive application frame with a sidebar, a header and scrolling content. Search terms: sticky header.", "dependencies": [], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/sidebar.json" ], "files": [ { "path": "packages/ui/src/components/dashboard-shell/dashboard-shell.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/dashboard-shell/dashboard-shell.tsx" }, { "path": "packages/ui/src/components/dashboard-shell/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/dashboard-shell/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/dashboard-shell.md", "categories": [ "Navigation" ], "meta": { "avoidWhen": [ "Avoid for pages without persistent navigation, such as a marketing page.", "Avoid more than one shell per page." ], "description": "Responsive application frame with a sidebar, a header and scrolling content.", "knownLimitations": [ "The shell adds layout only. Routing, authentication and page data stay with the application.", "By default (stickyHeader), DashboardShellMain is the only part that scrolls from the Sidebar's mobile breakpoint up, so the page's content belongs in it, and the header sticks only as a direct child of DashboardShellInset." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "dashboard-shell", "dashboard", "shell", "sticky header" ], "useWhen": [ "Use once at the boundary of a signed-in application to lay out its sidebar, header and scrolling content.", "Keep the default stickyHeader for a viewport-sized application whose header stays in view while the content scrolls; set stickyHeader={false} for a page that scrolls as a whole." ] } }, { "name": "filter-bar", "title": "Filter Bar", "description": "Responsive search, filter summary and action arrangement, with view tabs that open into a search field.", "dependencies": [ "lucide-react@1.18.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/motion.json", "https://ui.siteplane.io/registry/v/1.4.2/scroll-area.json", "https://ui.siteplane.io/registry/v/1.4.2/tabs.json" ], "files": [ { "path": "packages/ui/src/components/filter-bar/filter-bar.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/filter-bar/filter-bar.tsx" }, { "path": "packages/ui/src/components/filter-bar/filter-bar-tabs.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/filter-bar/filter-bar-tabs.tsx" }, { "path": "packages/ui/src/components/filter-bar/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/filter-bar/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/filter-bar.md", "categories": [ "Data display" ], "meta": { "avoidWhen": [ "Avoid for a collection that needs no search or filters; render the collection alone.", "Avoid FilterBarTabs when the search must stay visible beside the tabs; place FilterBarSearch next to a Tabs list instead." ], "description": "Responsive search, filter summary and action arrangement, with view tabs that open into a search field.", "knownLimitations": [ "FilterBar arranges controls only; the application owns the query, the filters and the filtering of the collection.", "FilterBarActiveFilters reads the bar's spacing from --filter-bar-gap (12 px, 8 px in the compact density). Change it on the FilterBar with [--filter-bar-gap:...], not with a gap utility, or the space above the active filters opens in one step.", "Tabs of FilterBarTabs that do not fit scroll inside the bar and fade at the edge where more wait. While they overflow, the scrolling strip takes a tab stop of its own, as a Scroll Area does.", "FilterBarTabs takes the rest of its row by default; grow={false} sizes it to its tabs, so its surface ends after the last tab." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "filter-bar", "filter", "bar", "search", "tabs" ], "useWhen": [ "Use to lay out search, filters, a summary of the active filters and actions above a collection.", "Use FilterBarTabs for a list with a few views, such as My projects and Starred, where the search shares the tab bar." ] } }, { "name": "detail-drawer", "title": "Detail Drawer", "description": "Right-side drawer for the details of a record, with an optional edit form.", "dependencies": [], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/drawer.json" ], "files": [ { "path": "packages/ui/src/components/detail-drawer/detail-drawer.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/detail-drawer/detail-drawer.tsx" }, { "path": "packages/ui/src/components/detail-drawer/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/detail-drawer/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/detail-drawer.md", "categories": [ "Overlays & disclosure" ], "meta": { "avoidWhen": [ "Avoid for a short confirmation; use Alert Dialog.", "Avoid for content other than the details of a record; compose Drawer or Sheet directly." ], "description": "Right-side drawer for the details of a record, with an optional edit form.", "knownLimitations": [ "Swipe is not the only way to close: keep a visible close action." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "detail-drawer", "detail", "drawer" ], "useWhen": [ "Use to show the details of a record beside its list, with an optional edit form." ] } }, { "name": "resource-list", "title": "Resource List", "description": "Reduced entity list with explicit indicator, content and meta slots.", "dependencies": [ "@base-ui/react@1.7.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/action-icons.json", "https://ui.siteplane.io/registry/v/1.4.2/motion.json" ], "files": [ { "path": "packages/ui/src/components/resource-list/resource-list.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/resource-list/resource-list.tsx" }, { "path": "packages/ui/src/components/resource-list/resource-list-focus.ts", "type": "registry:ui", "target": "~/src/siteplane/components/resource-list/resource-list-focus.ts" }, { "path": "packages/ui/src/components/resource-list/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/resource-list/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/resource-list.md", "categories": [ "Data display" ], "meta": { "avoidWhen": [ "Avoid when the list needs managed keyboard selection; use List Box.", "Avoid for data with sortable columns; use Table." ], "description": "Reduced entity list with explicit indicator, content and meta slots.", "knownLimitations": [ "Rows need a stable key. An index as the key makes a removed row leave as its neighbor.", "Rows animate only as direct children of the list; a row inside a wrapper component appears and leaves at once.", "When a row that holds focus leaves, focus moves to the next row, or the previous one at the end. With no other row, it is lost.", "A title or description stays on one line and ends with an ellipsis; its title attribute holds the full text, which a title prop replaces. Text children give it in the server markup; with an element among the children it is set from the rendered text once the part has mounted." ], "providerNotes": [ "Rows animate through the motion component, which the registry installs with it.", "SiteplaneMotionProvider preset=\"reduced\" and the system setting make every change instant." ], "releaseStatus": "stable", "searchTerms": [ "resource-list", "resource list", "resource", "list" ], "useWhen": [ "Use to list resources such as files, projects or members with an indicator, content and metadata, and optional interactive rows." ] } }, { "name": "settings-list", "title": "Settings List", "description": "Sectioned settings surface with passive items and consumer-provided controls, tags and supporting content. Search terms: preferences, rows.", "dependencies": [], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/separator.json" ], "files": [ { "path": "packages/ui/src/components/settings-list/settings-list.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/settings-list/settings-list.tsx" }, { "path": "packages/ui/src/components/settings-list/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/settings-list/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/settings-list.md", "categories": [ "Data display" ], "meta": { "avoidWhen": [ "Avoid when the whole row, rather than its trailing control, should activate the setting." ], "description": "Sectioned settings surface with passive items and consumer-provided controls, tags and supporting content.", "knownLimitations": [ "The list is not a form and submits no values; the controls it renders own their state." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "settings-list", "settings", "preferences", "rows" ], "useWhen": [ "Use when settings share one surfaced row anatomy but use different trailing controls." ] } }, { "name": "data-list", "title": "Data List", "description": "Show the details of one record as label and value rows, side by side or stacked. Search terms: description list, detail list, key value, properties, dl.", "dependencies": [], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/data-list/data-list.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/data-list/data-list.tsx" }, { "path": "packages/ui/src/components/data-list/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/data-list/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/data-list.md", "categories": [ "Data display" ], "meta": { "avoidWhen": [ "Avoid for data that people sort, filter or compare across many records; use Table.", "Avoid for editable settings; use Settings List with a control in each row." ], "description": "Show the details of one record as label and value rows, side by side or stacked.", "knownLimitations": [ "The horizontal label column is as wide as the widest label, up to 40% of the list; set --data-list-label-width for a fixed column.", "The list renders dl, dt and dd; put one label and one value in each DataListItem." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "data-list", "data list", "description list", "detail list", "key value", "properties", "dl" ], "useWhen": [ "Use to show the properties of one record, such as an account's plan, renewal date and seats.", "Use in a card or a detail drawer, with dividers when the rows need more separation." ] } }, { "name": "truncate", "title": "Truncate", "description": "Cut text after one line or a number of lines with an ellipsis, and show the full text in a tooltip. Search terms: line clamp, line-clamp, text overflow, clamp, overflow tooltip.", "dependencies": [ "@base-ui/react@1.7.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/tooltip.json" ], "files": [ { "path": "packages/ui/src/components/truncate/truncate.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/truncate/truncate.tsx" }, { "path": "packages/ui/src/components/truncate/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/truncate/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/truncate.md", "categories": [ "Layout & utilities" ], "meta": { "avoidWhen": [ "Avoid for text people must read in full, such as an error, an instruction or a legal notice; let it wrap.", "Avoid for menu rows, Badge and Tag labels and Button labels; they end in an ellipsis themselves." ], "description": "Cut text after one line or a number of lines with an ellipsis, and show the full text in a tooltip.", "knownLimitations": [ "The tooltip opens on hover, and on focus only where the element takes focus, such as a link through render; assistive technology reads the full text from the element itself.", "In a table cell or another box that grows with its content, give the Truncate or the cell a width, such as max-w-48, so the text has an edge to end at.", "The line count of a clamp over several lines comes from the style attribute; a Content Security Policy that blocks style attributes keeps two lines." ], "providerNotes": [ "The tooltip is the installed Tooltip. A TooltipProvider sets its delay; without one it opens after Base UI's default delay." ], "releaseStatus": "stable", "searchTerms": [ "truncate", "ellipsis", "line clamp", "line-clamp", "text overflow", "clamp", "overflow tooltip" ], "useWhen": [ "Use for a title or name that may be longer than its space, such as a card title, a list row or a table cell, with the full text on hover.", "Use for a description that should keep its first two or three lines." ] } }, { "name": "copy-button", "title": "Copy Button", "description": "Copy a value to the clipboard with an icon button or a labeled button that confirms with a check, a tooltip and an announcement. Search terms: copy to clipboard, copyable, copy link, copy URL.", "dependencies": [ "lucide-react@1.18.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/action-icons.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/tooltip.json" ], "files": [ { "path": "packages/ui/src/components/copy-button/copy-button.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/copy-button/copy-button.tsx" }, { "path": "packages/ui/src/components/copy-button/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/copy-button/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/copy-button.md", "categories": [ "Actions" ], "meta": { "avoidWhen": [ "Avoid for a menu entry that copies; use a MenuItem with the Copy icon and copy in its onClick with useCopyToClipboard.", "Avoid for a block of code; CodeBlock with copyable shows this button inside the block." ], "description": "Copy a value to the clipboard with an icon button or a labeled button that confirms with a check, a tooltip and an announcement.", "knownLimitations": [ "Browsers allow a page to write to the clipboard only in a secure context (https or localhost) and in response to a click; elsewhere the text is copied through a selection, which a browser may refuse.", "A value that loads first must arrive while the browser still counts the click; a slow request can make the copy fail." ], "providerNotes": [ "The tooltip is the installed Tooltip. A TooltipProvider sets its delay; without one it opens after Base UI's default delay." ], "releaseStatus": "stable", "searchTerms": [ "copy", "clipboard", "copy to clipboard", "copy button", "copyable", "copy link", "copy URL" ], "useWhen": [ "Use beside a value people copy, such as a URL, an ID or an invite link, as the icon alone with a tooltip.", "Use with a label, such as Copy link, for a copy action in a toolbar, a card or a dialog footer.", "Use inside an InputGroup with profile=\"field-action\" for a read-only field that people copy from." ] } }, { "name": "animated-buttons", "title": "Animated Buttons", "description": "Sweep and fixed-layout expanding button family. Search terms: actions.", "dependencies": [ "lucide-react@1.18.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json" ], "files": [ { "path": "packages/ui/src/components/animated-buttons/animated-buttons.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/animated-buttons/animated-buttons.tsx" }, { "path": "packages/ui/src/components/animated-buttons/animated-buttons.css", "type": "registry:ui", "target": "~/src/siteplane/components/animated-buttons/animated-buttons.css" }, { "path": "packages/ui/src/components/animated-buttons/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/animated-buttons/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/animated-buttons.md", "categories": [ "Animated" ], "meta": { "avoidWhen": [ "Avoid when a standard Button covers the need; Animated Buttons add hover motion only.", "Avoid in narrow parents that would clip an expanding label." ], "description": "Sweep and fixed-layout expanding button family.", "knownLimitations": [ "An expanding action moves its content on hover; leave room for the expanded label." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "animated-buttons", "animated buttons", "actions", "buttons" ], "useWhen": [ "Use for an action that gains from hover motion. The family has a fill sweep button, an expanding arrow button and an expanding log out button." ] } }, { "name": "theme-toggles", "title": "Theme Toggles", "description": "Animated sun and moon toggles that switch between light and dark mode. Search terms: actions.", "dependencies": [ "lucide-react@1.18.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/toggle.json" ], "files": [ { "path": "packages/ui/src/components/theme-toggles/theme-toggles.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/theme-toggles/theme-toggles.tsx" }, { "path": "packages/ui/src/components/theme-toggles/theme-toggles.css", "type": "registry:ui", "target": "~/src/siteplane/components/theme-toggles/theme-toggles.css" }, { "path": "packages/ui/src/components/theme-toggles/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/theme-toggles/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/theme-toggles.md", "categories": [ "Animated" ], "meta": { "avoidWhen": [ "Avoid for a choice among light, dark and system; use Toggle Group." ], "description": "Animated sun and moon toggles that switch between light and dark mode.", "knownLimitations": [ "The toggle reports its state but does not apply the theme; the application provider does." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "theme-toggles", "theme toggles", "actions", "theme", "toggles" ], "useWhen": [ "Use for a theme control that morphs between a sun and a moon, in a header or a settings row." ] } }, { "name": "pie-chart", "title": "Pie Chart", "description": "Show how a total divides into shares as a donut or pie chart. Search terms: ring, distribution.", "dependencies": [], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/motion.json", "https://ui.siteplane.io/registry/v/1.4.2/chart.json" ], "files": [ { "path": "packages/ui/src/components/pie-chart/pie-chart.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/pie-chart/pie-chart.tsx" }, { "path": "packages/ui/src/components/pie-chart/pie-geometry.ts", "type": "registry:ui", "target": "~/src/siteplane/components/pie-chart/pie-geometry.ts" }, { "path": "packages/ui/src/components/pie-chart/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/pie-chart/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/pie-chart.md", "categories": [ "Charts" ], "meta": { "avoidWhen": [ "Avoid when readers must compare values precisely or follow change over time; use a Table or a chart with axes.", "Avoid for more than five or six shares: small shares become hard to see, and the colors repeat after the eighth." ], "description": "Show how a total divides into shares as a donut or pie chart.", "knownLimitations": [ "The ring is one focus stop and arrow keys move between segments; segments have no click or selection props.", "variant=\"pie\" fills the disc with a wedge per share and has no hole, so center, centerValue and centerLabel show only in the donut; they lie over the ring and never take the pointer.", "centerValue is fitted into the hole from the chart's size and the text alone, the same on the server and the client: the full figure at 30, 24 or 20 px, otherwise compact (1.2M) at the largest step from 30 down to 12 px that fits; screen readers read it in full. The estimate errs on the wide side, so a typeface much wider than the kit's may need a smaller size. centerLabel stays on one line and ends in an ellipsis.", "Content of your own in center is laid out in the square around the hole and cut off at the hole's round edge, so it never covers the ring but can be cut: keep it short, or pass the figure as centerValue.", "Without the legend the shares and their values are read out as the description of the chart; the legend sits beside the ring and has no position option.", "When the data changes, the shares glide to their new size and a share is told by its id: give each share a stable id, never its position.", "The brand palette shades the brand color from strong to light and spreads the shades over the filled shares (up to eight); the categorical palette has the eight chart colors. Both repeat from the ninth share, except that the last share never takes the color of the first, where the ring closes; a color on a share always wins.", "No share fades while another is active. popOut is off by default: no share moves, and the tooltip alone marks the active share. With popOut the highlighted share steps out 10 px at any size, so it reaches up to 10 px beyond the box of the chart: an ancestor that clips its overflow close to the chart cuts it. A share that is the whole has nowhere to go and stays.", "The legend does not toggle shares, and its entries are no focus stops. Only with popOut does a mouse over an entry pop its share out (a touch does nothing); without popOut the legend does not react." ], "providerNotes": [ "The tooltip comes from the installed Tooltip. The chart opens and closes it itself, so it needs no TooltipProvider.", "The glide uses the installed Motion component and its tokens. SiteplaneMotionProvider preset=\"reduced\" and the system setting show new data at once." ], "releaseStatus": "stable", "searchTerms": [ "pie-chart", "pie", "donut", "ring", "chart", "share", "distribution" ], "useWhen": [ "Use when a few shares of one total should be shown as a donut or a pie with a legend and a tooltip.", "Use variant=\"pie\" when the shares should fill a whole disc, or centerValue and centerLabel when the hole of the ring should carry a figure such as a total.", "Use popOut when the share under the pointer, or the share of the legend entry under the mouse, should step out of the chart." ] } }, { "name": "file-type-icon", "title": "File Type Icon", "description": "Show a file’s type as a document icon with its extension. Search terms: file icon, attachment, pdf.", "dependencies": [ "react-file-icon@1.6.0" ], "devDependencies": [ "@types/react-file-icon@1.0.5" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/file-type-icon/file-type-icon.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/file-type-icon/file-type-icon.tsx" }, { "path": "packages/ui/src/components/file-type-icon/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/file-type-icon/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/file-type-icon.md", "categories": [ "Data display" ], "meta": { "avoidWhen": [ "Avoid when a thumbnail would identify an image or video better.", "Avoid as the only cue for a file’s type: the icon is decorative, so keep the file name visible." ], "description": "Show a file’s type as a document icon with its extension.", "knownLimitations": [ "The type comes from the file name or the extension prop only; the file’s contents and MIME type are not read.", "There is no size prop: resize the box with className and keep its proportion.", "The label color follows the type, from the kit status and accent colors; no prop sets it." ], "providerNotes": [ "Depends on the react-file-icon package, which the registry installs with the component." ], "releaseStatus": "stable", "searchTerms": [ "file-type-icon", "file icon", "document icon", "extension", "attachment", "pdf" ], "useWhen": [ "Use when a list, an attachment or an upload row names a file and should show its type at a glance." ] } }, { "name": "navigation-menu", "title": "Navigation Menu", "description": "Open site sections from a row of links with dropdown panels. Search terms: navbar, mega menu.", "dependencies": [ "@base-ui/react@1.7.0", "lucide-react@1.18.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json" ], "files": [ { "path": "packages/ui/src/components/navigation-menu/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/navigation-menu/index.ts" }, { "path": "packages/ui/src/components/navigation-menu/navigation-menu.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/navigation-menu/navigation-menu.tsx" }, { "path": "packages/ui/src/components/navigation-menu/navigation-menu.css", "type": "registry:ui", "target": "~/src/siteplane/components/navigation-menu/navigation-menu.css" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/navigation-menu.md", "categories": [ "Navigation" ], "meta": { "avoidWhen": [ "Avoid when the items are commands rather than destinations; use Menu or Dropdown Menu.", "Avoid when the links need no panels; a plain list of links is enough." ], "description": "Open site sections from a row of links with dropdown panels.", "knownLimitations": [ "A link inside NavigationMenuContent takes the full-width panel row style; set popup to choose the style yourself.", "Render exactly one NavigationMenuPopup inside NavigationMenu.", "Triggers and links take the control size of the provider; the menu has no size prop of its own." ], "providerNotes": [], "releaseStatus": "stable", "searchTerms": [ "navigation-menu", "navigation menu", "navbar", "mega menu", "dropdown", "links", "panels" ], "useWhen": [ "Use when a site needs a row of links where some items open panels of grouped links.", "Use when panels should share one popup that resizes and cross-fades between items." ] } }, { "name": "motion", "title": "Motion", "description": "Animate items that appear, leave, move or replace one another, and numbers that change, with no animation code. Search terms: presence, animate presence, transition, list, reorder, reveal, swap, enter, exit, rolling number, odometer, counter, tween, chart.", "dependencies": [ "@base-ui/react@1.7.0", "motion@12.43.0" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json" ], "files": [ { "path": "packages/ui/src/components/motion/motion.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/motion/motion.tsx" }, { "path": "packages/ui/src/components/motion/motion-presence.ts", "type": "registry:ui", "target": "~/src/siteplane/components/motion/motion-presence.ts" }, { "path": "packages/ui/src/components/motion/motion-follow.ts", "type": "registry:ui", "target": "~/src/siteplane/components/motion/motion-follow.ts" }, { "path": "packages/ui/src/components/motion/motion-number.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/motion/motion-number.tsx" }, { "path": "packages/ui/src/components/motion/motion-number-cells.ts", "type": "registry:ui", "target": "~/src/siteplane/components/motion/motion-number-cells.ts" }, { "path": "packages/ui/src/components/motion/motion-values.ts", "type": "registry:ui", "target": "~/src/siteplane/components/motion/motion-values.ts" }, { "path": "packages/ui/src/components/motion/motion-scroll.ts", "type": "registry:ui", "target": "~/src/siteplane/components/motion/motion-scroll.ts" }, { "path": "packages/ui/src/components/motion/motion-follow-value.ts", "type": "registry:ui", "target": "~/src/siteplane/components/motion/motion-follow-value.ts" }, { "path": "packages/ui/src/components/motion/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/motion/index.ts" }, { "path": "packages/ui/src/system/motion/css-transition.ts", "type": "registry:lib", "target": "~/src/siteplane/system/motion/css-transition.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/motion.md", "categories": [ "Layout & utilities" ], "meta": { "avoidWhen": [ "Avoid for one element that already animates itself, such as a Collapsible, a Dialog or a Toast.", "Avoid for lists of hundreds of rows: every item is a Motion element. Virtualize the list instead." ], "description": "Animate items that appear, leave, move or replace one another, and numbers that change, with no animation code.", "knownLimitations": [ "Items need a stable key. An index as the key makes a removed item leave as its neighbor.", "In a stack, set the space between items with the gap prop, which adds space between items only and none above the first or below the last. A CSS gap on the list leaves a hole until the item has left.", "Items must be direct children of the list, not wrapped in a fragment: a fragment around several items counts as one.", "A flow list moves the height of its own box when a row of items appears or goes. A list that is display: contents has no box, so pass the element that wraps its items as container.", "While a stack item, a reveal or a swap changes, its own element is the clipping box, so give that element no padding or border and put them on the content inside it.", "A leaving item is inert, so focus inside it is lost when it leaves. Move focus before removing it.", "MotionNumber formats a number in en-US unless you pass locales, so the server and the client always agree. A string is shown as it is and only its Latin digits (0 to 9) roll; every other character fades.", "MotionNumber is read once, as its final text, with no live announcement. Wrap it in your own live region when a change must be announced.", "The value tweens move lists of numbers of the same length. A list that changes its length shows the new values at once, unless the values are keyed with useTweenedRows." ], "providerNotes": [ "Depends on the motion package, which the registry installs with the component.", "SiteplaneMotionProvider preset=\"reduced\" and the system setting make every part instant." ], "releaseStatus": "stable", "searchTerms": [ "motion", "animation", "presence", "animate presence", "transition", "list", "reorder", "reveal", "swap", "enter", "exit", "number", "rolling number", "odometer", "counter", "tween", "chart" ], "useWhen": [ "Use when items are added, removed or reordered and the items around them should glide into their new place.", "Use when a message, an error or a bar appears and disappears and should not push the layout.", "Use when a step, a state or a panel replaces another, so that the old content fades out before the new content fades in and the container follows the new height.", "Use when a figure changes in place, such as a total, a rate or a count, and its digits should roll to the new value.", "Use when the marks of a chart should glide to new data: the value tweens move numbers toward their new targets.", "Use when a mark or a card should glide after the pointer from item to item without overshooting, as the crosshair and the tooltip of a chart do." ] } }, { "name": "chart", "title": "Chart", "description": "Shared scales, curves, interaction, tooltip, legend and axes behind the Siteplane UI charts. Search terms: chart core, axis, d3, data visualization.", "dependencies": [ "d3-scale@4.0.2", "d3-array@3.2.4" ], "devDependencies": [ "@types/d3-scale@4.0.9", "@types/d3-array@3.2.2" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/badge.json", "https://ui.siteplane.io/registry/v/1.4.2/motion.json", "https://ui.siteplane.io/registry/v/1.4.2/tooltip.json" ], "files": [ { "path": "packages/ui/src/components/chart/chart-types.ts", "type": "registry:ui", "target": "~/src/siteplane/components/chart/chart-types.ts" }, { "path": "packages/ui/src/components/chart/chart-data.ts", "type": "registry:ui", "target": "~/src/siteplane/components/chart/chart-data.ts" }, { "path": "packages/ui/src/components/chart/chart-scales.ts", "type": "registry:ui", "target": "~/src/siteplane/components/chart/chart-scales.ts" }, { "path": "packages/ui/src/components/chart/chart-stack.ts", "type": "registry:ui", "target": "~/src/siteplane/components/chart/chart-stack.ts" }, { "path": "packages/ui/src/components/chart/chart-model.ts", "type": "registry:ui", "target": "~/src/siteplane/components/chart/chart-model.ts" }, { "path": "packages/ui/src/components/chart/chart-format.ts", "type": "registry:ui", "target": "~/src/siteplane/components/chart/chart-format.ts" }, { "path": "packages/ui/src/components/chart/chart-palette.ts", "type": "registry:ui", "target": "~/src/siteplane/components/chart/chart-palette.ts" }, { "path": "packages/ui/src/components/chart/chart-curve.ts", "type": "registry:ui", "target": "~/src/siteplane/components/chart/chart-curve.ts" }, { "path": "packages/ui/src/components/chart/use-chart-width.ts", "type": "registry:ui", "target": "~/src/siteplane/components/chart/use-chart-width.ts" }, { "path": "packages/ui/src/components/chart/chart-interaction.ts", "type": "registry:ui", "target": "~/src/siteplane/components/chart/chart-interaction.ts" }, { "path": "packages/ui/src/components/chart/chart-legend.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/chart/chart-legend.tsx" }, { "path": "packages/ui/src/components/chart/chart-tooltip.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/chart/chart-tooltip.tsx" }, { "path": "packages/ui/src/components/chart/chart-tooltip-place.ts", "type": "registry:ui", "target": "~/src/siteplane/components/chart/chart-tooltip-place.ts" }, { "path": "packages/ui/src/components/chart/chart-axis-pill.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/chart/chart-axis-pill.tsx" }, { "path": "packages/ui/src/components/chart/chart-dimming.ts", "type": "registry:ui", "target": "~/src/siteplane/components/chart/chart-dimming.ts" }, { "path": "packages/ui/src/components/chart/chart-highlight.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/chart/chart-highlight.tsx" }, { "path": "packages/ui/src/components/chart/chart-cartesian.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/chart/chart-cartesian.tsx" }, { "path": "packages/ui/src/components/chart/chart-line-area.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/chart/chart-line-area.tsx" }, { "path": "packages/ui/src/components/chart/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/chart/index.ts" } ], "type": "registry:ui" }, { "name": "line-chart", "title": "Line Chart", "description": "Show how one or several measures change over time or across ordered categories. Search terms: trend, time series, graph, analytics.", "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/chart.json" ], "files": [ { "path": "packages/ui/src/components/line-chart/line-chart.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/line-chart/line-chart.tsx" }, { "path": "packages/ui/src/components/line-chart/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/line-chart/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/line-chart.md", "categories": [ "Charts" ], "meta": { "avoidWhen": [ "Avoid when the categories have no order, such as countries; use a Bar Chart.", "Avoid for readers who must read exact values: the axis gives a rough scale and the tooltip one value at a time; use a Table.", "Avoid for more than eight series; both palettes repeat after the eighth." ], "description": "Show how one or several measures change over time or across ordered categories.", "knownLimitations": [ "The plot is one focus stop; arrow keys, Home and End step through the x positions. There are no click or selection props, and the legend does not toggle series: a mouse over an entry only steps the other series back.", "A missing value (null, undefined or not a number) breaks the line at that point and leaves the series out of the tooltip for it; a point on its own is drawn as a dot.", "The value axis always includes 0 and has no props of its own for its range.", "Dates must be Date objects; they are written in UTC, so use dates at midnight UTC (new Date('2026-01-05')) for days. Text x values are categories, shown in the order given.", "A date axis is labeled on calendar ticks (days, weeks or months, as many as fit), evenly spaced, which need not sit on a data point; a text axis shows every k-th label, one k for the whole axis, so a narrow chart shows fewer of them. Neither lets two labels overlap.", "When the data changes the lines morph and the axis moves with them, unless a series has a gap or only one point, or the number of series changes, which show at once. Axis labels that the new data brings or takes away fade through: the old ones are out before the new ones come in.", "Several series share one value axis; a second axis is not provided.", "A series that sets no color takes a shade of the brand color, from strong to light and spread over the number of series (palette brand, the default); palette categorical gives each the chart colors --chart-1 to --chart-8 in order instead. A color that a series sets always wins, and both palettes start over from the ninth series.", "height=\"fill\" makes the chart as tall as its box, which takes its height from its container (a flex item that grows, a grid cell, or a box with a height) and never from the chart; minHeight sets the least height, 240 px by default. Until the box is measured, on the server too, the chart is minHeight tall." ], "providerNotes": [ "The tooltip comes from the installed Tooltip. The chart opens and closes it itself, so it needs no TooltipProvider.", "The glide uses the installed Motion component and its tokens. SiteplaneMotionProvider preset=\"reduced\" and the system setting show new data at once." ], "releaseStatus": "stable", "searchTerms": [ "line-chart", "line", "chart", "trend", "time series", "graph", "analytics" ], "useWhen": [ "Use when one or several measures should be shown over time or an ordered set, with a tooltip for each position." ] } }, { "name": "area-chart", "title": "Area Chart", "description": "Show how one or several measures change over time as filled areas, overlaid or stacked. Search terms: trend, time series, graph, analytics.", "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/chart.json" ], "files": [ { "path": "packages/ui/src/components/area-chart/area-chart.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/area-chart/area-chart.tsx" }, { "path": "packages/ui/src/components/area-chart/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/area-chart/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/area-chart.md", "categories": [ "Charts" ], "meta": { "avoidWhen": [ "Avoid when the categories have no order, such as countries; use a Bar Chart.", "Avoid overlapping several areas that hide each other; stack them, or use a Line Chart.", "Avoid for readers who must read exact values: the axis gives a rough scale and the tooltip one value at a time; use a Table." ], "description": "Show how one or several measures change over time as filled areas, overlaid or stacked.", "knownLimitations": [ "The plot is one focus stop; arrow keys, Home and End step through the x positions. There are no click or selection props, and the legend does not toggle series: a mouse over an entry only steps the other series back.", "A missing value (null, undefined or not a number) breaks the area at that point and leaves the series out of the tooltip for it; a point on its own is drawn as a dot.", "Stacked areas show each series' own value in the tooltip, not the running sum, and a missing value adds nothing to the stack.", "The value axis always includes 0 and has no props of its own for its range.", "Dates must be Date objects; they are written in UTC, so use dates at midnight UTC (new Date('2026-01-05')) for days. Text x values are categories, shown in the order given.", "A date axis is labeled on calendar ticks (days, weeks or months, as many as fit), evenly spaced, which need not sit on a data point; a text axis shows every k-th label, one k for the whole axis, so a narrow chart shows fewer of them. Neither lets two labels overlap.", "When the data changes the areas morph and the axis moves with them, unless a series has a gap or only one point, or the number of series changes, which show at once. Axis labels that the new data brings or takes away fade through: the old ones are out before the new ones come in.", "Several series share one value axis; a second axis is not provided.", "A series that sets no color takes a shade of the brand color, from strong to light and spread over the number of series (palette brand, the default); palette categorical gives each the chart colors --chart-1 to --chart-8 in order instead. A color that a series sets always wins, and both palettes start over from the ninth series.", "height=\"fill\" makes the chart as tall as its box, which takes its height from its container (a flex item that grows, a grid cell, or a box with a height) and never from the chart; minHeight sets the least height, 240 px by default. Until the box is measured, on the server too, the chart is minHeight tall." ], "providerNotes": [ "The tooltip comes from the installed Tooltip. The chart opens and closes it itself, so it needs no TooltipProvider.", "The glide uses the installed Motion component and its tokens. SiteplaneMotionProvider preset=\"reduced\" and the system setting show new data at once." ], "releaseStatus": "stable", "searchTerms": [ "area-chart", "area", "chart", "stacked", "trend", "time series", "graph", "analytics" ], "useWhen": [ "Use when one or several measures should be shown over time or an ordered set and the size of the whole, or of its parts when stacked, matters." ] } }, { "name": "bar-chart", "title": "Bar Chart", "description": "Compare values across categories as columns or horizontal bars, side by side or stacked. Search terms: grouped, comparison, graph, analytics.", "dependencies": [ "d3-scale@4.0.2" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/motion.json", "https://ui.siteplane.io/registry/v/1.4.2/chart.json" ], "files": [ { "path": "packages/ui/src/components/bar-chart/bar-chart.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/bar-chart/bar-chart.tsx" }, { "path": "packages/ui/src/components/bar-chart/bar-layout.ts", "type": "registry:ui", "target": "~/src/siteplane/components/bar-chart/bar-layout.ts" }, { "path": "packages/ui/src/components/bar-chart/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/bar-chart/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/bar-chart.md", "categories": [ "Charts" ], "meta": { "avoidWhen": [ "Avoid for a trend over dozens of points in time; a Line Chart or an Area Chart reads better beyond about 30 bars.", "Avoid for readers who must read exact values: the axis gives a rough scale and the tooltip one category at a time; use a Table.", "Avoid for more than eight series; both palettes repeat after the eighth." ], "description": "Compare values across categories as columns or horizontal bars, side by side or stacked.", "knownLimitations": [ "The plot is one focus stop; arrow keys, Home and End step through the categories (up and down for horizontal bars). There are no click or selection props, and the legend does not toggle series: a mouse over an entry only steps the other series back.", "A missing value (null, undefined or not a number) leaves its bar out and the series out of the tooltip for that category; a bar of 0 has no length.", "A bar takes the whole band of its category, which is 80% of the space the category has, so a chart with few categories has wide bars. The bars of a category share the band with 4 px between them, and no bar is thinner than 1 px: in a narrow chart with many categories the gap gives way first.", "Only the value end of a bar is rounded, by 8 px or, on a thin bar, by a quarter of its thickness, and in a stack only the outer segment of each sign.", "A stack piles positive values up from 0 and negative values down from it in the order of the series, and a missing value adds nothing. The tooltip shows each series' own value, not the sum.", "A series can name a second color for its bars below 0 (negativeColor); without it every bar keeps the color of its series.", "A series that sets no color takes a shade of the brand color, from strong to light and spread over the number of series (palette brand, the default); palette categorical gives each the chart colors --chart-1 to --chart-8 in order instead. A color that a series sets always wins, and both palettes start over from the ninth series.", "The value axis always includes 0 and has no props of its own for its range.", "Dates are categories. They must be Date objects; the chart shows them in date order and writes them in UTC, so use dates at midnight UTC (new Date('2026-01-05')) for days. The category axis shows every k-th label, one k for the whole axis, so a narrow chart shows fewer of them.", "In a horizontal chart xAxis still labels the categories and yAxis the values, now at the left and along the bottom. The labels at the left take at most 40% of the width, and a longer label ends there in an ellipsis. The tooltip and the live region that reads it to screen readers name the category in full.", "When the data changes the bars glide to their new values and the value axis moves with them; a bar that is new grows from the 0 line and one that is gone shrinks away. A bar is told by its category and series, so a category must keep the same text or date from one data set to the next. When categories come, go or change order, the bars of the categories that stay glide to their new place and thickness, a new bar grows from the 0 line where it stands and a bar that is gone shrinks where it stood. Axis labels that the new data brings or takes away fade through: the old ones are out before the new ones come in. A change in the number of series, or between side by side and stacked, shows at once.", "Several series share one value axis; a second axis is not provided.", "valueLabels writes each bar's value at its end in the format of the tooltip, or the sum of each sign of a stack. When the labels do not all fit, every k-th category keeps its labels, one k for the whole chart; side by side bars too thin for their labels show none. The labels are hidden while the bars glide.", "highlight sets one category apart, such as a period that is still running: its bars take a hatched fill of their own color, and its axis label and value labels take the text color. It is a look only: the tooltip and screen readers read the category as any other, so name it in the data, such as Today.", "height=\"fill\" makes the chart as tall as its box, which takes its height from its container (a flex item that grows, a grid cell, or a box with a height) and never from the chart; minHeight sets the least height, 240 px by default. Until the box is measured, on the server too, the chart is minHeight tall." ], "providerNotes": [ "The tooltip comes from the installed Tooltip. The chart opens and closes it itself, so it needs no TooltipProvider.", "The glide uses the installed Motion component and its tokens. SiteplaneMotionProvider preset=\"reduced\" and the system setting show new data at once." ], "releaseStatus": "stable", "searchTerms": [ "bar-chart", "bar", "chart", "column", "stacked", "grouped", "horizontal", "comparison", "graph", "analytics" ], "useWhen": [ "Use when the values of a few to a few dozen categories should be compared, side by side, stacked or as a ranking, with a tooltip for each category." ] } }, { "name": "sparkline", "title": "Sparkline", "description": "Show the trend of one or several measures in a small chart without axes. Search terms: spark chart, spark line, spark area, mini chart, inline chart, metric.", "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/chart.json", "https://ui.siteplane.io/registry/v/1.4.2/motion.json" ], "files": [ { "path": "packages/ui/src/components/sparkline/sparkline.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/sparkline/sparkline.tsx" }, { "path": "packages/ui/src/components/sparkline/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/sparkline/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/sparkline.md", "categories": [ "Charts" ], "meta": { "avoidWhen": [ "Avoid when readers need exact values or several measures on a shared axis; use a Line Chart or a Table.", "Avoid when a gap in the data must stay visible: a value that is not a number is left out and its neighbors are joined." ], "description": "Show the trend of one or several measures in a small chart without axes.", "knownLimitations": [ "There are no axes, labels, tooltip or hover values: the sparkline shows the shape of the data only. Name it with label and show the figure next to it.", "All series share one scale. It includes 0 by default, so a series that varies little around a large value looks flat. With includeZero={false} it spans from the lowest value to the highest, so a small change shows its shape but not its size: put the figure beside the sparkline.", "A value that is not a finite number is left out and its neighbors are joined; no gap is drawn.", "All series are drawn in one color, the color of the surrounding text unless color is given, so several series differ by their shape and overlap only.", "The width follows the room the sparkline is given: give it a width such as w-24 in a table cell or beside text. The stroke stays 2 px at any size.", "New data morphs into the old curves whatever their length, unless a series is one point or none, or the number of series changes, which show at once." ], "providerNotes": [ "The morph and the color change use the installed Motion component and its tokens. SiteplaneMotionProvider preset=\"reduced\" and the system setting show them at once." ], "releaseStatus": "stable", "searchTerms": [ "sparkline", "spark chart", "spark line", "spark area", "trend", "mini chart", "inline chart", "chart", "metric" ], "useWhen": [ "Use when a figure, a table row or a card should show at a glance how a measure has moved, next to its value.", "Use when a trend should take the color of its context, such as green for a rise and red for a fall, through the text color of a parent." ] } }, { "name": "bar-list", "title": "Bar List", "description": "Rank labeled values with a bar for each, relative to the largest. Search terms: ranking, top list, leaderboard, horizontal bars, chart, analytics.", "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/base.json", "https://ui.siteplane.io/registry/v/1.4.2/chart.json", "https://ui.siteplane.io/registry/v/1.4.2/motion.json", "https://ui.siteplane.io/registry/v/1.4.2/separator.json" ], "files": [ { "path": "packages/ui/src/components/bar-list/bar-list.tsx", "type": "registry:ui", "target": "~/src/siteplane/components/bar-list/bar-list.tsx" }, { "path": "packages/ui/src/components/bar-list/index.ts", "type": "registry:ui", "target": "~/src/siteplane/components/bar-list/index.ts" } ], "type": "registry:ui", "docs": "https://ui.siteplane.io/docs-markdown/components/bar-list.md", "categories": [ "Charts" ], "meta": { "avoidWhen": [ "Avoid when rows must be clicked, selected or linked: the rows are not interactive; use a Table, a List Box or a Resource List.", "Avoid when values can be negative or must be read against an axis; use a Bar Chart." ], "description": "Rank labeled values with a bar for each, relative to the largest.", "knownLimitations": [ "The rows take no click, hover or focus, and the list is not a focus stop.", "The rows keep the order of the data and are never sorted: sort the data to rank it.", "Each bar is as long as its value is large next to the largest, which fills the track, but any value above zero keeps at least 2% of the track, so a very small value is a short bar and not a hairline. A value that is zero or negative has no bar, and a negative value is written as it is. A value that is not a number counts as 0.", "The values share one column as wide as the widest of them, so every bar has the same track however the values are written.", "A label stays on one line and ends in an ellipsis when it does not fit, with the full text in its title; so does the optional second line, a description in quieter 13 px text under the label, which makes its row and bar taller. The value stays on the first line.", "The optional heading names the two columns above the rows, over a separator; with it, className goes to the frame that holds the heading and the list.", "An icon is decoration and is hidden from assistive technology. Pass an svg element to take the icon size of the kit.", "Row ids must be unique and stay the same while a row is in the data: a bar glides by its id. A new row grows its bar out of nothing, a row that is gone shrinks its bar away and then leaves, and a value with digits rolls to its new value, unless motion is reduced." ], "providerNotes": [ "The glide and the rolling values use the installed Motion component and its tokens. SiteplaneMotionProvider preset=\"reduced\" and the system setting show new data at once.", "The line under the heading is the installed Separator." ], "releaseStatus": "stable", "searchTerms": [ "bar-list", "bar list", "ranking", "top list", "leaderboard", "horizontal bars", "chart", "analytics" ], "useWhen": [ "Use when a short ranked list of labeled values, such as top pages or traffic sources, should read at a glance.", "Use when the order of the rows is the point and each value should be seen next to the largest." ] } }, { "name": "accordion-demo", "type": "registry:example", "title": "Frequently asked questions", "description": "Expand or collapse related content sections. Frequently asked questions — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/accordion.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/accordion.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/accordion/default.tsx", "type": "registry:file", "target": "~/src/components/accordion-demo.tsx" } ] }, { "name": "accordion-multiple-example", "type": "registry:example", "title": "Settings sections with multiple open panels", "description": "Expand or collapse related content sections. Settings sections with multiple open panels — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/accordion.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/accordion.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/accordion/multiple.tsx", "type": "registry:file", "target": "~/src/components/accordion-multiple-example.tsx" } ] }, { "name": "accordion-disabled-example", "type": "registry:example", "title": "Accordion with a disabled item", "description": "Expand or collapse related content sections. Accordion with a disabled item — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/accordion.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/accordion.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/accordion/disabled.tsx", "type": "registry:file", "target": "~/src/components/accordion-disabled-example.tsx" } ] }, { "name": "accordion-controlled-example", "type": "registry:example", "title": "Accordion controlled by a button", "description": "Expand or collapse related content sections. Accordion controlled by a button — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/accordion.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/accordion.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/accordion/controlled.tsx", "type": "registry:file", "target": "~/src/components/accordion-controlled-example.tsx" } ] }, { "name": "alert-demo", "type": "registry:example", "title": "Maintenance notice with icon", "description": "Present an inline message with a title and optional actions. Maintenance notice with icon — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/alert.md", "categories": [ "Feedback" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/alert.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/alert/default.tsx", "type": "registry:file", "target": "~/src/components/alert-demo.tsx" } ] }, { "name": "alert-variants-example", "type": "registry:example", "title": "Alert variants", "description": "Present an inline message with a title and optional actions. Alert variants — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/alert.md", "categories": [ "Feedback" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/alert.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/alert/variants.tsx", "type": "registry:file", "target": "~/src/components/alert-variants-example.tsx" } ] }, { "name": "alert-action-example", "type": "registry:example", "title": "Alert with actions", "description": "Present an inline message with a title and optional actions. Alert with actions — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/alert.md", "categories": [ "Feedback" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/alert.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/alert/action.tsx", "type": "registry:file", "target": "~/src/components/alert-action-example.tsx" } ] }, { "name": "alert-banner-example", "type": "registry:example", "title": "Page banners with the action at the end", "description": "Present an inline message with a title and optional actions. Page banners with the action at the end — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/alert.md", "categories": [ "Feedback" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/alert.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/alert/banner.tsx", "type": "registry:file", "target": "~/src/components/alert-banner-example.tsx" } ] }, { "name": "alert-banner-link-example", "type": "registry:example", "title": "Page banners with the link in the text", "description": "Present an inline message with a title and optional actions. Page banners with the link in the text — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/alert.md", "categories": [ "Feedback" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/alert.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/alert/banner-link.tsx", "type": "registry:file", "target": "~/src/components/alert-banner-link-example.tsx" } ] }, { "name": "alert-band-example", "type": "registry:example", "title": "Band in a card", "description": "Present an inline message with a title and optional actions. Band in a card — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/alert.md", "categories": [ "Feedback" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/alert.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/card.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/alert/band.tsx", "type": "registry:file", "target": "~/src/components/alert-band-example.tsx" } ] }, { "name": "alert-dialog-demo", "type": "registry:example", "title": "Delete project confirmation", "description": "Ask for a deliberate decision before continuing. Delete project confirmation — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/alert-dialog.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/alert-dialog.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/alert-dialog/default.tsx", "type": "registry:file", "target": "~/src/components/alert-dialog-demo.tsx" } ] }, { "name": "alert-dialog-delete-account-example", "type": "registry:example", "title": "Delete account", "description": "Ask for a deliberate decision before continuing. Delete account — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/alert-dialog.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/alert.json", "https://ui.siteplane.io/registry/v/1.4.2/alert-dialog.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/motion.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/alert-dialog/delete-account.tsx", "type": "registry:file", "target": "~/src/components/alert-dialog-delete-account-example.tsx" } ] }, { "name": "alert-dialog-controlled-example", "type": "registry:example", "title": "Discard unsaved comment confirmation", "description": "Ask for a deliberate decision before continuing. Discard unsaved comment confirmation — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/alert-dialog.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/alert-dialog.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/dialog.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/textarea.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/alert-dialog/controlled.tsx", "type": "registry:file", "target": "~/src/components/alert-dialog-controlled-example.tsx" } ] }, { "name": "animated-buttons-demo", "type": "registry:example", "title": "Fill sweep button", "description": "Buttons with hover motion, such as a fill that sweeps in or an arrow that expands behind the label. Fill sweep button — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/animated-buttons.md", "categories": [ "Animated" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/animated-buttons.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/animated-buttons/default.tsx", "type": "registry:file", "target": "~/src/components/animated-buttons-demo.tsx" } ] }, { "name": "animated-buttons-variants-example", "type": "registry:example", "title": "Fill sweep variants", "description": "Buttons with hover motion, such as a fill that sweeps in or an arrow that expands behind the label. Fill sweep variants — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/animated-buttons.md", "categories": [ "Animated" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/animated-buttons.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/animated-buttons/variants.tsx", "type": "registry:file", "target": "~/src/components/animated-buttons-variants-example.tsx" } ] }, { "name": "animated-buttons-expanding-example", "type": "registry:example", "title": "Expanding arrow link and log out button", "description": "Buttons with hover motion, such as a fill that sweeps in or an arrow that expands behind the label. Expanding arrow link and log out button — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/animated-buttons.md", "categories": [ "Animated" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/animated-buttons.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/animated-buttons/expanding.tsx", "type": "registry:file", "target": "~/src/components/animated-buttons-expanding-example.tsx" } ] }, { "name": "animated-buttons-sizes-example", "type": "registry:example", "title": "Sizes, disabled and loading", "description": "Buttons with hover motion, such as a fill that sweeps in or an arrow that expands behind the label. Sizes, disabled and loading — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/animated-buttons.md", "categories": [ "Animated" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/animated-buttons.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/animated-buttons/sizes.tsx", "type": "registry:file", "target": "~/src/components/animated-buttons-sizes-example.tsx" } ] }, { "name": "area-chart-demo", "type": "registry:example", "title": "Page views by month", "description": "Show how one or several measures change over time as filled areas, overlaid or stacked. Page views by month — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/area-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/area-chart.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/area-chart/default.tsx", "type": "registry:file", "target": "~/src/components/area-chart-demo.tsx" } ] }, { "name": "area-chart-stacked-example", "type": "registry:example", "title": "Visitors by source, stacked", "description": "Show how one or several measures change over time as filled areas, overlaid or stacked. Visitors by source, stacked — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/area-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/area-chart.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/area-chart/stacked.tsx", "type": "registry:file", "target": "~/src/components/area-chart-stacked-example.tsx" } ] }, { "name": "area-chart-fill-example", "type": "registry:example", "title": "The gradient and the solid fill", "description": "Show how one or several measures change over time as filled areas, overlaid or stacked. The gradient and the solid fill — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/area-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/area-chart.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/area-chart/fill.tsx", "type": "registry:file", "target": "~/src/components/area-chart-fill-example.tsx" } ] }, { "name": "area-chart-curves-example", "type": "registry:example", "title": "Build minutes by hour on a monotone curve", "description": "Show how one or several measures change over time as filled areas, overlaid or stacked. Build minutes by hour on a monotone curve — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/area-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/area-chart.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/area-chart/curves.tsx", "type": "registry:file", "target": "~/src/components/area-chart-curves-example.tsx" } ] }, { "name": "area-chart-negative-example", "type": "registry:example", "title": "Customers gained and lost, stacked around 0", "description": "Show how one or several measures change over time as filled areas, overlaid or stacked. Customers gained and lost, stacked around 0 — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/area-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/area-chart.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/area-chart/negative.tsx", "type": "registry:file", "target": "~/src/components/area-chart-negative-example.tsx" } ] }, { "name": "area-chart-fill-height-example", "type": "registry:example", "title": "An area chart that fills its card beside a taller card", "description": "Show how one or several measures change over time as filled areas, overlaid or stacked. An area chart that fills its card beside a taller card — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/area-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/area-chart.json", "https://ui.siteplane.io/registry/v/1.4.2/card.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/area-chart/fill-height.tsx", "type": "registry:file", "target": "~/src/components/area-chart-fill-height-example.tsx" } ] }, { "name": "area-chart-changing-example", "type": "registry:example", "title": "Stacked visits that glide when the period changes", "description": "Show how one or several measures change over time as filled areas, overlaid or stacked. Stacked visits that glide when the period changes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/area-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/area-chart.json", "https://ui.siteplane.io/registry/v/1.4.2/toggle-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/area-chart/changing.tsx", "type": "registry:file", "target": "~/src/components/area-chart-changing-example.tsx" } ] }, { "name": "autocomplete-demo", "type": "registry:example", "title": "Project search with suggestions", "description": "Suggest completions while allowing free text. Project search with suggestions — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/autocomplete.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/autocomplete.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/autocomplete/default.tsx", "type": "registry:file", "target": "~/src/components/autocomplete-demo.tsx" } ] }, { "name": "autocomplete-controlled-example", "type": "registry:example", "title": "Controlled value and clear", "description": "Suggest completions while allowing free text. Controlled value and clear — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/autocomplete.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/autocomplete.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/autocomplete/controlled.tsx", "type": "registry:file", "target": "~/src/components/autocomplete-controlled-example.tsx" } ] }, { "name": "autocomplete-groups-example", "type": "registry:example", "title": "Tag suggestions in groups", "description": "Suggest completions while allowing free text. Tag suggestions in groups — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/autocomplete.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/autocomplete.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/autocomplete/groups.tsx", "type": "registry:file", "target": "~/src/components/autocomplete-groups-example.tsx" } ] }, { "name": "autocomplete-limit-results-example", "type": "registry:example", "title": "Skill suggestions with a result limit", "description": "Suggest completions while allowing free text. Skill suggestions with a result limit — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/autocomplete.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/autocomplete.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/autocomplete/limit-results.tsx", "type": "registry:file", "target": "~/src/components/autocomplete-limit-results-example.tsx" } ] }, { "name": "autocomplete-appearance-example", "type": "registry:example", "title": "Autocomplete variants and disabled state", "description": "Suggest completions while allowing free text. Autocomplete variants and disabled state — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/autocomplete.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/autocomplete.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/autocomplete/appearance.tsx", "type": "registry:file", "target": "~/src/components/autocomplete-appearance-example.tsx" } ] }, { "name": "autocomplete-sizes-example", "type": "registry:example", "title": "Autocomplete sizes", "description": "Suggest completions while allowing free text. Autocomplete sizes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/autocomplete.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/autocomplete.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/autocomplete/sizes.tsx", "type": "registry:file", "target": "~/src/components/autocomplete-sizes-example.tsx" } ] }, { "name": "autocomplete-form-example", "type": "registry:example", "title": "Job title field with suggestions", "description": "Suggest completions while allowing free text. Job title field with suggestions — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/autocomplete.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/autocomplete.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/autocomplete/form.tsx", "type": "registry:file", "target": "~/src/components/autocomplete-form-example.tsx" } ] }, { "name": "avatar-demo", "type": "registry:example", "title": "Profile photo with initials fallback", "description": "Represent a person with an image or a text fallback. Profile photo with initials fallback — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/avatar.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/avatar.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/avatar/default.tsx", "type": "registry:file", "target": "~/src/components/avatar-demo.tsx" } ] }, { "name": "avatar-fallback-example", "type": "registry:example", "title": "Guest avatar with user icon", "description": "Represent a person with an image or a text fallback. Guest avatar with user icon — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/avatar.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/avatar.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/avatar/fallback.tsx", "type": "registry:file", "target": "~/src/components/avatar-fallback-example.tsx" } ] }, { "name": "avatar-sizes-example", "type": "registry:example", "title": "Avatar sizes and shapes", "description": "Represent a person with an image or a text fallback. Avatar sizes and shapes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/avatar.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/avatar.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/avatar/sizes.tsx", "type": "registry:file", "target": "~/src/components/avatar-sizes-example.tsx" } ] }, { "name": "avatar-group-example", "type": "registry:example", "title": "Project members with overflow count", "description": "Represent a person with an image or a text fallback. Project members with overflow count — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/avatar.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/avatar.json", "https://ui.siteplane.io/registry/v/1.4.2/avatar-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/avatar/group.tsx", "type": "registry:file", "target": "~/src/components/avatar-group-example.tsx" } ] }, { "name": "avatar-status-example", "type": "registry:example", "title": "Avatars with presence status", "description": "Represent a person with an image or a text fallback. Avatars with presence status — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/avatar.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/avatar.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/avatar/status.tsx", "type": "registry:file", "target": "~/src/components/avatar-status-example.tsx" } ] }, { "name": "avatar-group-demo", "type": "registry:example", "title": "Project members with overflow count", "description": "Show several people as a row of overlapping avatars with an optional overflow count. Project members with overflow count — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/avatar-group.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/avatar.json", "https://ui.siteplane.io/registry/v/1.4.2/avatar-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/avatar-group/default.tsx", "type": "registry:file", "target": "~/src/components/avatar-group-demo.tsx" } ] }, { "name": "avatar-group-sizes-example", "type": "registry:example", "title": "Avatar groups in four sizes", "description": "Show several people as a row of overlapping avatars with an optional overflow count. Avatar groups in four sizes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/avatar-group.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/avatar.json", "https://ui.siteplane.io/registry/v/1.4.2/avatar-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/avatar-group/sizes.tsx", "type": "registry:file", "target": "~/src/components/avatar-group-sizes-example.tsx" } ] }, { "name": "avatar-group-count-example", "type": "registry:example", "title": "A small and a large overflow count", "description": "Show several people as a row of overlapping avatars with an optional overflow count. A small and a large overflow count — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/avatar-group.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/avatar.json", "https://ui.siteplane.io/registry/v/1.4.2/avatar-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/avatar-group/count.tsx", "type": "registry:file", "target": "~/src/components/avatar-group-count-example.tsx" } ] }, { "name": "avatar-group-card-example", "type": "registry:example", "title": "Reviewers of a design review on a card", "description": "Show several people as a row of overlapping avatars with an optional overflow count. Reviewers of a design review on a card — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/avatar-group.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/avatar.json", "https://ui.siteplane.io/registry/v/1.4.2/avatar-group.json", "https://ui.siteplane.io/registry/v/1.4.2/card.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/avatar-group/card.tsx", "type": "registry:file", "target": "~/src/components/avatar-group-card-example.tsx" } ] }, { "name": "badge-demo", "type": "registry:example", "title": "Draft status badge", "description": "Label a status, category, or count. Draft status badge — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/badge.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/badge.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/badge/default.tsx", "type": "registry:file", "target": "~/src/components/badge-demo.tsx" } ] }, { "name": "badge-variants-example", "type": "registry:example", "title": "Badge variants", "description": "Label a status, category, or count. Badge variants — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/badge.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/badge.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/badge/variants.tsx", "type": "registry:file", "target": "~/src/components/badge-variants-example.tsx" } ] }, { "name": "badge-secondary-example", "type": "registry:example", "title": "Secondary badges on a white and a tinted row", "description": "Label a status, category, or count. Secondary badges on a white and a tinted row — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/badge.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/badge.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/badge/secondary.tsx", "type": "registry:file", "target": "~/src/components/badge-secondary-example.tsx" } ] }, { "name": "badge-emphasis-example", "type": "registry:example", "title": "A New label and an unread count", "description": "Label a status, category, or count. A New label and an unread count — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/badge.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/badge.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/badge/emphasis.tsx", "type": "registry:file", "target": "~/src/components/badge-emphasis-example.tsx" } ] }, { "name": "badge-sizes-example", "type": "registry:example", "title": "Badge sizes", "description": "Label a status, category, or count. Badge sizes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/badge.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/badge.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/badge/sizes.tsx", "type": "registry:file", "target": "~/src/components/badge-sizes-example.tsx" } ] }, { "name": "badge-shape-example", "type": "registry:example", "title": "Default and pill badges", "description": "Label a status, category, or count. Default and pill badges — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/badge.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/badge.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/badge/shape.tsx", "type": "registry:file", "target": "~/src/components/badge-shape-example.tsx" } ] }, { "name": "badge-composition-example", "type": "registry:example", "title": "Status badges with icons", "description": "Label a status, category, or count. Status badges with icons — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/badge.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/badge.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/badge/composition.tsx", "type": "registry:file", "target": "~/src/components/badge-composition-example.tsx" } ] }, { "name": "badge-status-dot-example", "type": "registry:example", "title": "Invoice status badges", "description": "Label a status, category, or count. Invoice status badges — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/badge.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/badge.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/badge/status-dot.tsx", "type": "registry:file", "target": "~/src/components/badge-status-dot-example.tsx" } ] }, { "name": "badge-status-example", "type": "registry:example", "title": "Site statuses in a list and in a sentence", "description": "Label a status, category, or count. Site statuses in a list and in a sentence — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/badge.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/badge.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/badge/status.tsx", "type": "registry:file", "target": "~/src/components/badge-status-example.tsx" } ] }, { "name": "badge-link-example", "type": "registry:example", "title": "Badge rendered as a link", "description": "Label a status, category, or count. Badge rendered as a link — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/badge.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/badge.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/badge/link.tsx", "type": "registry:file", "target": "~/src/components/badge-link-example.tsx" } ] }, { "name": "badge-light-example", "type": "registry:example", "title": "Badge with light", "description": "Label a status, category, or count. Badge with light — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/badge.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/badge.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/badge/light.tsx", "type": "registry:file", "target": "~/src/components/badge-light-example.tsx" } ] }, { "name": "bar-chart-demo", "type": "registry:example", "title": "Signups by month", "description": "Compare values across categories as columns or horizontal bars, side by side or stacked. Signups by month — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/bar-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/bar-chart.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/bar-chart/default.tsx", "type": "registry:file", "target": "~/src/components/bar-chart-demo.tsx" } ] }, { "name": "bar-chart-multiple-example", "type": "registry:example", "title": "Support tickets opened and resolved by month", "description": "Compare values across categories as columns or horizontal bars, side by side or stacked. Support tickets opened and resolved by month — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/bar-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/bar-chart.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/bar-chart/multiple.tsx", "type": "registry:file", "target": "~/src/components/bar-chart-multiple-example.tsx" } ] }, { "name": "bar-chart-stacked-example", "type": "registry:example", "title": "Customers gained and lost by month", "description": "Compare values across categories as columns or horizontal bars, side by side or stacked. Customers gained and lost by month — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/bar-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/bar-chart.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/bar-chart/stacked.tsx", "type": "registry:file", "target": "~/src/components/bar-chart-stacked-example.tsx" } ] }, { "name": "bar-chart-horizontal-example", "type": "registry:example", "title": "Active users by feature", "description": "Compare values across categories as columns or horizontal bars, side by side or stacked. Active users by feature — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/bar-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/bar-chart.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/bar-chart/horizontal.tsx", "type": "registry:file", "target": "~/src/components/bar-chart-horizontal-example.tsx" } ] }, { "name": "bar-chart-negative-example", "type": "registry:example", "title": "Net cash flow by month", "description": "Compare values across categories as columns or horizontal bars, side by side or stacked. Net cash flow by month — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/bar-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/bar-chart.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/bar-chart/negative.tsx", "type": "registry:file", "target": "~/src/components/bar-chart-negative-example.tsx" } ] }, { "name": "bar-chart-categorical-example", "type": "registry:example", "title": "API requests by region and month", "description": "Compare values across categories as columns or horizontal bars, side by side or stacked. API requests by region and month — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/bar-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/bar-chart.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/bar-chart/categorical.tsx", "type": "registry:file", "target": "~/src/components/bar-chart-categorical-example.tsx" } ] }, { "name": "bar-chart-value-labels-example", "type": "registry:example", "title": "Orders by month with the total above each stack", "description": "Compare values across categories as columns or horizontal bars, side by side or stacked. Orders by month with the total above each stack — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/bar-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/bar-chart.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/bar-chart/value-labels.tsx", "type": "registry:file", "target": "~/src/components/bar-chart-value-labels-example.tsx" } ] }, { "name": "bar-chart-highlight-example", "type": "registry:example", "title": "Visitors this week with today still running", "description": "Compare values across categories as columns or horizontal bars, side by side or stacked. Visitors this week with today still running — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/bar-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/bar-chart.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/bar-chart/highlight.tsx", "type": "registry:file", "target": "~/src/components/bar-chart-highlight-example.tsx" } ] }, { "name": "bar-chart-fill-height-example", "type": "registry:example", "title": "A chart that fills the room its card leaves", "description": "Compare values across categories as columns or horizontal bars, side by side or stacked. A chart that fills the room its card leaves — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/bar-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/bar-chart.json", "https://ui.siteplane.io/registry/v/1.4.2/card.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/bar-chart/fill-height.tsx", "type": "registry:file", "target": "~/src/components/bar-chart-fill-height-example.tsx" } ] }, { "name": "bar-chart-changing-example", "type": "registry:example", "title": "Orders over the last 6 or 12 months", "description": "Compare values across categories as columns or horizontal bars, side by side or stacked. Orders over the last 6 or 12 months — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/bar-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/bar-chart.json", "https://ui.siteplane.io/registry/v/1.4.2/toggle-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/bar-chart/changing.tsx", "type": "registry:file", "target": "~/src/components/bar-chart-changing-example.tsx" } ] }, { "name": "bar-list-demo", "type": "registry:example", "title": "Top pages by visitors", "description": "Rank labeled values with a bar for each, relative to the largest. Top pages by visitors — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/bar-list.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/bar-list.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/bar-list/default.tsx", "type": "registry:file", "target": "~/src/components/bar-list-demo.tsx" } ] }, { "name": "bar-list-formatted-example", "type": "registry:example", "title": "Revenue by country in US dollars", "description": "Rank labeled values with a bar for each, relative to the largest. Revenue by country in US dollars — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/bar-list.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/bar-list.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/bar-list/formatted.tsx", "type": "registry:file", "target": "~/src/components/bar-list-formatted-example.tsx" } ] }, { "name": "bar-list-icons-example", "type": "registry:example", "title": "Traffic sources with icons", "description": "Rank labeled values with a bar for each, relative to the largest. Traffic sources with icons — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/bar-list.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/bar-list.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/bar-list/icons.tsx", "type": "registry:file", "target": "~/src/components/bar-list-icons-example.tsx" } ] }, { "name": "bar-list-second-line-example", "type": "registry:example", "title": "Top pages with their paths", "description": "Rank labeled values with a bar for each, relative to the largest. Top pages with their paths — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/bar-list.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/bar-list.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/bar-list/second-line.tsx", "type": "registry:file", "target": "~/src/components/bar-list-second-line-example.tsx" } ] }, { "name": "bar-list-heading-example", "type": "registry:example", "title": "Traffic sources under a heading row", "description": "Rank labeled values with a bar for each, relative to the largest. Traffic sources under a heading row — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/bar-list.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/bar-list.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/bar-list/heading.tsx", "type": "registry:file", "target": "~/src/components/bar-list-heading-example.tsx" } ] }, { "name": "bar-list-changing-example", "type": "registry:example", "title": "Top pages that glide when the period changes", "description": "Rank labeled values with a bar for each, relative to the largest. Top pages that glide when the period changes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/bar-list.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/bar-list.json", "https://ui.siteplane.io/registry/v/1.4.2/toggle-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/bar-list/changing.tsx", "type": "registry:file", "target": "~/src/components/bar-list-changing-example.tsx" } ] }, { "name": "bar-list-rtl-example", "type": "registry:example", "title": "Visitors by device, right to left", "description": "Rank labeled values with a bar for each, relative to the largest. Visitors by device, right to left — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/bar-list.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/bar-list.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/bar-list/rtl.tsx", "type": "registry:file", "target": "~/src/components/bar-list-rtl-example.tsx" } ] }, { "name": "breadcrumb-demo", "type": "registry:example", "title": "Breadcrumb with a menu for hidden levels", "description": "Show the current location within a navigation hierarchy. Breadcrumb with a menu for hidden levels — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/breadcrumb.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/breadcrumb.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/menu.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/breadcrumb/default.tsx", "type": "registry:file", "target": "~/src/components/breadcrumb-demo.tsx" } ] }, { "name": "breadcrumb-separator-example", "type": "registry:example", "title": "Custom separator", "description": "Show the current location within a navigation hierarchy. Custom separator — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/breadcrumb.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/breadcrumb.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/breadcrumb/separator.tsx", "type": "registry:file", "target": "~/src/components/breadcrumb-separator-example.tsx" } ] }, { "name": "breadcrumb-collapsed-example", "type": "registry:example", "title": "Collapsed path", "description": "Show the current location within a navigation hierarchy. Collapsed path — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/breadcrumb.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/breadcrumb.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/breadcrumb/collapsed.tsx", "type": "registry:file", "target": "~/src/components/breadcrumb-collapsed-example.tsx" } ] }, { "name": "button-demo", "type": "registry:example", "title": "Default button", "description": "Trigger an action with a text label, an icon, or both. Default button — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/button.md", "categories": [ "Actions" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/button/default.tsx", "type": "registry:file", "target": "~/src/components/button-demo.tsx" } ] }, { "name": "button-variants-example", "type": "registry:example", "title": "All button variants", "description": "Trigger an action with a text label, an icon, or both. All button variants — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/button.md", "categories": [ "Actions" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/button/variants.tsx", "type": "registry:file", "target": "~/src/components/button-variants-example.tsx" } ] }, { "name": "button-glass-example", "type": "registry:example", "title": "Glass buttons", "description": "Trigger an action with a text label, an icon, or both. Glass buttons — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/button.md", "categories": [ "Actions" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/button/glass.tsx", "type": "registry:file", "target": "~/src/components/button-glass-example.tsx" } ] }, { "name": "button-sizes-example", "type": "registry:example", "title": "Button and icon button sizes", "description": "Trigger an action with a text label, an icon, or both. Button and icon button sizes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/button.md", "categories": [ "Actions" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/button/sizes.tsx", "type": "registry:file", "target": "~/src/components/button-sizes-example.tsx" } ] }, { "name": "button-pill-example", "type": "registry:example", "title": "Pill buttons", "description": "Trigger an action with a text label, an icon, or both. Pill buttons — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/button.md", "categories": [ "Actions" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/button/pill.tsx", "type": "registry:file", "target": "~/src/components/button-pill-example.tsx" } ] }, { "name": "button-icons-example", "type": "registry:example", "title": "Leading, trailing and icon-only buttons", "description": "Trigger an action with a text label, an icon, or both. Leading, trailing and icon-only buttons — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/button.md", "categories": [ "Actions" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/button/icons.tsx", "type": "registry:file", "target": "~/src/components/button-icons-example.tsx" } ] }, { "name": "button-states-example", "type": "registry:example", "title": "Disabled and loading buttons", "description": "Trigger an action with a text label, an icon, or both. Disabled and loading buttons — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/button.md", "categories": [ "Actions" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/button/states.tsx", "type": "registry:file", "target": "~/src/components/button-states-example.tsx" } ] }, { "name": "button-async-action-example", "type": "registry:example", "title": "Loading button", "description": "Trigger an action with a text label, an icon, or both. Loading button — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/button.md", "categories": [ "Actions" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/button/async-action.tsx", "type": "registry:file", "target": "~/src/components/button-async-action-example.tsx" } ] }, { "name": "button-layout-example", "type": "registry:example", "title": "Button width and alignment", "description": "Trigger an action with a text label, an icon, or both. Button width and alignment — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/button.md", "categories": [ "Actions" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/button/layout.tsx", "type": "registry:file", "target": "~/src/components/button-layout-example.tsx" } ] }, { "name": "button-link-example", "type": "registry:example", "title": "Button rendered as a link", "description": "Trigger an action with a text label, an icon, or both. Button rendered as a link — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/button.md", "categories": [ "Actions" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/button/link.tsx", "type": "registry:file", "target": "~/src/components/button-link-example.tsx" } ] }, { "name": "button-underlined-link-example", "type": "registry:example", "title": "Links in a sentence and on their own", "description": "Trigger an action with a text label, an icon, or both. Links in a sentence and on their own — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/button.md", "categories": [ "Actions" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/button/underlined-link.tsx", "type": "registry:file", "target": "~/src/components/button-underlined-link-example.tsx" } ] }, { "name": "calendar-demo", "type": "registry:example", "title": "Appointment date calendar", "description": "Choose a date, several dates or a date range. Appointment date calendar — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/calendar.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/calendar.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/calendar/default.tsx", "type": "registry:file", "target": "~/src/components/calendar-demo.tsx" } ] }, { "name": "calendar-range-example", "type": "registry:example", "title": "Date range", "description": "Choose a date, several dates or a date range. Date range — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/calendar.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/calendar.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/calendar/range.tsx", "type": "registry:file", "target": "~/src/components/calendar-range-example.tsx" } ] }, { "name": "calendar-shortcuts-example", "type": "registry:example", "title": "Date range with shortcuts", "description": "Choose a date, several dates or a date range. Date range with shortcuts — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/calendar.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/calendar.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/calendar/shortcuts.tsx", "type": "registry:file", "target": "~/src/components/calendar-shortcuts-example.tsx" } ] }, { "name": "calendar-multiple-example", "type": "registry:example", "title": "Multiple dates", "description": "Choose a date, several dates or a date range. Multiple dates — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/calendar.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/calendar.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/calendar/multiple.tsx", "type": "registry:file", "target": "~/src/components/calendar-multiple-example.tsx" } ] }, { "name": "calendar-constraints-example", "type": "registry:example", "title": "Booked dates unavailable", "description": "Choose a date, several dates or a date range. Booked dates unavailable — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/calendar.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/calendar.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/calendar/constraints.tsx", "type": "registry:file", "target": "~/src/components/calendar-constraints-example.tsx" } ] }, { "name": "calendar-controlled-example", "type": "registry:example", "title": "Due date with a Today button", "description": "Choose a date, several dates or a date range. Due date with a Today button — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/calendar.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/calendar.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/calendar/controlled.tsx", "type": "registry:file", "target": "~/src/components/calendar-controlled-example.tsx" } ] }, { "name": "calendar-locale-example", "type": "registry:example", "title": "German calendar", "description": "Choose a date, several dates or a date range. German calendar — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/calendar.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/calendar.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/calendar/locale.tsx", "type": "registry:file", "target": "~/src/components/calendar-locale-example.tsx" } ] }, { "name": "card-demo", "type": "registry:example", "title": "Create project card", "description": "Group related content and actions on a surface. Create project card — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/card.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/select.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/card/default.tsx", "type": "registry:file", "target": "~/src/components/card-demo.tsx" } ] }, { "name": "card-action-example", "type": "registry:example", "title": "Recent invoices with a view-all link", "description": "Group related content and actions on a surface. Recent invoices with a view-all link — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/card.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/card.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/card/action.tsx", "type": "registry:file", "target": "~/src/components/card-action-example.tsx" } ] }, { "name": "card-header-media-example", "type": "registry:example", "title": "Cards with an avatar, an icon and title context", "description": "Group related content and actions on a surface. Cards with an avatar, an icon and title context — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/card.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/avatar.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/card.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/card/header-media.tsx", "type": "registry:file", "target": "~/src/components/card-header-media-example.tsx" } ] }, { "name": "card-divided-example", "type": "registry:example", "title": "Payouts with a divided header and footer", "description": "Group related content and actions on a surface. Payouts with a divided header and footer — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/card.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/separator.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/card/divided.tsx", "type": "registry:file", "target": "~/src/components/card-divided-example.tsx" } ] }, { "name": "card-inset-example", "type": "registry:example", "title": "Card with a 24 px inset", "description": "Group related content and actions on a surface. Card with a 24 px inset — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/card.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/progress.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/card/inset.tsx", "type": "registry:file", "target": "~/src/components/card-inset-example.tsx" } ] }, { "name": "card-frame-example", "type": "registry:example", "title": "Framed card with a header action", "description": "Group related content and actions on a surface. Framed card with a header action — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/card.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/empty-state.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/card/frame.tsx", "type": "registry:file", "target": "~/src/components/card-frame-example.tsx" } ] }, { "name": "card-variants-example", "type": "registry:example", "title": "Raised, header and subtle cards", "description": "Group related content and actions on a surface. Raised, header and subtle cards — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/card.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/progress.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/card/variants.tsx", "type": "registry:file", "target": "~/src/components/card-variants-example.tsx" } ] }, { "name": "card-nested-example", "type": "registry:example", "title": "Inset files in a card and elevated plans", "description": "Group related content and actions on a surface. Inset files in a card and elevated plans — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/card.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/file-type-icon.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/card/nested.tsx", "type": "registry:file", "target": "~/src/components/card-nested-example.tsx" } ] }, { "name": "card-feedback-example", "type": "registry:example", "title": "Message and error cards", "description": "Group related content and actions on a surface. Message and error cards — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/card.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/avatar.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/card.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/card/feedback.tsx", "type": "registry:file", "target": "~/src/components/card-feedback-example.tsx" } ] }, { "name": "card-glass-example", "type": "registry:example", "title": "Glass card", "description": "Group related content and actions on a surface. Glass card — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/card.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/label.json", "https://ui.siteplane.io/registry/v/1.4.2/switch.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/card/glass.tsx", "type": "registry:file", "target": "~/src/components/card-glass-example.tsx" } ] }, { "name": "card-background-example", "type": "registry:example", "title": "A card on the page canvas and on the card color", "description": "Group related content and actions on a surface. A card on the page canvas and on the card color — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/card.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/card.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/card/background.tsx", "type": "registry:file", "target": "~/src/components/card-background-example.tsx" } ] }, { "name": "checkbox-demo", "type": "registry:example", "title": "Terms checkbox", "description": "Select or clear an independent option. Terms checkbox — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/checkbox.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/checkbox.json", "https://ui.siteplane.io/registry/v/1.4.2/label.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/checkbox/default.tsx", "type": "registry:file", "target": "~/src/components/checkbox-demo.tsx" } ] }, { "name": "checkbox-with-description-example", "type": "registry:example", "title": "Checkbox with description", "description": "Select or clear an independent option. Checkbox with description — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/checkbox.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/checkbox.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/checkbox/with-description.tsx", "type": "registry:file", "target": "~/src/components/checkbox-with-description-example.tsx" } ] }, { "name": "checkbox-states-example", "type": "registry:example", "title": "Disabled and invalid checkboxes", "description": "Select or clear an independent option. Disabled and invalid checkboxes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/checkbox.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/checkbox.json", "https://ui.siteplane.io/registry/v/1.4.2/label.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/checkbox/states.tsx", "type": "registry:file", "target": "~/src/components/checkbox-states-example.tsx" } ] }, { "name": "checkbox-card-style-example", "type": "registry:example", "title": "Checkbox card", "description": "Select or clear an independent option. Checkbox card — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/checkbox.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/checkbox.json", "https://ui.siteplane.io/registry/v/1.4.2/label.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/checkbox/card-style.tsx", "type": "registry:file", "target": "~/src/components/checkbox-card-style-example.tsx" } ] }, { "name": "checkbox-controlled-example", "type": "registry:example", "title": "Controlled checkbox", "description": "Select or clear an independent option. Controlled checkbox — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/checkbox.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/checkbox.json", "https://ui.siteplane.io/registry/v/1.4.2/label.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/checkbox/controlled.tsx", "type": "registry:file", "target": "~/src/components/checkbox-controlled-example.tsx" } ] }, { "name": "checkbox-form-example", "type": "registry:example", "title": "Checkbox in a form", "description": "Select or clear an independent option. Checkbox in a form — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/checkbox.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/checkbox.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/checkbox/form.tsx", "type": "registry:file", "target": "~/src/components/checkbox-form-example.tsx" } ] }, { "name": "checkbox-sizes-example", "type": "registry:example", "title": "Checkbox sizes", "description": "Select or clear an independent option. Checkbox sizes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/checkbox.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/checkbox.json", "https://ui.siteplane.io/registry/v/1.4.2/label.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/checkbox/sizes.tsx", "type": "registry:file", "target": "~/src/components/checkbox-sizes-example.tsx" } ] }, { "name": "checkbox-group-demo", "type": "registry:example", "title": "Notification channel checkboxes", "description": "Choose any number of related options. Notification channel checkboxes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/checkbox-group.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/checkbox.json", "https://ui.siteplane.io/registry/v/1.4.2/checkbox-group.json", "https://ui.siteplane.io/registry/v/1.4.2/label.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/checkbox-group/default.tsx", "type": "registry:file", "target": "~/src/components/checkbox-group-demo.tsx" } ] }, { "name": "checkbox-group-controlled-example", "type": "registry:example", "title": "Controlled column visibility", "description": "Choose any number of related options. Controlled column visibility — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/checkbox-group.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/checkbox.json", "https://ui.siteplane.io/registry/v/1.4.2/checkbox-group.json", "https://ui.siteplane.io/registry/v/1.4.2/label.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/checkbox-group/controlled.tsx", "type": "registry:file", "target": "~/src/components/checkbox-group-controlled-example.tsx" } ] }, { "name": "checkbox-group-select-all-example", "type": "registry:example", "title": "Parent checkbox for project permissions", "description": "Choose any number of related options. Parent checkbox for project permissions — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/checkbox-group.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/checkbox.json", "https://ui.siteplane.io/registry/v/1.4.2/checkbox-group.json", "https://ui.siteplane.io/registry/v/1.4.2/label.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/checkbox-group/select-all.tsx", "type": "registry:file", "target": "~/src/components/checkbox-group-select-all-example.tsx" } ] }, { "name": "checkbox-group-form-example", "type": "registry:example", "title": "Checkbox group in a form", "description": "Choose any number of related options. Checkbox group in a form — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/checkbox-group.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/checkbox.json", "https://ui.siteplane.io/registry/v/1.4.2/checkbox-group.json", "https://ui.siteplane.io/registry/v/1.4.2/fieldset.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/checkbox-group/form.tsx", "type": "registry:file", "target": "~/src/components/checkbox-group-form-example.tsx" } ] }, { "name": "checkbox-group-card-style-example", "type": "registry:example", "title": "Add-on cards", "description": "Choose any number of related options. Add-on cards — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/checkbox-group.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/checkbox.json", "https://ui.siteplane.io/registry/v/1.4.2/checkbox-group.json", "https://ui.siteplane.io/registry/v/1.4.2/label.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/checkbox-group/card-style.tsx", "type": "registry:file", "target": "~/src/components/checkbox-group-card-style-example.tsx" } ] }, { "name": "checkbox-group-sizes-example", "type": "registry:example", "title": "Checkbox group sizes", "description": "Choose any number of related options. Checkbox group sizes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/checkbox-group.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/checkbox.json", "https://ui.siteplane.io/registry/v/1.4.2/checkbox-group.json", "https://ui.siteplane.io/registry/v/1.4.2/label.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/checkbox-group/sizes.tsx", "type": "registry:file", "target": "~/src/components/checkbox-group-sizes-example.tsx" } ] }, { "name": "code-demo", "type": "registry:example", "title": "Inline code in a sentence", "description": "Display inline code or a copyable block of text. Inline code in a sentence — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/code.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/code.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/code/default.tsx", "type": "registry:file", "target": "~/src/components/code-demo.tsx" } ] }, { "name": "code-block-example", "type": "registry:example", "title": "Copyable API request", "description": "Display inline code or a copyable block of text. Copyable API request — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/code.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/code.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/code/block.tsx", "type": "registry:file", "target": "~/src/components/code-block-example.tsx" } ] }, { "name": "code-mask-example", "type": "registry:example", "title": "Masked API key", "description": "Display inline code or a copyable block of text. Masked API key — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/code.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/code.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/code/mask.tsx", "type": "registry:file", "target": "~/src/components/code-mask-example.tsx" } ] }, { "name": "collapsible-demo", "type": "registry:example", "title": "Recovery keys disclosure", "description": "Show or hide a single section of content. Recovery keys disclosure — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/collapsible.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/code.json", "https://ui.siteplane.io/registry/v/1.4.2/collapsible.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/collapsible/default.tsx", "type": "registry:file", "target": "~/src/components/collapsible-demo.tsx" } ] }, { "name": "collapsible-controlled-example", "type": "registry:example", "title": "Order details with an icon trigger", "description": "Show or hide a single section of content. Order details with an icon trigger — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/collapsible.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/collapsible.json", "https://ui.siteplane.io/registry/v/1.4.2/frame.json", "https://ui.siteplane.io/registry/v/1.4.2/separator.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/collapsible/controlled.tsx", "type": "registry:file", "target": "~/src/components/collapsible-controlled-example.tsx" } ] }, { "name": "collapsible-file-tree-example", "type": "registry:example", "title": "File tree with nested folders", "description": "Show or hide a single section of content. File tree with nested folders — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/collapsible.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/collapsible.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/collapsible/file-tree.tsx", "type": "registry:file", "target": "~/src/components/collapsible-file-tree-example.tsx" } ] }, { "name": "color-picker-demo", "type": "registry:example", "title": "Brand color field", "description": "Choose a hex color with a swatch, hue slider, and channel fields. Brand color field — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/color-picker.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/color-picker.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/color-picker/default.tsx", "type": "registry:file", "target": "~/src/components/color-picker-demo.tsx" } ] }, { "name": "color-picker-controlled-example", "type": "registry:example", "title": "Controlled color", "description": "Choose a hex color with a swatch, hue slider, and channel fields. Controlled color — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/color-picker.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/color-picker.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/color-picker/controlled.tsx", "type": "registry:file", "target": "~/src/components/color-picker-controlled-example.tsx" } ] }, { "name": "color-picker-sizes-example", "type": "registry:example", "title": "Color picker sizes and swatch-only trigger", "description": "Choose a hex color with a swatch, hue slider, and channel fields. Color picker sizes and swatch-only trigger — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/color-picker.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/color-picker.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/color-picker/sizes.tsx", "type": "registry:file", "target": "~/src/components/color-picker-sizes-example.tsx" } ] }, { "name": "color-picker-custom-example", "type": "registry:example", "title": "Palette that ends in a custom color", "description": "Choose a hex color with a swatch, hue slider, and channel fields. Palette that ends in a custom color — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/color-picker.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/color-picker.json", "https://ui.siteplane.io/registry/v/1.4.2/color-swatch-picker.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/color-picker/custom.tsx", "type": "registry:file", "target": "~/src/components/color-picker-custom-example.tsx" } ] }, { "name": "color-picker-form-example", "type": "registry:example", "title": "Color picker in a form", "description": "Choose a hex color with a swatch, hue slider, and channel fields. Color picker in a form — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/color-picker.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/color-picker.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/color-picker/form.tsx", "type": "registry:file", "target": "~/src/components/color-picker-form-example.tsx" } ] }, { "name": "color-swatch-picker-demo", "type": "registry:example", "title": "Label color swatches", "description": "Select a named color or image from an application-owned palette. Label color swatches — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/color-swatch-picker.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/color-swatch-picker.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/color-swatch-picker/default.tsx", "type": "registry:file", "target": "~/src/components/color-swatch-picker-demo.tsx" } ] }, { "name": "color-swatch-picker-controlled-example", "type": "registry:example", "title": "Controlled selection", "description": "Select a named color or image from an application-owned palette. Controlled selection — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/color-swatch-picker.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/color-swatch-picker.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/color-swatch-picker/controlled.tsx", "type": "registry:file", "target": "~/src/components/color-swatch-picker-controlled-example.tsx" } ] }, { "name": "color-swatch-picker-ring-example", "type": "registry:example", "title": "Label color swatches with a selection ring", "description": "Select a named color or image from an application-owned palette. Label color swatches with a selection ring — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/color-swatch-picker.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/color-swatch-picker.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/color-swatch-picker/ring.tsx", "type": "registry:file", "target": "~/src/components/color-swatch-picker-ring-example.tsx" } ] }, { "name": "color-swatch-picker-images-example", "type": "registry:example", "title": "Reviewer swatches with photos", "description": "Select a named color or image from an application-owned palette. Reviewer swatches with photos — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/color-swatch-picker.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/color-swatch-picker.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/color-swatch-picker/images.tsx", "type": "registry:file", "target": "~/src/components/color-swatch-picker-images-example.tsx" } ] }, { "name": "color-swatch-picker-states-example", "type": "registry:example", "title": "Read-only and disabled swatches", "description": "Select a named color or image from an application-owned palette. Read-only and disabled swatches — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/color-swatch-picker.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/color-swatch-picker.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/color-swatch-picker/states.tsx", "type": "registry:file", "target": "~/src/components/color-swatch-picker-states-example.tsx" } ] }, { "name": "color-swatch-picker-form-example", "type": "registry:example", "title": "Required swatch selection in a form", "description": "Select a named color or image from an application-owned palette. Required swatch selection in a form — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/color-swatch-picker.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/color-swatch-picker.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/color-swatch-picker/form.tsx", "type": "registry:file", "target": "~/src/components/color-swatch-picker-form-example.tsx" } ] }, { "name": "combobox-demo", "type": "registry:example", "title": "Assignee picker", "description": "Search and choose from known options. Assignee picker — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/combobox.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/combobox.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/combobox/default.tsx", "type": "registry:file", "target": "~/src/components/combobox-demo.tsx" } ] }, { "name": "combobox-controlled-example", "type": "registry:example", "title": "Controlled value and clear", "description": "Search and choose from known options. Controlled value and clear — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/combobox.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/combobox.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/combobox/controlled.tsx", "type": "registry:file", "target": "~/src/components/combobox-controlled-example.tsx" } ] }, { "name": "combobox-multiple-example", "type": "registry:example", "title": "Label picker with chips", "description": "Search and choose from known options. Label picker with chips — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/combobox.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/combobox.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/combobox/multiple.tsx", "type": "registry:file", "target": "~/src/components/combobox-multiple-example.tsx" } ] }, { "name": "combobox-groups-example", "type": "registry:example", "title": "Timezone combobox with groups", "description": "Search and choose from known options. Timezone combobox with groups — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/combobox.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/combobox.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/combobox/groups.tsx", "type": "registry:file", "target": "~/src/components/combobox-groups-example.tsx" } ] }, { "name": "combobox-searchable-select-example", "type": "registry:example", "title": "Country picker with search", "description": "Search and choose from known options. Country picker with search — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/combobox.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/combobox.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/select.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/combobox/searchable-select.tsx", "type": "registry:file", "target": "~/src/components/combobox-searchable-select-example.tsx" } ] }, { "name": "combobox-appearance-example", "type": "registry:example", "title": "Combobox variants and disabled state", "description": "Search and choose from known options. Combobox variants and disabled state — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/combobox.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/combobox.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/combobox/appearance.tsx", "type": "registry:file", "target": "~/src/components/combobox-appearance-example.tsx" } ] }, { "name": "combobox-sizes-example", "type": "registry:example", "title": "Combobox sizes", "description": "Search and choose from known options. Combobox sizes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/combobox.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/combobox.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/combobox/sizes.tsx", "type": "registry:file", "target": "~/src/components/combobox-sizes-example.tsx" } ] }, { "name": "combobox-form-example", "type": "registry:example", "title": "Workspace field in a form", "description": "Search and choose from known options. Workspace field in a form — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/combobox.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/combobox.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/combobox/form.tsx", "type": "registry:file", "target": "~/src/components/combobox-form-example.tsx" } ] }, { "name": "command-demo", "type": "registry:example", "title": "Command palette", "description": "Find and run actions in an inline list or a dialog. Command palette — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/command.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/command.json", "https://ui.siteplane.io/registry/v/1.4.2/kbd.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/command/default.tsx", "type": "registry:file", "target": "~/src/components/command-demo.tsx" } ] }, { "name": "command-groups-example", "type": "registry:example", "title": "Inline command with groups and shortcuts", "description": "Find and run actions in an inline list or a dialog. Inline command with groups and shortcuts — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/command.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/command.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/command/groups.tsx", "type": "registry:file", "target": "~/src/components/command-groups-example.tsx" } ] }, { "name": "context-menu-demo", "type": "registry:example", "title": "Context menu with icons and shortcuts", "description": "Show actions for an element on right-click or long press. Context menu with icons and shortcuts — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/context-menu.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/context-menu.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/context-menu/default.tsx", "type": "registry:file", "target": "~/src/components/context-menu-demo.tsx" } ] }, { "name": "context-menu-submenu-example", "type": "registry:example", "title": "Grouped context menu with a submenu", "description": "Show actions for an element on right-click or long press. Grouped context menu with a submenu — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/context-menu.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/context-menu.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/context-menu/submenu.tsx", "type": "registry:file", "target": "~/src/components/context-menu-submenu-example.tsx" } ] }, { "name": "context-menu-choices-example", "type": "registry:example", "title": "View options context menu", "description": "Show actions for an element on right-click or long press. View options context menu — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/context-menu.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/context-menu.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/context-menu/choices.tsx", "type": "registry:file", "target": "~/src/components/context-menu-choices-example.tsx" } ] }, { "name": "context-menu-with-link-example", "type": "registry:example", "title": "Context menu with link items", "description": "Show actions for an element on right-click or long press. Context menu with link items — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/context-menu.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/context-menu.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/context-menu/with-link.tsx", "type": "registry:file", "target": "~/src/components/context-menu-with-link-example.tsx" } ] }, { "name": "context-menu-glass-example", "type": "registry:example", "title": "Glass context menu", "description": "Show actions for an element on right-click or long press. Glass context menu — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/context-menu.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/context-menu.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/context-menu/glass.tsx", "type": "registry:file", "target": "~/src/components/context-menu-glass-example.tsx" } ] }, { "name": "copy-button-demo", "type": "registry:example", "title": "Client portal address with a copy action", "description": "Copy a value to the clipboard with an icon button or a labeled button that confirms with a check, a tooltip and an announcement. Client portal address with a copy action — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/copy-button.md", "categories": [ "Actions" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/copy-button.json", "https://ui.siteplane.io/registry/v/1.4.2/data-list.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/copy-button/default.tsx", "type": "registry:file", "target": "~/src/components/copy-button-demo.tsx" } ] }, { "name": "copy-button-text-example", "type": "registry:example", "title": "Copy link as a quiet text action and as an outline Button", "description": "Copy a value to the clipboard with an icon button or a labeled button that confirms with a check, a tooltip and an announcement. Copy link as a quiet text action and as an outline Button — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/copy-button.md", "categories": [ "Actions" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/copy-button.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/copy-button/text.tsx", "type": "registry:file", "target": "~/src/components/copy-button-text-example.tsx" } ] }, { "name": "copy-button-input-group-example", "type": "registry:example", "title": "Read-only invite link with a copy action", "description": "Copy a value to the clipboard with an icon button or a labeled button that confirms with a check, a tooltip and an announcement. Read-only invite link with a copy action — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/copy-button.md", "categories": [ "Actions" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/copy-button.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/input-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/copy-button/input-group.tsx", "type": "registry:file", "target": "~/src/components/copy-button-input-group-example.tsx" } ] }, { "name": "copy-button-states-example", "type": "registry:example", "title": "A copy that works and a copy whose value fails to load", "description": "Copy a value to the clipboard with an icon button or a labeled button that confirms with a check, a tooltip and an announcement. A copy that works and a copy whose value fails to load — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/copy-button.md", "categories": [ "Actions" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/copy-button.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/copy-button/states.tsx", "type": "registry:file", "target": "~/src/components/copy-button-states-example.tsx" } ] }, { "name": "dashboard-shell-inset-example", "type": "registry:example", "title": "Inset workspace shell", "description": "Compose a sidebar, header, and scrolling application content. Inset workspace shell — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/dashboard-shell.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/avatar.json", "https://ui.siteplane.io/registry/v/1.4.2/breadcrumb.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/collapsible.json", "https://ui.siteplane.io/registry/v/1.4.2/dashboard-shell.json", "https://ui.siteplane.io/registry/v/1.4.2/dropdown-menu.json", "https://ui.siteplane.io/registry/v/1.4.2/kbd.json", "https://ui.siteplane.io/registry/v/1.4.2/sidebar.json", "https://ui.siteplane.io/registry/v/1.4.2/tooltip.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/dashboard-shell/inset.tsx", "type": "registry:file", "target": "~/src/components/dashboard-shell-inset-example.tsx" } ] }, { "name": "dashboard-shell-demo", "type": "registry:example", "title": "Push workspace shell", "description": "Compose a sidebar, header, and scrolling application content. Push workspace shell — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/dashboard-shell.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/avatar.json", "https://ui.siteplane.io/registry/v/1.4.2/breadcrumb.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/collapsible.json", "https://ui.siteplane.io/registry/v/1.4.2/dashboard-shell.json", "https://ui.siteplane.io/registry/v/1.4.2/dropdown-menu.json", "https://ui.siteplane.io/registry/v/1.4.2/kbd.json", "https://ui.siteplane.io/registry/v/1.4.2/sidebar.json", "https://ui.siteplane.io/registry/v/1.4.2/tooltip.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/dashboard-shell/default.tsx", "type": "registry:file", "target": "~/src/components/dashboard-shell-demo.tsx" } ] }, { "name": "dashboard-shell-sticky-header-example", "type": "registry:example", "title": "Sticky header", "description": "Compose a sidebar, header, and scrolling application content. Sticky header — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/dashboard-shell.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/dashboard-shell.json", "https://ui.siteplane.io/registry/v/1.4.2/sidebar.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/dashboard-shell/sticky-header.tsx", "type": "registry:file", "target": "~/src/components/dashboard-shell-sticky-header-example.tsx" } ] }, { "name": "dashboard-shell-header-workspace-on-top-example", "type": "registry:example", "title": "Workspace on top", "description": "Compose a sidebar, header, and scrolling application content. Workspace on top — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/dashboard-shell.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/dashboard-shell.json", "https://ui.siteplane.io/registry/v/1.4.2/dropdown-menu.json", "https://ui.siteplane.io/registry/v/1.4.2/sidebar.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/dashboard-shell/header-workspace-on-top.tsx", "type": "registry:file", "target": "~/src/components/dashboard-shell-header-workspace-on-top-example.tsx" } ] }, { "name": "dashboard-shell-header-logo-above-workspace-example", "type": "registry:example", "title": "Logo above the workspace", "description": "Compose a sidebar, header, and scrolling application content. Logo above the workspace — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/dashboard-shell.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/avatar.json", "https://ui.siteplane.io/registry/v/1.4.2/dashboard-shell.json", "https://ui.siteplane.io/registry/v/1.4.2/dropdown-menu.json", "https://ui.siteplane.io/registry/v/1.4.2/sidebar.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/dashboard-shell/header-logo-above-workspace.tsx", "type": "registry:file", "target": "~/src/components/dashboard-shell-header-logo-above-workspace-example.tsx" } ] }, { "name": "dashboard-shell-header-logo-only-example", "type": "registry:example", "title": "Logo only", "description": "Compose a sidebar, header, and scrolling application content. Logo only — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/dashboard-shell.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/dashboard-shell.json", "https://ui.siteplane.io/registry/v/1.4.2/sidebar.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/dashboard-shell/header-logo-only.tsx", "type": "registry:file", "target": "~/src/components/dashboard-shell-header-logo-only-example.tsx" } ] }, { "name": "dashboard-shell-controlled-example", "type": "registry:example", "title": "Controlled sidebar state", "description": "Compose a sidebar, header, and scrolling application content. Controlled sidebar state — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/dashboard-shell.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/dashboard-shell.json", "https://ui.siteplane.io/registry/v/1.4.2/sidebar.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/dashboard-shell/controlled.tsx", "type": "registry:file", "target": "~/src/components/dashboard-shell-controlled-example.tsx" } ] }, { "name": "data-list-demo", "type": "registry:example", "title": "Subscription details", "description": "Show the details of one record as label and value rows, side by side or stacked. Subscription details — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/data-list.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/data-list.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/data-list/default.tsx", "type": "registry:file", "target": "~/src/components/data-list-demo.tsx" } ] }, { "name": "data-list-dividers-example", "type": "registry:example", "title": "Connection details with dividers", "description": "Show the details of one record as label and value rows, side by side or stacked. Connection details with dividers — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/data-list.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/badge.json", "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/code.json", "https://ui.siteplane.io/registry/v/1.4.2/data-list.json", "https://ui.siteplane.io/registry/v/1.4.2/separator.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/data-list/dividers.tsx", "type": "registry:file", "target": "~/src/components/data-list-dividers-example.tsx" } ] }, { "name": "data-list-vertical-example", "type": "registry:example", "title": "Billing details with labels above the values", "description": "Show the details of one record as label and value rows, side by side or stacked. Billing details with labels above the values — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/data-list.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/data-list.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/data-list/vertical.tsx", "type": "registry:file", "target": "~/src/components/data-list-vertical-example.tsx" } ] }, { "name": "date-field-demo", "type": "registry:example", "title": "Invoice date field", "description": "Edit a date with keyboard segments or a calendar. Invoice date field — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/date-field.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/date-field.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/date-field/default.tsx", "type": "registry:file", "target": "~/src/components/date-field-demo.tsx" } ] }, { "name": "date-field-controlled-example", "type": "registry:example", "title": "Controlled meeting date", "description": "Edit a date with keyboard segments or a calendar. Controlled meeting date — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/date-field.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/date-field.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/date-field/controlled.tsx", "type": "registry:file", "target": "~/src/components/date-field-controlled-example.tsx" } ] }, { "name": "date-field-constraints-example", "type": "registry:example", "title": "Weekday delivery date", "description": "Edit a date with keyboard segments or a calendar. Weekday delivery date — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/date-field.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/date-field.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/date-field/constraints.tsx", "type": "registry:file", "target": "~/src/components/date-field-constraints-example.tsx" } ] }, { "name": "date-field-states-example", "type": "registry:example", "title": "Disabled, read-only and invalid date fields", "description": "Edit a date with keyboard segments or a calendar. Disabled, read-only and invalid date fields — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/date-field.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/date-field.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/date-field/states.tsx", "type": "registry:file", "target": "~/src/components/date-field-states-example.tsx" } ] }, { "name": "date-field-form-example", "type": "registry:example", "title": "Date field in a form", "description": "Edit a date with keyboard segments or a calendar. Date field in a form — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/date-field.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/date-field.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/date-field/form.tsx", "type": "registry:file", "target": "~/src/components/date-field-form-example.tsx" } ] }, { "name": "date-field-icons-example", "type": "registry:example", "title": "Date of birth field", "description": "Edit a date with keyboard segments or a calendar. Date of birth field — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/date-field.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/date-field.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/date-field/icons.tsx", "type": "registry:file", "target": "~/src/components/date-field-icons-example.tsx" } ] }, { "name": "date-picker-demo", "type": "registry:example", "title": "Due date picker", "description": "Choose a date from a button-triggered calendar. Due date picker — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/date-picker.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/date-picker.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/date-picker/default.tsx", "type": "registry:file", "target": "~/src/components/date-picker-demo.tsx" } ] }, { "name": "date-picker-controlled-example", "type": "registry:example", "title": "Controlled meeting date", "description": "Choose a date from a button-triggered calendar. Controlled meeting date — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/date-picker.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/date-picker.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/date-picker/controlled.tsx", "type": "registry:file", "target": "~/src/components/date-picker-controlled-example.tsx" } ] }, { "name": "date-picker-constraints-example", "type": "registry:example", "title": "Weekday appointment date", "description": "Choose a date from a button-triggered calendar. Weekday appointment date — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/date-picker.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/date-picker.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/date-picker/constraints.tsx", "type": "registry:file", "target": "~/src/components/date-picker-constraints-example.tsx" } ] }, { "name": "date-picker-format-example", "type": "registry:example", "title": "Long date format", "description": "Choose a date from a button-triggered calendar. Long date format — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/date-picker.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/date-picker.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/date-picker/format.tsx", "type": "registry:file", "target": "~/src/components/date-picker-format-example.tsx" } ] }, { "name": "date-picker-states-example", "type": "registry:example", "title": "Disabled and invalid date pickers", "description": "Choose a date from a button-triggered calendar. Disabled and invalid date pickers — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/date-picker.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/date-picker.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/date-picker/states.tsx", "type": "registry:file", "target": "~/src/components/date-picker-states-example.tsx" } ] }, { "name": "date-range-picker-demo", "type": "registry:example", "title": "Out-of-office dates", "description": "Edit and select a start and end date. Out-of-office dates — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/date-range-picker.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/date-range-picker.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/date-range-picker/default.tsx", "type": "registry:file", "target": "~/src/components/date-range-picker-demo.tsx" } ] }, { "name": "date-range-picker-controlled-example", "type": "registry:example", "title": "Controlled trip dates", "description": "Edit and select a start and end date. Controlled trip dates — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/date-range-picker.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/date-range-picker.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/date-range-picker/controlled.tsx", "type": "registry:file", "target": "~/src/components/date-range-picker-controlled-example.tsx" } ] }, { "name": "date-range-picker-constraints-example", "type": "registry:example", "title": "Stay dates within the booking window", "description": "Edit and select a start and end date. Stay dates within the booking window — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/date-range-picker.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/date-range-picker.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/date-range-picker/constraints.tsx", "type": "registry:file", "target": "~/src/components/date-range-picker-constraints-example.tsx" } ] }, { "name": "date-range-picker-states-example", "type": "registry:example", "title": "Disabled, read-only and invalid date ranges", "description": "Edit and select a start and end date. Disabled, read-only and invalid date ranges — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/date-range-picker.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/date-range-picker.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/date-range-picker/states.tsx", "type": "registry:file", "target": "~/src/components/date-range-picker-states-example.tsx" } ] }, { "name": "date-range-picker-form-example", "type": "registry:example", "title": "Date range in a form", "description": "Edit and select a start and end date. Date range in a form — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/date-range-picker.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/date-range-picker.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/date-range-picker/form.tsx", "type": "registry:file", "target": "~/src/components/date-range-picker-form-example.tsx" } ] }, { "name": "date-time-picker-demo", "type": "registry:example", "title": "Scheduled publish time", "description": "Edit a local date and time in one control. Scheduled publish time — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/date-time-picker.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/date-time-picker.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/date-time-picker/default.tsx", "type": "registry:file", "target": "~/src/components/date-time-picker-demo.tsx" } ] }, { "name": "date-time-picker-controlled-example", "type": "registry:example", "title": "Controlled meeting start", "description": "Edit a local date and time in one control. Controlled meeting start — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/date-time-picker.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/date-time-picker.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/date-time-picker/controlled.tsx", "type": "registry:file", "target": "~/src/components/date-time-picker-controlled-example.tsx" } ] }, { "name": "date-time-picker-constraints-example", "type": "registry:example", "title": "Weekday interview", "description": "Edit a local date and time in one control. Weekday interview — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/date-time-picker.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/date-time-picker.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/date-time-picker/constraints.tsx", "type": "registry:file", "target": "~/src/components/date-time-picker-constraints-example.tsx" } ] }, { "name": "date-time-picker-step-example", "type": "registry:example", "title": "Meeting start in 15-minute steps", "description": "Edit a local date and time in one control. Meeting start in 15-minute steps — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/date-time-picker.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/date-time-picker.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/date-time-picker/step.tsx", "type": "registry:file", "target": "~/src/components/date-time-picker-step-example.tsx" } ] }, { "name": "date-time-picker-states-example", "type": "registry:example", "title": "Disabled, read-only and invalid date and time fields", "description": "Edit a local date and time in one control. Disabled, read-only and invalid date and time fields — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/date-time-picker.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/date-time-picker.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/date-time-picker/states.tsx", "type": "registry:file", "target": "~/src/components/date-time-picker-states-example.tsx" } ] }, { "name": "date-time-picker-form-example", "type": "registry:example", "title": "Date and time in a form", "description": "Edit a local date and time in one control. Date and time in a form — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/date-time-picker.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/date-time-picker.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/date-time-picker/form.tsx", "type": "registry:file", "target": "~/src/components/date-time-picker-form-example.tsx" } ] }, { "name": "detail-drawer-demo", "type": "registry:example", "title": "Customer details from a list", "description": "Show record details in a right-side drawer. Customer details from a list — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/detail-drawer.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/avatar.json", "https://ui.siteplane.io/registry/v/1.4.2/badge.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/data-list.json", "https://ui.siteplane.io/registry/v/1.4.2/detail-drawer.json", "https://ui.siteplane.io/registry/v/1.4.2/resource-list.json", "https://ui.siteplane.io/registry/v/1.4.2/timeline.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/detail-drawer/default.tsx", "type": "registry:file", "target": "~/src/components/detail-drawer-demo.tsx" } ] }, { "name": "detail-drawer-form-example", "type": "registry:example", "title": "Edit project drawer", "description": "Show record details in a right-side drawer. Edit project drawer — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/detail-drawer.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/detail-drawer.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/detail-drawer/form.tsx", "type": "registry:file", "target": "~/src/components/detail-drawer-form-example.tsx" } ] }, { "name": "detail-drawer-scrolling-example", "type": "registry:example", "title": "Invoice history with downloads", "description": "Show record details in a right-side drawer. Invoice history with downloads — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/detail-drawer.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/badge.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/detail-drawer.json", "https://ui.siteplane.io/registry/v/1.4.2/table.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/detail-drawer/scrolling.tsx", "type": "registry:file", "target": "~/src/components/detail-drawer-scrolling-example.tsx" } ] }, { "name": "dialog-demo", "type": "registry:example", "title": "Rename project form", "description": "Display a focused task in an overlay with a title and a clear close action. Rename project form — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/dialog.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/dialog.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/dialog/default.tsx", "type": "registry:file", "target": "~/src/components/dialog-demo.tsx" } ] }, { "name": "dialog-controlled-example", "type": "registry:example", "title": "Share dialog opened from a menu", "description": "Display a focused task in an overlay with a title and a clear close action. Share dialog opened from a menu — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/dialog.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/dialog.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/label.json", "https://ui.siteplane.io/registry/v/1.4.2/menu.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/dialog/controlled.tsx", "type": "registry:file", "target": "~/src/components/dialog-controlled-example.tsx" } ] }, { "name": "dialog-nested-example", "type": "registry:example", "title": "Nested team member dialogs", "description": "Display a focused task in an overlay with a title and a clear close action. Nested team member dialogs — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/dialog.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/data-list.json", "https://ui.siteplane.io/registry/v/1.4.2/dialog.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/dialog/nested.tsx", "type": "registry:file", "target": "~/src/components/dialog-nested-example.tsx" } ] }, { "name": "dialog-scrolling-example", "type": "registry:example", "title": "Terms of service with scrollable content", "description": "Display a focused task in an overlay with a title and a clear close action. Terms of service with scrollable content — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/dialog.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/dialog.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/dialog/scrolling.tsx", "type": "registry:file", "target": "~/src/components/dialog-scrolling-example.tsx" } ] }, { "name": "drawer-demo", "type": "registry:example", "title": "Task filters drawer", "description": "Open an edge panel with swipe dismissal. Task filters drawer — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/drawer.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/checkbox.json", "https://ui.siteplane.io/registry/v/1.4.2/checkbox-group.json", "https://ui.siteplane.io/registry/v/1.4.2/drawer.json", "https://ui.siteplane.io/registry/v/1.4.2/fieldset.json", "https://ui.siteplane.io/registry/v/1.4.2/label.json", "https://ui.siteplane.io/registry/v/1.4.2/radio-group.json", "https://ui.siteplane.io/registry/v/1.4.2/toggle-group.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/drawer/default.tsx", "type": "registry:file", "target": "~/src/components/drawer-demo.tsx" } ] }, { "name": "drawer-mobile-menu-example", "type": "registry:example", "title": "Mobile navigation drawer", "description": "Open an edge panel with swipe dismissal. Mobile navigation drawer — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/drawer.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/avatar.json", "https://ui.siteplane.io/registry/v/1.4.2/badge.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/drawer.json", "https://ui.siteplane.io/registry/v/1.4.2/separator.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/drawer/mobile-menu.tsx", "type": "registry:file", "target": "~/src/components/drawer-mobile-menu-example.tsx" } ] }, { "name": "drawer-menu-example", "type": "registry:example", "title": "File actions drawer", "description": "Open an edge panel with swipe dismissal. File actions drawer — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/drawer.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/drawer.json", "https://ui.siteplane.io/registry/v/1.4.2/file-type-icon.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/drawer/menu.tsx", "type": "registry:file", "target": "~/src/components/drawer-menu-example.tsx" } ] }, { "name": "drawer-positions-example", "type": "registry:example", "title": "Drawers on each edge", "description": "Open an edge panel with swipe dismissal. Drawers on each edge — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/drawer.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/avatar.json", "https://ui.siteplane.io/registry/v/1.4.2/badge.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/checkbox.json", "https://ui.siteplane.io/registry/v/1.4.2/checkbox-group.json", "https://ui.siteplane.io/registry/v/1.4.2/data-list.json", "https://ui.siteplane.io/registry/v/1.4.2/drawer.json", "https://ui.siteplane.io/registry/v/1.4.2/fieldset.json", "https://ui.siteplane.io/registry/v/1.4.2/label.json", "https://ui.siteplane.io/registry/v/1.4.2/resource-list.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/drawer/positions.tsx", "type": "registry:file", "target": "~/src/components/drawer-positions-example.tsx" } ] }, { "name": "drawer-width-example", "type": "registry:example", "title": "Readable and full-width bottom drawers", "description": "Open an edge panel with swipe dismissal. Readable and full-width bottom drawers — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/drawer.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/drawer.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/drawer/width.tsx", "type": "registry:file", "target": "~/src/components/drawer-width-example.tsx" } ] }, { "name": "drawer-variants-example", "type": "registry:example", "title": "Default, inset and straight drawers", "description": "Open an edge panel with swipe dismissal. Default, inset and straight drawers — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/drawer.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/avatar.json", "https://ui.siteplane.io/registry/v/1.4.2/avatar-group.json", "https://ui.siteplane.io/registry/v/1.4.2/badge.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/data-list.json", "https://ui.siteplane.io/registry/v/1.4.2/drawer.json", "https://ui.siteplane.io/registry/v/1.4.2/progress.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/drawer/variants.tsx", "type": "registry:file", "target": "~/src/components/drawer-variants-example.tsx" } ] }, { "name": "drawer-scrolling-example", "type": "registry:example", "title": "Scrollable activity drawer", "description": "Open an edge panel with swipe dismissal. Scrollable activity drawer — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/drawer.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/drawer.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/drawer/scrolling.tsx", "type": "registry:file", "target": "~/src/components/drawer-scrolling-example.tsx" } ] }, { "name": "drawer-snap-points-example", "type": "registry:example", "title": "Comments drawer with snap points", "description": "Open an edge panel with swipe dismissal. Comments drawer with snap points — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/drawer.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/drawer.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/drawer/snap-points.tsx", "type": "registry:file", "target": "~/src/components/drawer-snap-points-example.tsx" } ] }, { "name": "dropdown-menu-demo", "type": "registry:example", "title": "Account dropdown menu", "description": "Build a menu with DropdownMenu-prefixed part names. Account dropdown menu — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/dropdown-menu.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/dropdown-menu.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/dropdown-menu/default.tsx", "type": "registry:file", "target": "~/src/components/dropdown-menu-demo.tsx" } ] }, { "name": "dropdown-menu-glass-example", "type": "registry:example", "title": "Glass dropdown menu", "description": "Build a menu with DropdownMenu-prefixed part names. Glass dropdown menu — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/dropdown-menu.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/dropdown-menu.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/dropdown-menu/glass.tsx", "type": "registry:file", "target": "~/src/components/dropdown-menu-glass-example.tsx" } ] }, { "name": "empty-state-demo", "type": "registry:example", "title": "Empty project list with actions", "description": "Explain why a collection has no content and what to do next. Empty project list with actions — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/empty-state.md", "categories": [ "Feedback" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/empty-state.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/empty-state/default.tsx", "type": "registry:file", "target": "~/src/components/empty-state-demo.tsx" } ] }, { "name": "empty-state-no-results-example", "type": "registry:example", "title": "No matching projects", "description": "Explain why a collection has no content and what to do next. No matching projects — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/empty-state.md", "categories": [ "Feedback" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/empty-state.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/empty-state/no-results.tsx", "type": "registry:file", "target": "~/src/components/empty-state-no-results-example.tsx" } ] }, { "name": "empty-state-with-avatars-example", "type": "registry:example", "title": "Invite team members", "description": "Explain why a collection has no content and what to do next. Invite team members — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/empty-state.md", "categories": [ "Feedback" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/avatar.json", "https://ui.siteplane.io/registry/v/1.4.2/avatar-group.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/empty-state.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/empty-state/with-avatars.tsx", "type": "registry:file", "target": "~/src/components/empty-state-with-avatars-example.tsx" } ] }, { "name": "field-demo", "type": "registry:example", "title": "Project name with description", "description": "Connect a control with its label, help and validation. Project name with description — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/field.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/field/default.tsx", "type": "registry:file", "target": "~/src/components/field-demo.tsx" } ] }, { "name": "field-validation-example", "type": "registry:example", "title": "Project slug validation", "description": "Connect a control with its label, help and validation. Project slug validation — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/field.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/field/validation.tsx", "type": "registry:file", "target": "~/src/components/field-validation-example.tsx" } ] }, { "name": "field-floating-label-example", "type": "registry:example", "title": "Floating label fields", "description": "Connect a control with its label, help and validation. Floating label fields — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/field.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/action-icons.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/combobox.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/input-group.json", "https://ui.siteplane.io/registry/v/1.4.2/select.json", "https://ui.siteplane.io/registry/v/1.4.2/textarea.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/field/floating-label.tsx", "type": "registry:file", "target": "~/src/components/field-floating-label-example.tsx" } ] }, { "name": "field-with-select-example", "type": "registry:example", "title": "Data region select", "description": "Connect a control with its label, help and validation. Data region select — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/field.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/select.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/field/with-select.tsx", "type": "registry:file", "target": "~/src/components/field-with-select-example.tsx" } ] }, { "name": "field-item-example", "type": "registry:example", "title": "Product updates opt-in", "description": "Connect a control with its label, help and validation. Product updates opt-in — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/field.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/checkbox.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/field/item.tsx", "type": "registry:file", "target": "~/src/components/field-item-example.tsx" } ] }, { "name": "fieldset-demo", "type": "registry:example", "title": "Shipping address", "description": "Group related form fields under a shared legend. Shipping address — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/fieldset.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/fieldset.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/fieldset/default.tsx", "type": "registry:file", "target": "~/src/components/fieldset-demo.tsx" } ] }, { "name": "fieldset-disabled-example", "type": "registry:example", "title": "Disabled billing details", "description": "Group related form fields under a shared legend. Disabled billing details — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/fieldset.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/fieldset.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/fieldset/disabled.tsx", "type": "registry:file", "target": "~/src/components/fieldset-disabled-example.tsx" } ] }, { "name": "fieldset-choice-set-example", "type": "registry:example", "title": "Email digest frequency", "description": "Group related form fields under a shared legend. Email digest frequency — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/fieldset.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/fieldset.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/radio-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/fieldset/choice-set.tsx", "type": "registry:file", "target": "~/src/components/fieldset-choice-set-example.tsx" } ] }, { "name": "file-type-icon-demo", "type": "registry:example", "title": "File type icons for common files", "description": "Show a file’s type as a document icon with its extension. File type icons for common files — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/file-type-icon.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/file-type-icon.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/file-type-icon/default.tsx", "type": "registry:file", "target": "~/src/components/file-type-icon-demo.tsx" } ] }, { "name": "file-type-icon-types-example", "type": "registry:example", "title": "Icons by file type", "description": "Show a file’s type as a document icon with its extension. Icons by file type — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/file-type-icon.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/file-type-icon.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/file-type-icon/types.tsx", "type": "registry:file", "target": "~/src/components/file-type-icon-types-example.tsx" } ] }, { "name": "file-type-icon-sizes-example", "type": "registry:example", "title": "Icon sizes", "description": "Show a file’s type as a document icon with its extension. Icon sizes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/file-type-icon.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/file-type-icon.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/file-type-icon/sizes.tsx", "type": "registry:file", "target": "~/src/components/file-type-icon-sizes-example.tsx" } ] }, { "name": "file-type-icon-list-example", "type": "registry:example", "title": "Icons beside file names", "description": "Show a file’s type as a document icon with its extension. Icons beside file names — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/file-type-icon.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/file-type-icon.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/file-type-icon/list.tsx", "type": "registry:file", "target": "~/src/components/file-type-icon-list-example.tsx" } ] }, { "name": "file-type-icon-extension-example", "type": "registry:example", "title": "Icons chosen by extension", "description": "Show a file’s type as a document icon with its extension. Icons chosen by extension — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/file-type-icon.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/file-type-icon.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/file-type-icon/extension.tsx", "type": "registry:file", "target": "~/src/components/file-type-icon-extension-example.tsx" } ] }, { "name": "filter-bar-demo", "type": "registry:example", "title": "Projects with search in the tab bar", "description": "Arrange search, filters and actions above a collection. Projects with search in the tab bar — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/filter-bar.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/empty-state.json", "https://ui.siteplane.io/registry/v/1.4.2/filter-bar.json", "https://ui.siteplane.io/registry/v/1.4.2/motion.json", "https://ui.siteplane.io/registry/v/1.4.2/resource-list.json", "https://ui.siteplane.io/registry/v/1.4.2/tabs.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/filter-bar/default.tsx", "type": "registry:file", "target": "~/src/components/filter-bar-demo.tsx" } ] }, { "name": "filter-bar-removable-filters-example", "type": "registry:example", "title": "Accounts with a status filter and removable tags", "description": "Arrange search, filters and actions above a collection. Accounts with a status filter and removable tags — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/filter-bar.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/empty-state.json", "https://ui.siteplane.io/registry/v/1.4.2/filter-bar.json", "https://ui.siteplane.io/registry/v/1.4.2/input-group.json", "https://ui.siteplane.io/registry/v/1.4.2/menu.json", "https://ui.siteplane.io/registry/v/1.4.2/motion.json", "https://ui.siteplane.io/registry/v/1.4.2/resource-list.json", "https://ui.siteplane.io/registry/v/1.4.2/tag-group.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/filter-bar/removable-filters.tsx", "type": "registry:file", "target": "~/src/components/filter-bar-removable-filters-example.tsx" } ] }, { "name": "filter-bar-date-range-example", "type": "registry:example", "title": "Invoices filtered by a date range", "description": "Arrange search, filters and actions above a collection. Invoices filtered by a date range — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/filter-bar.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/date-range-picker.json", "https://ui.siteplane.io/registry/v/1.4.2/empty-state.json", "https://ui.siteplane.io/registry/v/1.4.2/filter-bar.json", "https://ui.siteplane.io/registry/v/1.4.2/input-group.json", "https://ui.siteplane.io/registry/v/1.4.2/motion.json", "https://ui.siteplane.io/registry/v/1.4.2/resource-list.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/filter-bar/date-range.tsx", "type": "registry:file", "target": "~/src/components/filter-bar-date-range-example.tsx" } ] }, { "name": "form-demo", "type": "registry:example", "title": "Sign-in form", "description": "Submit related fields and display validation feedback. Sign-in form — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/form.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/form/default.tsx", "type": "registry:file", "target": "~/src/components/form-demo.tsx" } ] }, { "name": "form-server-validation-example", "type": "registry:example", "title": "Server validation", "description": "Submit related fields and display validation feedback. Server validation — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/form.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/form/server-validation.tsx", "type": "registry:file", "target": "~/src/components/form-server-validation-example.tsx" } ] }, { "name": "form-reset-example", "type": "registry:example", "title": "Controlled reset", "description": "Submit related fields and display validation feedback. Controlled reset — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/form.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/form/reset.tsx", "type": "registry:file", "target": "~/src/components/form-reset-example.tsx" } ] }, { "name": "form-floating-labels-example", "type": "registry:example", "title": "Contact details form", "description": "Submit related fields and display validation feedback. Contact details form — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/form.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/fieldset.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/select.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/form/floating-labels.tsx", "type": "registry:file", "target": "~/src/components/form-floating-labels-example.tsx" } ] }, { "name": "frame-demo", "type": "registry:example", "title": "Frame with header, panel and footer", "description": "Group raised panels inside a shared frame. Frame with header, panel and footer — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/frame.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/frame.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/frame/default.tsx", "type": "registry:file", "target": "~/src/components/frame-demo.tsx" } ] }, { "name": "frame-sections-example", "type": "registry:example", "title": "Frame with separated panels", "description": "Group raised panels inside a shared frame. Frame with separated panels — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/frame.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/frame.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/frame/sections.tsx", "type": "registry:file", "target": "~/src/components/frame-sections-example.tsx" } ] }, { "name": "frame-settings-panel-example", "type": "registry:example", "title": "Frame with stacked sections", "description": "Group raised panels inside a shared frame. Frame with stacked sections — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/frame.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/frame.json", "https://ui.siteplane.io/registry/v/1.4.2/separator.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/frame/settings-panel.tsx", "type": "registry:file", "target": "~/src/components/frame-settings-panel-example.tsx" } ] }, { "name": "group-demo", "type": "registry:example", "title": "Message actions with an overflow menu", "description": "Join related controls into one visual group. Message actions with an overflow menu — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/group.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/group.json", "https://ui.siteplane.io/registry/v/1.4.2/menu.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/group/default.tsx", "type": "registry:file", "target": "~/src/components/group-demo.tsx" } ] }, { "name": "group-text-example", "type": "registry:example", "title": "Website address with a prefix", "description": "Join related controls into one visual group. Website address with a prefix — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/group.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/group.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/group/text.tsx", "type": "registry:file", "target": "~/src/components/group-text-example.tsx" } ] }, { "name": "group-input-button-example", "type": "registry:example", "title": "Search form with an input and a submit button", "description": "Join related controls into one visual group. Search form with an input and a submit button — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/group.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/group.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/group/input-button.tsx", "type": "registry:file", "target": "~/src/components/group-input-button-example.tsx" } ] }, { "name": "group-vertical-example", "type": "registry:example", "title": "Vertical zoom controls", "description": "Join related controls into one visual group. Vertical zoom controls — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/group.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/group.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/group/vertical.tsx", "type": "registry:file", "target": "~/src/components/group-vertical-example.tsx" } ] }, { "name": "icon-morphs-demo", "type": "registry:example", "title": "Menu button", "description": "Animate a menu trigger between closed and open states. Menu button — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/icon-morphs.md", "categories": [ "Animated" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/icon-morphs.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/icon-morphs/default.tsx", "type": "registry:file", "target": "~/src/components/icon-morphs-demo.tsx" } ] }, { "name": "icon-morphs-controlled-example", "type": "registry:example", "title": "Menu button controlling navigation", "description": "Animate a menu trigger between closed and open states. Menu button controlling navigation — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/icon-morphs.md", "categories": [ "Animated" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/collapsible.json", "https://ui.siteplane.io/registry/v/1.4.2/icon-morphs.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/icon-morphs/controlled.tsx", "type": "registry:file", "target": "~/src/components/icon-morphs-controlled-example.tsx" } ] }, { "name": "icon-morphs-sizes-example", "type": "registry:example", "title": "Menu button sizes", "description": "Animate a menu trigger between closed and open states. Menu button sizes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/icon-morphs.md", "categories": [ "Animated" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/icon-morphs.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/icon-morphs/sizes.tsx", "type": "registry:file", "target": "~/src/components/icon-morphs-sizes-example.tsx" } ] }, { "name": "input-demo", "type": "registry:example", "title": "Project name input", "description": "Enter a single line of text or a native input value. Project name input — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/input.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/input/default.tsx", "type": "registry:file", "target": "~/src/components/input-demo.tsx" } ] }, { "name": "input-variants-example", "type": "registry:example", "title": "Input surface variants", "description": "Enter a single line of text or a native input value. Input surface variants — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/input.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/input/variants.tsx", "type": "registry:file", "target": "~/src/components/input-variants-example.tsx" } ] }, { "name": "input-sizes-example", "type": "registry:example", "title": "Input sizes", "description": "Enter a single line of text or a native input value. Input sizes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/input.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/input/sizes.tsx", "type": "registry:file", "target": "~/src/components/input-sizes-example.tsx" } ] }, { "name": "input-states-example", "type": "registry:example", "title": "Disabled, read-only and invalid inputs", "description": "Enter a single line of text or a native input value. Disabled, read-only and invalid inputs — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/input.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/input/states.tsx", "type": "registry:file", "target": "~/src/components/input-states-example.tsx" } ] }, { "name": "input-file-example", "type": "registry:example", "title": "Attachment file input", "description": "Enter a single line of text or a native input value. Attachment file input — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/input.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/input/file.tsx", "type": "registry:file", "target": "~/src/components/input-file-example.tsx" } ] }, { "name": "input-password-example", "type": "registry:example", "title": "Password with show and hide toggle", "description": "Enter a single line of text or a native input value. Password with show and hide toggle — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/input.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/action-icons.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/input-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/input/password.tsx", "type": "registry:file", "target": "~/src/components/input-password-example.tsx" } ] }, { "name": "input-controlled-example", "type": "registry:example", "title": "Display name with character count", "description": "Enter a single line of text or a native input value. Display name with character count — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/input.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/input/controlled.tsx", "type": "registry:file", "target": "~/src/components/input-controlled-example.tsx" } ] }, { "name": "input-floating-label-example", "type": "registry:example", "title": "Email with a floating label", "description": "Enter a single line of text or a native input value. Email with a floating label — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/input.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/input/floating-label.tsx", "type": "registry:file", "target": "~/src/components/input-floating-label-example.tsx" } ] }, { "name": "input-group-demo", "type": "registry:example", "title": "Search with icon", "description": "Attach text, icons or actions to an input surface. Search with icon — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/input-group.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input-group.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/input-group/default.tsx", "type": "registry:file", "target": "~/src/components/input-group-demo.tsx" } ] }, { "name": "input-group-with-text-example", "type": "registry:example", "title": "Website and budget with text addons", "description": "Attach text, icons or actions to an input surface. Website and budget with text addons — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/input-group.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/input-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/input-group/with-text.tsx", "type": "registry:file", "target": "~/src/components/input-group-with-text-example.tsx" } ] }, { "name": "input-group-addons-example", "type": "registry:example", "title": "Discount code with an apply button", "description": "Attach text, icons or actions to an input surface. Discount code with an apply button — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/input-group.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/input-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/input-group/addons.tsx", "type": "registry:file", "target": "~/src/components/input-group-addons-example.tsx" } ] }, { "name": "input-group-password-toggle-example", "type": "registry:example", "title": "Password with visibility toggle", "description": "Attach text, icons or actions to an input surface. Password with visibility toggle — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/input-group.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/action-icons.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/input-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/input-group/password-toggle.tsx", "type": "registry:file", "target": "~/src/components/input-group-password-toggle-example.tsx" } ] }, { "name": "input-group-multiline-example", "type": "registry:example", "title": "Comment box with footer", "description": "Attach text, icons or actions to an input surface. Comment box with footer — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/input-group.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/input-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/input-group/multiline.tsx", "type": "registry:file", "target": "~/src/components/input-group-multiline-example.tsx" } ] }, { "name": "input-group-appearance-example", "type": "registry:example", "title": "Input group surfaces", "description": "Attach text, icons or actions to an input surface. Input group surfaces — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/input-group.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/input-group.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/input-group/appearance.tsx", "type": "registry:file", "target": "~/src/components/input-group-appearance-example.tsx" } ] }, { "name": "kbd-demo", "type": "registry:example", "title": "Keys and key combinations", "description": "Display a key or keyboard shortcut. Keys and key combinations — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/kbd.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/kbd.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/kbd/default.tsx", "type": "registry:file", "target": "~/src/components/kbd-demo.tsx" } ] }, { "name": "kbd-group-example", "type": "registry:example", "title": "Shortcut hint in text", "description": "Display a key or keyboard shortcut. Shortcut hint in text — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/kbd.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/kbd.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/kbd/group.tsx", "type": "registry:file", "target": "~/src/components/kbd-group-example.tsx" } ] }, { "name": "kbd-input-group-example", "type": "registry:example", "title": "Search field with shortcut hint", "description": "Display a key or keyboard shortcut. Search field with shortcut hint — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/kbd.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input-group.json", "https://ui.siteplane.io/registry/v/1.4.2/kbd.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/kbd/input-group.tsx", "type": "registry:file", "target": "~/src/components/kbd-input-group-example.tsx" } ] }, { "name": "kbd-button-example", "type": "registry:example", "title": "Print button with shortcut", "description": "Display a key or keyboard shortcut. Print button with shortcut — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/kbd.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/kbd.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/kbd/button.tsx", "type": "registry:file", "target": "~/src/components/kbd-button-example.tsx" } ] }, { "name": "label-demo", "type": "registry:example", "title": "Workspace name label", "description": "Give a native form control a visible accessible name. Workspace name label — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/label.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/label.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/label/default.tsx", "type": "registry:file", "target": "~/src/components/label-demo.tsx" } ] }, { "name": "label-help-example", "type": "registry:example", "title": "Required email with help text", "description": "Give a native form control a visible accessible name. Required email with help text — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/label.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/label/help.tsx", "type": "registry:file", "target": "~/src/components/label-help-example.tsx" } ] }, { "name": "label-checkbox-example", "type": "registry:example", "title": "Terms checkbox label", "description": "Give a native form control a visible accessible name. Terms checkbox label — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/label.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/checkbox.json", "https://ui.siteplane.io/registry/v/1.4.2/label.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/label/checkbox.tsx", "type": "registry:file", "target": "~/src/components/label-checkbox-example.tsx" } ] }, { "name": "line-chart-demo", "type": "registry:example", "title": "Active users by month", "description": "Show how one or several measures change over time or across ordered categories. Active users by month — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/line-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/line-chart.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/line-chart/default.tsx", "type": "registry:file", "target": "~/src/components/line-chart-demo.tsx" } ] }, { "name": "line-chart-multiple-example", "type": "registry:example", "title": "Sessions by device, one line each", "description": "Show how one or several measures change over time or across ordered categories. Sessions by device, one line each — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/line-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/line-chart.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/line-chart/multiple.tsx", "type": "registry:file", "target": "~/src/components/line-chart-multiple-example.tsx" } ] }, { "name": "line-chart-categorical-example", "type": "registry:example", "title": "Conversion rate by channel in percent", "description": "Show how one or several measures change over time or across ordered categories. Conversion rate by channel in percent — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/line-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/line-chart.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/line-chart/categorical.tsx", "type": "registry:file", "target": "~/src/components/line-chart-categorical-example.tsx" } ] }, { "name": "line-chart-curves-example", "type": "registry:example", "title": "Orders per hour in the four curves", "description": "Show how one or several measures change over time or across ordered categories. Orders per hour in the four curves — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/line-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/line-chart.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/line-chart/curves.tsx", "type": "registry:file", "target": "~/src/components/line-chart-curves-example.tsx" } ] }, { "name": "line-chart-dots-example", "type": "registry:example", "title": "Deploys per day with a dot on every point", "description": "Show how one or several measures change over time or across ordered categories. Deploys per day with a dot on every point — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/line-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/line-chart.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/line-chart/dots.tsx", "type": "registry:file", "target": "~/src/components/line-chart-dots-example.tsx" } ] }, { "name": "line-chart-dates-example", "type": "registry:example", "title": "Signups per day on a time axis", "description": "Show how one or several measures change over time or across ordered categories. Signups per day on a time axis — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/line-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/line-chart.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/line-chart/dates.tsx", "type": "registry:file", "target": "~/src/components/line-chart-dates-example.tsx" } ] }, { "name": "line-chart-fill-height-example", "type": "registry:example", "title": "A line chart that fills its card beside a taller card", "description": "Show how one or several measures change over time or across ordered categories. A line chart that fills its card beside a taller card — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/line-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/line-chart.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/line-chart/fill-height.tsx", "type": "registry:file", "target": "~/src/components/line-chart-fill-height-example.tsx" } ] }, { "name": "line-chart-changing-example", "type": "registry:example", "title": "Visits that glide when the period changes", "description": "Show how one or several measures change over time or across ordered categories. Visits that glide when the period changes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/line-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/line-chart.json", "https://ui.siteplane.io/registry/v/1.4.2/toggle-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/line-chart/changing.tsx", "type": "registry:file", "target": "~/src/components/line-chart-changing-example.tsx" } ] }, { "name": "list-box-demo", "type": "registry:example", "title": "Workspace list with descriptions", "description": "Choose one item from a visible list. Workspace list with descriptions — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/list-box.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/list-box.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/list-box/default.tsx", "type": "registry:file", "target": "~/src/components/list-box-demo.tsx" } ] }, { "name": "list-box-controlled-example", "type": "registry:example", "title": "Controlled workspace list", "description": "Choose one item from a visible list. Controlled workspace list — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/list-box.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/list-box.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/list-box/controlled.tsx", "type": "registry:file", "target": "~/src/components/list-box-controlled-example.tsx" } ] }, { "name": "list-box-appearance-example", "type": "registry:example", "title": "List with row selection", "description": "Choose one item from a visible list. List with row selection — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/list-box.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/list-box.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/list-box/appearance.tsx", "type": "registry:file", "target": "~/src/components/list-box-appearance-example.tsx" } ] }, { "name": "menu-demo", "type": "registry:example", "title": "Project actions menu", "description": "Offer a compact list of actions and choices. Project actions menu — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/menu.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/menu.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/menu/default.tsx", "type": "registry:file", "target": "~/src/components/menu-demo.tsx" } ] }, { "name": "menu-account-menu-example", "type": "registry:example", "title": "Account menu", "description": "Offer a compact list of actions and choices. Account menu — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/menu.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/avatar.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/menu.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/menu/account-menu.tsx", "type": "registry:file", "target": "~/src/components/menu-account-menu-example.tsx" } ] }, { "name": "menu-choices-example", "type": "registry:example", "title": "Notification preferences menu", "description": "Offer a compact list of actions and choices. Notification preferences menu — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/menu.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/menu.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/menu/choices.tsx", "type": "registry:file", "target": "~/src/components/menu-choices-example.tsx" } ] }, { "name": "menu-glass-example", "type": "registry:example", "title": "Glass menu", "description": "Offer a compact list of actions and choices. Glass menu — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/menu.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/menu.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/menu/glass.tsx", "type": "registry:file", "target": "~/src/components/menu-glass-example.tsx" } ] }, { "name": "meter-demo", "type": "registry:example", "title": "Storage usage meter", "description": "Measure a current value within a known range. Storage usage meter — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/meter.md", "categories": [ "Feedback" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/meter.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/meter/default.tsx", "type": "registry:file", "target": "~/src/components/meter-demo.tsx" } ] }, { "name": "meter-range-example", "type": "registry:example", "title": "Bandwidth usage in gigabytes", "description": "Measure a current value within a known range. Bandwidth usage in gigabytes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/meter.md", "categories": [ "Feedback" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/meter.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/meter/range.tsx", "type": "registry:file", "target": "~/src/components/meter-range-example.tsx" } ] }, { "name": "motion-demo", "type": "registry:example", "title": "Task list that adds and removes rows", "description": "Animate items that appear, leave, move or replace one another, and numbers that change, with no animation code. Task list that adds and removes rows — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/motion.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/motion.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/motion/default.tsx", "type": "registry:file", "target": "~/src/components/motion-demo.tsx" } ] }, { "name": "motion-reorder-example", "type": "registry:example", "title": "Sorting and shuffling a list", "description": "Animate items that appear, leave, move or replace one another, and numbers that change, with no animation code. Sorting and shuffling a list — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/motion.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/motion.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/motion/reorder.tsx", "type": "registry:file", "target": "~/src/components/motion-reorder-example.tsx" } ] }, { "name": "motion-divided-example", "type": "registry:example", "title": "Dividers that come and go with the space between rows", "description": "Animate items that appear, leave, move or replace one another, and numbers that change, with no animation code. Dividers that come and go with the space between rows — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/motion.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/motion.json", "https://ui.siteplane.io/registry/v/1.4.2/separator.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/motion/divided.tsx", "type": "registry:file", "target": "~/src/components/motion-divided-example.tsx" } ] }, { "name": "motion-flow-example", "type": "registry:example", "title": "Chips that wrap and glide", "description": "Animate items that appear, leave, move or replace one another, and numbers that change, with no animation code. Chips that wrap and glide — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/motion.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/motion.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/motion/flow.tsx", "type": "registry:file", "target": "~/src/components/motion-flow-example.tsx" } ] }, { "name": "motion-reveal-example", "type": "registry:example", "title": "A message that expands and collapses", "description": "Animate items that appear, leave, move or replace one another, and numbers that change, with no animation code. A message that expands and collapses — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/motion.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/alert.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/motion.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/motion/reveal.tsx", "type": "registry:file", "target": "~/src/components/motion-reveal-example.tsx" } ] }, { "name": "motion-field-error-example", "type": "registry:example", "title": "A field error under an input", "description": "Animate items that appear, leave, move or replace one another, and numbers that change, with no animation code. A field error under an input — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/motion.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/motion/field-error.tsx", "type": "registry:file", "target": "~/src/components/motion-field-error-example.tsx" } ] }, { "name": "motion-swap-example", "type": "registry:example", "title": "Steps that fade through and resize", "description": "Animate items that appear, leave, move or replace one another, and numbers that change, with no animation code. Steps that fade through and resize — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/motion.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/motion.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/motion/swap.tsx", "type": "registry:file", "target": "~/src/components/motion-swap-example.tsx" } ] }, { "name": "motion-number-example", "type": "registry:example", "title": "Revenue and change that roll to new values", "description": "Animate items that appear, leave, move or replace one another, and numbers that change, with no animation code. Revenue and change that roll to new values — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/motion.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/motion.json", "https://ui.siteplane.io/registry/v/1.4.2/toggle-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/motion/number.tsx", "type": "registry:file", "target": "~/src/components/motion-number-example.tsx" } ] }, { "name": "motion-values-example", "type": "registry:example", "title": "Bars that glide to new data", "description": "Animate items that appear, leave, move or replace one another, and numbers that change, with no animation code. Bars that glide to new data — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/motion.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/motion.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/motion/values.tsx", "type": "registry:file", "target": "~/src/components/motion-values-example.tsx" } ] }, { "name": "navigation-menu-demo", "type": "registry:example", "title": "Navigation menu with two dropdown panels and a link", "description": "Open site sections from a row of links with dropdown panels. Navigation menu with two dropdown panels and a link — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/navigation-menu.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/navigation-menu.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/navigation-menu/default.tsx", "type": "registry:file", "target": "~/src/components/navigation-menu-demo.tsx" } ] }, { "name": "navigation-menu-groups-example", "type": "registry:example", "title": "Panel with two labeled groups", "description": "Open site sections from a row of links with dropdown panels. Panel with two labeled groups — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/navigation-menu.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/badge.json", "https://ui.siteplane.io/registry/v/1.4.2/navigation-menu.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/navigation-menu/groups.tsx", "type": "registry:file", "target": "~/src/components/navigation-menu-groups-example.tsx" } ] }, { "name": "navigation-menu-controlled-example", "type": "registry:example", "title": "Controlled open panel", "description": "Open site sections from a row of links with dropdown panels. Controlled open panel — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/navigation-menu.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/navigation-menu.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/navigation-menu/controlled.tsx", "type": "registry:file", "target": "~/src/components/navigation-menu-controlled-example.tsx" } ] }, { "name": "number-field-demo", "type": "registry:example", "title": "Quantity field", "description": "Edit a numeric value with typing, stepping or scrubbing. Quantity field — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/number-field.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/number-field.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/number-field/default.tsx", "type": "registry:file", "target": "~/src/components/number-field-demo.tsx" } ] }, { "name": "number-field-controlled-example", "type": "registry:example", "title": "Session timeout in 5-minute steps", "description": "Edit a numeric value with typing, stepping or scrubbing. Session timeout in 5-minute steps — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/number-field.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/number-field.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/number-field/controlled.tsx", "type": "registry:file", "target": "~/src/components/number-field-controlled-example.tsx" } ] }, { "name": "number-field-format-example", "type": "registry:example", "title": "Budget in US dollars", "description": "Edit a numeric value with typing, stepping or scrubbing. Budget in US dollars — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/number-field.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/number-field.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/number-field/format.tsx", "type": "registry:file", "target": "~/src/components/number-field-format-example.tsx" } ] }, { "name": "number-field-appearance-example", "type": "registry:example", "title": "Number field variants and disabled state", "description": "Edit a numeric value with typing, stepping or scrubbing. Number field variants and disabled state — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/number-field.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/number-field.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/number-field/appearance.tsx", "type": "registry:file", "target": "~/src/components/number-field-appearance-example.tsx" } ] }, { "name": "number-field-sizes-example", "type": "registry:example", "title": "Number field sizes", "description": "Edit a numeric value with typing, stepping or scrubbing. Number field sizes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/number-field.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/number-field.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/number-field/sizes.tsx", "type": "registry:file", "target": "~/src/components/number-field-sizes-example.tsx" } ] }, { "name": "number-field-emphasized-example", "type": "registry:example", "title": "Cart quantity", "description": "Edit a numeric value with typing, stepping or scrubbing. Cart quantity — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/number-field.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/number-field.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/number-field/emphasized.tsx", "type": "registry:file", "target": "~/src/components/number-field-emphasized-example.tsx" } ] }, { "name": "number-field-form-example", "type": "registry:example", "title": "Team seats in a form", "description": "Edit a numeric value with typing, stepping or scrubbing. Team seats in a form — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/number-field.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/number-field.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/number-field/form.tsx", "type": "registry:file", "target": "~/src/components/number-field-form-example.tsx" } ] }, { "name": "otp-field-demo", "type": "registry:example", "title": "Verification code", "description": "Enter a short verification code in separate or joined slots. Verification code — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/otp-field.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/otp-field.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/otp-field/default.tsx", "type": "registry:file", "target": "~/src/components/otp-field-demo.tsx" } ] }, { "name": "otp-field-separator-example", "type": "registry:example", "title": "Verification code in two groups", "description": "Enter a short verification code in separate or joined slots. Verification code in two groups — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/otp-field.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/otp-field.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/otp-field/separator.tsx", "type": "registry:file", "target": "~/src/components/otp-field-separator-example.tsx" } ] }, { "name": "otp-field-joined-example", "type": "registry:example", "title": "Verification code in a joined field", "description": "Enter a short verification code in separate or joined slots. Verification code in a joined field — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/otp-field.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/otp-field.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/otp-field/joined.tsx", "type": "registry:file", "target": "~/src/components/otp-field-joined-example.tsx" } ] }, { "name": "otp-field-alphanumeric-example", "type": "registry:example", "title": "Recovery code", "description": "Enter a short verification code in separate or joined slots. Recovery code — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/otp-field.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/otp-field.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/otp-field/alphanumeric.tsx", "type": "registry:file", "target": "~/src/components/otp-field-alphanumeric-example.tsx" } ] }, { "name": "otp-field-controlled-example", "type": "registry:example", "title": "Controlled one-time password", "description": "Enter a short verification code in separate or joined slots. Controlled one-time password — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/otp-field.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/otp-field.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/otp-field/controlled.tsx", "type": "registry:file", "target": "~/src/components/otp-field-controlled-example.tsx" } ] }, { "name": "otp-field-appearance-example", "type": "registry:example", "title": "Code variants, masking and disabled", "description": "Enter a short verification code in separate or joined slots. Code variants, masking and disabled — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/otp-field.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/otp-field.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/otp-field/appearance.tsx", "type": "registry:file", "target": "~/src/components/otp-field-appearance-example.tsx" } ] }, { "name": "otp-field-sizes-example", "type": "registry:example", "title": "Code sizes", "description": "Enter a short verification code in separate or joined slots. Code sizes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/otp-field.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/otp-field.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/otp-field/sizes.tsx", "type": "registry:file", "target": "~/src/components/otp-field-sizes-example.tsx" } ] }, { "name": "otp-field-form-example", "type": "registry:example", "title": "Verification code form", "description": "Enter a short verification code in separate or joined slots. Verification code form — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/otp-field.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/otp-field.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/otp-field/form.tsx", "type": "registry:file", "target": "~/src/components/otp-field-form-example.tsx" } ] }, { "name": "pagination-demo", "type": "registry:example", "title": "Paging through ten pages", "description": "Move between pages of a long list or table. Paging through ten pages — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/pagination.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/pagination.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/pagination/default.tsx", "type": "registry:file", "target": "~/src/components/pagination-demo.tsx" } ] }, { "name": "pagination-ghost-example", "type": "registry:example", "title": "Compact pagination", "description": "Move between pages of a long list or table. Compact pagination — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/pagination.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/pagination.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/pagination/ghost.tsx", "type": "registry:file", "target": "~/src/components/pagination-ghost-example.tsx" } ] }, { "name": "pie-chart-demo", "type": "registry:example", "title": "Storage use with an unfilled share", "description": "Show how a total divides into shares as a donut or pie chart. Storage use with an unfilled share — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/pie-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/pie-chart.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/pie-chart/default.tsx", "type": "registry:file", "target": "~/src/components/pie-chart-demo.tsx" } ] }, { "name": "pie-chart-pie-example", "type": "registry:example", "title": "Monthly revenue by plan as a pie", "description": "Show how a total divides into shares as a donut or pie chart. Monthly revenue by plan as a pie — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/pie-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/pie-chart.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/pie-chart/pie.tsx", "type": "registry:file", "target": "~/src/components/pie-chart-pie-example.tsx" } ] }, { "name": "pie-chart-center-example", "type": "registry:example", "title": "Donuts with a total and a compact total in their holes", "description": "Show how a total divides into shares as a donut or pie chart. Donuts with a total and a compact total in their holes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/pie-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/pie-chart.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/pie-chart/center.tsx", "type": "registry:file", "target": "~/src/components/pie-chart-center-example.tsx" } ] }, { "name": "pie-chart-without-legend-example", "type": "registry:example", "title": "A compact storage donut without a legend", "description": "Show how a total divides into shares as a donut or pie chart. A compact storage donut without a legend — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/pie-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/pie-chart.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/pie-chart/without-legend.tsx", "type": "registry:file", "target": "~/src/components/pie-chart-without-legend-example.tsx" } ] }, { "name": "pie-chart-categorical-example", "type": "registry:example", "title": "Traffic by channel in percent", "description": "Show how a total divides into shares as a donut or pie chart. Traffic by channel in percent — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/pie-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/pie-chart.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/pie-chart/categorical.tsx", "type": "registry:file", "target": "~/src/components/pie-chart-categorical-example.tsx" } ] }, { "name": "pie-chart-pop-out-example", "type": "registry:example", "title": "Sales by region with a share that pops out", "description": "Show how a total divides into shares as a donut or pie chart. Sales by region with a share that pops out — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/pie-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/pie-chart.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/pie-chart/pop-out.tsx", "type": "registry:file", "target": "~/src/components/pie-chart-pop-out-example.tsx" } ] }, { "name": "pie-chart-changing-example", "type": "registry:example", "title": "A ring that glides when the period or the shares change", "description": "Show how a total divides into shares as a donut or pie chart. A ring that glides when the period or the shares change — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/pie-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/pie-chart.json", "https://ui.siteplane.io/registry/v/1.4.2/toggle-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/pie-chart/changing.tsx", "type": "registry:file", "target": "~/src/components/pie-chart-changing-example.tsx" } ] }, { "name": "pie-chart-sizes-example", "type": "registry:example", "title": "Rings of 120, 200 and 280 pixels", "description": "Show how a total divides into shares as a donut or pie chart. Rings of 120, 200 and 280 pixels — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/pie-chart.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/pie-chart.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/pie-chart/sizes.tsx", "type": "registry:file", "target": "~/src/components/pie-chart-sizes-example.tsx" } ] }, { "name": "popover-demo", "type": "registry:example", "title": "Feedback form popover", "description": "Open contextual content next to a trigger. Feedback form popover — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/popover.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/popover.json", "https://ui.siteplane.io/registry/v/1.4.2/textarea.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/popover/default.tsx", "type": "registry:file", "target": "~/src/components/popover-demo.tsx" } ] }, { "name": "popover-close-button-example", "type": "registry:example", "title": "Notifications popover with a close button", "description": "Open contextual content next to a trigger. Notifications popover with a close button — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/popover.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/popover.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/popover/close-button.tsx", "type": "registry:file", "target": "~/src/components/popover-close-button-example.tsx" } ] }, { "name": "popover-position-example", "type": "registry:example", "title": "Popover alignment", "description": "Open contextual content next to a trigger. Popover alignment — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/popover.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/popover.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/popover/position.tsx", "type": "registry:file", "target": "~/src/components/popover-position-example.tsx" } ] }, { "name": "popover-compact-example", "type": "registry:example", "title": "Password requirements hint", "description": "Open contextual content next to a trigger. Password requirements hint — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/popover.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/input-group.json", "https://ui.siteplane.io/registry/v/1.4.2/popover.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/popover/compact.tsx", "type": "registry:file", "target": "~/src/components/popover-compact-example.tsx" } ] }, { "name": "popover-glass-example", "type": "registry:example", "title": "Glass popover", "description": "Open contextual content next to a trigger. Glass popover — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/popover.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/popover.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/popover/glass.tsx", "type": "registry:file", "target": "~/src/components/popover-glass-example.tsx" } ] }, { "name": "preview-card-demo", "type": "registry:example", "title": "User profile preview", "description": "Preview a link’s destination without leaving the current page. User profile preview — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/preview-card.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/avatar.json", "https://ui.siteplane.io/registry/v/1.4.2/preview-card.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/preview-card/default.tsx", "type": "registry:file", "target": "~/src/components/preview-card-demo.tsx" } ] }, { "name": "preview-card-link-preview-example", "type": "registry:example", "title": "Project link preview", "description": "Preview a link’s destination without leaving the current page. Project link preview — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/preview-card.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/preview-card.json", "https://ui.siteplane.io/registry/v/1.4.2/progress.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/preview-card/link-preview.tsx", "type": "registry:file", "target": "~/src/components/preview-card-link-preview-example.tsx" } ] }, { "name": "progress-demo", "type": "registry:example", "title": "Upload progress bar", "description": "Show how much of an operation has completed. Upload progress bar — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/progress.md", "categories": [ "Feedback" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/progress.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/progress/default.tsx", "type": "registry:file", "target": "~/src/components/progress-demo.tsx" } ] }, { "name": "progress-label-example", "type": "registry:example", "title": "Progress with label and value", "description": "Show how much of an operation has completed. Progress with label and value — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/progress.md", "categories": [ "Feedback" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/progress.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/progress/label.tsx", "type": "registry:file", "target": "~/src/components/progress-label-example.tsx" } ] }, { "name": "progress-range-example", "type": "registry:example", "title": "Upload size in megabytes", "description": "Show how much of an operation has completed. Upload size in megabytes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/progress.md", "categories": [ "Feedback" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/progress.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/progress/range.tsx", "type": "registry:file", "target": "~/src/components/progress-range-example.tsx" } ] }, { "name": "progress-circle-example", "type": "registry:example", "title": "Circular progress sizes", "description": "Show how much of an operation has completed. Circular progress sizes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/progress.md", "categories": [ "Feedback" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/progress.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/progress/circle.tsx", "type": "registry:file", "target": "~/src/components/progress-circle-example.tsx" } ] }, { "name": "radio-group-demo", "type": "registry:example", "title": "Notification frequency options", "description": "Choose one option from a related set. Notification frequency options — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/radio-group.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/label.json", "https://ui.siteplane.io/registry/v/1.4.2/radio-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/radio-group/default.tsx", "type": "registry:file", "target": "~/src/components/radio-group-demo.tsx" } ] }, { "name": "radio-group-with-description-example", "type": "registry:example", "title": "Radio options with descriptions", "description": "Choose one option from a related set. Radio options with descriptions — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/radio-group.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/fieldset.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/radio-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/radio-group/with-description.tsx", "type": "registry:file", "target": "~/src/components/radio-group-with-description-example.tsx" } ] }, { "name": "radio-group-controlled-example", "type": "registry:example", "title": "Controlled radio group with a disabled option", "description": "Choose one option from a related set. Controlled radio group with a disabled option — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/radio-group.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/label.json", "https://ui.siteplane.io/registry/v/1.4.2/radio-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/radio-group/controlled.tsx", "type": "registry:file", "target": "~/src/components/radio-group-controlled-example.tsx" } ] }, { "name": "radio-group-card-style-example", "type": "registry:example", "title": "Plan cards", "description": "Choose one option from a related set. Plan cards — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/radio-group.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/label.json", "https://ui.siteplane.io/registry/v/1.4.2/radio-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/radio-group/card-style.tsx", "type": "registry:file", "target": "~/src/components/radio-group-card-style-example.tsx" } ] }, { "name": "radio-group-form-example", "type": "registry:example", "title": "Radio group in a form", "description": "Choose one option from a related set. Radio group in a form — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/radio-group.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/fieldset.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/radio-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/radio-group/form.tsx", "type": "registry:file", "target": "~/src/components/radio-group-form-example.tsx" } ] }, { "name": "radio-group-sizes-example", "type": "registry:example", "title": "Radio group sizes", "description": "Choose one option from a related set. Radio group sizes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/radio-group.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/label.json", "https://ui.siteplane.io/registry/v/1.4.2/radio-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/radio-group/sizes.tsx", "type": "registry:file", "target": "~/src/components/radio-group-sizes-example.tsx" } ] }, { "name": "resource-list-demo", "type": "registry:example", "title": "Project list with status indicators", "description": "Display resources with status indicators, metadata and optional interactive rows. Project list with status indicators — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/resource-list.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/resource-list.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/resource-list/default.tsx", "type": "registry:file", "target": "~/src/components/resource-list-demo.tsx" } ] }, { "name": "resource-list-navigation-example", "type": "registry:example", "title": "Linked projects with the current item", "description": "Display resources with status indicators, metadata and optional interactive rows. Linked projects with the current item — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/resource-list.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/resource-list.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/resource-list/navigation.tsx", "type": "registry:file", "target": "~/src/components/resource-list-navigation-example.tsx" } ] }, { "name": "resource-list-indicators-example", "type": "registry:example", "title": "Tasks with icon indicators", "description": "Display resources with status indicators, metadata and optional interactive rows. Tasks with icon indicators — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/resource-list.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/resource-list.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/resource-list/indicators.tsx", "type": "registry:file", "target": "~/src/components/resource-list-indicators-example.tsx" } ] }, { "name": "resource-list-dense-list-example", "type": "registry:example", "title": "Compact list on a soft surface", "description": "Display resources with status indicators, metadata and optional interactive rows. Compact list on a soft surface — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/resource-list.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/resource-list.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/resource-list/dense-list.tsx", "type": "registry:file", "target": "~/src/components/resource-list-dense-list-example.tsx" } ] }, { "name": "resource-list-divided-example", "type": "registry:example", "title": "Recent changes in a card, divided by hairlines", "description": "Display resources with status indicators, metadata and optional interactive rows. Recent changes in a card, divided by hairlines — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/resource-list.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/resource-list.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/resource-list/divided.tsx", "type": "registry:file", "target": "~/src/components/resource-list-divided-example.tsx" } ] }, { "name": "resource-list-divided-header-example", "type": "registry:example", "title": "Recently published, with a header and clickable rows", "description": "Display resources with status indicators, metadata and optional interactive rows. Recently published, with a header and clickable rows — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/resource-list.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/resource-list.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/resource-list/divided-header.tsx", "type": "registry:file", "target": "~/src/components/resource-list-divided-header-example.tsx" } ] }, { "name": "resource-list-removable-example", "type": "registry:example", "title": "Projects with a Remove action", "description": "Display resources with status indicators, metadata and optional interactive rows. Projects with a Remove action — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/resource-list.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/resource-list.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/resource-list/removable.tsx", "type": "registry:file", "target": "~/src/components/resource-list-removable-example.tsx" } ] }, { "name": "scroll-area-demo", "type": "registry:example", "title": "Scrollable list of release tags", "description": "Constrain overflowing content with styled scrollbars. Scrollable list of release tags — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/scroll-area.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/scroll-area.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/scroll-area/default.tsx", "type": "registry:file", "target": "~/src/components/scroll-area-demo.tsx" } ] }, { "name": "scroll-area-fade-example", "type": "registry:example", "title": "List with faded edges", "description": "Constrain overflowing content with styled scrollbars. List with faded edges — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/scroll-area.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/scroll-area.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/scroll-area/fade.tsx", "type": "registry:file", "target": "~/src/components/scroll-area-fade-example.tsx" } ] }, { "name": "scroll-area-tag-row-example", "type": "registry:example", "title": "Horizontally scrolling tags", "description": "Constrain overflowing content with styled scrollbars. Horizontally scrolling tags — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/scroll-area.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/badge.json", "https://ui.siteplane.io/registry/v/1.4.2/scroll-area.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/scroll-area/tag-row.tsx", "type": "registry:file", "target": "~/src/components/scroll-area-tag-row-example.tsx" } ] }, { "name": "scroll-area-both-axes-example", "type": "registry:example", "title": "Content scrolling in both directions", "description": "Constrain overflowing content with styled scrollbars. Content scrolling in both directions — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/scroll-area.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/scroll-area.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/scroll-area/both-axes.tsx", "type": "registry:file", "target": "~/src/components/scroll-area-both-axes-example.tsx" } ] }, { "name": "scroll-area-fill-example", "type": "registry:example", "title": "Scroll area with a pinned footer", "description": "Constrain overflowing content with styled scrollbars. Scroll area with a pinned footer — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/scroll-area.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/scroll-area.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/scroll-area/fill.tsx", "type": "registry:file", "target": "~/src/components/scroll-area-fill-example.tsx" } ] }, { "name": "select-demo", "type": "registry:example", "title": "Workspace select", "description": "Choose from a fixed set of options without text filtering. Workspace select — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/select.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/select.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/select/default.tsx", "type": "registry:file", "target": "~/src/components/select-demo.tsx" } ] }, { "name": "select-controlled-example", "type": "registry:example", "title": "Controlled selection", "description": "Choose from a fixed set of options without text filtering. Controlled selection — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/select.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/select.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/select/controlled.tsx", "type": "registry:file", "target": "~/src/components/select-controlled-example.tsx" } ] }, { "name": "select-multiple-example", "type": "registry:example", "title": "Team multi-select", "description": "Choose from a fixed set of options without text filtering. Team multi-select — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/select.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/select.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/select/multiple.tsx", "type": "registry:file", "target": "~/src/components/select-multiple-example.tsx" } ] }, { "name": "select-groups-example", "type": "registry:example", "title": "Data region select with groups", "description": "Choose from a fixed set of options without text filtering. Data region select with groups — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/select.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/select.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/select/groups.tsx", "type": "registry:file", "target": "~/src/components/select-groups-example.tsx" } ] }, { "name": "select-options-with-icon-example", "type": "registry:example", "title": "Visibility select with icons", "description": "Choose from a fixed set of options without text filtering. Visibility select with icons — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/select.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/select.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/select/options-with-icon.tsx", "type": "registry:file", "target": "~/src/components/select-options-with-icon-example.tsx" } ] }, { "name": "select-appearance-example", "type": "registry:example", "title": "Select variants and disabled state", "description": "Choose from a fixed set of options without text filtering. Select variants and disabled state — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/select.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/select.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/select/appearance.tsx", "type": "registry:file", "target": "~/src/components/select-appearance-example.tsx" } ] }, { "name": "select-sizes-example", "type": "registry:example", "title": "Select sizes", "description": "Choose from a fixed set of options without text filtering. Select sizes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/select.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/select.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/select/sizes.tsx", "type": "registry:file", "target": "~/src/components/select-sizes-example.tsx" } ] }, { "name": "select-form-example", "type": "registry:example", "title": "Workspace select in a form", "description": "Choose from a fixed set of options without text filtering. Workspace select in a form — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/select.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/select.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/select/form.tsx", "type": "registry:file", "target": "~/src/components/select-form-example.tsx" } ] }, { "name": "separator-demo", "type": "registry:example", "title": "Separator between a heading and content", "description": "Divide related sections with a horizontal or vertical line. Separator between a heading and content — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/separator.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/separator.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/separator/default.tsx", "type": "registry:file", "target": "~/src/components/separator-demo.tsx" } ] }, { "name": "separator-vertical-example", "type": "registry:example", "title": "Vertical separators between items", "description": "Divide related sections with a horizontal or vertical line. Vertical separators between items — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/separator.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/separator.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/separator/vertical.tsx", "type": "registry:file", "target": "~/src/components/separator-vertical-example.tsx" } ] }, { "name": "separator-decorative-example", "type": "registry:example", "title": "Decorative separators between the rows of a list", "description": "Divide related sections with a horizontal or vertical line. Decorative separators between the rows of a list — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/separator.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/separator.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/separator/decorative.tsx", "type": "registry:file", "target": "~/src/components/separator-decorative-example.tsx" } ] }, { "name": "settings-list-demo", "type": "registry:example", "title": "Project settings", "description": "Arrange labeled settings and their controls in a shared card. Project settings — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/settings-list.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/select.json", "https://ui.siteplane.io/registry/v/1.4.2/settings-list.json", "https://ui.siteplane.io/registry/v/1.4.2/switch.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/settings-list/default.tsx", "type": "registry:file", "target": "~/src/components/settings-list-demo.tsx" } ] }, { "name": "settings-list-controlled-example", "type": "registry:example", "title": "Controlled profile settings", "description": "Arrange labeled settings and their controls in a shared card. Controlled profile settings — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/settings-list.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/badge.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/settings-list.json", "https://ui.siteplane.io/registry/v/1.4.2/switch.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/settings-list/controlled.tsx", "type": "registry:file", "target": "~/src/components/settings-list-controlled-example.tsx" } ] }, { "name": "sheet-demo", "type": "registry:example", "title": "Edit profile sheet", "description": "Open content in an edge panel. Edit profile sheet — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/sheet.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/sheet.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/sheet/default.tsx", "type": "registry:file", "target": "~/src/components/sheet-demo.tsx" } ] }, { "name": "sheet-positions-example", "type": "registry:example", "title": "Sheets on each side", "description": "Open content in an edge panel. Sheets on each side — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/sheet.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/sheet.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/sheet/positions.tsx", "type": "registry:file", "target": "~/src/components/sheet-positions-example.tsx" } ] }, { "name": "sheet-scrolling-example", "type": "registry:example", "title": "Scrollable release notes", "description": "Open content in an edge panel. Scrollable release notes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/sheet.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/sheet.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/sheet/scrolling.tsx", "type": "registry:file", "target": "~/src/components/sheet-scrolling-example.tsx" } ] }, { "name": "sheet-inset-example", "type": "registry:example", "title": "Inset invite sheet", "description": "Open content in an edge panel. Inset invite sheet — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/sheet.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/sheet.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/sheet/inset.tsx", "type": "registry:file", "target": "~/src/components/sheet-inset-example.tsx" } ] }, { "name": "sheet-fullscreen-example", "type": "registry:example", "title": "Fullscreen menu with a nested page", "description": "Open content in an edge panel. Fullscreen menu with a nested page — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/sheet.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/sheet.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/sheet/fullscreen.tsx", "type": "registry:file", "target": "~/src/components/sheet-fullscreen-example.tsx" } ] }, { "name": "sidebar-inset-example", "type": "registry:example", "title": "Inset workspace sidebar", "description": "Build application navigation with desktop collapse and a mobile sheet. Inset workspace sidebar — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/sidebar.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/avatar.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/collapsible.json", "https://ui.siteplane.io/registry/v/1.4.2/dropdown-menu.json", "https://ui.siteplane.io/registry/v/1.4.2/kbd.json", "https://ui.siteplane.io/registry/v/1.4.2/sidebar.json", "https://ui.siteplane.io/registry/v/1.4.2/tooltip.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/sidebar/inset.tsx", "type": "registry:file", "target": "~/src/components/sidebar-inset-example.tsx" } ] }, { "name": "sidebar-demo", "type": "registry:example", "title": "Push workspace sidebar", "description": "Build application navigation with desktop collapse and a mobile sheet. Push workspace sidebar — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/sidebar.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/avatar.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/collapsible.json", "https://ui.siteplane.io/registry/v/1.4.2/dropdown-menu.json", "https://ui.siteplane.io/registry/v/1.4.2/kbd.json", "https://ui.siteplane.io/registry/v/1.4.2/sidebar.json", "https://ui.siteplane.io/registry/v/1.4.2/tooltip.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/sidebar/default.tsx", "type": "registry:file", "target": "~/src/components/sidebar-demo.tsx" } ] }, { "name": "sidebar-header-workspace-on-top-example", "type": "registry:example", "title": "Workspace on top", "description": "Build application navigation with desktop collapse and a mobile sheet. Workspace on top — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/sidebar.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/dropdown-menu.json", "https://ui.siteplane.io/registry/v/1.4.2/sidebar.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/sidebar/header-workspace-on-top.tsx", "type": "registry:file", "target": "~/src/components/sidebar-header-workspace-on-top-example.tsx" } ] }, { "name": "sidebar-header-logo-above-workspace-example", "type": "registry:example", "title": "Logo above the workspace", "description": "Build application navigation with desktop collapse and a mobile sheet. Logo above the workspace — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/sidebar.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/avatar.json", "https://ui.siteplane.io/registry/v/1.4.2/dropdown-menu.json", "https://ui.siteplane.io/registry/v/1.4.2/sidebar.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/sidebar/header-logo-above-workspace.tsx", "type": "registry:file", "target": "~/src/components/sidebar-header-logo-above-workspace-example.tsx" } ] }, { "name": "sidebar-header-logo-only-example", "type": "registry:example", "title": "Logo only", "description": "Build application navigation with desktop collapse and a mobile sheet. Logo only — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/sidebar.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/sidebar.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/sidebar/header-logo-only.tsx", "type": "registry:file", "target": "~/src/components/sidebar-header-logo-only-example.tsx" } ] }, { "name": "sidebar-icon-example", "type": "registry:example", "title": "Icon collapse and resize rail", "description": "Build application navigation with desktop collapse and a mobile sheet. Icon collapse and resize rail — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/sidebar.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/sidebar.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/sidebar/icon.tsx", "type": "registry:file", "target": "~/src/components/sidebar-icon-example.tsx" } ] }, { "name": "sidebar-content-example", "type": "registry:example", "title": "Sidebar search, badges and nested links", "description": "Build application navigation with desktop collapse and a mobile sheet. Sidebar search, badges and nested links — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/sidebar.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/sidebar.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/sidebar/content.tsx", "type": "registry:file", "target": "~/src/components/sidebar-content-example.tsx" } ] }, { "name": "sidebar-two-line-example", "type": "registry:example", "title": "Workspace and account rows with a detail line", "description": "Build application navigation with desktop collapse and a mobile sheet. Workspace and account rows with a detail line — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/sidebar.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/avatar.json", "https://ui.siteplane.io/registry/v/1.4.2/dropdown-menu.json", "https://ui.siteplane.io/registry/v/1.4.2/sidebar.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/sidebar/two-line.tsx", "type": "registry:file", "target": "~/src/components/sidebar-two-line-example.tsx" } ] }, { "name": "sidebar-controlled-example", "type": "registry:example", "title": "Controlled desktop state", "description": "Build application navigation with desktop collapse and a mobile sheet. Controlled desktop state — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/sidebar.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/sidebar.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/sidebar/controlled.tsx", "type": "registry:file", "target": "~/src/components/sidebar-controlled-example.tsx" } ] }, { "name": "skeleton-demo", "type": "registry:example", "title": "Member row placeholder", "description": "Reserve space while application content loads. Member row placeholder — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/skeleton.md", "categories": [ "Feedback" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/skeleton.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/skeleton/default.tsx", "type": "registry:file", "target": "~/src/components/skeleton-demo.tsx" } ] }, { "name": "skeleton-card-example", "type": "registry:example", "title": "Project card placeholder", "description": "Reserve space while application content loads. Project card placeholder — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/skeleton.md", "categories": [ "Feedback" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/skeleton.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/skeleton/card.tsx", "type": "registry:file", "target": "~/src/components/skeleton-card-example.tsx" } ] }, { "name": "skeleton-table-row-example", "type": "registry:example", "title": "Table rows placeholder", "description": "Reserve space while application content loads. Table rows placeholder — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/skeleton.md", "categories": [ "Feedback" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/skeleton.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/skeleton/table-row.tsx", "type": "registry:file", "target": "~/src/components/skeleton-table-row-example.tsx" } ] }, { "name": "slider-demo", "type": "registry:example", "title": "Volume slider with value", "description": "Choose a numeric value or range by moving one or more thumbs. Volume slider with value — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/slider.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/slider.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/slider/default.tsx", "type": "registry:file", "target": "~/src/components/slider-demo.tsx" } ] }, { "name": "slider-controlled-example", "type": "registry:example", "title": "Controlled price range", "description": "Choose a numeric value or range by moving one or more thumbs. Controlled price range — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/slider.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/slider.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/slider/controlled.tsx", "type": "registry:file", "target": "~/src/components/slider-controlled-example.tsx" } ] }, { "name": "slider-labels-example", "type": "registry:example", "title": "Storage slider with scale labels", "description": "Choose a numeric value or range by moving one or more thumbs. Storage slider with scale labels — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/slider.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/slider.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/slider/labels.tsx", "type": "registry:file", "target": "~/src/components/slider-labels-example.tsx" } ] }, { "name": "slider-appearance-example", "type": "registry:example", "title": "Slider orientation and disabled state", "description": "Choose a numeric value or range by moving one or more thumbs. Slider orientation and disabled state — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/slider.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/slider.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/slider/appearance.tsx", "type": "registry:file", "target": "~/src/components/slider-appearance-example.tsx" } ] }, { "name": "slider-sizes-example", "type": "registry:example", "title": "Slider sizes", "description": "Choose a numeric value or range by moving one or more thumbs. Slider sizes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/slider.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/slider.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/slider/sizes.tsx", "type": "registry:file", "target": "~/src/components/slider-sizes-example.tsx" } ] }, { "name": "slider-form-example", "type": "registry:example", "title": "Session timeout in a settings form", "description": "Choose a numeric value or range by moving one or more thumbs. Session timeout in a settings form — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/slider.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/slider.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/slider/form.tsx", "type": "registry:file", "target": "~/src/components/slider-form-example.tsx" } ] }, { "name": "sparkline-demo", "type": "registry:example", "title": "Visitors over 14 days beside their total", "description": "Show the trend of one or several measures in a small chart without axes. Visitors over 14 days beside their total — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/sparkline.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/sparkline.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/sparkline/default.tsx", "type": "registry:file", "target": "~/src/components/sparkline-demo.tsx" } ] }, { "name": "sparkline-variants-example", "type": "registry:example", "title": "A line, a line with its fill, and the fill alone", "description": "Show the trend of one or several measures in a small chart without axes. A line, a line with its fill, and the fill alone — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/sparkline.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/sparkline.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/sparkline/variants.tsx", "type": "registry:file", "target": "~/src/components/sparkline-variants-example.tsx" } ] }, { "name": "sparkline-multiple-example", "type": "registry:example", "title": "Desktop and mobile visitors on one scale, as area and fill", "description": "Show the trend of one or several measures in a small chart without axes. Desktop and mobile visitors on one scale, as area and fill — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/sparkline.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/sparkline.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/sparkline/multiple.tsx", "type": "registry:file", "target": "~/src/components/sparkline-multiple-example.tsx" } ] }, { "name": "sparkline-scale-example", "type": "registry:example", "title": "The same revenue on a scale from 0 and from its lowest value", "description": "Show the trend of one or several measures in a small chart without axes. The same revenue on a scale from 0 and from its lowest value — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/sparkline.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/sparkline.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/sparkline/scale.tsx", "type": "registry:file", "target": "~/src/components/sparkline-scale-example.tsx" } ] }, { "name": "sparkline-trend-example", "type": "registry:example", "title": "Sparklines in the color of a rise and a fall", "description": "Show the trend of one or several measures in a small chart without axes. Sparklines in the color of a rise and a fall — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/sparkline.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/sparkline.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/sparkline/trend.tsx", "type": "registry:file", "target": "~/src/components/sparkline-trend-example.tsx" } ] }, { "name": "sparkline-changing-example", "type": "registry:example", "title": "A sparkline that morphs when the period changes", "description": "Show the trend of one or several measures in a small chart without axes. A sparkline that morphs when the period changes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/sparkline.md", "categories": [ "Charts" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/sparkline.json", "https://ui.siteplane.io/registry/v/1.4.2/toggle-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/sparkline/changing.tsx", "type": "registry:file", "target": "~/src/components/sparkline-changing-example.tsx" } ] }, { "name": "spinner-demo", "type": "registry:example", "title": "Loading spinner", "description": "Indicate that an operation is still in progress. Loading spinner — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/spinner.md", "categories": [ "Feedback" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/spinner.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/spinner/default.tsx", "type": "registry:file", "target": "~/src/components/spinner-demo.tsx" } ] }, { "name": "spinner-variants-example", "type": "registry:example", "title": "Spinner variants", "description": "Indicate that an operation is still in progress. Spinner variants — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/spinner.md", "categories": [ "Feedback" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/spinner.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/spinner/variants.tsx", "type": "registry:file", "target": "~/src/components/spinner-variants-example.tsx" } ] }, { "name": "spinner-sizes-example", "type": "registry:example", "title": "Spinner sizes", "description": "Indicate that an operation is still in progress. Spinner sizes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/spinner.md", "categories": [ "Feedback" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/spinner.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/spinner/sizes.tsx", "type": "registry:file", "target": "~/src/components/spinner-sizes-example.tsx" } ] }, { "name": "spinner-label-example", "type": "registry:example", "title": "Spinner with loading label", "description": "Indicate that an operation is still in progress. Spinner with loading label — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/spinner.md", "categories": [ "Feedback" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/spinner.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/spinner/label.tsx", "type": "registry:file", "target": "~/src/components/spinner-label-example.tsx" } ] }, { "name": "spinner-input-group-example", "type": "registry:example", "title": "Search field while loading", "description": "Indicate that an operation is still in progress. Search field while loading — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/spinner.md", "categories": [ "Feedback" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input-group.json", "https://ui.siteplane.io/registry/v/1.4.2/spinner.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/spinner/input-group.tsx", "type": "registry:file", "target": "~/src/components/spinner-input-group-example.tsx" } ] }, { "name": "stepper-demo", "type": "registry:example", "title": "Onboarding progress", "description": "Show ordered steps and their progress. Onboarding progress — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/stepper.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/stepper.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/stepper/default.tsx", "type": "registry:file", "target": "~/src/components/stepper-demo.tsx" } ] }, { "name": "stepper-controlled-example", "type": "registry:example", "title": "Clickable setup steps", "description": "Show ordered steps and their progress. Clickable setup steps — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/stepper.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/stepper.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/stepper/controlled.tsx", "type": "registry:file", "target": "~/src/components/stepper-controlled-example.tsx" } ] }, { "name": "stepper-content-example", "type": "registry:example", "title": "Setup steps with content", "description": "Show ordered steps and their progress. Setup steps with content — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/stepper.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/stepper.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/stepper/content.tsx", "type": "registry:file", "target": "~/src/components/stepper-content-example.tsx" } ] }, { "name": "switch-demo", "type": "registry:example", "title": "Switch with label", "description": "Turn a setting on or off. Switch with label — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/switch.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/label.json", "https://ui.siteplane.io/registry/v/1.4.2/switch.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/switch/default.tsx", "type": "registry:file", "target": "~/src/components/switch-demo.tsx" } ] }, { "name": "switch-with-description-example", "type": "registry:example", "title": "Switch with description", "description": "Turn a setting on or off. Switch with description — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/switch.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/switch.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/switch/with-description.tsx", "type": "registry:file", "target": "~/src/components/switch-with-description-example.tsx" } ] }, { "name": "switch-states-example", "type": "registry:example", "title": "Disabled and invalid switches", "description": "Turn a setting on or off. Disabled and invalid switches — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/switch.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/label.json", "https://ui.siteplane.io/registry/v/1.4.2/switch.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/switch/states.tsx", "type": "registry:file", "target": "~/src/components/switch-states-example.tsx" } ] }, { "name": "switch-card-style-example", "type": "registry:example", "title": "Switch card", "description": "Turn a setting on or off. Switch card — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/switch.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/label.json", "https://ui.siteplane.io/registry/v/1.4.2/switch.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/switch/card-style.tsx", "type": "registry:file", "target": "~/src/components/switch-card-style-example.tsx" } ] }, { "name": "switch-controlled-example", "type": "registry:example", "title": "Controlled switch", "description": "Turn a setting on or off. Controlled switch — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/switch.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/label.json", "https://ui.siteplane.io/registry/v/1.4.2/switch.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/switch/controlled.tsx", "type": "registry:file", "target": "~/src/components/switch-controlled-example.tsx" } ] }, { "name": "switch-form-example", "type": "registry:example", "title": "Switch in a form", "description": "Turn a setting on or off. Switch in a form — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/switch.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/switch.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/switch/form.tsx", "type": "registry:file", "target": "~/src/components/switch-form-example.tsx" } ] }, { "name": "switch-sizes-example", "type": "registry:example", "title": "Switch sizes", "description": "Turn a setting on or off. Switch sizes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/switch.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/label.json", "https://ui.siteplane.io/registry/v/1.4.2/switch.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/switch/sizes.tsx", "type": "registry:file", "target": "~/src/components/switch-sizes-example.tsx" } ] }, { "name": "table-demo", "type": "registry:example", "title": "Project overview", "description": "Display structured data with keyboard navigation, optional sorting, and row selection. Project overview — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/table.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/badge.json", "https://ui.siteplane.io/registry/v/1.4.2/table.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/table/default.tsx", "type": "registry:file", "target": "~/src/components/table-demo.tsx" } ] }, { "name": "table-sortable-example", "type": "registry:example", "title": "Sortable columns", "description": "Display structured data with keyboard navigation, optional sorting, and row selection. Sortable columns — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/table.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/table.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/table/sortable.tsx", "type": "registry:file", "target": "~/src/components/table-sortable-example.tsx" } ] }, { "name": "table-checkbox-selection-example", "type": "registry:example", "title": "Checkbox selection", "description": "Display structured data with keyboard navigation, optional sorting, and row selection. Checkbox selection — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/table.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/table.json" ], "dependencies": [ "react-aria-components@1.20.0" ], "files": [ { "path": "apps/site/src/examples/table/checkbox-selection.tsx", "type": "registry:file", "target": "~/src/components/table-checkbox-selection-example.tsx" } ] }, { "name": "table-row-action-example", "type": "registry:example", "title": "Project row actions", "description": "Display structured data with keyboard navigation, optional sorting, and row selection. Project row actions — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/table.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/menu.json", "https://ui.siteplane.io/registry/v/1.4.2/table.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/table/row-action.tsx", "type": "registry:file", "target": "~/src/components/table-row-action-example.tsx" } ] }, { "name": "table-empty-example", "type": "registry:example", "title": "Empty collection", "description": "Display structured data with keyboard navigation, optional sorting, and row selection. Empty collection — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/table.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/table.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/table/empty.tsx", "type": "registry:file", "target": "~/src/components/table-empty-example.tsx" } ] }, { "name": "table-footer-summary-example", "type": "registry:example", "title": "Project budgets with caption and total", "description": "Display structured data with keyboard navigation, optional sorting, and row selection. Project budgets with caption and total — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/table.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/table.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/table/footer-summary.tsx", "type": "registry:file", "target": "~/src/components/table-footer-summary-example.tsx" } ] }, { "name": "table-card-frame-example", "type": "registry:example", "title": "Table in a CardFrame", "description": "Display structured data with keyboard navigation, optional sorting, and row selection. Table in a CardFrame — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/table.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/table.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/table/card-frame.tsx", "type": "registry:file", "target": "~/src/components/table-card-frame-example.tsx" } ] }, { "name": "tabs-demo", "type": "registry:example", "title": "Project overview tabs", "description": "Switch between associated content panels. Project overview tabs — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/tabs.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/tabs.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/tabs/default.tsx", "type": "registry:file", "target": "~/src/components/tabs-demo.tsx" } ] }, { "name": "tabs-variants-example", "type": "registry:example", "title": "Tab list variants", "description": "Switch between associated content panels. Tab list variants — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/tabs.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/tabs.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/tabs/variants.tsx", "type": "registry:file", "target": "~/src/components/tabs-variants-example.tsx" } ] }, { "name": "tabs-divider-example", "type": "registry:example", "title": "Underline tabs with a divider", "description": "Switch between associated content panels. Underline tabs with a divider — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/tabs.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/badge.json", "https://ui.siteplane.io/registry/v/1.4.2/tabs.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/tabs/divider.tsx", "type": "registry:file", "target": "~/src/components/tabs-divider-example.tsx" } ] }, { "name": "tabs-icon-tabs-example", "type": "registry:example", "title": "Tabs with icons", "description": "Switch between associated content panels. Tabs with icons — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/tabs.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/tabs.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/tabs/icon-tabs.tsx", "type": "registry:file", "target": "~/src/components/tabs-icon-tabs-example.tsx" } ] }, { "name": "tabs-vertical-example", "type": "registry:example", "title": "Vertical settings tabs", "description": "Switch between associated content panels. Vertical settings tabs — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/tabs.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/tabs.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/tabs/vertical.tsx", "type": "registry:file", "target": "~/src/components/tabs-vertical-example.tsx" } ] }, { "name": "tabs-sizes-example", "type": "registry:example", "title": "Tab sizes", "description": "Switch between associated content panels. Tab sizes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/tabs.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/tabs.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/tabs/sizes.tsx", "type": "registry:file", "target": "~/src/components/tabs-sizes-example.tsx" } ] }, { "name": "tabs-controlled-example", "type": "registry:example", "title": "Controlled selection", "description": "Switch between associated content panels. Controlled selection — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/tabs.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/tabs.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/tabs/controlled.tsx", "type": "registry:file", "target": "~/src/components/tabs-controlled-example.tsx" } ] }, { "name": "tabs-overflow-example", "type": "registry:example", "title": "Nine settings tabs in a narrow column", "description": "Switch between associated content panels. Nine settings tabs in a narrow column — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/tabs.md", "categories": [ "Navigation" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/tabs.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/tabs/overflow.tsx", "type": "registry:file", "target": "~/src/components/tabs-overflow-example.tsx" } ] }, { "name": "tag-group-demo", "type": "registry:example", "title": "Project labels", "description": "Display, select, and remove a keyboard-navigable collection of tags. Project labels — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/tag-group.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/tag-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/tag-group/default.tsx", "type": "registry:file", "target": "~/src/components/tag-group-demo.tsx" } ] }, { "name": "tag-group-selection-example", "type": "registry:example", "title": "Selectable team tags", "description": "Display, select, and remove a keyboard-navigable collection of tags. Selectable team tags — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/tag-group.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/tag-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/tag-group/selection.tsx", "type": "registry:file", "target": "~/src/components/tag-group-selection-example.tsx" } ] }, { "name": "tag-group-remove-example", "type": "registry:example", "title": "Removable filter tags", "description": "Display, select, and remove a keyboard-navigable collection of tags. Removable filter tags — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/tag-group.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/tag-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/tag-group/remove.tsx", "type": "registry:file", "target": "~/src/components/tag-group-remove-example.tsx" } ] }, { "name": "tag-group-add-remove-example", "type": "registry:example", "title": "Add and remove labels", "description": "Display, select, and remove a keyboard-navigable collection of tags. Add and remove labels — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/tag-group.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/tag-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/tag-group/add-remove.tsx", "type": "registry:file", "target": "~/src/components/tag-group-add-remove-example.tsx" } ] }, { "name": "tag-group-sizes-example", "type": "registry:example", "title": "Tag sizes", "description": "Display, select, and remove a keyboard-navigable collection of tags. Tag sizes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/tag-group.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/tag-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/tag-group/sizes.tsx", "type": "registry:file", "target": "~/src/components/tag-group-sizes-example.tsx" } ] }, { "name": "textarea-demo", "type": "registry:example", "title": "Project description", "description": "Enter and edit multiline text. Project description — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/textarea.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/textarea.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/textarea/default.tsx", "type": "registry:file", "target": "~/src/components/textarea-demo.tsx" } ] }, { "name": "textarea-variants-example", "type": "registry:example", "title": "Textarea surface variants", "description": "Enter and edit multiline text. Textarea surface variants — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/textarea.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/textarea.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/textarea/variants.tsx", "type": "registry:file", "target": "~/src/components/textarea-variants-example.tsx" } ] }, { "name": "textarea-lines-example", "type": "registry:example", "title": "Reply between two and six lines", "description": "Enter and edit multiline text. Reply between two and six lines — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/textarea.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/textarea.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/textarea/lines.tsx", "type": "registry:file", "target": "~/src/components/textarea-lines-example.tsx" } ] }, { "name": "textarea-sizes-example", "type": "registry:example", "title": "Textarea sizes", "description": "Enter and edit multiline text. Textarea sizes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/textarea.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/textarea.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/textarea/sizes.tsx", "type": "registry:file", "target": "~/src/components/textarea-sizes-example.tsx" } ] }, { "name": "textarea-states-example", "type": "registry:example", "title": "Disabled, read-only and invalid textareas", "description": "Enter and edit multiline text. Disabled, read-only and invalid textareas — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/textarea.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/textarea.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/textarea/states.tsx", "type": "registry:file", "target": "~/src/components/textarea-states-example.tsx" } ] }, { "name": "textarea-controlled-example", "type": "registry:example", "title": "Bio with character limit", "description": "Enter and edit multiline text. Bio with character limit — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/textarea.md", "categories": [ "Forms & selection" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/textarea.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/textarea/controlled.tsx", "type": "registry:file", "target": "~/src/components/textarea-controlled-example.tsx" } ] }, { "name": "theme-toggles-demo", "type": "registry:example", "title": "Theme toggle", "description": "Switch between light and dark mode with an animated sun and moon toggle. Theme toggle — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/theme-toggles.md", "categories": [ "Animated" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/theme-toggles.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/theme-toggles/default.tsx", "type": "registry:file", "target": "~/src/components/theme-toggles-demo.tsx" } ] }, { "name": "theme-toggles-controlled-example", "type": "registry:example", "title": "Controlled theme toggle with layered icons", "description": "Switch between light and dark mode with an animated sun and moon toggle. Controlled theme toggle with layered icons — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/theme-toggles.md", "categories": [ "Animated" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/theme-toggles.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/theme-toggles/controlled.tsx", "type": "registry:file", "target": "~/src/components/theme-toggles-controlled-example.tsx" } ] }, { "name": "theme-toggles-sizes-example", "type": "registry:example", "title": "Theme toggle sizes", "description": "Switch between light and dark mode with an animated sun and moon toggle. Theme toggle sizes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/theme-toggles.md", "categories": [ "Animated" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/theme-toggles.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/theme-toggles/sizes.tsx", "type": "registry:file", "target": "~/src/components/theme-toggles-sizes-example.tsx" } ] }, { "name": "time-field-demo", "type": "registry:example", "title": "Daily summary time", "description": "Edit an hour and minute with segments or a selector. Daily summary time — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/time-field.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/time-field.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/time-field/default.tsx", "type": "registry:file", "target": "~/src/components/time-field-demo.tsx" } ] }, { "name": "time-field-controlled-example", "type": "registry:example", "title": "Controlled meeting time", "description": "Edit an hour and minute with segments or a selector. Controlled meeting time — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/time-field.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/time-field.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/time-field/controlled.tsx", "type": "registry:file", "target": "~/src/components/time-field-controlled-example.tsx" } ] }, { "name": "time-field-step-example", "type": "registry:example", "title": "Meeting start in 15-minute steps", "description": "Edit an hour and minute with segments or a selector. Meeting start in 15-minute steps — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/time-field.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/time-field.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/time-field/step.tsx", "type": "registry:file", "target": "~/src/components/time-field-step-example.tsx" } ] }, { "name": "time-field-states-example", "type": "registry:example", "title": "Disabled, read-only and invalid time fields", "description": "Edit an hour and minute with segments or a selector. Disabled, read-only and invalid time fields — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/time-field.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/time-field.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/time-field/states.tsx", "type": "registry:file", "target": "~/src/components/time-field-states-example.tsx" } ] }, { "name": "time-field-form-example", "type": "registry:example", "title": "Time field in a form", "description": "Edit an hour and minute with segments or a selector. Time field in a form — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/time-field.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/time-field.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/time-field/form.tsx", "type": "registry:file", "target": "~/src/components/time-field-form-example.tsx" } ] }, { "name": "time-field-icons-example", "type": "registry:example", "title": "Working hours", "description": "Edit an hour and minute with segments or a selector. Working hours — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/time-field.md", "categories": [ "Date & color" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/fieldset.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/time-field.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/time-field/icons.tsx", "type": "registry:file", "target": "~/src/components/time-field-icons-example.tsx" } ] }, { "name": "timeline-demo", "type": "registry:example", "title": "Project activity", "description": "Present events in chronological order. Project activity — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/timeline.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/timeline.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/timeline/default.tsx", "type": "registry:file", "target": "~/src/components/timeline-demo.tsx" } ] }, { "name": "timeline-variants-example", "type": "registry:example", "title": "Deployment history with status colors", "description": "Present events in chronological order. Deployment history with status colors — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/timeline.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/timeline.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/timeline/variants.tsx", "type": "registry:file", "target": "~/src/components/timeline-variants-example.tsx" } ] }, { "name": "timeline-markers-example", "type": "registry:example", "title": "Review history with icon markers", "description": "Present events in chronological order. Review history with icon markers — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/timeline.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/timeline.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/timeline/markers.tsx", "type": "registry:file", "target": "~/src/components/timeline-markers-example.tsx" } ] }, { "name": "timeline-now-example", "type": "registry:example", "title": "Appointments today with the now marker", "description": "Present events in chronological order. Appointments today with the now marker — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/timeline.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/timeline.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/timeline/now.tsx", "type": "registry:file", "target": "~/src/components/timeline-now-example.tsx" } ] }, { "name": "timeline-live-example", "type": "registry:example", "title": "Deployment history that grows and shrinks", "description": "Present events in chronological order. Deployment history that grows and shrinks — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/timeline.md", "categories": [ "Data display" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/timeline.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/timeline/live.tsx", "type": "registry:file", "target": "~/src/components/timeline-live-example.tsx" } ] }, { "name": "toast-demo", "type": "registry:example", "title": "Toast with title and description", "description": "Show temporary feedback with dismissible notifications. Toast with title and description — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/toast.md", "categories": [ "Feedback" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/toast.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/toast/default.tsx", "type": "registry:file", "target": "~/src/components/toast-demo.tsx" } ] }, { "name": "toast-types-example", "type": "registry:example", "title": "Toast types", "description": "Show temporary feedback with dismissible notifications. Toast types — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/toast.md", "categories": [ "Feedback" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/toast.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/toast/types.tsx", "type": "registry:file", "target": "~/src/components/toast-types-example.tsx" } ] }, { "name": "toast-update-example", "type": "registry:example", "title": "Export progress toast", "description": "Show temporary feedback with dismissible notifications. Export progress toast — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/toast.md", "categories": [ "Feedback" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/toast.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/toast/update.tsx", "type": "registry:file", "target": "~/src/components/toast-update-example.tsx" } ] }, { "name": "toast-action-example", "type": "registry:example", "title": "Toast with undo action", "description": "Show temporary feedback with dismissible notifications. Toast with undo action — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/toast.md", "categories": [ "Feedback" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/toast.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/toast/action.tsx", "type": "registry:file", "target": "~/src/components/toast-action-example.tsx" } ] }, { "name": "toggle-demo", "type": "registry:example", "title": "Bookmark toggle", "description": "Toggle a button between pressed and unpressed states. Bookmark toggle — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/toggle.md", "categories": [ "Actions" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/toggle.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/toggle/default.tsx", "type": "registry:file", "target": "~/src/components/toggle-demo.tsx" } ] }, { "name": "toggle-variants-example", "type": "registry:example", "title": "Default, outline and disabled toggles", "description": "Toggle a button between pressed and unpressed states. Default, outline and disabled toggles — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/toggle.md", "categories": [ "Actions" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/toggle.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/toggle/variants.tsx", "type": "registry:file", "target": "~/src/components/toggle-variants-example.tsx" } ] }, { "name": "toggle-padding-example", "type": "registry:example", "title": "Formatting toggles with icons", "description": "Toggle a button between pressed and unpressed states. Formatting toggles with icons — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/toggle.md", "categories": [ "Actions" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/toggle.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/toggle/padding.tsx", "type": "registry:file", "target": "~/src/components/toggle-padding-example.tsx" } ] }, { "name": "toggle-sizes-example", "type": "registry:example", "title": "Toggle sizes", "description": "Toggle a button between pressed and unpressed states. Toggle sizes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/toggle.md", "categories": [ "Actions" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/toggle.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/toggle/sizes.tsx", "type": "registry:file", "target": "~/src/components/toggle-sizes-example.tsx" } ] }, { "name": "toggle-controlled-example", "type": "registry:example", "title": "Controlled italic toggle", "description": "Toggle a button between pressed and unpressed states. Controlled italic toggle — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/toggle.md", "categories": [ "Actions" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/toggle.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/toggle/controlled.tsx", "type": "registry:file", "target": "~/src/components/toggle-controlled-example.tsx" } ] }, { "name": "toggle-group-demo", "type": "registry:example", "title": "Text alignment", "description": "Group related pressed-state buttons. Text alignment — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/toggle-group.md", "categories": [ "Actions" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/toggle-group.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/toggle-group/default.tsx", "type": "registry:file", "target": "~/src/components/toggle-group-demo.tsx" } ] }, { "name": "toggle-group-controlled-example", "type": "registry:example", "title": "Formatting options with multiple selection", "description": "Group related pressed-state buttons. Formatting options with multiple selection — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/toggle-group.md", "categories": [ "Actions" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/toggle-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/toggle-group/controlled.tsx", "type": "registry:file", "target": "~/src/components/toggle-group-controlled-example.tsx" } ] }, { "name": "toggle-group-with-label-example", "type": "registry:example", "title": "View switcher with label", "description": "Group related pressed-state buttons. View switcher with label — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/toggle-group.md", "categories": [ "Actions" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/toggle-group.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/toggle-group/with-label.tsx", "type": "registry:file", "target": "~/src/components/toggle-group-with-label-example.tsx" } ] }, { "name": "toggle-group-with-separators-example", "type": "registry:example", "title": "Formatting group with a separator", "description": "Group related pressed-state buttons. Formatting group with a separator — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/toggle-group.md", "categories": [ "Actions" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/toggle-group.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/toggle-group/with-separators.tsx", "type": "registry:file", "target": "~/src/components/toggle-group-with-separators-example.tsx" } ] }, { "name": "toggle-group-layout-example", "type": "registry:example", "title": "Vertical toggle group", "description": "Group related pressed-state buttons. Vertical toggle group — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/toggle-group.md", "categories": [ "Actions" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/toggle-group.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/toggle-group/layout.tsx", "type": "registry:file", "target": "~/src/components/toggle-group-layout-example.tsx" } ] }, { "name": "toggle-group-sizes-example", "type": "registry:example", "title": "Toggle group sizes", "description": "Group related pressed-state buttons. Toggle group sizes — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/toggle-group.md", "categories": [ "Actions" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/toggle-group.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/toggle-group/sizes.tsx", "type": "registry:file", "target": "~/src/components/toggle-group-sizes-example.tsx" } ] }, { "name": "toolbar-demo", "type": "registry:example", "title": "Formatting toolbar", "description": "Group related actions with directional keyboard navigation. Formatting toolbar — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/toolbar.md", "categories": [ "Actions" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/select.json", "https://ui.siteplane.io/registry/v/1.4.2/toggle-group.json", "https://ui.siteplane.io/registry/v/1.4.2/toolbar.json", "https://ui.siteplane.io/registry/v/1.4.2/tooltip.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/toolbar/default.tsx", "type": "registry:file", "target": "~/src/components/toolbar-demo.tsx" } ] }, { "name": "tooltip-demo", "type": "registry:example", "title": "Icon button with tooltip", "description": "Add a short description to a control on hover or focus. Icon button with tooltip — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/tooltip.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/tooltip.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/tooltip/default.tsx", "type": "registry:file", "target": "~/src/components/tooltip-demo.tsx" } ] }, { "name": "tooltip-grouped-example", "type": "registry:example", "title": "Formatting buttons with grouped tooltips", "description": "Add a short description to a control on hover or focus. Formatting buttons with grouped tooltips — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/tooltip.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/toggle-group.json", "https://ui.siteplane.io/registry/v/1.4.2/tooltip.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/tooltip/grouped.tsx", "type": "registry:file", "target": "~/src/components/tooltip-grouped-example.tsx" } ] }, { "name": "tooltip-positions-example", "type": "registry:example", "title": "Tooltips on each side", "description": "Add a short description to a control on hover or focus. Tooltips on each side — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/tooltip.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/tooltip.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/tooltip/positions.tsx", "type": "registry:file", "target": "~/src/components/tooltip-positions-example.tsx" } ] }, { "name": "tooltip-disabled-example", "type": "registry:example", "title": "Tooltip on a disabled button", "description": "Add a short description to a control on hover or focus. Tooltip on a disabled button — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/tooltip.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/tooltip.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/tooltip/disabled.tsx", "type": "registry:file", "target": "~/src/components/tooltip-disabled-example.tsx" } ] }, { "name": "tooltip-glass-example", "type": "registry:example", "title": "Glass tooltip", "description": "Add a short description to a control on hover or focus. Glass tooltip — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/tooltip.md", "categories": [ "Overlays & disclosure" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/tooltip.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/tooltip/glass.tsx", "type": "registry:file", "target": "~/src/components/tooltip-glass-example.tsx" } ] }, { "name": "truncate-demo", "type": "registry:example", "title": "Card title cut after one line, beside an icon and a link", "description": "Cut text after one line or a number of lines with an ellipsis, and show the full text in a tooltip. Card title cut after one line, beside an icon and a link — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/truncate.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/truncate.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/truncate/default.tsx", "type": "registry:file", "target": "~/src/components/truncate-demo.tsx" } ] }, { "name": "truncate-lines-example", "type": "registry:example", "title": "Description cut after two lines", "description": "Cut text after one line or a number of lines with an ellipsis, and show the full text in a tooltip. Description cut after two lines — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/truncate.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/truncate.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/truncate/lines.tsx", "type": "registry:file", "target": "~/src/components/truncate-lines-example.tsx" } ] }, { "name": "truncate-width-example", "type": "registry:example", "title": "Card title cut at half the width of the card", "description": "Cut text after one line or a number of lines with an ellipsis, and show the full text in a tooltip. Card title cut at half the width of the card — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/truncate.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/truncate.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/truncate/width.tsx", "type": "registry:file", "target": "~/src/components/truncate-width-example.tsx" } ] }, { "name": "truncate-table-cell-example", "type": "registry:example", "title": "File names cut in a table column", "description": "Cut text after one line or a number of lines with an ellipsis, and show the full text in a tooltip. File names cut in a table column — usage example.", "docs": "https://ui.siteplane.io/docs-markdown/components/truncate.md", "categories": [ "Layout & utilities" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/table.json", "https://ui.siteplane.io/registry/v/1.4.2/truncate.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/truncate/table-cell.tsx", "type": "registry:file", "target": "~/src/components/truncate-table-cell-example.tsx" } ] }, { "name": "application-shell", "type": "registry:block", "title": "Application shell", "description": "Navigate a responsive workspace with a sidebar, header, and content region. Application shell — complete application example.", "docs": "https://ui.siteplane.io/docs-markdown/examples/application-shell.md", "categories": [ "Examples" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/dashboard-shell.json", "https://ui.siteplane.io/registry/v/1.4.2/settings-list.json", "https://ui.siteplane.io/registry/v/1.4.2/sidebar.json", "https://ui.siteplane.io/registry/v/1.4.2/switch.json" ], "dependencies": [ "lucide-react@1.18.0" ], "files": [ { "path": "apps/site/src/examples/application-shell/default.tsx", "type": "registry:file", "target": "~/src/components/application-shell.tsx" } ] }, { "name": "resource-management", "type": "registry:block", "title": "Resource management", "description": "Filter and sort projects, inspect a project, and confirm archiving. Resource management — complete application example.", "docs": "https://ui.siteplane.io/docs-markdown/examples/resource-management.md", "categories": [ "Examples" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/alert-dialog.json", "https://ui.siteplane.io/registry/v/1.4.2/badge.json", "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/data-list.json", "https://ui.siteplane.io/registry/v/1.4.2/detail-drawer.json", "https://ui.siteplane.io/registry/v/1.4.2/filter-bar.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/select.json", "https://ui.siteplane.io/registry/v/1.4.2/table.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/resource-management/default.tsx", "type": "registry:file", "target": "~/src/components/resource-management.tsx" } ] }, { "name": "team-settings", "type": "registry:block", "title": "Team settings", "description": "Edit the team profile and notification preferences, then save or reset the changes. Team settings — complete application example.", "docs": "https://ui.siteplane.io/docs-markdown/examples/team-settings.md", "categories": [ "Examples" ], "registryDependencies": [ "https://ui.siteplane.io/registry/v/1.4.2/button.json", "https://ui.siteplane.io/registry/v/1.4.2/card.json", "https://ui.siteplane.io/registry/v/1.4.2/form.json", "https://ui.siteplane.io/registry/v/1.4.2/input.json", "https://ui.siteplane.io/registry/v/1.4.2/select.json", "https://ui.siteplane.io/registry/v/1.4.2/settings-list.json", "https://ui.siteplane.io/registry/v/1.4.2/switch.json", "https://ui.siteplane.io/registry/v/1.4.2/textarea.json" ], "dependencies": [], "files": [ { "path": "apps/site/src/examples/team-settings/default.tsx", "type": "registry:file", "target": "~/src/components/team-settings.tsx" } ] } ] }