@tribepad/themis 1.0.17 → 1.1.0

package/dist/elements/TimeField/index.js

@@ -1,3 +1,3 @@
 "use client";
-'use strict';var react=require('react'),reactAriaComponents=require('react-aria-components'),clsx=require('clsx'),tailwindMerge=require('tailwind-merge'),zod=require('zod'),classVarianceAuthority=require('class-variance-authority'),jsxRuntime=require('react/jsx-runtime'),date=require('@internationalized/date');function t(...o){return tailwindMerge.twMerge(clsx.clsx(o))}var b=zod.z.object({value:zod.z.custom().optional(),defaultValue:zod.z.custom().optional(),placeholderValue:zod.z.custom().optional(),granularity:zod.z.enum(["hour","minute","second"]).default("minute"),hourCycle:zod.z.union([zod.z.literal(12),zod.z.literal(24)]).optional(),hideTimeZone:zod.z.boolean().optional(),shouldForceLeadingZeros:zod.z.boolean().optional(),minValue:zod.z.custom().optional(),maxValue:zod.z.custom().optional(),isDisabled:zod.z.boolean().optional(),isReadOnly:zod.z.boolean().optional(),isRequired:zod.z.boolean().optional(),isInvalid:zod.z.boolean().optional(),validate:zod.z.function().optional(),validationBehavior:zod.z.enum(["native","aria"]).default("native"),label:zod.z.string(),description:zod.z.string().optional(),errorMessage:zod.z.union([zod.z.string(),zod.z.function()]).optional(),name:zod.z.string().optional(),size:zod.z.enum(["sm","default","lg"]).default("default"),onChange:zod.z.function().optional(),onFocus:zod.z.function().optional(),onBlur:zod.z.function().optional(),onFocusChange:zod.z.function().optional(),className:zod.z.string().optional(),autoFocus:zod.z.boolean().optional()}),l=classVarianceAuthority.cva(["inline-flex items-center rounded-md border","bg-[var(--content-background)] text-[var(--content-foreground)]","transition-colors duration-200","focus-within:ring-2 focus-within:ring-[var(--ring)] focus-within:ring-offset-2","data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50"],{variants:{size:{sm:"h-9 px-3 text-sm gap-0.5",default:"h-11 px-4 text-base gap-1",lg:"h-14 px-5 text-lg gap-1.5"},isInvalid:{true:"border-[var(--destructive-background)] focus-within:ring-[var(--destructive-background)]",false:"border-[var(--input-border)] hover:border-[var(--input-border)]/80"}},defaultVariants:{size:"default",isInvalid:false}}),s=classVarianceAuthority.cva(["tabular-nums rounded px-0.5","focus:outline-none focus:bg-[var(--accent)] focus:text-[var(--accent-foreground)]","data-[placeholder]:text-[var(--menu-muted)]","data-[type=literal]:text-[var(--menu-muted)]","data-[disabled]:opacity-50"],{variants:{size:{sm:"text-sm min-w-[1.5ch]",default:"text-base min-w-[2ch]",lg:"text-lg min-w-[2ch]"}},defaultVariants:{size:"default"}}),m=classVarianceAuthority.cva(["block font-medium text-[var(--content-foreground)]","mb-1.5",'data-[required]:after:content-["*"] data-[required]:after:ml-0.5',"data-[required]:after:text-[var(--destructive-background)]"],{variants:{size:{sm:"text-sm",default:"text-sm",lg:"text-base"}},defaultVariants:{size:"default"}}),d=classVarianceAuthority.cva(["text-[var(--menu-muted)]","mt-1"],{variants:{size:{sm:"text-xs",default:"text-sm",lg:"text-base"}},defaultVariants:{size:"default"}}),u=classVarianceAuthority.cva(["flex items-center gap-1","text-[var(--destructive-background)]","mt-1"],{variants:{size:{sm:"text-xs",default:"text-sm",lg:"text-base"}},defaultVariants:{size:"default"}});var c=react.forwardRef(({label:o,description:p,errorMessage:f,size:a="default",className:x,...n},g)=>jsxRuntime.jsxs(reactAriaComponents.TimeField,{ref:g,className:t("group flex flex-col gap-1",x),...n,children:[o&&jsxRuntime.jsx(reactAriaComponents.Label,{className:t(m({size:a})),"data-required":n.isRequired||void 0,children:o}),jsxRuntime.jsx(reactAriaComponents.DateInput,{className:t(l({size:a,isInvalid:n.isInvalid}),"w-fit"),children:F=>jsxRuntime.jsx(reactAriaComponents.DateSegment,{segment:F,className:t(s({size:a}))})}),p&&jsxRuntime.jsx(reactAriaComponents.Text,{slot:"description",className:t(d({size:a})),children:p}),jsxRuntime.jsx(reactAriaComponents.FieldError,{className:t(u({size:a})),children:f})]}));c.displayName="TimeField";Object.defineProperty(exports,"Time",{enumerable:true,get:function(){return date.Time}});Object.defineProperty(exports,"parseTime",{enumerable:true,get:function(){return date.parseTime}});exports.TimeField=c;exports.TimeFieldPropsSchema=b;exports.timeFieldDescriptionVariants=d;exports.timeFieldErrorVariants=u;exports.timeFieldLabelVariants=m;exports.timeFieldVariants=l;exports.timeSegmentVariants=s;//# sourceMappingURL=index.js.map
+'use strict';var react=require('react'),reactAriaComponents=require('react-aria-components'),clsx=require('clsx'),tailwindMerge=require('tailwind-merge'),zod=require('zod'),classVarianceAuthority=require('class-variance-authority'),jsxRuntime=require('react/jsx-runtime'),date=require('@internationalized/date');function e(...s){return tailwindMerge.twMerge(clsx.clsx(s))}var i={sm:"text-xs",default:"text-sm",lg:"text-base"};var l={sm:"h-9",default:"h-10",lg:"h-11"},o={sm:`${l.sm} px-2 text-xs`,default:`${l.default} px-3 text-sm`,lg:`${l.lg} px-4 text-base`},m="min-h-[44px] flex items-center";var N=zod.z.object({value:zod.z.custom().optional(),defaultValue:zod.z.custom().optional(),placeholderValue:zod.z.custom().optional(),granularity:zod.z.enum(["hour","minute","second"]).default("minute"),hourCycle:zod.z.union([zod.z.literal(12),zod.z.literal(24)]).optional(),hideTimeZone:zod.z.boolean().optional(),shouldForceLeadingZeros:zod.z.boolean().optional(),minValue:zod.z.custom().optional(),maxValue:zod.z.custom().optional(),isDisabled:zod.z.boolean().optional(),isReadOnly:zod.z.boolean().optional(),isRequired:zod.z.boolean().optional(),isInvalid:zod.z.boolean().optional(),validate:zod.z.function().optional(),validationBehavior:zod.z.enum(["native","aria"]).default("native"),label:zod.z.string(),description:zod.z.string().optional(),errorMessage:zod.z.union([zod.z.string(),zod.z.function()]).optional(),name:zod.z.string().optional(),size:zod.z.enum(["sm","default","lg"]).default("default"),onChange:zod.z.function().optional(),onFocus:zod.z.function().optional(),onBlur:zod.z.function().optional(),onFocusChange:zod.z.function().optional(),className:zod.z.string().optional(),autoFocus:zod.z.boolean().optional()}),c=classVarianceAuthority.cva(["inline-flex items-center rounded-md border","bg-[var(--content-background)] text-[var(--content-foreground)]","transition-colors duration-200","focus-within:ring-2 focus-within:ring-[var(--ring)] focus-within:ring-offset-2","data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50"],{variants:{size:{sm:`${o.sm} gap-0.5`,default:`${o.default} gap-0.5`,lg:`${o.lg} gap-1`},isInvalid:{true:"border-[var(--destructive-background)] focus-within:ring-[var(--destructive-background)]",false:"border-[var(--input-border)] hover:border-[var(--input-border)]/80"}},defaultVariants:{size:"default",isInvalid:false}}),u=classVarianceAuthority.cva(["tabular-nums rounded px-0.5","focus:outline-none focus:bg-[var(--accent)] focus:text-[var(--accent-foreground)]","data-[placeholder]:text-[var(--menu-muted)]","data-[type=literal]:text-[var(--menu-muted)]","data-[disabled]:opacity-50"],{variants:{size:{sm:`${i.sm} min-w-[1.5ch]`,default:`${i.default} min-w-[2ch]`,lg:`${i.lg} min-w-[2ch]`}},defaultVariants:{size:"default"}}),p=classVarianceAuthority.cva(["block font-medium text-[var(--content-foreground)]","mb-1.5",'data-[required]:after:content-["*"] data-[required]:after:ml-0.5',"data-[required]:after:text-[var(--destructive-background)]"],{variants:{size:{sm:"text-sm",default:"text-sm",lg:"text-base"}},defaultVariants:{size:"default"}}),T=classVarianceAuthority.cva(["text-[var(--menu-muted)]","mt-1"],{variants:{size:{sm:"text-xs",default:"text-sm",lg:"text-base"}},defaultVariants:{size:"default"}}),f=classVarianceAuthority.cva(["flex items-center gap-1","text-[var(--destructive-background)]","mt-1"],{variants:{size:{sm:"text-xs",default:"text-sm",lg:"text-base"}},defaultVariants:{size:"default"}});var E=react.forwardRef(({label:s,description:x,errorMessage:S,size:a="default",className:g,...d},_)=>jsxRuntime.jsxs(reactAriaComponents.TimeField,{ref:_,className:e("group flex flex-col gap-1",g),...d,children:[s&&jsxRuntime.jsx(reactAriaComponents.Label,{className:e(p({size:a})),"data-required":d.isRequired||void 0,children:s}),jsxRuntime.jsx(reactAriaComponents.DateInput,{className:e(m,c({size:a,isInvalid:d.isInvalid}),"w-fit"),children:I=>jsxRuntime.jsx(reactAriaComponents.DateSegment,{segment:I,className:e(u({size:a}))})}),x&&jsxRuntime.jsx(reactAriaComponents.Text,{slot:"description",className:e(T({size:a})),children:x}),jsxRuntime.jsx(reactAriaComponents.FieldError,{className:e(f({size:a})),children:S})]}));E.displayName="TimeField";Object.defineProperty(exports,"Time",{enumerable:true,get:function(){return date.Time}});Object.defineProperty(exports,"parseTime",{enumerable:true,get:function(){return date.parseTime}});exports.TimeField=E;exports.TimeFieldPropsSchema=N;exports.timeFieldDescriptionVariants=T;exports.timeFieldErrorVariants=f;exports.timeFieldLabelVariants=p;exports.timeFieldVariants=c;exports.timeSegmentVariants=u;//# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/elements/TimeField/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/utils/cn.ts","../../../src/elements/TimeField/TimeField.types.ts","../../../src/elements/TimeField/TimeField.tsx"],"names":["cn","inputs","twMerge","clsx","TimeFieldPropsSchema","z","timeFieldVariants","cva","timeSegmentVariants","timeFieldLabelVariants","timeFieldDescriptionVariants","timeFieldErrorVariants","TimeField","forwardRef","label","description","errorMessage","size","className","props","ref","jsxs","AriaTimeField","jsx","AriaLabel","AriaDateInput","segment","AriaDateSegment","AriaText","AriaFieldError"],"mappings":"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","file":"index.js","sourcesContent":["/**\n * Class Name Utility\n * Merges Tailwind CSS classes with conflict resolution\n *\n * Combines clsx for conditional classes and tailwind-merge for deduplication\n *\n * @example\n * cn('px-2 py-1', 'px-4') // => 'py-1 px-4' (px-4 overrides px-2)\n * cn('text-red-500', condition && 'text-blue-500') // => conditional application\n */\n\nimport { clsx, type ClassValue } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]): string {\n  return twMerge(clsx(inputs));\n}\n","/**\n * TimeField Component Types\n *\n * Zod schemas and TypeScript types for the TimeField component.\n * Includes CVA variant definitions for styling.\n *\n * Note: Zod schemas are used for contract tests and developer guardrails,\n * not runtime validation. This follows the established Themis pattern.\n *\n * @see {@link ../../docs/prd/timefield-prd.md} for full requirements\n */\n\nimport { z } from 'zod';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport type {\n  TimeFieldProps as AriaTimeFieldProps,\n  TimeValue,\n} from 'react-aria-components';\n\n// ============================================================================\n// Time Value Types (re-exported for convenience)\n// ============================================================================\n\n/**\n * Union type for all time values supported by the TimeField.\n * - Time: Time only (no date, no timezone)\n * - CalendarDateTime: Date and time (no timezone)\n * - ZonedDateTime: Date, time, and timezone\n */\nexport type { TimeValue } from 'react-aria-components';\n\n// ============================================================================\n// Granularity Type\n// ============================================================================\n\n/**\n * Controls which time segments are displayed.\n * - 'hour': Hour only (+ AM/PM in 12-hour mode)\n * - 'minute': Hour + minute (default)\n * - 'second': Hour + minute + second\n *\n * Note: Millisecond granularity is intentionally excluded - no common UI use case.\n */\nexport type TimeGranularity = 'hour' | 'minute' | 'second';\n\n// ============================================================================\n// Size Variant Type\n// ============================================================================\n\n/**\n * Size variants for TimeField component.\n * - 'sm': Compact size (36px height) - AA compliant only, not AAA\n * - 'default': Standard size (44px height) - AAA compliant\n * - 'lg': Large size (56px height) - AAA compliant\n */\nexport type TimeFieldSize = 'sm' | 'default' | 'lg';\n\n// ============================================================================\n// Hour Cycle Type\n// ============================================================================\n\n/**\n * Hour cycle format.\n * - 12: 12-hour format with AM/PM\n * - 24: 24-hour format\n */\nexport type HourCycle = 12 | 24;\n\n// ============================================================================\n// Zod Schemas\n// ============================================================================\n\n/**\n * Zod schema for TimeField props validation.\n * Used for contract tests and developer guardrails, not runtime validation.\n */\nexport const TimeFieldPropsSchema = z.object({\n  // Value props\n  value: z.custom<TimeValue>().optional(),\n  defaultValue: z.custom<TimeValue>().optional(),\n  placeholderValue: z.custom<TimeValue>().optional(),\n\n  // Granularity props\n  granularity: z.enum(['hour', 'minute', 'second']).default('minute'),\n  hourCycle: z.union([z.literal(12), z.literal(24)]).optional(),\n  hideTimeZone: z.boolean().optional(),\n  shouldForceLeadingZeros: z.boolean().optional(),\n\n  // Constraint props\n  minValue: z.custom<TimeValue>().optional(),\n  maxValue: z.custom<TimeValue>().optional(),\n\n  // State props\n  isDisabled: z.boolean().optional(),\n  isReadOnly: z.boolean().optional(),\n  isRequired: z.boolean().optional(),\n  isInvalid: z.boolean().optional(),\n\n  // Validation props\n  /** Custom validation function that returns an error message or null */\n  validate: z.function().optional(),\n  validationBehavior: z.enum(['native', 'aria']).default('native'),\n\n  // Display props\n  label: z.string(),\n  description: z.string().optional(),\n  /** Error message string or render function */\n  errorMessage: z.union([z.string(), z.function()]).optional(),\n\n  // Form props\n  name: z.string().optional(),\n\n  // Variant props\n  size: z.enum(['sm', 'default', 'lg']).default('default'),\n\n  // Event props\n  /** Called when the time value changes */\n  onChange: z.function().optional(),\n  /** Called when the field gains focus */\n  onFocus: z.function().optional(),\n  /** Called when the field loses focus */\n  onBlur: z.function().optional(),\n  /** Called when focus state changes */\n  onFocusChange: z.function().optional(),\n\n  // Standard props\n  className: z.string().optional(),\n  autoFocus: z.boolean().optional(),\n});\n\n// ============================================================================\n// TypeScript Types\n// ============================================================================\n\n/**\n * Custom props added to TimeField (not from React Aria).\n */\nexport interface ThemisTimeFieldCustomProps {\n  /** Size variant: 'sm', 'default', or 'lg' */\n  size?: TimeFieldSize;\n  /** Field label */\n  label?: string;\n  /** Description text below the field */\n  description?: string;\n  /** Error message when field is invalid */\n  errorMessage?: string;\n}\n\n/**\n * Props for the TimeField component.\n * Uses React Aria's TimeFieldProps directly to ensure correct function types.\n */\nexport type TimeFieldProps = AriaTimeFieldProps<TimeValue> &\n  ThemisTimeFieldCustomProps;\n\n// ============================================================================\n// CVA Variants\n// ============================================================================\n\n/**\n * Variants for the TimeField input container.\n * Applies to the DateInput element wrapping time segments.\n *\n * Size notes:\n * - sm (36px): Desktop-only, AA compliant only (not AAA touch target)\n * - default (44px): AAA compliant, recommended for most use cases\n * - lg (56px): AAA compliant, enhanced touch targets\n */\nexport const timeFieldVariants = cva(\n  [\n    // Base styles\n    'inline-flex items-center rounded-md border',\n    'bg-[var(--content-background)] text-[var(--content-foreground)]',\n    'transition-colors duration-200',\n    // Focus within\n    'focus-within:ring-2 focus-within:ring-[var(--ring)] focus-within:ring-offset-2',\n    // Disabled\n    'data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50',\n  ],\n  {\n    variants: {\n      size: {\n        sm: 'h-9 px-3 text-sm gap-0.5', // 36px - AA only\n        default: 'h-11 px-4 text-base gap-1', // 44px - AAA\n        lg: 'h-14 px-5 text-lg gap-1.5', // 56px - AAA\n      },\n      isInvalid: {\n        true: 'border-[var(--destructive-background)] focus-within:ring-[var(--destructive-background)]',\n        false: 'border-[var(--input-border)] hover:border-[var(--input-border)]/80',\n      },\n    },\n    defaultVariants: {\n      size: 'default',\n      isInvalid: false,\n    },\n  }\n);\n\n/**\n * Variants for individual time segment elements.\n * Each segment (hour, minute, second, dayPeriod) uses these styles.\n */\nexport const timeSegmentVariants = cva(\n  [\n    // Base styles\n    'tabular-nums rounded px-0.5',\n    // Focus\n    'focus:outline-none focus:bg-[var(--accent)] focus:text-[var(--accent-foreground)]',\n    // Placeholder\n    'data-[placeholder]:text-[var(--menu-muted)]',\n    // Literal segments (colons, spaces)\n    'data-[type=literal]:text-[var(--menu-muted)]',\n    // Disabled\n    'data-[disabled]:opacity-50',\n  ],\n  {\n    variants: {\n      size: {\n        sm: 'text-sm min-w-[1.5ch]',\n        default: 'text-base min-w-[2ch]',\n        lg: 'text-lg min-w-[2ch]',\n      },\n    },\n    defaultVariants: {\n      size: 'default',\n    },\n  }\n);\n\n/**\n * Variants for the TimeField label.\n */\nexport const timeFieldLabelVariants = cva(\n  [\n    'block font-medium text-[var(--content-foreground)]',\n    'mb-1.5',\n    // Required indicator\n    'data-[required]:after:content-[\"*\"] data-[required]:after:ml-0.5',\n    'data-[required]:after:text-[var(--destructive-background)]',\n  ],\n  {\n    variants: {\n      size: {\n        sm: 'text-sm',\n        default: 'text-sm',\n        lg: 'text-base',\n      },\n    },\n    defaultVariants: {\n      size: 'default',\n    },\n  }\n);\n\n/**\n * Variants for the description text below the field.\n */\nexport const timeFieldDescriptionVariants = cva(\n  [\n    'text-[var(--menu-muted)]',\n    'mt-1',\n  ],\n  {\n    variants: {\n      size: {\n        sm: 'text-xs',\n        default: 'text-sm',\n        lg: 'text-base',\n      },\n    },\n    defaultVariants: {\n      size: 'default',\n    },\n  }\n);\n\n/**\n * Variants for the error message display.\n */\nexport const timeFieldErrorVariants = cva(\n  [\n    'flex items-center gap-1',\n    'text-[var(--destructive-background)]',\n    'mt-1',\n  ],\n  {\n    variants: {\n      size: {\n        sm: 'text-xs',\n        default: 'text-sm',\n        lg: 'text-base',\n      },\n    },\n    defaultVariants: {\n      size: 'default',\n    },\n  }\n);\n\n// ============================================================================\n// Variant Types (from CVA)\n// ============================================================================\n\n/**\n * Variant props for timeFieldVariants CVA function.\n */\nexport type TimeFieldVariantProps = VariantProps<typeof timeFieldVariants>;\n\n/**\n * Variant props for timeSegmentVariants CVA function.\n */\nexport type TimeSegmentVariantProps = VariantProps<typeof timeSegmentVariants>;\n","'use client';\n\n/**\n * TimeField Component\n *\n * A fully accessible time input component built on React Aria's TimeField primitive.\n * Provides keyboard-editable time segments for entering hours, minutes, and seconds.\n *\n * Features:\n * - WCAG 2.2 AAA compliant (default/lg sizes) / AA compliant (sm size)\n * - Configurable granularity (hour, minute, second)\n * - 12-hour and 24-hour format support\n * - Step increment support\n * - Min/max constraints with validation\n * - Form integration with hidden input\n * - Full keyboard navigation\n * - Screen reader accessible\n *\n * @see {@link ../../docs/prd/timefield-prd.md} for full requirements\n */\n\nimport { forwardRef, type ReactElement } from 'react';\nimport {\n  TimeField as AriaTimeField,\n  DateInput as AriaDateInput,\n  DateSegment as AriaDateSegment,\n  Label as AriaLabel,\n  Text as AriaText,\n  FieldError as AriaFieldError,\n} from 'react-aria-components';\nimport { cn } from '../../utils/cn';\nimport type { TimeFieldProps } from './TimeField.types';\nimport {\n  timeFieldVariants,\n  timeSegmentVariants,\n  timeFieldLabelVariants,\n  timeFieldDescriptionVariants,\n  timeFieldErrorVariants,\n} from './TimeField.types';\n\n// =============================================================================\n// TimeField Component\n// =============================================================================\n\n/**\n * TimeField component for time input with keyboard-editable segments.\n *\n * @example\n * ```tsx\n * import { TimeField, Time } from '@tribepad/themis/elements/TimeField';\n *\n * // Basic usage\n * <TimeField label=\"Meeting Time\" />\n *\n * // With default value\n * <TimeField\n *   label=\"Start Time\"\n *   defaultValue={new Time(14, 30)}\n * />\n *\n * // 12-hour format with step\n * <TimeField\n *   label=\"Appointment\"\n *   hourCycle={12}\n *   step={15}\n * />\n *\n * // With validation\n * <TimeField\n *   label=\"Office Hours\"\n *   minValue={new Time(9, 0)}\n *   maxValue={new Time(17, 0)}\n *   errorMessage=\"Please select a time within office hours\"\n * />\n * ```\n */\nexport const TimeField = forwardRef<HTMLDivElement, TimeFieldProps>(\n  (\n    {\n      // Display props\n      label,\n      description,\n      errorMessage,\n      // Variant props\n      size = 'default',\n      // Standard props\n      className,\n      // All other props go to AriaTimeField\n      ...props\n    },\n    ref\n  ): ReactElement => {\n    return (\n      <AriaTimeField\n        ref={ref}\n        className={cn('group flex flex-col gap-1', className)}\n        {...props}\n      >\n        {/* Label */}\n        {label && (\n          <AriaLabel\n            className={cn(timeFieldLabelVariants({ size }))}\n            data-required={props.isRequired || undefined}\n          >\n            {label}\n          </AriaLabel>\n        )}\n\n        {/* Time Input */}\n        <AriaDateInput\n          className={cn(\n            timeFieldVariants({\n              size,\n              isInvalid: props.isInvalid,\n            }),\n            'w-fit'\n          )}\n        >\n          {(segment) => (\n            <AriaDateSegment\n              segment={segment}\n              className={cn(timeSegmentVariants({ size }))}\n            />\n          )}\n        </AriaDateInput>\n\n        {/* Description */}\n        {description && (\n          <AriaText\n            slot=\"description\"\n            className={cn(timeFieldDescriptionVariants({ size }))}\n          >\n            {description}\n          </AriaText>\n        )}\n\n        {/* Error Message */}\n        <AriaFieldError className={cn(timeFieldErrorVariants({ size }))}>\n          {errorMessage}\n        </AriaFieldError>\n      </AriaTimeField>\n    );\n  }\n);\n\nTimeField.displayName = 'TimeField';\n"]}
+{"version":3,"sources":["../../../src/utils/cn.ts","../../../src/styles/shared-variants.ts","../../../src/elements/TimeField/TimeField.types.ts","../../../src/elements/TimeField/TimeField.tsx"],"names":["cn","inputs","twMerge","clsx","TEXT_SIZE_SMALL_SCALE","FIELD_HEIGHTS","FIELD_INPUT_SIZES","FIELD_TOUCH_TARGET","TimeFieldPropsSchema","z","timeFieldVariants","cva","timeSegmentVariants","timeFieldLabelVariants","timeFieldDescriptionVariants","timeFieldErrorVariants","TimeField","forwardRef","label","description","errorMessage","size","className","props","ref","jsxs","AriaTimeField","jsx","AriaLabel","AriaDateInput","segment","AriaDateSegment","AriaText","AriaFieldError"],"mappings":"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","file":"index.js","sourcesContent":["/**\n * Class Name Utility\n * Merges Tailwind CSS classes with conflict resolution\n *\n * Combines clsx for conditional classes and tailwind-merge for deduplication\n *\n * @example\n * cn('px-2 py-1', 'px-4') // => 'py-1 px-4' (px-4 overrides px-2)\n * cn('text-red-500', condition && 'text-blue-500') // => conditional application\n */\n\nimport { clsx, type ClassValue } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]): string {\n  return twMerge(clsx(inputs));\n}\n","/**\n * Shared CVA Variant Utilities\n *\n * Common patterns extracted from component variants for consistency and reduced bundle size.\n * Use these constants in CVA definitions to ensure consistent styling across Themis.\n *\n * @see interaction-states.ts for interaction-specific styles (focus, hover, pressed)\n */\n\n// =============================================================================\n// Focus Ring Patterns\n// =============================================================================\n\n/**\n * Focus-within ring (for container elements with focusable children)\n * Use when the container should show focus when any child is focused\n */\nexport const FOCUS_WITHIN_RING = [\n  'focus-within:outline-none',\n  'focus-within:ring-2',\n  'focus-within:ring-[var(--ring)]',\n  'focus-within:ring-offset-2',\n] as const;\n\n/**\n * Focus-visible ring (for directly focusable elements)\n * Use for buttons, inputs, and other interactive elements\n */\nexport const FOCUS_VISIBLE_RING = [\n  'focus-visible:outline-none',\n  'focus-visible:ring-2',\n  'focus-visible:ring-[var(--ring)]',\n  'focus-visible:ring-offset-2',\n] as const;\n\n/**\n * Standard focus ring (for elements using :focus pseudo-class)\n * Prefer focus-visible when possible for better UX\n */\nexport const FOCUS_RING = [\n  'focus:outline-none',\n  'focus:ring-2',\n  'focus:ring-[var(--ring)]',\n] as const;\n\n/**\n * Focus with background change (for segments, cells, menu items)\n */\nexport const FOCUS_HIGHLIGHT = [\n  'focus:outline-none',\n  'focus:bg-[var(--accent)]',\n  'focus:text-[var(--accent-foreground)]',\n] as const;\n\n// =============================================================================\n// Disabled State Patterns\n// =============================================================================\n\n/**\n * Standard disabled state using disabled attribute\n */\nexport const DISABLED_STANDARD = [\n  'disabled:pointer-events-none',\n  'disabled:opacity-50',\n] as const;\n\n/**\n * Disabled state using data attribute (React Aria pattern)\n */\nexport const DISABLED_DATA_ATTR = [\n  'data-[disabled]:pointer-events-none',\n  'data-[disabled]:opacity-50',\n  'data-[disabled]:cursor-not-allowed',\n] as const;\n\n// =============================================================================\n// Size-Based Text Variants\n// =============================================================================\n\n/**\n * Small text size scale (xs -> sm -> base)\n */\nexport const TEXT_SIZE_SMALL_SCALE = {\n  sm: 'text-xs',\n  default: 'text-sm',\n  lg: 'text-base',\n} as const;\n\n/**\n * Medium text size scale (sm -> base -> lg)\n */\nexport const TEXT_SIZE_MEDIUM_SCALE = {\n  sm: 'text-sm',\n  default: 'text-base',\n  lg: 'text-lg',\n} as const;\n\n// =============================================================================\n// Touch Target Utilities\n// =============================================================================\n\n/**\n * WCAG 2.2 AAA minimum touch target (44x44px)\n */\nexport const TOUCH_TARGET_MIN = [\n  'min-h-[44px]',\n  'min-w-[44px]',\n] as const;\n\n/**\n * Common button/cell sizes with touch target compliance\n */\nexport const INTERACTIVE_SIZES = {\n  sm: 'h-9 w-9',      // 36px - desktop only, NOT AAA compliant\n  default: 'h-11 w-11', // 44px - AAA compliant\n  lg: 'h-14 w-14',    // 56px - AAA compliant, enhanced\n} as const;\n\n/**\n * Height-only sizes for fields and inputs\n */\nexport const FIELD_HEIGHTS = {\n  sm: 'h-9',      // 36px\n  default: 'h-10', // 40px\n  lg: 'h-11',     // 44px\n} as const;\n\n/**\n * Layer 2: Visual sizing for form field inputs (height + padding + font).\n * Use on the <input>, <select>, or trigger element itself.\n *\n * Components may append additional classes (e.g. gap-* for segmented fields, py-* for text inputs).\n */\nexport const FIELD_INPUT_SIZES = {\n  sm: `${FIELD_HEIGHTS.sm} px-2 text-xs`,\n  default: `${FIELD_HEIGHTS.default} px-3 text-sm`,\n  lg: `${FIELD_HEIGHTS.lg} px-4 text-base`,\n} as const;\n\n/**\n * Layer 1: Invisible touch target wrapper for form fields.\n * Apply to a <label> (or wrapper div) around the input element.\n * The <label> natively routes clicks/taps to the contained input\n * without JavaScript — achieving a 44px touch target while the\n * input stays at its visual height (h-9/h-10/h-11).\n */\nexport const FIELD_TOUCH_TARGET = 'min-h-[44px] flex items-center' as const;\n\n// =============================================================================\n// Message/Feedback Patterns\n// =============================================================================\n\n/**\n * Error message styling\n */\nexport const ERROR_MESSAGE_BASE = [\n  'flex',\n  'items-center',\n  'gap-1.5',\n  'text-[var(--destructive-background)]',\n] as const;\n\n/**\n * Success message styling\n */\nexport const SUCCESS_MESSAGE_BASE = [\n  'flex',\n  'items-center',\n  'gap-1.5',\n  'text-[var(--success-background)]',\n] as const;\n\n/**\n * Description/helper text styling\n */\nexport const DESCRIPTION_BASE = [\n  'text-[var(--menu-muted)]',\n] as const;\n\n/**\n * Label base styling\n */\nexport const LABEL_BASE = [\n  'font-medium',\n  'text-[var(--content-foreground)]',\n] as const;\n\n/**\n * Required indicator pattern\n */\nexport const REQUIRED_INDICATOR = \"after:content-['*'] after:ml-0.5 after:text-[var(--destructive-background)]\";\n\n// =============================================================================\n// Animation Patterns\n// =============================================================================\n\n/**\n * Popover/dropdown entry animation\n */\nexport const POPOVER_ANIMATION_IN = [\n  'data-[entering]:animate-in',\n  'data-[entering]:fade-in-0',\n  'data-[entering]:zoom-in-95',\n] as const;\n\n/**\n * Popover/dropdown exit animation\n */\nexport const POPOVER_ANIMATION_OUT = [\n  'data-[exiting]:animate-out',\n  'data-[exiting]:fade-out-0',\n  'data-[exiting]:zoom-out-95',\n] as const;\n\n/**\n * Modal content enter animation (fade + zoom)\n * Uses React Aria data-[entering]/data-[exiting] attributes\n */\nexport const MODAL_ANIMATION_IN = [\n  'data-[entering]:animate-in',\n  'data-[entering]:fade-in-0',\n  'data-[entering]:zoom-in-95',\n  'data-[entering]:duration-200',\n  'data-[entering]:ease-out',\n] as const;\n\n/**\n * Modal content exit animation (fade + zoom)\n * Uses React Aria data-[entering]/data-[exiting] attributes\n */\nexport const MODAL_ANIMATION_OUT = [\n  'data-[exiting]:animate-out',\n  'data-[exiting]:fade-out-0',\n  'data-[exiting]:zoom-out-95',\n  'data-[exiting]:duration-150',\n  'data-[exiting]:ease-in',\n] as const;\n\n/**\n * Modal slide enter animation (fade + slide up)\n */\nexport const MODAL_SLIDE_IN = [\n  'data-[entering]:animate-in',\n  'data-[entering]:fade-in-0',\n  'data-[entering]:slide-in-from-bottom-4',\n  'data-[entering]:duration-200',\n  'data-[entering]:ease-out',\n] as const;\n\n/**\n * Modal slide exit animation (fade + slide down)\n */\nexport const MODAL_SLIDE_OUT = [\n  'data-[exiting]:animate-out',\n  'data-[exiting]:fade-out-0',\n  'data-[exiting]:slide-out-to-bottom-4',\n  'data-[exiting]:duration-150',\n  'data-[exiting]:ease-in',\n] as const;\n\n/**\n * Modal overlay enter/exit animation (fade only)\n */\nexport const MODAL_OVERLAY_IN = [\n  'data-[entering]:animate-in',\n  'data-[entering]:fade-in-0',\n  'data-[entering]:duration-200',\n] as const;\n\nexport const MODAL_OVERLAY_OUT = [\n  'data-[exiting]:animate-out',\n  'data-[exiting]:fade-out-0',\n  'data-[exiting]:duration-150',\n] as const;\n\n/**\n * Reduced motion support (WCAG 2.2)\n */\nexport const REDUCED_MOTION = [\n  'motion-reduce:transition-none',\n  'motion-reduce:animate-none',\n] as const;\n\n/**\n * Standard transition for colors\n */\nexport const TRANSITION_COLORS = [\n  'transition-colors',\n  'duration-200',\n] as const;\n\n/**\n * Fast transition for interactions\n */\nexport const TRANSITION_FAST = [\n  'transition-colors',\n  'duration-150',\n] as const;\n\n// =============================================================================\n// Hover State Patterns\n// =============================================================================\n\n/**\n * Accent background on hover (for interactive items)\n */\nexport const HOVER_ACCENT = [\n  'hover:bg-[var(--accent)]',\n  'hover:text-[var(--accent-foreground)]',\n] as const;\n\n// =============================================================================\n// Helper Functions\n// =============================================================================\n\n/**\n * Combines multiple style arrays into a flat array for CVA base styles\n */\nexport function combineStyles(...styles: (readonly string[] | string)[]): string[] {\n  return styles.flatMap(s => Array.isArray(s) ? [...s] : [s]);\n}\n","/**\n * TimeField Component Types\n *\n * Zod schemas and TypeScript types for the TimeField component.\n * Includes CVA variant definitions for styling.\n *\n * Note: Zod schemas are used for contract tests and developer guardrails,\n * not runtime validation. This follows the established Themis pattern.\n *\n * @see {@link ../../docs/prd/timefield-prd.md} for full requirements\n */\n\nimport { z } from 'zod';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { FIELD_INPUT_SIZES, TEXT_SIZE_SMALL_SCALE } from '../../styles';\nimport type {\n  TimeFieldProps as AriaTimeFieldProps,\n  TimeValue,\n} from 'react-aria-components';\n\n// ============================================================================\n// Time Value Types (re-exported for convenience)\n// ============================================================================\n\n/**\n * Union type for all time values supported by the TimeField.\n * - Time: Time only (no date, no timezone)\n * - CalendarDateTime: Date and time (no timezone)\n * - ZonedDateTime: Date, time, and timezone\n */\nexport type { TimeValue } from 'react-aria-components';\n\n// ============================================================================\n// Granularity Type\n// ============================================================================\n\n/**\n * Controls which time segments are displayed.\n * - 'hour': Hour only (+ AM/PM in 12-hour mode)\n * - 'minute': Hour + minute (default)\n * - 'second': Hour + minute + second\n *\n * Note: Millisecond granularity is intentionally excluded - no common UI use case.\n */\nexport type TimeGranularity = 'hour' | 'minute' | 'second';\n\n// ============================================================================\n// Size Variant Type\n// ============================================================================\n\n/**\n * Size variants for TimeField component.\n * - 'sm': Compact size (36px height) - AA compliant only, not AAA\n * - 'default': Standard size (44px height) - AAA compliant\n * - 'lg': Large size (56px height) - AAA compliant\n */\nexport type TimeFieldSize = 'sm' | 'default' | 'lg';\n\n// ============================================================================\n// Hour Cycle Type\n// ============================================================================\n\n/**\n * Hour cycle format.\n * - 12: 12-hour format with AM/PM\n * - 24: 24-hour format\n */\nexport type HourCycle = 12 | 24;\n\n// ============================================================================\n// Zod Schemas\n// ============================================================================\n\n/**\n * Zod schema for TimeField props validation.\n * Used for contract tests and developer guardrails, not runtime validation.\n */\nexport const TimeFieldPropsSchema = z.object({\n  // Value props\n  value: z.custom<TimeValue>().optional(),\n  defaultValue: z.custom<TimeValue>().optional(),\n  placeholderValue: z.custom<TimeValue>().optional(),\n\n  // Granularity props\n  granularity: z.enum(['hour', 'minute', 'second']).default('minute'),\n  hourCycle: z.union([z.literal(12), z.literal(24)]).optional(),\n  hideTimeZone: z.boolean().optional(),\n  shouldForceLeadingZeros: z.boolean().optional(),\n\n  // Constraint props\n  minValue: z.custom<TimeValue>().optional(),\n  maxValue: z.custom<TimeValue>().optional(),\n\n  // State props\n  isDisabled: z.boolean().optional(),\n  isReadOnly: z.boolean().optional(),\n  isRequired: z.boolean().optional(),\n  isInvalid: z.boolean().optional(),\n\n  // Validation props\n  /** Custom validation function that returns an error message or null */\n  validate: z.function().optional(),\n  validationBehavior: z.enum(['native', 'aria']).default('native'),\n\n  // Display props\n  label: z.string(),\n  description: z.string().optional(),\n  /** Error message string or render function */\n  errorMessage: z.union([z.string(), z.function()]).optional(),\n\n  // Form props\n  name: z.string().optional(),\n\n  // Variant props\n  size: z.enum(['sm', 'default', 'lg']).default('default'),\n\n  // Event props\n  /** Called when the time value changes */\n  onChange: z.function().optional(),\n  /** Called when the field gains focus */\n  onFocus: z.function().optional(),\n  /** Called when the field loses focus */\n  onBlur: z.function().optional(),\n  /** Called when focus state changes */\n  onFocusChange: z.function().optional(),\n\n  // Standard props\n  className: z.string().optional(),\n  autoFocus: z.boolean().optional(),\n});\n\n// ============================================================================\n// TypeScript Types\n// ============================================================================\n\n/**\n * Custom props added to TimeField (not from React Aria).\n */\nexport interface ThemisTimeFieldCustomProps {\n  /** Size variant: 'sm', 'default', or 'lg' */\n  size?: TimeFieldSize;\n  /** Field label */\n  label?: string;\n  /** Description text below the field */\n  description?: string;\n  /** Error message when field is invalid */\n  errorMessage?: string;\n}\n\n/**\n * Props for the TimeField component.\n * Uses React Aria's TimeFieldProps directly to ensure correct function types.\n */\nexport type TimeFieldProps = AriaTimeFieldProps<TimeValue> &\n  ThemisTimeFieldCustomProps;\n\n// ============================================================================\n// CVA Variants\n// ============================================================================\n\n/**\n * Variants for the TimeField input container.\n * Applies to the DateInput element wrapping time segments.\n *\n * Size notes:\n * - sm (36px): Desktop-only, AA compliant only (not AAA touch target)\n * - default (44px): AAA compliant, recommended for most use cases\n * - lg (56px): AAA compliant, enhanced touch targets\n */\nexport const timeFieldVariants = cva(\n  [\n    // Base styles\n    'inline-flex items-center rounded-md border',\n    'bg-[var(--content-background)] text-[var(--content-foreground)]',\n    'transition-colors duration-200',\n    // Focus within\n    'focus-within:ring-2 focus-within:ring-[var(--ring)] focus-within:ring-offset-2',\n    // Disabled\n    'data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50',\n  ],\n  {\n    variants: {\n      size: {\n        sm: `${FIELD_INPUT_SIZES.sm} gap-0.5`,\n        default: `${FIELD_INPUT_SIZES.default} gap-0.5`,\n        lg: `${FIELD_INPUT_SIZES.lg} gap-1`,\n      },\n      isInvalid: {\n        true: 'border-[var(--destructive-background)] focus-within:ring-[var(--destructive-background)]',\n        false: 'border-[var(--input-border)] hover:border-[var(--input-border)]/80',\n      },\n    },\n    defaultVariants: {\n      size: 'default',\n      isInvalid: false,\n    },\n  }\n);\n\n/**\n * Variants for individual time segment elements.\n * Each segment (hour, minute, second, dayPeriod) uses these styles.\n */\nexport const timeSegmentVariants = cva(\n  [\n    // Base styles\n    'tabular-nums rounded px-0.5',\n    // Focus\n    'focus:outline-none focus:bg-[var(--accent)] focus:text-[var(--accent-foreground)]',\n    // Placeholder\n    'data-[placeholder]:text-[var(--menu-muted)]',\n    // Literal segments (colons, spaces)\n    'data-[type=literal]:text-[var(--menu-muted)]',\n    // Disabled\n    'data-[disabled]:opacity-50',\n  ],\n  {\n    variants: {\n      size: {\n        sm: `${TEXT_SIZE_SMALL_SCALE.sm} min-w-[1.5ch]`,\n        default: `${TEXT_SIZE_SMALL_SCALE.default} min-w-[2ch]`,\n        lg: `${TEXT_SIZE_SMALL_SCALE.lg} min-w-[2ch]`,\n      },\n    },\n    defaultVariants: {\n      size: 'default',\n    },\n  }\n);\n\n/**\n * Variants for the TimeField label.\n */\nexport const timeFieldLabelVariants = cva(\n  [\n    'block font-medium text-[var(--content-foreground)]',\n    'mb-1.5',\n    // Required indicator\n    'data-[required]:after:content-[\"*\"] data-[required]:after:ml-0.5',\n    'data-[required]:after:text-[var(--destructive-background)]',\n  ],\n  {\n    variants: {\n      size: {\n        sm: 'text-sm',\n        default: 'text-sm',\n        lg: 'text-base',\n      },\n    },\n    defaultVariants: {\n      size: 'default',\n    },\n  }\n);\n\n/**\n * Variants for the description text below the field.\n */\nexport const timeFieldDescriptionVariants = cva(\n  [\n    'text-[var(--menu-muted)]',\n    'mt-1',\n  ],\n  {\n    variants: {\n      size: {\n        sm: 'text-xs',\n        default: 'text-sm',\n        lg: 'text-base',\n      },\n    },\n    defaultVariants: {\n      size: 'default',\n    },\n  }\n);\n\n/**\n * Variants for the error message display.\n */\nexport const timeFieldErrorVariants = cva(\n  [\n    'flex items-center gap-1',\n    'text-[var(--destructive-background)]',\n    'mt-1',\n  ],\n  {\n    variants: {\n      size: {\n        sm: 'text-xs',\n        default: 'text-sm',\n        lg: 'text-base',\n      },\n    },\n    defaultVariants: {\n      size: 'default',\n    },\n  }\n);\n\n// ============================================================================\n// Variant Types (from CVA)\n// ============================================================================\n\n/**\n * Variant props for timeFieldVariants CVA function.\n */\nexport type TimeFieldVariantProps = VariantProps<typeof timeFieldVariants>;\n\n/**\n * Variant props for timeSegmentVariants CVA function.\n */\nexport type TimeSegmentVariantProps = VariantProps<typeof timeSegmentVariants>;\n","'use client';\n\n/**\n * TimeField Component\n *\n * A fully accessible time input component built on React Aria's TimeField primitive.\n * Provides keyboard-editable time segments for entering hours, minutes, and seconds.\n *\n * Features:\n * - WCAG 2.2 AAA compliant (default/lg sizes) / AA compliant (sm size)\n * - Configurable granularity (hour, minute, second)\n * - 12-hour and 24-hour format support\n * - Step increment support\n * - Min/max constraints with validation\n * - Form integration with hidden input\n * - Full keyboard navigation\n * - Screen reader accessible\n *\n * @see {@link ../../docs/prd/timefield-prd.md} for full requirements\n */\n\nimport { forwardRef, type ReactElement } from 'react';\nimport {\n  TimeField as AriaTimeField,\n  DateInput as AriaDateInput,\n  DateSegment as AriaDateSegment,\n  Label as AriaLabel,\n  Text as AriaText,\n  FieldError as AriaFieldError,\n} from 'react-aria-components';\nimport { cn } from '../../utils/cn';\nimport { FIELD_TOUCH_TARGET } from '../../styles';\nimport type { TimeFieldProps } from './TimeField.types';\nimport {\n  timeFieldVariants,\n  timeSegmentVariants,\n  timeFieldLabelVariants,\n  timeFieldDescriptionVariants,\n  timeFieldErrorVariants,\n} from './TimeField.types';\n\n// =============================================================================\n// TimeField Component\n// =============================================================================\n\n/**\n * TimeField component for time input with keyboard-editable segments.\n *\n * @example\n * ```tsx\n * import { TimeField, Time } from '@tribepad/themis/elements/TimeField';\n *\n * // Basic usage\n * <TimeField label=\"Meeting Time\" />\n *\n * // With default value\n * <TimeField\n *   label=\"Start Time\"\n *   defaultValue={new Time(14, 30)}\n * />\n *\n * // 12-hour format with step\n * <TimeField\n *   label=\"Appointment\"\n *   hourCycle={12}\n *   step={15}\n * />\n *\n * // With validation\n * <TimeField\n *   label=\"Office Hours\"\n *   minValue={new Time(9, 0)}\n *   maxValue={new Time(17, 0)}\n *   errorMessage=\"Please select a time within office hours\"\n * />\n * ```\n */\nexport const TimeField = forwardRef<HTMLDivElement, TimeFieldProps>(\n  (\n    {\n      // Display props\n      label,\n      description,\n      errorMessage,\n      // Variant props\n      size = 'default',\n      // Standard props\n      className,\n      // All other props go to AriaTimeField\n      ...props\n    },\n    ref\n  ): ReactElement => {\n    return (\n      <AriaTimeField\n        ref={ref}\n        className={cn('group flex flex-col gap-1', className)}\n        {...props}\n      >\n        {/* Label */}\n        {label && (\n          <AriaLabel\n            className={cn(timeFieldLabelVariants({ size }))}\n            data-required={props.isRequired || undefined}\n          >\n            {label}\n          </AriaLabel>\n        )}\n\n        {/* Time Input */}\n        <AriaDateInput\n          className={cn(\n            FIELD_TOUCH_TARGET,\n            timeFieldVariants({\n              size,\n              isInvalid: props.isInvalid,\n            }),\n            'w-fit'\n          )}\n        >\n          {(segment) => (\n            <AriaDateSegment\n              segment={segment}\n              className={cn(timeSegmentVariants({ size }))}\n            />\n          )}\n        </AriaDateInput>\n\n        {/* Description */}\n        {description && (\n          <AriaText\n            slot=\"description\"\n            className={cn(timeFieldDescriptionVariants({ size }))}\n          >\n            {description}\n          </AriaText>\n        )}\n\n        {/* Error Message */}\n        <AriaFieldError className={cn(timeFieldErrorVariants({ size }))}>\n          {errorMessage}\n        </AriaFieldError>\n      </AriaTimeField>\n    );\n  }\n);\n\nTimeField.displayName = 'TimeField';\n"]}

