{
  "name": "meter",
  "type": "registry:ui",
  "title": "Meter",
  "description": "Meter communicates a known numeric value within a fixed range, such as usage, capacity, a rating, or a quota.",
  "registryDependencies": [
    "@siteplane/base"
  ],
  "dependencies": [
    "@base-ui/react@1.5.0",
    "class-variance-authority@0.7.1"
  ],
  "files": [
    {
      "path": "src/components/ui/meter.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\n\nimport { Meter as MeterPrimitive } from \"@base-ui/react/meter\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport * as React from \"react\";\nimport {\n  type SiteplaneControlSize,\n  useResolvedControlSize,\n} from \"@/components/ui/siteplane-provider\";\nimport { cn } from \"@/lib/utils\";\n\nconst METER_DEFAULT_LOCALE = \"en-US\";\n\nconst meterRootVariants = cva(\"flex w-full flex-col\", {\n  defaultVariants: {\n    size: \"default\",\n  },\n  variants: {\n    size: {\n      default: \"gap-2\",\n      lg: \"gap-2\",\n      sm: \"gap-1.5\",\n      xl: \"gap-2.5\",\n    },\n  },\n});\n\nconst meterLabelVariants = cva(\"font-medium text-foreground\", {\n  defaultVariants: {\n    size: \"default\",\n  },\n  variants: {\n    size: {\n      default: \"text-sm\",\n      lg: \"text-sm\",\n      sm: \"text-sm\",\n      xl: \"text-base sm:text-sm\",\n    },\n  },\n});\n\nconst meterTrackVariants = cva(\n  \"block w-full overflow-hidden rounded-full bg-input\",\n  {\n    defaultVariants: {\n      size: \"default\",\n    },\n    variants: {\n      size: {\n        default: \"h-1\",\n        lg: \"h-1.5\",\n        sm: \"h-1\",\n        xl: \"h-2\",\n      },\n    },\n  },\n);\n\nconst meterValueVariants = cva(\"text-foreground tabular-nums\", {\n  defaultVariants: {\n    size: \"default\",\n  },\n  variants: {\n    size: {\n      default: \"text-sm\",\n      lg: \"text-sm\",\n      sm: \"text-xs\",\n      xl: \"text-base sm:text-sm\",\n    },\n  },\n});\n\nconst MeterSizeContext = React.createContext<SiteplaneControlSize | null>(null);\n\nexport interface MeterProps\n  extends Omit<MeterPrimitive.Root.Props, \"size\">,\n    VariantProps<typeof meterRootVariants> {}\n\nexport function Meter({\n  className,\n  children,\n  locale = METER_DEFAULT_LOCALE,\n  size,\n  ...props\n}: MeterProps): React.ReactElement {\n  const resolvedSize = useResolvedControlSize(size);\n\n  return (\n    <MeterSizeContext.Provider value={resolvedSize}>\n      <MeterPrimitive.Root\n        className={cn(meterRootVariants({ size: resolvedSize }), className)}\n        data-size={resolvedSize}\n        data-slot=\"meter\"\n        locale={locale}\n        {...props}\n      >\n        {children ? (\n          children\n        ) : (\n          <MeterTrack>\n            <MeterIndicator />\n          </MeterTrack>\n        )}\n      </MeterPrimitive.Root>\n    </MeterSizeContext.Provider>\n  );\n}\n\nexport interface MeterLabelProps\n  extends Omit<MeterPrimitive.Label.Props, \"size\">,\n    VariantProps<typeof meterLabelVariants> {}\n\nexport function MeterLabel({\n  className,\n  size,\n  ...props\n}: MeterLabelProps): React.ReactElement {\n  const groupSize = React.useContext(MeterSizeContext);\n  const resolvedSize = useResolvedControlSize(size ?? groupSize);\n\n  return (\n    <MeterPrimitive.Label\n      className={cn(meterLabelVariants({ size: resolvedSize }), className)}\n      data-size={resolvedSize}\n      data-slot=\"meter-label\"\n      {...props}\n    />\n  );\n}\n\nexport interface MeterTrackProps\n  extends Omit<MeterPrimitive.Track.Props, \"size\">,\n    VariantProps<typeof meterTrackVariants> {}\n\nexport function MeterTrack({\n  className,\n  size,\n  ...props\n}: MeterTrackProps): React.ReactElement {\n  const groupSize = React.useContext(MeterSizeContext);\n  const resolvedSize = useResolvedControlSize(size ?? groupSize);\n\n  return (\n    <MeterPrimitive.Track\n      className={cn(meterTrackVariants({ size: resolvedSize }), className)}\n      data-size={resolvedSize}\n      data-slot=\"meter-track\"\n      {...props}\n    />\n  );\n}\n\nexport function MeterIndicator({\n  className,\n  ...props\n}: MeterPrimitive.Indicator.Props): React.ReactElement {\n  return (\n    <MeterPrimitive.Indicator\n      className={cn(\n        \"rounded-full bg-primary transition-all [transition-duration:var(--motion-duration-linger)] [transition-timing-function:var(--motion-ease-apple-out)] motion-reduce:transition-none\",\n        className,\n      )}\n      data-slot=\"meter-indicator\"\n      {...props}\n    />\n  );\n}\n\nexport interface MeterValueProps\n  extends Omit<MeterPrimitive.Value.Props, \"size\">,\n    VariantProps<typeof meterValueVariants> {}\n\nexport function MeterValue({\n  className,\n  size,\n  ...props\n}: MeterValueProps): React.ReactElement {\n  const groupSize = React.useContext(MeterSizeContext);\n  const resolvedSize = useResolvedControlSize(size ?? groupSize);\n\n  return (\n    <MeterPrimitive.Value\n      className={cn(meterValueVariants({ size: resolvedSize }), className)}\n      data-size={resolvedSize}\n      data-slot=\"meter-value\"\n      {...props}\n    />\n  );\n}\n\nexport { MeterPrimitive };\n"
    }
  ],
  "categories": [
    "feedback"
  ],
  "docs": "# Meter\n\n> Siteplane UI release `0.1.1`.\n\n## Public Purpose\n\nMeter communicates a known numeric value within a fixed range, such as storage\nusage, capacity, a rating, or a quota. Use Progress for an ongoing task whose\ncompletion is changing over time.\n\n## Import\n\n`import { Meter, MeterIndicator, MeterLabel, MeterTrack, MeterValue } from \"@/components/ui/meter\";`\n\n## Public API\n\n- Set `value`, optional `min` and `max`, and controlled or formatted value\n  behavior on `Meter`.\n- `locale` controls the formatted numeric output and defaults to `\"en-US\"`.\n- Compose `MeterLabel`, `MeterValue`, `MeterTrack`, and `MeterIndicator` for a\n  labelled measurement. Without children, Meter renders its Track and Indicator\n  automatically.\n- Root `size` accepts `\"sm\"`, `\"default\"`, `\"lg\"`, or `\"xl\"` and provides\n  the default size to every part.\n- `MeterLabel`, `MeterTrack`, and `MeterValue` each accept their own `size`\n  override. A part-level size takes precedence over the root or provider size.\n- `MeterValue` accepts the Base UI render function when the displayed unit is\n  not a percentage.\n\n## Public Motion\n\n- MeterIndicator animates value changes with the central linger duration and\n  Apple-out easing tokens.\n- The operating-system reduced-motion preference removes the transition. The\n  forced `reducedMotionPreset` shortens the shared linger duration from 380ms\n  to 120ms.\n- Value updates do not change the surrounding layout.\n\n## Public Accessibility\n\n- Provide a visible `MeterLabel` or an explicit accessible name.\n- Preserve `aria-valuenow`, `aria-valuemin`, and `aria-valuemax` from the Base\n  UI-backed root.\n- A custom MeterValue format must communicate the same numeric state as the\n  indicator.\n- Meter is read-only. Use Slider or Number Field when a person must change the\n  value.\n\n## Public Agent Guidance\n\n- Use Meter only when the current value, minimum, and maximum are known.\n- Use Progress for task completion and Slider or Number Field for input.\n- Keep Track, Indicator, locale, size inheritance, and accessibility behavior\n  inside the existing primitive.\n- Do not rebuild the visual from a raw progress element when Meter fits.\n\n## Public Links\n\n- [Documentation and preview](https://ui.siteplane.io/docs/components/feedback/meter)\n\n- [Registry source](https://ui.siteplane.io/r/meter.json)\n",
  "meta": {
    "siteplane:agentContractVersion": 1,
    "siteplane:docs": "https://ui.siteplane.io/docs/components/feedback/meter",
    "siteplane:releaseVersion": "0.1.1",
    "siteplane:sourceOwned": true
  },
  "devDependencies": []
}