package/dist/elements/TimeField/index.mjs

@@ -1,3 +1,3 @@
 "use client";
-import {forwardRef}from'react';import {TimeField,Label,DateInput,DateSegment,Text,FieldError}from'react-aria-components';import {clsx}from'clsx';import {twMerge}from'tailwind-merge';import {z}from'zod';import {cva}from'class-variance-authority';import {jsxs,jsx}from'react/jsx-runtime';export{Time,parseTime}from'@internationalized/date';function t(...o){return twMerge(clsx(o))}var b=z.object({value:z.custom().optional(),defaultValue:z.custom().optional(),placeholderValue:z.custom().optional(),granularity:z.enum(["hour","minute","second"]).default("minute"),hourCycle:z.union([z.literal(12),z.literal(24)]).optional(),hideTimeZone:z.boolean().optional(),shouldForceLeadingZeros:z.boolean().optional(),minValue:z.custom().optional(),maxValue:z.custom().optional(),isDisabled:z.boolean().optional(),isReadOnly:z.boolean().optional(),isRequired:z.boolean().optional(),isInvalid:z.boolean().optional(),validate:z.function().optional(),validationBehavior:z.enum(["native","aria"]).default("native"),label:z.string(),description:z.string().optional(),errorMessage:z.union([z.string(),z.function()]).optional(),name:z.string().optional(),size:z.enum(["sm","default","lg"]).default("default"),onChange:z.function().optional(),onFocus:z.function().optional(),onBlur:z.function().optional(),onFocusChange:z.function().optional(),className:z.string().optional(),autoFocus:z.boolean().optional()}),l=cva(["inline-flex items-center rounded-md border","bg-[var(--content-background)] text-[var(--content-foreground)]","transition-colors duration-200","focus-within:ring-2 focus-within:ring-[var(--ring)] focus-within:ring-offset-2","data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50"],{variants:{size:{sm:"h-9 px-3 text-sm gap-0.5",default:"h-11 px-4 text-base gap-1",lg:"h-14 px-5 text-lg gap-1.5"},isInvalid:{true:"border-[var(--destructive-background)] focus-within:ring-[var(--destructive-background)]",false:"border-[var(--input-border)] hover:border-[var(--input-border)]/80"}},defaultVariants:{size:"default",isInvalid:false}}),s=cva(["tabular-nums rounded px-0.5","focus:outline-none focus:bg-[var(--accent)] focus:text-[var(--accent-foreground)]","data-[placeholder]:text-[var(--menu-muted)]","data-[type=literal]:text-[var(--menu-muted)]","data-[disabled]:opacity-50"],{variants:{size:{sm:"text-sm min-w-[1.5ch]",default:"text-base min-w-[2ch]",lg:"text-lg min-w-[2ch]"}},defaultVariants:{size:"default"}}),m=cva(["block font-medium text-[var(--content-foreground)]","mb-1.5",'data-[required]:after:content-["*"] data-[required]:after:ml-0.5',"data-[required]:after:text-[var(--destructive-background)]"],{variants:{size:{sm:"text-sm",default:"text-sm",lg:"text-base"}},defaultVariants:{size:"default"}}),d=cva(["text-[var(--menu-muted)]","mt-1"],{variants:{size:{sm:"text-xs",default:"text-sm",lg:"text-base"}},defaultVariants:{size:"default"}}),u=cva(["flex items-center gap-1","text-[var(--destructive-background)]","mt-1"],{variants:{size:{sm:"text-xs",default:"text-sm",lg:"text-base"}},defaultVariants:{size:"default"}});var c=forwardRef(({label:o,description:p,errorMessage:f,size:a="default",className:x,...n},g)=>jsxs(TimeField,{ref:g,className:t("group flex flex-col gap-1",x),...n,children:[o&&jsx(Label,{className:t(m({size:a})),"data-required":n.isRequired||void 0,children:o}),jsx(DateInput,{className:t(l({size:a,isInvalid:n.isInvalid}),"w-fit"),children:F=>jsx(DateSegment,{segment:F,className:t(s({size:a}))})}),p&&jsx(Text,{slot:"description",className:t(d({size:a})),children:p}),jsx(FieldError,{className:t(u({size:a})),children:f})]}));c.displayName="TimeField";export{c as TimeField,b as TimeFieldPropsSchema,d as timeFieldDescriptionVariants,u as timeFieldErrorVariants,m as timeFieldLabelVariants,l as timeFieldVariants,s as timeSegmentVariants};//# sourceMappingURL=index.mjs.map
+import {forwardRef}from'react';import {TimeField,Label,DateInput,DateSegment,Text,FieldError}from'react-aria-components';import {clsx}from'clsx';import {twMerge}from'tailwind-merge';import {z}from'zod';import {cva}from'class-variance-authority';import {jsxs,jsx}from'react/jsx-runtime';export{Time,parseTime}from'@internationalized/date';function e(...s){return twMerge(clsx(s))}var i={sm:"text-xs",default:"text-sm",lg:"text-base"};var l={sm:"h-9",default:"h-10",lg:"h-11"},o={sm:`${l.sm} px-2 text-xs`,default:`${l.default} px-3 text-sm`,lg:`${l.lg} px-4 text-base`},m="min-h-[44px] flex items-center";var N=z.object({value:z.custom().optional(),defaultValue:z.custom().optional(),placeholderValue:z.custom().optional(),granularity:z.enum(["hour","minute","second"]).default("minute"),hourCycle:z.union([z.literal(12),z.literal(24)]).optional(),hideTimeZone:z.boolean().optional(),shouldForceLeadingZeros:z.boolean().optional(),minValue:z.custom().optional(),maxValue:z.custom().optional(),isDisabled:z.boolean().optional(),isReadOnly:z.boolean().optional(),isRequired:z.boolean().optional(),isInvalid:z.boolean().optional(),validate:z.function().optional(),validationBehavior:z.enum(["native","aria"]).default("native"),label:z.string(),description:z.string().optional(),errorMessage:z.union([z.string(),z.function()]).optional(),name:z.string().optional(),size:z.enum(["sm","default","lg"]).default("default"),onChange:z.function().optional(),onFocus:z.function().optional(),onBlur:z.function().optional(),onFocusChange:z.function().optional(),className:z.string().optional(),autoFocus:z.boolean().optional()}),c=cva(["inline-flex items-center rounded-md border","bg-[var(--content-background)] text-[var(--content-foreground)]","transition-colors duration-200","focus-within:ring-2 focus-within:ring-[var(--ring)] focus-within:ring-offset-2","data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50"],{variants:{size:{sm:`${o.sm} gap-0.5`,default:`${o.default} gap-0.5`,lg:`${o.lg} gap-1`},isInvalid:{true:"border-[var(--destructive-background)] focus-within:ring-[var(--destructive-background)]",false:"border-[var(--input-border)] hover:border-[var(--input-border)]/80"}},defaultVariants:{size:"default",isInvalid:false}}),u=cva(["tabular-nums rounded px-0.5","focus:outline-none focus:bg-[var(--accent)] focus:text-[var(--accent-foreground)]","data-[placeholder]:text-[var(--menu-muted)]","data-[type=literal]:text-[var(--menu-muted)]","data-[disabled]:opacity-50"],{variants:{size:{sm:`${i.sm} min-w-[1.5ch]`,default:`${i.default} min-w-[2ch]`,lg:`${i.lg} min-w-[2ch]`}},defaultVariants:{size:"default"}}),p=cva(["block font-medium text-[var(--content-foreground)]","mb-1.5",'data-[required]:after:content-["*"] data-[required]:after:ml-0.5',"data-[required]:after:text-[var(--destructive-background)]"],{variants:{size:{sm:"text-sm",default:"text-sm",lg:"text-base"}},defaultVariants:{size:"default"}}),T=cva(["text-[var(--menu-muted)]","mt-1"],{variants:{size:{sm:"text-xs",default:"text-sm",lg:"text-base"}},defaultVariants:{size:"default"}}),f=cva(["flex items-center gap-1","text-[var(--destructive-background)]","mt-1"],{variants:{size:{sm:"text-xs",default:"text-sm",lg:"text-base"}},defaultVariants:{size:"default"}});var E=forwardRef(({label:s,description:x,errorMessage:S,size:a="default",className:g,...d},_)=>jsxs(TimeField,{ref:_,className:e("group flex flex-col gap-1",g),...d,children:[s&&jsx(Label,{className:e(p({size:a})),"data-required":d.isRequired||void 0,children:s}),jsx(DateInput,{className:e(m,c({size:a,isInvalid:d.isInvalid}),"w-fit"),children:I=>jsx(DateSegment,{segment:I,className:e(u({size:a}))})}),x&&jsx(Text,{slot:"description",className:e(T({size:a})),children:x}),jsx(FieldError,{className:e(f({size:a})),children:S})]}));E.displayName="TimeField";export{E as TimeField,N as TimeFieldPropsSchema,T as timeFieldDescriptionVariants,f as timeFieldErrorVariants,p as timeFieldLabelVariants,c as timeFieldVariants,u as timeSegmentVariants};//# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map

package/dist/elements/TimeField/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/utils/cn.ts","../../../src/elements/TimeField/TimeField.types.ts","../../../src/elements/TimeField/TimeField.tsx"],"names":["cn","inputs","twMerge","clsx","TimeFieldPropsSchema","z","timeFieldVariants","cva","timeSegmentVariants","timeFieldLabelVariants","timeFieldDescriptionVariants","timeFieldErrorVariants","TimeField","forwardRef","label","description","errorMessage","size","className","props","ref","jsxs","AriaTimeField","jsx","AriaLabel","AriaDateInput","segment","AriaDateSegment","AriaText","AriaFieldError"],"mappings":"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","file":"index.mjs","sourcesContent":["/**\n * Class Name Utility\n * Merges Tailwind CSS classes with conflict resolution\n *\n * Combines clsx for conditional classes and tailwind-merge for deduplication\n *\n * @example\n * cn('px-2 py-1', 'px-4') // => 'py-1 px-4' (px-4 overrides px-2)\n * cn('text-red-500', condition && 'text-blue-500') // => conditional application\n */\n\nimport { clsx, type ClassValue } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]): string {\n  return twMerge(clsx(inputs));\n}\n","/**\n * TimeField Component Types\n *\n * Zod schemas and TypeScript types for the TimeField component.\n * Includes CVA variant definitions for styling.\n *\n * Note: Zod schemas are used for contract tests and developer guardrails,\n * not runtime validation. This follows the established Themis pattern.\n *\n * @see {@link ../../docs/prd/timefield-prd.md} for full requirements\n */\n\nimport { z } from 'zod';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport type {\n  TimeFieldProps as AriaTimeFieldProps,\n  TimeValue,\n} from 'react-aria-components';\n\n// ============================================================================\n// Time Value Types (re-exported for convenience)\n// ============================================================================\n\n/**\n * Union type for all time values supported by the TimeField.\n * - Time: Time only (no date, no timezone)\n * - CalendarDateTime: Date and time (no timezone)\n * - ZonedDateTime: Date, time, and timezone\n */\nexport type { TimeValue } from 'react-aria-components';\n\n// ============================================================================\n// Granularity Type\n// ============================================================================\n\n/**\n * Controls which time segments are displayed.\n * - 'hour': Hour only (+ AM/PM in 12-hour mode)\n * - 'minute': Hour + minute (default)\n * - 'second': Hour + minute + second\n *\n * Note: Millisecond granularity is intentionally excluded - no common UI use case.\n */\nexport type TimeGranularity = 'hour' | 'minute' | 'second';\n\n// ============================================================================\n// Size Variant Type\n// ============================================================================\n\n/**\n * Size variants for TimeField component.\n * - 'sm': Compact size (36px height) - AA compliant only, not AAA\n * - 'default': Standard size (44px height) - AAA compliant\n * - 'lg': Large size (56px height) - AAA compliant\n */\nexport type TimeFieldSize = 'sm' | 'default' | 'lg';\n\n// ============================================================================\n// Hour Cycle Type\n// ============================================================================\n\n/**\n * Hour cycle format.\n * - 12: 12-hour format with AM/PM\n * - 24: 24-hour format\n */\nexport type HourCycle = 12 | 24;\n\n// ============================================================================\n// Zod Schemas\n// ============================================================================\n\n/**\n * Zod schema for TimeField props validation.\n * Used for contract tests and developer guardrails, not runtime validation.\n */\nexport const TimeFieldPropsSchema = z.object({\n  // Value props\n  value: z.custom<TimeValue>().optional(),\n  defaultValue: z.custom<TimeValue>().optional(),\n  placeholderValue: z.custom<TimeValue>().optional(),\n\n  // Granularity props\n  granularity: z.enum(['hour', 'minute', 'second']).default('minute'),\n  hourCycle: z.union([z.literal(12), z.literal(24)]).optional(),\n  hideTimeZone: z.boolean().optional(),\n  shouldForceLeadingZeros: z.boolean().optional(),\n\n  // Constraint props\n  minValue: z.custom<TimeValue>().optional(),\n  maxValue: z.custom<TimeValue>().optional(),\n\n  // State props\n  isDisabled: z.boolean().optional(),\n  isReadOnly: z.boolean().optional(),\n  isRequired: z.boolean().optional(),\n  isInvalid: z.boolean().optional(),\n\n  // Validation props\n  /** Custom validation function that returns an error message or null */\n  validate: z.function().optional(),\n  validationBehavior: z.enum(['native', 'aria']).default('native'),\n\n  // Display props\n  label: z.string(),\n  description: z.string().optional(),\n  /** Error message string or render function */\n  errorMessage: z.union([z.string(), z.function()]).optional(),\n\n  // Form props\n  name: z.string().optional(),\n\n  // Variant props\n  size: z.enum(['sm', 'default', 'lg']).default('default'),\n\n  // Event props\n  /** Called when the time value changes */\n  onChange: z.function().optional(),\n  /** Called when the field gains focus */\n  onFocus: z.function().optional(),\n  /** Called when the field loses focus */\n  onBlur: z.function().optional(),\n  /** Called when focus state changes */\n  onFocusChange: z.function().optional(),\n\n  // Standard props\n  className: z.string().optional(),\n  autoFocus: z.boolean().optional(),\n});\n\n// ============================================================================\n// TypeScript Types\n// ============================================================================\n\n/**\n * Custom props added to TimeField (not from React Aria).\n */\nexport interface ThemisTimeFieldCustomProps {\n  /** Size variant: 'sm', 'default', or 'lg' */\n  size?: TimeFieldSize;\n  /** Field label */\n  label?: string;\n  /** Description text below the field */\n  description?: string;\n  /** Error message when field is invalid */\n  errorMessage?: string;\n}\n\n/**\n * Props for the TimeField component.\n * Uses React Aria's TimeFieldProps directly to ensure correct function types.\n */\nexport type TimeFieldProps = AriaTimeFieldProps<TimeValue> &\n  ThemisTimeFieldCustomProps;\n\n// ============================================================================\n// CVA Variants\n// ============================================================================\n\n/**\n * Variants for the TimeField input container.\n * Applies to the DateInput element wrapping time segments.\n *\n * Size notes:\n * - sm (36px): Desktop-only, AA compliant only (not AAA touch target)\n * - default (44px): AAA compliant, recommended for most use cases\n * - lg (56px): AAA compliant, enhanced touch targets\n */\nexport const timeFieldVariants = cva(\n  [\n    // Base styles\n    'inline-flex items-center rounded-md border',\n    'bg-[var(--content-background)] text-[var(--content-foreground)]',\n    'transition-colors duration-200',\n    // Focus within\n    'focus-within:ring-2 focus-within:ring-[var(--ring)] focus-within:ring-offset-2',\n    // Disabled\n    'data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50',\n  ],\n  {\n    variants: {\n      size: {\n        sm: 'h-9 px-3 text-sm gap-0.5', // 36px - AA only\n        default: 'h-11 px-4 text-base gap-1', // 44px - AAA\n        lg: 'h-14 px-5 text-lg gap-1.5', // 56px - AAA\n      },\n      isInvalid: {\n        true: 'border-[var(--destructive-background)] focus-within:ring-[var(--destructive-background)]',\n        false: 'border-[var(--input-border)] hover:border-[var(--input-border)]/80',\n      },\n    },\n    defaultVariants: {\n      size: 'default',\n      isInvalid: false,\n    },\n  }\n);\n\n/**\n * Variants for individual time segment elements.\n * Each segment (hour, minute, second, dayPeriod) uses these styles.\n */\nexport const timeSegmentVariants = cva(\n  [\n    // Base styles\n    'tabular-nums rounded px-0.5',\n    // Focus\n    'focus:outline-none focus:bg-[var(--accent)] focus:text-[var(--accent-foreground)]',\n    // Placeholder\n    'data-[placeholder]:text-[var(--menu-muted)]',\n    // Literal segments (colons, spaces)\n    'data-[type=literal]:text-[var(--menu-muted)]',\n    // Disabled\n    'data-[disabled]:opacity-50',\n  ],\n  {\n    variants: {\n      size: {\n        sm: 'text-sm min-w-[1.5ch]',\n        default: 'text-base min-w-[2ch]',\n        lg: 'text-lg min-w-[2ch]',\n      },\n    },\n    defaultVariants: {\n      size: 'default',\n    },\n  }\n);\n\n/**\n * Variants for the TimeField label.\n */\nexport const timeFieldLabelVariants = cva(\n  [\n    'block font-medium text-[var(--content-foreground)]',\n    'mb-1.5',\n    // Required indicator\n    'data-[required]:after:content-[\"*\"] data-[required]:after:ml-0.5',\n    'data-[required]:after:text-[var(--destructive-background)]',\n  ],\n  {\n    variants: {\n      size: {\n        sm: 'text-sm',\n        default: 'text-sm',\n        lg: 'text-base',\n      },\n    },\n    defaultVariants: {\n      size: 'default',\n    },\n  }\n);\n\n/**\n * Variants for the description text below the field.\n */\nexport const timeFieldDescriptionVariants = cva(\n  [\n    'text-[var(--menu-muted)]',\n    'mt-1',\n  ],\n  {\n    variants: {\n      size: {\n        sm: 'text-xs',\n        default: 'text-sm',\n        lg: 'text-base',\n      },\n    },\n    defaultVariants: {\n      size: 'default',\n    },\n  }\n);\n\n/**\n * Variants for the error message display.\n */\nexport const timeFieldErrorVariants = cva(\n  [\n    'flex items-center gap-1',\n    'text-[var(--destructive-background)]',\n    'mt-1',\n  ],\n  {\n    variants: {\n      size: {\n        sm: 'text-xs',\n        default: 'text-sm',\n        lg: 'text-base',\n      },\n    },\n    defaultVariants: {\n      size: 'default',\n    },\n  }\n);\n\n// ============================================================================\n// Variant Types (from CVA)\n// ============================================================================\n\n/**\n * Variant props for timeFieldVariants CVA function.\n */\nexport type TimeFieldVariantProps = VariantProps<typeof timeFieldVariants>;\n\n/**\n * Variant props for timeSegmentVariants CVA function.\n */\nexport type TimeSegmentVariantProps = VariantProps<typeof timeSegmentVariants>;\n","'use client';\n\n/**\n * TimeField Component\n *\n * A fully accessible time input component built on React Aria's TimeField primitive.\n * Provides keyboard-editable time segments for entering hours, minutes, and seconds.\n *\n * Features:\n * - WCAG 2.2 AAA compliant (default/lg sizes) / AA compliant (sm size)\n * - Configurable granularity (hour, minute, second)\n * - 12-hour and 24-hour format support\n * - Step increment support\n * - Min/max constraints with validation\n * - Form integration with hidden input\n * - Full keyboard navigation\n * - Screen reader accessible\n *\n * @see {@link ../../docs/prd/timefield-prd.md} for full requirements\n */\n\nimport { forwardRef, type ReactElement } from 'react';\nimport {\n  TimeField as AriaTimeField,\n  DateInput as AriaDateInput,\n  DateSegment as AriaDateSegment,\n  Label as AriaLabel,\n  Text as AriaText,\n  FieldError as AriaFieldError,\n} from 'react-aria-components';\nimport { cn } from '../../utils/cn';\nimport type { TimeFieldProps } from './TimeField.types';\nimport {\n  timeFieldVariants,\n  timeSegmentVariants,\n  timeFieldLabelVariants,\n  timeFieldDescriptionVariants,\n  timeFieldErrorVariants,\n} from './TimeField.types';\n\n// =============================================================================\n// TimeField Component\n// =============================================================================\n\n/**\n * TimeField component for time input with keyboard-editable segments.\n *\n * @example\n * ```tsx\n * import { TimeField, Time } from '@tribepad/themis/elements/TimeField';\n *\n * // Basic usage\n * <TimeField label=\"Meeting Time\" />\n *\n * // With default value\n * <TimeField\n *   label=\"Start Time\"\n *   defaultValue={new Time(14, 30)}\n * />\n *\n * // 12-hour format with step\n * <TimeField\n *   label=\"Appointment\"\n *   hourCycle={12}\n *   step={15}\n * />\n *\n * // With validation\n * <TimeField\n *   label=\"Office Hours\"\n *   minValue={new Time(9, 0)}\n *   maxValue={new Time(17, 0)}\n *   errorMessage=\"Please select a time within office hours\"\n * />\n * ```\n */\nexport const TimeField = forwardRef<HTMLDivElement, TimeFieldProps>(\n  (\n    {\n      // Display props\n      label,\n      description,\n      errorMessage,\n      // Variant props\n      size = 'default',\n      // Standard props\n      className,\n      // All other props go to AriaTimeField\n      ...props\n    },\n    ref\n  ): ReactElement => {\n    return (\n      <AriaTimeField\n        ref={ref}\n        className={cn('group flex flex-col gap-1', className)}\n        {...props}\n      >\n        {/* Label */}\n        {label && (\n          <AriaLabel\n            className={cn(timeFieldLabelVariants({ size }))}\n            data-required={props.isRequired || undefined}\n          >\n            {label}\n          </AriaLabel>\n        )}\n\n        {/* Time Input */}\n        <AriaDateInput\n          className={cn(\n            timeFieldVariants({\n              size,\n              isInvalid: props.isInvalid,\n            }),\n            'w-fit'\n          )}\n        >\n          {(segment) => (\n            <AriaDateSegment\n              segment={segment}\n              className={cn(timeSegmentVariants({ size }))}\n            />\n          )}\n        </AriaDateInput>\n\n        {/* Description */}\n        {description && (\n          <AriaText\n            slot=\"description\"\n            className={cn(timeFieldDescriptionVariants({ size }))}\n          >\n            {description}\n          </AriaText>\n        )}\n\n        {/* Error Message */}\n        <AriaFieldError className={cn(timeFieldErrorVariants({ size }))}>\n          {errorMessage}\n        </AriaFieldError>\n      </AriaTimeField>\n    );\n  }\n);\n\nTimeField.displayName = 'TimeField';\n"]}
+{"version":3,"sources":["../../../src/utils/cn.ts","../../../src/styles/shared-variants.ts","../../../src/elements/TimeField/TimeField.types.ts","../../../src/elements/TimeField/TimeField.tsx"],"names":["cn","inputs","twMerge","clsx","TEXT_SIZE_SMALL_SCALE","FIELD_HEIGHTS","FIELD_INPUT_SIZES","FIELD_TOUCH_TARGET","TimeFieldPropsSchema","z","timeFieldVariants","cva","timeSegmentVariants","timeFieldLabelVariants","timeFieldDescriptionVariants","timeFieldErrorVariants","TimeField","forwardRef","label","description","errorMessage","size","className","props","ref","jsxs","AriaTimeField","jsx","AriaLabel","AriaDateInput","segment","AriaDateSegment","AriaText","AriaFieldError"],"mappings":"kVAcO,SAASA,CAAAA,CAAAA,GAAMC,CAAAA,CAA8B,CAClD,OAAOC,OAAAA,CAAQC,KAAKF,CAAM,CAAC,CAC7B,CCkEO,IAAMG,CAAAA,CAAwB,CACnC,EAAA,CAAI,UACJ,OAAA,CAAS,SAAA,CACT,EAAA,CAAI,WACN,CAAA,CAmCO,IAAMC,CAAAA,CAAgB,CAC3B,GAAI,KAAA,CACJ,OAAA,CAAS,MAAA,CACT,EAAA,CAAI,MACN,CAAA,CAQaC,CAAAA,CAAoB,CAC/B,GAAI,CAAA,EAAGD,CAAAA,CAAc,EAAE,CAAA,aAAA,CAAA,CACvB,QAAS,CAAA,EAAGA,CAAAA,CAAc,OAAO,CAAA,aAAA,CAAA,CACjC,GAAI,CAAA,EAAGA,CAAAA,CAAc,EAAE,CAAA,eAAA,CACzB,CAAA,CASaE,CAAAA,CAAqB,gCAAA,CCrE3B,IAAMC,CAAAA,CAAuBC,EAAE,MAAA,CAAO,CAE3C,KAAA,CAAOA,CAAAA,CAAE,MAAA,EAAkB,CAAE,QAAA,EAAS,CACtC,aAAcA,CAAAA,CAAE,MAAA,EAAkB,CAAE,QAAA,EAAS,CAC7C,gBAAA,CAAkBA,CAAAA,CAAE,MAAA,GAAoB,QAAA,EAAS,CAGjD,WAAA,CAAaA,CAAAA,CAAE,IAAA,CAAK,CAAC,MAAA,CAAQ,QAAA,CAAU,QAAQ,CAAC,CAAA,CAAE,OAAA,CAAQ,QAAQ,CAAA,CAClE,SAAA,CAAWA,CAAAA,CAAE,KAAA,CAAM,CAACA,CAAAA,CAAE,OAAA,CAAQ,EAAE,CAAA,CAAGA,CAAAA,CAAE,OAAA,CAAQ,EAAE,CAAC,CAAC,CAAA,CAAE,QAAA,EAAS,CAC5D,YAAA,CAAcA,EAAE,OAAA,EAAQ,CAAE,QAAA,EAAS,CACnC,wBAAyBA,CAAAA,CAAE,OAAA,EAAQ,CAAE,QAAA,EAAS,CAG9C,QAAA,CAAUA,CAAAA,CAAE,MAAA,GAAoB,QAAA,EAAS,CACzC,QAAA,CAAUA,CAAAA,CAAE,MAAA,EAAkB,CAAE,QAAA,EAAS,CAGzC,WAAYA,CAAAA,CAAE,OAAA,EAAQ,CAAE,QAAA,EAAS,CACjC,UAAA,CAAYA,CAAAA,CAAE,OAAA,GAAU,QAAA,EAAS,CACjC,UAAA,CAAYA,CAAAA,CAAE,OAAA,EAAQ,CAAE,QAAA,EAAS,CACjC,UAAWA,CAAAA,CAAE,OAAA,EAAQ,CAAE,QAAA,EAAS,CAIhC,QAAA,CAAUA,CAAAA,CAAE,QAAA,GAAW,QAAA,EAAS,CAChC,kBAAA,CAAoBA,CAAAA,CAAE,IAAA,CAAK,CAAC,QAAA,CAAU,MAAM,CAAC,CAAA,CAAE,OAAA,CAAQ,QAAQ,CAAA,CAG/D,KAAA,CAAOA,CAAAA,CAAE,MAAA,EAAO,CAChB,YAAaA,CAAAA,CAAE,MAAA,EAAO,CAAE,QAAA,GAExB,YAAA,CAAcA,CAAAA,CAAE,KAAA,CAAM,CAACA,EAAE,MAAA,EAAO,CAAGA,CAAAA,CAAE,QAAA,EAAU,CAAC,CAAA,CAAE,QAAA,GAGlD,IAAA,CAAMA,CAAAA,CAAE,MAAA,EAAO,CAAE,QAAA,EAAS,CAG1B,IAAA,CAAMA,CAAAA,CAAE,KAAK,CAAC,IAAA,CAAM,SAAA,CAAW,IAAI,CAAC,CAAA,CAAE,OAAA,CAAQ,SAAS,EAIvD,QAAA,CAAUA,CAAAA,CAAE,QAAA,EAAS,CAAE,UAAS,CAEhC,OAAA,CAASA,CAAAA,CAAE,QAAA,GAAW,QAAA,EAAS,CAE/B,MAAA,CAAQA,CAAAA,CAAE,QAAA,EAAS,CAAE,QAAA,EAAS,CAE9B,cAAeA,CAAAA,CAAE,QAAA,EAAS,CAAE,QAAA,EAAS,CAGrC,SAAA,CAAWA,CAAAA,CAAE,MAAA,GAAS,QAAA,EAAS,CAC/B,SAAA,CAAWA,CAAAA,CAAE,OAAA,EAAQ,CAAE,QAAA,EACzB,CAAC,CAAA,CAwCYC,CAAAA,CAAoBC,GAAAA,CAC/B,CAEE,6CACA,iEAAA,CACA,gCAAA,CAEA,gFAAA,CAEA,+DACF,EACA,CACE,QAAA,CAAU,CACR,IAAA,CAAM,CACJ,EAAA,CAAI,CAAA,EAAGL,CAAAA,CAAkB,EAAE,CAAA,QAAA,CAAA,CAC3B,OAAA,CAAS,CAAA,EAAGA,CAAAA,CAAkB,OAAO,CAAA,QAAA,CAAA,CACrC,EAAA,CAAI,CAAA,EAAGA,EAAkB,EAAE,CAAA,MAAA,CAC7B,CAAA,CACA,SAAA,CAAW,CACT,IAAA,CAAM,0FAAA,CACN,KAAA,CAAO,oEACT,CACF,CAAA,CACA,eAAA,CAAiB,CACf,IAAA,CAAM,SAAA,CACN,SAAA,CAAW,KACb,CACF,CACF,CAAA,CAMaM,CAAAA,CAAsBD,GAAAA,CACjC,CAEE,6BAAA,CAEA,mFAAA,CAEA,6CAAA,CAEA,+CAEA,4BACF,CAAA,CACA,CACE,QAAA,CAAU,CACR,IAAA,CAAM,CACJ,EAAA,CAAI,GAAGP,CAAAA,CAAsB,EAAE,CAAA,cAAA,CAAA,CAC/B,OAAA,CAAS,CAAA,EAAGA,CAAAA,CAAsB,OAAO,CAAA,YAAA,CAAA,CACzC,GAAI,CAAA,EAAGA,CAAAA,CAAsB,EAAE,CAAA,YAAA,CACjC,CACF,CAAA,CACA,eAAA,CAAiB,CACf,IAAA,CAAM,SACR,CACF,CACF,CAAA,CAKaS,CAAAA,CAAyBF,GAAAA,CACpC,CACE,oDAAA,CACA,QAAA,CAEA,mEACA,4DACF,CAAA,CACA,CACE,QAAA,CAAU,CACR,IAAA,CAAM,CACJ,EAAA,CAAI,UACJ,OAAA,CAAS,SAAA,CACT,EAAA,CAAI,WACN,CACF,CAAA,CACA,eAAA,CAAiB,CACf,KAAM,SACR,CACF,CACF,CAAA,CAKaG,CAAAA,CAA+BH,GAAAA,CAC1C,CACE,0BAAA,CACA,MACF,CAAA,CACA,CACE,QAAA,CAAU,CACR,IAAA,CAAM,CACJ,EAAA,CAAI,SAAA,CACJ,QAAS,SAAA,CACT,EAAA,CAAI,WACN,CACF,CAAA,CACA,eAAA,CAAiB,CACf,IAAA,CAAM,SACR,CACF,CACF,CAAA,CAKaI,CAAAA,CAAyBJ,GAAAA,CACpC,CACE,yBAAA,CACA,sCAAA,CACA,MACF,CAAA,CACA,CACE,QAAA,CAAU,CACR,KAAM,CACJ,EAAA,CAAI,SAAA,CACJ,OAAA,CAAS,UACT,EAAA,CAAI,WACN,CACF,CAAA,CACA,eAAA,CAAiB,CACf,IAAA,CAAM,SACR,CACF,CACF,MC7NaK,CAAAA,CAAYC,UAAAA,CACvB,CACE,CAEE,KAAA,CAAAC,CAAAA,CACA,WAAA,CAAAC,CAAAA,CACA,aAAAC,CAAAA,CAEA,IAAA,CAAAC,CAAAA,CAAO,SAAA,CAEP,SAAA,CAAAC,CAAAA,CAEA,GAAGC,CACL,EACAC,CAAAA,GAGEC,IAAAA,CAACC,SAAAA,CAAA,CACC,GAAA,CAAKF,CAAAA,CACL,SAAA,CAAWxB,CAAAA,CAAG,4BAA6BsB,CAAS,CAAA,CACnD,GAAGC,CAAAA,CAGH,QAAA,CAAA,CAAAL,CAAAA,EACCS,GAAAA,CAACC,KAAAA,CAAA,CACC,SAAA,CAAW5B,CAAAA,CAAGa,CAAAA,CAAuB,CAAE,IAAA,CAAAQ,CAAK,CAAC,CAAC,EAC9C,eAAA,CAAeE,CAAAA,CAAM,UAAA,EAAc,MAAA,CAElC,SAAAL,CAAAA,CACH,CAAA,CAIFS,GAAAA,CAACE,SAAAA,CAAA,CACC,SAAA,CAAW7B,CAAAA,CACTO,CAAAA,CACAG,CAAAA,CAAkB,CAChB,IAAA,CAAAW,CAAAA,CACA,SAAA,CAAWE,EAAM,SACnB,CAAC,CAAA,CACD,OACF,CAAA,CAEC,QAAA,CAACO,CAAAA,EACAH,GAAAA,CAACI,YAAA,CACC,OAAA,CAASD,CAAAA,CACT,SAAA,CAAW9B,CAAAA,CAAGY,CAAAA,CAAoB,CAAE,IAAA,CAAAS,CAAK,CAAC,CAAC,CAAA,CAC7C,CAAA,CAEJ,EAGCF,CAAAA,EACCQ,GAAAA,CAACK,IAAAA,CAAA,CACC,KAAK,aAAA,CACL,SAAA,CAAWhC,CAAAA,CAAGc,CAAAA,CAA6B,CAAE,IAAA,CAAAO,CAAK,CAAC,CAAC,CAAA,CAEnD,QAAA,CAAAF,CAAAA,CACH,CAAA,CAIFQ,GAAAA,CAACM,UAAAA,CAAA,CAAe,SAAA,CAAWjC,EAAGe,CAAAA,CAAuB,CAAE,IAAA,CAAAM,CAAK,CAAC,CAAC,CAAA,CAC3D,QAAA,CAAAD,EACH,CAAA,CAAA,CACF,CAGN,EAEAJ,CAAAA,CAAU,YAAc,WAAA","file":"index.mjs","sourcesContent":["/**\n * Class Name Utility\n * Merges Tailwind CSS classes with conflict resolution\n *\n * Combines clsx for conditional classes and tailwind-merge for deduplication\n *\n * @example\n * cn('px-2 py-1', 'px-4') // => 'py-1 px-4' (px-4 overrides px-2)\n * cn('text-red-500', condition && 'text-blue-500') // => conditional application\n */\n\nimport { clsx, type ClassValue } from 'clsx';\nimport { twMerge } from 'tailwind-merge';\n\nexport function cn(...inputs: ClassValue[]): string {\n  return twMerge(clsx(inputs));\n}\n","/**\n * Shared CVA Variant Utilities\n *\n * Common patterns extracted from component variants for consistency and reduced bundle size.\n * Use these constants in CVA definitions to ensure consistent styling across Themis.\n *\n * @see interaction-states.ts for interaction-specific styles (focus, hover, pressed)\n */\n\n// =============================================================================\n// Focus Ring Patterns\n// =============================================================================\n\n/**\n * Focus-within ring (for container elements with focusable children)\n * Use when the container should show focus when any child is focused\n */\nexport const FOCUS_WITHIN_RING = [\n  'focus-within:outline-none',\n  'focus-within:ring-2',\n  'focus-within:ring-[var(--ring)]',\n  'focus-within:ring-offset-2',\n] as const;\n\n/**\n * Focus-visible ring (for directly focusable elements)\n * Use for buttons, inputs, and other interactive elements\n */\nexport const FOCUS_VISIBLE_RING = [\n  'focus-visible:outline-none',\n  'focus-visible:ring-2',\n  'focus-visible:ring-[var(--ring)]',\n  'focus-visible:ring-offset-2',\n] as const;\n\n/**\n * Standard focus ring (for elements using :focus pseudo-class)\n * Prefer focus-visible when possible for better UX\n */\nexport const FOCUS_RING = [\n  'focus:outline-none',\n  'focus:ring-2',\n  'focus:ring-[var(--ring)]',\n] as const;\n\n/**\n * Focus with background change (for segments, cells, menu items)\n */\nexport const FOCUS_HIGHLIGHT = [\n  'focus:outline-none',\n  'focus:bg-[var(--accent)]',\n  'focus:text-[var(--accent-foreground)]',\n] as const;\n\n// =============================================================================\n// Disabled State Patterns\n// =============================================================================\n\n/**\n * Standard disabled state using disabled attribute\n */\nexport const DISABLED_STANDARD = [\n  'disabled:pointer-events-none',\n  'disabled:opacity-50',\n] as const;\n\n/**\n * Disabled state using data attribute (React Aria pattern)\n */\nexport const DISABLED_DATA_ATTR = [\n  'data-[disabled]:pointer-events-none',\n  'data-[disabled]:opacity-50',\n  'data-[disabled]:cursor-not-allowed',\n] as const;\n\n// =============================================================================\n// Size-Based Text Variants\n// =============================================================================\n\n/**\n * Small text size scale (xs -> sm -> base)\n */\nexport const TEXT_SIZE_SMALL_SCALE = {\n  sm: 'text-xs',\n  default: 'text-sm',\n  lg: 'text-base',\n} as const;\n\n/**\n * Medium text size scale (sm -> base -> lg)\n */\nexport const TEXT_SIZE_MEDIUM_SCALE = {\n  sm: 'text-sm',\n  default: 'text-base',\n  lg: 'text-lg',\n} as const;\n\n// =============================================================================\n// Touch Target Utilities\n// =============================================================================\n\n/**\n * WCAG 2.2 AAA minimum touch target (44x44px)\n */\nexport const TOUCH_TARGET_MIN = [\n  'min-h-[44px]',\n  'min-w-[44px]',\n] as const;\n\n/**\n * Common button/cell sizes with touch target compliance\n */\nexport const INTERACTIVE_SIZES = {\n  sm: 'h-9 w-9',      // 36px - desktop only, NOT AAA compliant\n  default: 'h-11 w-11', // 44px - AAA compliant\n  lg: 'h-14 w-14',    // 56px - AAA compliant, enhanced\n} as const;\n\n/**\n * Height-only sizes for fields and inputs\n */\nexport const FIELD_HEIGHTS = {\n  sm: 'h-9',      // 36px\n  default: 'h-10', // 40px\n  lg: 'h-11',     // 44px\n} as const;\n\n/**\n * Layer 2: Visual sizing for form field inputs (height + padding + font).\n * Use on the <input>, <select>, or trigger element itself.\n *\n * Components may append additional classes (e.g. gap-* for segmented fields, py-* for text inputs).\n */\nexport const FIELD_INPUT_SIZES = {\n  sm: `${FIELD_HEIGHTS.sm} px-2 text-xs`,\n  default: `${FIELD_HEIGHTS.default} px-3 text-sm`,\n  lg: `${FIELD_HEIGHTS.lg} px-4 text-base`,\n} as const;\n\n/**\n * Layer 1: Invisible touch target wrapper for form fields.\n * Apply to a <label> (or wrapper div) around the input element.\n * The <label> natively routes clicks/taps to the contained input\n * without JavaScript — achieving a 44px touch target while the\n * input stays at its visual height (h-9/h-10/h-11).\n */\nexport const FIELD_TOUCH_TARGET = 'min-h-[44px] flex items-center' as const;\n\n// =============================================================================\n// Message/Feedback Patterns\n// =============================================================================\n\n/**\n * Error message styling\n */\nexport const ERROR_MESSAGE_BASE = [\n  'flex',\n  'items-center',\n  'gap-1.5',\n  'text-[var(--destructive-background)]',\n] as const;\n\n/**\n * Success message styling\n */\nexport const SUCCESS_MESSAGE_BASE = [\n  'flex',\n  'items-center',\n  'gap-1.5',\n  'text-[var(--success-background)]',\n] as const;\n\n/**\n * Description/helper text styling\n */\nexport const DESCRIPTION_BASE = [\n  'text-[var(--menu-muted)]',\n] as const;\n\n/**\n * Label base styling\n */\nexport const LABEL_BASE = [\n  'font-medium',\n  'text-[var(--content-foreground)]',\n] as const;\n\n/**\n * Required indicator pattern\n */\nexport const REQUIRED_INDICATOR = \"after:content-['*'] after:ml-0.5 after:text-[var(--destructive-background)]\";\n\n// =============================================================================\n// Animation Patterns\n// =============================================================================\n\n/**\n * Popover/dropdown entry animation\n */\nexport const POPOVER_ANIMATION_IN = [\n  'data-[entering]:animate-in',\n  'data-[entering]:fade-in-0',\n  'data-[entering]:zoom-in-95',\n] as const;\n\n/**\n * Popover/dropdown exit animation\n */\nexport const POPOVER_ANIMATION_OUT = [\n  'data-[exiting]:animate-out',\n  'data-[exiting]:fade-out-0',\n  'data-[exiting]:zoom-out-95',\n] as const;\n\n/**\n * Modal content enter animation (fade + zoom)\n * Uses React Aria data-[entering]/data-[exiting] attributes\n */\nexport const MODAL_ANIMATION_IN = [\n  'data-[entering]:animate-in',\n  'data-[entering]:fade-in-0',\n  'data-[entering]:zoom-in-95',\n  'data-[entering]:duration-200',\n  'data-[entering]:ease-out',\n] as const;\n\n/**\n * Modal content exit animation (fade + zoom)\n * Uses React Aria data-[entering]/data-[exiting] attributes\n */\nexport const MODAL_ANIMATION_OUT = [\n  'data-[exiting]:animate-out',\n  'data-[exiting]:fade-out-0',\n  'data-[exiting]:zoom-out-95',\n  'data-[exiting]:duration-150',\n  'data-[exiting]:ease-in',\n] as const;\n\n/**\n * Modal slide enter animation (fade + slide up)\n */\nexport const MODAL_SLIDE_IN = [\n  'data-[entering]:animate-in',\n  'data-[entering]:fade-in-0',\n  'data-[entering]:slide-in-from-bottom-4',\n  'data-[entering]:duration-200',\n  'data-[entering]:ease-out',\n] as const;\n\n/**\n * Modal slide exit animation (fade + slide down)\n */\nexport const MODAL_SLIDE_OUT = [\n  'data-[exiting]:animate-out',\n  'data-[exiting]:fade-out-0',\n  'data-[exiting]:slide-out-to-bottom-4',\n  'data-[exiting]:duration-150',\n  'data-[exiting]:ease-in',\n] as const;\n\n/**\n * Modal overlay enter/exit animation (fade only)\n */\nexport const MODAL_OVERLAY_IN = [\n  'data-[entering]:animate-in',\n  'data-[entering]:fade-in-0',\n  'data-[entering]:duration-200',\n] as const;\n\nexport const MODAL_OVERLAY_OUT = [\n  'data-[exiting]:animate-out',\n  'data-[exiting]:fade-out-0',\n  'data-[exiting]:duration-150',\n] as const;\n\n/**\n * Reduced motion support (WCAG 2.2)\n */\nexport const REDUCED_MOTION = [\n  'motion-reduce:transition-none',\n  'motion-reduce:animate-none',\n] as const;\n\n/**\n * Standard transition for colors\n */\nexport const TRANSITION_COLORS = [\n  'transition-colors',\n  'duration-200',\n] as const;\n\n/**\n * Fast transition for interactions\n */\nexport const TRANSITION_FAST = [\n  'transition-colors',\n  'duration-150',\n] as const;\n\n// =============================================================================\n// Hover State Patterns\n// =============================================================================\n\n/**\n * Accent background on hover (for interactive items)\n */\nexport const HOVER_ACCENT = [\n  'hover:bg-[var(--accent)]',\n  'hover:text-[var(--accent-foreground)]',\n] as const;\n\n// =============================================================================\n// Helper Functions\n// =============================================================================\n\n/**\n * Combines multiple style arrays into a flat array for CVA base styles\n */\nexport function combineStyles(...styles: (readonly string[] | string)[]): string[] {\n  return styles.flatMap(s => Array.isArray(s) ? [...s] : [s]);\n}\n","/**\n * TimeField Component Types\n *\n * Zod schemas and TypeScript types for the TimeField component.\n * Includes CVA variant definitions for styling.\n *\n * Note: Zod schemas are used for contract tests and developer guardrails,\n * not runtime validation. This follows the established Themis pattern.\n *\n * @see {@link ../../docs/prd/timefield-prd.md} for full requirements\n */\n\nimport { z } from 'zod';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { FIELD_INPUT_SIZES, TEXT_SIZE_SMALL_SCALE } from '../../styles';\nimport type {\n  TimeFieldProps as AriaTimeFieldProps,\n  TimeValue,\n} from 'react-aria-components';\n\n// ============================================================================\n// Time Value Types (re-exported for convenience)\n// ============================================================================\n\n/**\n * Union type for all time values supported by the TimeField.\n * - Time: Time only (no date, no timezone)\n * - CalendarDateTime: Date and time (no timezone)\n * - ZonedDateTime: Date, time, and timezone\n */\nexport type { TimeValue } from 'react-aria-components';\n\n// ============================================================================\n// Granularity Type\n// ============================================================================\n\n/**\n * Controls which time segments are displayed.\n * - 'hour': Hour only (+ AM/PM in 12-hour mode)\n * - 'minute': Hour + minute (default)\n * - 'second': Hour + minute + second\n *\n * Note: Millisecond granularity is intentionally excluded - no common UI use case.\n */\nexport type TimeGranularity = 'hour' | 'minute' | 'second';\n\n// ============================================================================\n// Size Variant Type\n// ============================================================================\n\n/**\n * Size variants for TimeField component.\n * - 'sm': Compact size (36px height) - AA compliant only, not AAA\n * - 'default': Standard size (44px height) - AAA compliant\n * - 'lg': Large size (56px height) - AAA compliant\n */\nexport type TimeFieldSize = 'sm' | 'default' | 'lg';\n\n// ============================================================================\n// Hour Cycle Type\n// ============================================================================\n\n/**\n * Hour cycle format.\n * - 12: 12-hour format with AM/PM\n * - 24: 24-hour format\n */\nexport type HourCycle = 12 | 24;\n\n// ============================================================================\n// Zod Schemas\n// ============================================================================\n\n/**\n * Zod schema for TimeField props validation.\n * Used for contract tests and developer guardrails, not runtime validation.\n */\nexport const TimeFieldPropsSchema = z.object({\n  // Value props\n  value: z.custom<TimeValue>().optional(),\n  defaultValue: z.custom<TimeValue>().optional(),\n  placeholderValue: z.custom<TimeValue>().optional(),\n\n  // Granularity props\n  granularity: z.enum(['hour', 'minute', 'second']).default('minute'),\n  hourCycle: z.union([z.literal(12), z.literal(24)]).optional(),\n  hideTimeZone: z.boolean().optional(),\n  shouldForceLeadingZeros: z.boolean().optional(),\n\n  // Constraint props\n  minValue: z.custom<TimeValue>().optional(),\n  maxValue: z.custom<TimeValue>().optional(),\n\n  // State props\n  isDisabled: z.boolean().optional(),\n  isReadOnly: z.boolean().optional(),\n  isRequired: z.boolean().optional(),\n  isInvalid: z.boolean().optional(),\n\n  // Validation props\n  /** Custom validation function that returns an error message or null */\n  validate: z.function().optional(),\n  validationBehavior: z.enum(['native', 'aria']).default('native'),\n\n  // Display props\n  label: z.string(),\n  description: z.string().optional(),\n  /** Error message string or render function */\n  errorMessage: z.union([z.string(), z.function()]).optional(),\n\n  // Form props\n  name: z.string().optional(),\n\n  // Variant props\n  size: z.enum(['sm', 'default', 'lg']).default('default'),\n\n  // Event props\n  /** Called when the time value changes */\n  onChange: z.function().optional(),\n  /** Called when the field gains focus */\n  onFocus: z.function().optional(),\n  /** Called when the field loses focus */\n  onBlur: z.function().optional(),\n  /** Called when focus state changes */\n  onFocusChange: z.function().optional(),\n\n  // Standard props\n  className: z.string().optional(),\n  autoFocus: z.boolean().optional(),\n});\n\n// ============================================================================\n// TypeScript Types\n// ============================================================================\n\n/**\n * Custom props added to TimeField (not from React Aria).\n */\nexport interface ThemisTimeFieldCustomProps {\n  /** Size variant: 'sm', 'default', or 'lg' */\n  size?: TimeFieldSize;\n  /** Field label */\n  label?: string;\n  /** Description text below the field */\n  description?: string;\n  /** Error message when field is invalid */\n  errorMessage?: string;\n}\n\n/**\n * Props for the TimeField component.\n * Uses React Aria's TimeFieldProps directly to ensure correct function types.\n */\nexport type TimeFieldProps = AriaTimeFieldProps<TimeValue> &\n  ThemisTimeFieldCustomProps;\n\n// ============================================================================\n// CVA Variants\n// ============================================================================\n\n/**\n * Variants for the TimeField input container.\n * Applies to the DateInput element wrapping time segments.\n *\n * Size notes:\n * - sm (36px): Desktop-only, AA compliant only (not AAA touch target)\n * - default (44px): AAA compliant, recommended for most use cases\n * - lg (56px): AAA compliant, enhanced touch targets\n */\nexport const timeFieldVariants = cva(\n  [\n    // Base styles\n    'inline-flex items-center rounded-md border',\n    'bg-[var(--content-background)] text-[var(--content-foreground)]',\n    'transition-colors duration-200',\n    // Focus within\n    'focus-within:ring-2 focus-within:ring-[var(--ring)] focus-within:ring-offset-2',\n    // Disabled\n    'data-[disabled]:cursor-not-allowed data-[disabled]:opacity-50',\n  ],\n  {\n    variants: {\n      size: {\n        sm: `${FIELD_INPUT_SIZES.sm} gap-0.5`,\n        default: `${FIELD_INPUT_SIZES.default} gap-0.5`,\n        lg: `${FIELD_INPUT_SIZES.lg} gap-1`,\n      },\n      isInvalid: {\n        true: 'border-[var(--destructive-background)] focus-within:ring-[var(--destructive-background)]',\n        false: 'border-[var(--input-border)] hover:border-[var(--input-border)]/80',\n      },\n    },\n    defaultVariants: {\n      size: 'default',\n      isInvalid: false,\n    },\n  }\n);\n\n/**\n * Variants for individual time segment elements.\n * Each segment (hour, minute, second, dayPeriod) uses these styles.\n */\nexport const timeSegmentVariants = cva(\n  [\n    // Base styles\n    'tabular-nums rounded px-0.5',\n    // Focus\n    'focus:outline-none focus:bg-[var(--accent)] focus:text-[var(--accent-foreground)]',\n    // Placeholder\n    'data-[placeholder]:text-[var(--menu-muted)]',\n    // Literal segments (colons, spaces)\n    'data-[type=literal]:text-[var(--menu-muted)]',\n    // Disabled\n    'data-[disabled]:opacity-50',\n  ],\n  {\n    variants: {\n      size: {\n        sm: `${TEXT_SIZE_SMALL_SCALE.sm} min-w-[1.5ch]`,\n        default: `${TEXT_SIZE_SMALL_SCALE.default} min-w-[2ch]`,\n        lg: `${TEXT_SIZE_SMALL_SCALE.lg} min-w-[2ch]`,\n      },\n    },\n    defaultVariants: {\n      size: 'default',\n    },\n  }\n);\n\n/**\n * Variants for the TimeField label.\n */\nexport const timeFieldLabelVariants = cva(\n  [\n    'block font-medium text-[var(--content-foreground)]',\n    'mb-1.5',\n    // Required indicator\n    'data-[required]:after:content-[\"*\"] data-[required]:after:ml-0.5',\n    'data-[required]:after:text-[var(--destructive-background)]',\n  ],\n  {\n    variants: {\n      size: {\n        sm: 'text-sm',\n        default: 'text-sm',\n        lg: 'text-base',\n      },\n    },\n    defaultVariants: {\n      size: 'default',\n    },\n  }\n);\n\n/**\n * Variants for the description text below the field.\n */\nexport const timeFieldDescriptionVariants = cva(\n  [\n    'text-[var(--menu-muted)]',\n    'mt-1',\n  ],\n  {\n    variants: {\n      size: {\n        sm: 'text-xs',\n        default: 'text-sm',\n        lg: 'text-base',\n      },\n    },\n    defaultVariants: {\n      size: 'default',\n    },\n  }\n);\n\n/**\n * Variants for the error message display.\n */\nexport const timeFieldErrorVariants = cva(\n  [\n    'flex items-center gap-1',\n    'text-[var(--destructive-background)]',\n    'mt-1',\n  ],\n  {\n    variants: {\n      size: {\n        sm: 'text-xs',\n        default: 'text-sm',\n        lg: 'text-base',\n      },\n    },\n    defaultVariants: {\n      size: 'default',\n    },\n  }\n);\n\n// ============================================================================\n// Variant Types (from CVA)\n// ============================================================================\n\n/**\n * Variant props for timeFieldVariants CVA function.\n */\nexport type TimeFieldVariantProps = VariantProps<typeof timeFieldVariants>;\n\n/**\n * Variant props for timeSegmentVariants CVA function.\n */\nexport type TimeSegmentVariantProps = VariantProps<typeof timeSegmentVariants>;\n","'use client';\n\n/**\n * TimeField Component\n *\n * A fully accessible time input component built on React Aria's TimeField primitive.\n * Provides keyboard-editable time segments for entering hours, minutes, and seconds.\n *\n * Features:\n * - WCAG 2.2 AAA compliant (default/lg sizes) / AA compliant (sm size)\n * - Configurable granularity (hour, minute, second)\n * - 12-hour and 24-hour format support\n * - Step increment support\n * - Min/max constraints with validation\n * - Form integration with hidden input\n * - Full keyboard navigation\n * - Screen reader accessible\n *\n * @see {@link ../../docs/prd/timefield-prd.md} for full requirements\n */\n\nimport { forwardRef, type ReactElement } from 'react';\nimport {\n  TimeField as AriaTimeField,\n  DateInput as AriaDateInput,\n  DateSegment as AriaDateSegment,\n  Label as AriaLabel,\n  Text as AriaText,\n  FieldError as AriaFieldError,\n} from 'react-aria-components';\nimport { cn } from '../../utils/cn';\nimport { FIELD_TOUCH_TARGET } from '../../styles';\nimport type { TimeFieldProps } from './TimeField.types';\nimport {\n  timeFieldVariants,\n  timeSegmentVariants,\n  timeFieldLabelVariants,\n  timeFieldDescriptionVariants,\n  timeFieldErrorVariants,\n} from './TimeField.types';\n\n// =============================================================================\n// TimeField Component\n// =============================================================================\n\n/**\n * TimeField component for time input with keyboard-editable segments.\n *\n * @example\n * ```tsx\n * import { TimeField, Time } from '@tribepad/themis/elements/TimeField';\n *\n * // Basic usage\n * <TimeField label=\"Meeting Time\" />\n *\n * // With default value\n * <TimeField\n *   label=\"Start Time\"\n *   defaultValue={new Time(14, 30)}\n * />\n *\n * // 12-hour format with step\n * <TimeField\n *   label=\"Appointment\"\n *   hourCycle={12}\n *   step={15}\n * />\n *\n * // With validation\n * <TimeField\n *   label=\"Office Hours\"\n *   minValue={new Time(9, 0)}\n *   maxValue={new Time(17, 0)}\n *   errorMessage=\"Please select a time within office hours\"\n * />\n * ```\n */\nexport const TimeField = forwardRef<HTMLDivElement, TimeFieldProps>(\n  (\n    {\n      // Display props\n      label,\n      description,\n      errorMessage,\n      // Variant props\n      size = 'default',\n      // Standard props\n      className,\n      // All other props go to AriaTimeField\n      ...props\n    },\n    ref\n  ): ReactElement => {\n    return (\n      <AriaTimeField\n        ref={ref}\n        className={cn('group flex flex-col gap-1', className)}\n        {...props}\n      >\n        {/* Label */}\n        {label && (\n          <AriaLabel\n            className={cn(timeFieldLabelVariants({ size }))}\n            data-required={props.isRequired || undefined}\n          >\n            {label}\n          </AriaLabel>\n        )}\n\n        {/* Time Input */}\n        <AriaDateInput\n          className={cn(\n            FIELD_TOUCH_TARGET,\n            timeFieldVariants({\n              size,\n              isInvalid: props.isInvalid,\n            }),\n            'w-fit'\n          )}\n        >\n          {(segment) => (\n            <AriaDateSegment\n              segment={segment}\n              className={cn(timeSegmentVariants({ size }))}\n            />\n          )}\n        </AriaDateInput>\n\n        {/* Description */}\n        {description && (\n          <AriaText\n            slot=\"description\"\n            className={cn(timeFieldDescriptionVariants({ size }))}\n          >\n            {description}\n          </AriaText>\n        )}\n\n        {/* Error Message */}\n        <AriaFieldError className={cn(timeFieldErrorVariants({ size }))}>\n          {errorMessage}\n        </AriaFieldError>\n      </AriaTimeField>\n    );\n  }\n);\n\nTimeField.displayName = 'TimeField';\n"]}

package/dist/elements/Toast/Toast.d.ts

@@ -1,12 +1,12 @@
 import { ToastQueue, type QueuedToast, type ToastState as AriaToastState } from 'react-stately';
 import { type VariantProps } from 'class-variance-authority';
-import type { ToastContent, ToastState, ToastConfig } from './Toast.types';
+import type { ToastContent, ToastState, ToastConfig, ToastConvenienceOptions } from './Toast.types';
 /**
- * Toast container variants with theme-aligned styling
- * Fixed 356px width for consistent appearance across all toasts
+ * Toast container variants with goey-inspired blob styling
+ * Uses asymmetric border-radius for organic shape and scale animations
  */
 export declare const toastVariants: (props?: ({
-    variant?: "default" | "primary" | "accent" | "destructive" | null | undefined;
+    variant?: "success" | "default" | "primary" | "accent" | "destructive" | "warning" | "info" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
 /**
  * Toaster position variants for the toast region container
@@ -14,68 +14,46 @@ export declare const toastVariants: (props?: ({
 export declare const toasterVariants: (props?: ({
     position?: "top-right" | "top-left" | "bottom-right" | "bottom-left" | "top-center" | "bottom-center" | null | undefined;
 } & import("class-variance-authority/types").ClassProp) | undefined) => string;
-/**
- * Get the total number of active toasts (visible + queued)
- */
 export declare function getTotalActiveToasts(): number;
-/**
- * Subscribe to total toast count changes
- */
 export declare function subscribeToTotalCount(fn: () => void): () => void;
-/**
- * Enhanced toast queue API with additional methods
- * Provides closeAll, pauseAll, resumeAll on top of base ToastQueue
- */
 export declare const toastQueue: {
-    /**
-     * Add a toast to the queue
-     */
     add: (content: ToastState, options?: {
         timeout?: number;
         onClose?: () => void;
     }) => string;
-    /**
-     * Close a specific toast by key
-     */
     close: (key: string) => void;
-    /**
-     * Close all toasts (visible and queued)
-     */
     closeAll: () => void;
-    /**
-     * Pause all toast timers
-     */
     pauseAll: () => void;
-    /**
-     * Resume all toast timers
-     */
     resumeAll: () => void;
-    /**
-     * Get the visible toasts
-     */
     readonly visibleToasts: QueuedToast<ToastState>[];
-    /**
-     * Subscribe to queue changes
-     */
     subscribe: (fn: () => void) => () => void;
-    /**
-     * Get total active toasts (visible + queued)
-     */
     readonly totalCount: number;
 };
+export declare function getInternalQueue(): ToastQueue<ToastState>;
 /**
- * Get the internal queue for use in components
+ * Add a toast notification programmatically
+ *
+ * @example
+ * ```tsx
+ * toast("Message saved!");
+ * toast("Error occurred", { variant: "destructive" });
+ * toast.success("Saved!", { description: "Your changes were saved." });
+ * toast.error("Failed", { title: "Upload Error" });
+ * ```
  */
-export declare function getInternalQueue(): ToastQueue<ToastState>;
 export declare function toast(content: ToastContent, options?: ToastConfig): string;
+export declare namespace toast {
+    var success: (content: ToastContent, options?: ToastConvenienceOptions) => string;
+    var error: (content: ToastContent, options?: ToastConvenienceOptions) => string;
+    var warning: (content: ToastContent, options?: ToastConvenienceOptions) => string;
+    var info: (content: ToastContent, options?: ToastConvenienceOptions) => string;
+}
 export interface ToastItemProps {
-    /** Toast from the queue */
     toast: QueuedToast<ToastState>;
-    /** Toast state for managing dismissal */
     state: AriaToastState<ToastState>;
 }
 /**
- * Individual toast notification component
+ * Individual toast notification component with goey-inspired morphing design
  * Uses React Aria useToast hook for accessibility
  */
 export declare const ToastItem: import("react").NamedExoticComponent<ToastItemProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/elements/Toast/Toast.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Toast.d.ts","sourceRoot":"","sources":["../../../src/elements/Toast/Toast.tsx"],"names":[],"mappings":"AAoBA,OAAO,EAAE,UAAU,EAAE,KAAK,WAAW,EAAE,KAAK,UAAU,IAAI,cAAc,EAAE,MAAM,eAAe,CAAC;AAChG,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAIlE,OAAO,KAAK,EAEV,YAAY,EACZ,UAAU,EAEV,WAAW,EACZ,MAAM,eAAe,CAAC;AAMvB;;;GAGG;AACH,eAAO,MAAM,aAAa;;8EA2CzB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,eAAe;;8EAqB3B,CAAC;AA2EF;;GAEG;AACH,wBAAgB,oBAAoB,IAAI,MAAM,CAE7C;AAED;;GAEG;AACH,wBAAgB,qBAAqB,CAAC,EAAE,EAAE,MAAM,IAAI,GAAG,MAAM,IAAI,CAGhE;AAED;;;GAGG;AACH,eAAO,MAAM,UAAU;IACrB;;OAEG;mBACY,UAAU,YAAY;QAAE,OAAO,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;KAAE;IAG/E;;OAEG;iBACU,MAAM;IAInB;;OAEG;;IAQH;;OAEG;;IAKH;;OAEG;;IAKH;;OAEG;;IAKH;;OAEG;oBACa,MAAM,IAAI;IAE1B;;OAEG;;CAIJ,CAAC;AAEF;;GAEG;AACH,wBAAgB,gBAAgB,IAAI,UAAU,CAAC,UAAU,CAAC,CAEzD;AAiDD,wBAAgB,KAAK,CAAC,OAAO,EAAE,YAAY,EAAE,OAAO,CAAC,EAAE,WAAW,GAAG,MAAM,CAoC1E;AAMD,MAAM,WAAW,cAAc;IAC7B,2BAA2B;IAC3B,KAAK,EAAE,WAAW,CAAC,UAAU,CAAC,CAAC;IAC/B,yCAAyC;IACzC,KAAK,EAAE,cAAc,CAAC,UAAU,CAAC,CAAC;CACnC;AAED;;;GAGG;AACH,eAAO,MAAM,SAAS,sGA4FrB,CAAC;AAQF,YAAY,EAAE,YAAY,EAAE,CAAC"}
+{"version":3,"file":"Toast.d.ts","sourceRoot":"","sources":["../../../src/elements/Toast/Toast.tsx"],"names":[],"mappings":"AAqBA,OAAO,EAAE,UAAU,EAAE,KAAK,WAAW,EAAE,KAAK,UAAU,IAAI,cAAc,EAAE,MAAM,eAAe,CAAC;AAChG,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAIlE,OAAO,KAAK,EAEV,YAAY,EACZ,UAAU,EAEV,WAAW,EACX,uBAAuB,EACxB,MAAM,eAAe,CAAC;AAMvB;;;GAGG;AACH,eAAO,MAAM,aAAa;;8EAiEzB,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,eAAe;;8EAqB3B,CAAC;AA8HF,wBAAgB,oBAAoB,IAAI,MAAM,CAE7C;AAED,wBAAgB,qBAAqB,CAAC,EAAE,EAAE,MAAM,IAAI,GAAG,MAAM,IAAI,CAGhE;AAED,eAAO,MAAM,UAAU;mBACN,UAAU,YAAY;QAAE,OAAO,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;KAAE;iBAGlE,MAAM;;;;;oBAsBH,MAAM,IAAI;;CAK3B,CAAC;AAEF,wBAAgB,gBAAgB,IAAI,UAAU,CAAC,UAAU,CAAC,CAEzD;AA+BD;;;;;;;;;;GAUG;AACH,wBAAgB,KAAK,CAAC,OAAO,EAAE,YAAY,EAAE,OAAO,CAAC,EAAE,WAAW,GAAG,MAAM,CA+B1E;yBA/Be,KAAK;2BAoCK,YAAY,YAAY,uBAAuB,KAAG,MAAM;yBAG1D,YAAY,YAAY,uBAAuB,KAAG,MAAM;2BAGtD,YAAY,YAAY,uBAAuB,KAAG,MAAM;wBAG3D,YAAY,YAAY,uBAAuB,KAAG,MAAM;;AAO/E,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,WAAW,CAAC,UAAU,CAAC,CAAC;IAC/B,KAAK,EAAE,cAAc,CAAC,UAAU,CAAC,CAAC;CACnC;AAED;;;GAGG;AACH,eAAO,MAAM,SAAS,sGA0IrB,CAAC;AAQF,YAAY,EAAE,YAAY,EAAE,CAAC"}

package/dist/elements/Toast/Toast.types.d.ts

@@ -1,5 +1,5 @@
 import { z } from 'zod';
-import type { ReactNode } from 'react';
+import type { ReactElement, ReactNode } from 'react';
 /**
  * Toast Component Type Definitions
  *
@@ -26,10 +26,13 @@ export type DismissReason = z.infer<typeof DismissReasonSchema>;
  * @see toast-prd.md Variant Token Mapping table
  */
 export declare const ToastVariantSchema: z.ZodEnum<{
+    success: "success";
     default: "default";
     primary: "primary";
     accent: "accent";
     destructive: "destructive";
+    warning: "warning";
+    info: "info";
 }>;
 export type ToastVariant = z.infer<typeof ToastVariantSchema>;
 /**
@@ -59,19 +62,34 @@ export type ToasterPosition = z.infer<typeof ToasterPositionSchema>;
  */
 export declare const ToastOptionsSchema: z.ZodObject<{
     variant: z.ZodDefault<z.ZodEnum<{
+        success: "success";
         default: "default";
         primary: "primary";
         accent: "accent";
         destructive: "destructive";
+        warning: "warning";
+        info: "info";
     }>>;
     timeout: z.ZodDefault<z.ZodNumber>;
     onClose: z.ZodOptional<z.ZodFunction<z.core.$ZodFunctionArgs, z.core.$ZodFunctionOut>>;
+    title: z.ZodOptional<z.ZodString>;
+    description: z.ZodOptional<z.ZodString>;
+    showProgress: z.ZodOptional<z.ZodBoolean>;
 }, z.core.$strip>;
 export interface ToastOptions {
     variant?: ToastVariant;
     timeout?: number;
     onClose?: (key: string, reason: DismissReason) => void;
+    title?: string;
+    description?: string;
+    icon?: ReactElement;
+    showProgress?: boolean;
 }
+/**
+ * Options for convenience methods (toast.success, toast.error, etc.)
+ * Same as ToastOptions but without variant (set by the method)
+ */
+export type ToastConvenienceOptions = Omit<ToastOptions, 'variant'>;
 /**
  * Props for the ToastProvider component
  * Wraps the application to provide toast queue context
@@ -136,6 +154,14 @@ export interface ToastState {
     timeout: number;
     /** Callback fired when toast is dismissed */
     onClose?: (key: string, reason: DismissReason) => void;
+    /** Bold title text */
+    title?: string;
+    /** Secondary description text */
+    description?: string;
+    /** Custom icon override */
+    icon?: ReactElement;
+    /** Show countdown progress bar */
+    showProgress?: boolean;
 }
 /**
  * Toast content type - fully customizable by developer

package/dist/elements/Toast/Toast.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Toast.types.d.ts","sourceRoot":"","sources":["../../../src/elements/Toast/Toast.types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"Toast.types.d.ts","sourceRoot":"","sources":["../../../src/elements/Toast/Toast.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,KAAK,CAAC;AACxB,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAErD;;;;;;GAMG;AAMH;;;;;GAKG;AACH,eAAO,MAAM,mBAAmB;;;;EAA8C,CAAC;AAC/E,MAAM,MAAM,aAAa,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,mBAAmB,CAAC,CAAC;AAEhE;;;;;GAKG;AACH,eAAO,MAAM,kBAAkB;;;;;;;;EAQ7B,CAAC;AACH,MAAM,MAAM,YAAY,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,kBAAkB,CAAC,CAAC;AAE9D;;;GAGG;AACH,eAAO,MAAM,qBAAqB;;;;;;;EAOhC,CAAC;AACH,MAAM,MAAM,eAAe,GAAG,CAAC,CAAC,KAAK,CAAC,OAAO,qBAAqB,CAAC,CAAC;AAMpE;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,kBAAkB;;;;;;;;;;;;;;;iBAuC7B,CAAC;AAEH,MAAM,WAAW,YAAY;IAC3B,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,MAAM,EAAE,aAAa,KAAK,IAAI,CAAC;IACvD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAED;;;GAGG;AACH,MAAM,MAAM,uBAAuB,GAAG,IAAI,CAAC,YAAY,EAAE,SAAS,CAAC,CAAC;AAMpE;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,wBAAwB;;iBAOnC,CAAC;AAEH,MAAM,WAAW,kBAAkB;IACjC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,QAAQ,EAAE,SAAS,CAAC;CACrB;AAMD;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,kBAAkB;;;;;;;;;;;iBAkB7B,CAAC;AAEH,MAAM,WAAW,YAAY;IAC3B,QAAQ,CAAC,EAAE,eAAe,CAAC;IAC3B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAMD;;;GAGG;AACH,MAAM,WAAW,UAAU;IACzB,sCAAsC;IACtC,GAAG,EAAE,MAAM,CAAC;IAEZ,+DAA+D;IAC/D,OAAO,EAAE,SAAS,CAAC;IAEnB,iCAAiC;IACjC,OAAO,EAAE,YAAY,CAAC;IAEtB,4DAA4D;IAC5D,OAAO,EAAE,MAAM,CAAC;IAEhB,6CAA6C;IAC7C,OAAO,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,MAAM,EAAE,aAAa,KAAK,IAAI,CAAC;IAEvD,sBAAsB;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,iCAAiC;IACjC,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,2BAA2B;IAC3B,IAAI,CAAC,EAAE,YAAY,CAAC;IAEpB,kCAAkC;IAClC,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAED;;;GAGG;AACH,MAAM,MAAM,YAAY,GAAG,SAAS,CAAC;AAErC;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B,iCAAiC;IACjC,KAAK,EAAE;QACL,GAAG,EAAE,MAAM,CAAC;QACZ,OAAO,EAAE,UAAU,CAAC;QACpB,SAAS,EAAE,UAAU,GAAG,QAAQ,GAAG,SAAS,CAAC;QAC7C,QAAQ,EAAE,MAAM,CAAC;KAClB,CAAC;IAEF,+CAA+C;IAC/C,KAAK,EAAE;QACL,KAAK,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;KAC9B,CAAC;CACH;AAMD;;;GAGG;AACH,MAAM,WAAW,aAAa;IAC5B;;;;;OAKG;IACH,GAAG,EAAE,CAAC,OAAO,EAAE,YAAY,EAAE,OAAO,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,KAAK,MAAM,CAAC;IAExE;;;OAGG;IACH,KAAK,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAC;IAE7B;;OAEG;IACH,QAAQ,EAAE,MAAM,IAAI,CAAC;IAErB;;;OAGG;IACH,QAAQ,EAAE,MAAM,IAAI,CAAC;IAErB;;OAEG;IACH,SAAS,EAAE,MAAM,IAAI,CAAC;CACvB;AAMD;;;GAGG;AACH,MAAM,MAAM,WAAW,GAAG,OAAO,CAAC,YAAY,CAAC,CAAC;AAEhD;;GAEG;AACH,MAAM,MAAM,QAAQ,GAAG,MAAM,CAAC"}

package/dist/elements/Toast/Toaster.d.ts

@@ -1,15 +1,3 @@
 import type { ToasterProps } from './Toast.types';
-/**
- * Toaster - Toast region container
- * Renders the toast notification area with proper ARIA attributes
- *
- * @example
- * ```tsx
- * <ToastProvider>
- *   <App />
- *   <Toaster position="bottom-right" aria-label="Notifications" />
- * </ToastProvider>
- * ```
- */
 export declare const Toaster: import("react").NamedExoticComponent<ToasterProps & import("react").RefAttributes<HTMLDivElement>>;
 //# sourceMappingURL=Toaster.d.ts.map

package/dist/elements/Toast/Toaster.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Toaster.d.ts","sourceRoot":"","sources":["../../../src/elements/Toast/Toaster.tsx"],"names":[],"mappings":"AAiBA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAiElD;;;;;;;;;;;GAWG;AACH,eAAO,MAAM,OAAO,oGA6EnB,CAAC"}
+{"version":3,"file":"Toaster.d.ts","sourceRoot":"","sources":["../../../src/elements/Toast/Toaster.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAkElD,eAAO,MAAM,OAAO,oGAiEnB,CAAC"}

package/dist/elements/Toast/index.d.ts

@@ -22,6 +22,6 @@
 export { toast, toastQueue, toastVariants, toasterVariants } from './Toast';
 export { ToastProvider } from './ToastProvider';
 export { Toaster } from './Toaster';
-export type { ToastOptions, ToastContent, ToasterProps, ToastProviderProps, ToastVariant, ToasterPosition, DismissReason, ToastKey, ToastConfig, ToastQueueAPI, } from './Toast.types';
+export type { ToastOptions, ToastConvenienceOptions, ToastContent, ToasterProps, ToastProviderProps, ToastVariant, ToasterPosition, DismissReason, ToastKey, ToastConfig, ToastQueueAPI, } from './Toast.types';
 export { ToastOptionsSchema, ToasterPropsSchema, ToastProviderPropsSchema, ToastVariantSchema, ToasterPositionSchema, DismissReasonSchema, } from './Toast.types';
 //# sourceMappingURL=index.d.ts.map

package/dist/elements/Toast/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Toast/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;GAoBG;AAGH,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,aAAa,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAG5E,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAGpC,YAAY,EACV,YAAY,EACZ,YAAY,EACZ,YAAY,EACZ,kBAAkB,EAClB,YAAY,EACZ,eAAe,EACf,aAAa,EACb,QAAQ,EACR,WAAW,EACX,aAAa,GACd,MAAM,eAAe,CAAC;AAGvB,OAAO,EACL,kBAAkB,EAClB,kBAAkB,EAClB,wBAAwB,EACxB,kBAAkB,EAClB,qBAAqB,EACrB,mBAAmB,GACpB,MAAM,eAAe,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/Toast/index.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;GAoBG;AAGH,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,aAAa,EAAE,eAAe,EAAE,MAAM,SAAS,CAAC;AAG5E,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAGpC,YAAY,EACV,YAAY,EACZ,uBAAuB,EACvB,YAAY,EACZ,YAAY,EACZ,kBAAkB,EAClB,YAAY,EACZ,eAAe,EACf,aAAa,EACb,QAAQ,EACR,WAAW,EACX,aAAa,GACd,MAAM,eAAe,CAAC;AAGvB,OAAO,EACL,kBAAkB,EAClB,kBAAkB,EAClB,wBAAwB,EACxB,kBAAkB,EAClB,qBAAqB,EACrB,mBAAmB,GACpB,MAAM,eAAe,CAAC"}