@nextlyhq/ui 0.0.2-alpha.32 → 0.0.2-alpha.34

package/dist/index.d.cts

@@ -133,7 +133,7 @@ declare const FormLabelWithTooltip: react.ForwardRefExoticComponent<FormLabelWit
  * - success: Light green background
  * - warning: Light amber background
  * - destructive: Light red background
- * - outline: Transparent background with  border border-primary/5
+ * - outline: Transparent background with  border border-border
  */
 declare const badgeVariants: (props?: ({
     variant?: "default" | "primary" | "destructive" | "outline" | "success" | "warning" | null | undefined;
@@ -152,11 +152,11 @@ declare function Badge({ className, variant, ...props }: BadgeProps): react_jsx_
  * - Border radius: 0px (rounded-none)
  * - Padding: 24px (p-6) for header/content, 16px 24px for footer
  * - Shadow: sm (default), md (hover/elevated)
- * - Border: 1px solid  border border-primary/5 color
+ * - Border: 1px solid  border border-border color
  *
  * Variants:
  * - default: Standard card with subtle shadow
- * - interactive: Hover effects for clickable cards  (border border-primary/5 highlight, shadow increase)
+ * - interactive: Hover effects for clickable cards  (border border-border highlight, shadow increase)
  *   ⚠️ IMPORTANT: When using the interactive variant, you MUST add appropriate
  *   accessibility attributes:
  *   - Add role="button" or use an actual <button> wrapper
@@ -201,8 +201,8 @@ declare const Card: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElemen
 } & class_variance_authority_types.ClassProp) | undefined) => string> & react.RefAttributes<HTMLDivElement>>;
 interface CardHeaderProps extends HTMLAttributes<HTMLDivElement> {
     /**
-     * Whether to hide the bottom  border border-primary/5 separator between header and content.
-     * Default: false  (border border-primary/5 is shown per design spec)
+     * Whether to hide the bottom  border border-border separator between header and content.
+     * Default: false  (border border-border is shown per design spec)
      */
     noBorder?: boolean;
 }
@@ -557,9 +557,9 @@ declare const Checkbox: react.ForwardRefExoticComponent<Omit<CheckboxPrimitive.C
  *
  * Implementation Notes:
  * - Uses Radix UI primitives for robust accessibility
- * - Visual "checked" state achieved via  border border-primary/5 expansion (border-[5px])
- * - No inner indicator needed -  border border-primary/5 expansion provides clear visual feedback
- * - Hover state changes  border border-primary/5 color for better interactivity
+ * - Visual "checked" state achieved via  border border-border expansion (border-[5px])
+ * - No inner indicator needed -  border border-border expansion provides clear visual feedback
+ * - Hover state changes  border border-border color for better interactivity
  */
 declare const RadioGroup: react.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
 declare const RadioGroupItem: react.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupItemProps & react.RefAttributes<HTMLButtonElement>, "ref"> & react.RefAttributes<HTMLButtonElement>>;
@@ -595,7 +595,7 @@ type AccordionContentProps = ComponentPropsWithoutRef<typeof Content>;
  * Built on Radix UI primitives with WAI-ARIA compliance.
  *
  * Design Specs:
- * - AccordionItem border: 1px bottom  border border-primary/5 (border-b)
+ * - AccordionItem border: 1px bottom  border border-border (border-b)
  * - AccordionTrigger padding: 16px vertical (py-4)
  * - AccordionTrigger font: font-medium (500 weight)
  * - AccordionContent padding: 16px bottom, 0 top (pb-4 pt-0)
@@ -686,7 +686,7 @@ declare const Accordion: react.ForwardRefExoticComponent<(AccordionPrimitive.Acc
  * AccordionItem - Container for trigger and content
  *
  * Design Specs:
- * - Border: 1px bottom  border border-primary/5 (border-b) for visual separation
+ * - Border: 1px bottom  border border-border (border-b) for visual separation
  * - Each item represents a collapsible section
  *
  * Accessibility:
@@ -1021,8 +1021,8 @@ declare const TabsList: react.ForwardRefExoticComponent<Omit<_radix_ui_react_tab
  * - Padding: 6px 16px (px-4 py-2)
  * - Font: text-sm (14px), font-medium (500)
  * - Transition: 150ms (design system standard)
- * - Active state: blue text with blue bottom  border border-primary/5 (2px)
- * - Hover: blue text with blue bottom  border border-primary/5
+ * - Active state: blue text with blue bottom  border border-border (2px)
+ * - Hover: blue text with blue bottom  border border-border
  * - Gmail-inspired clean underline style
  *
  * Accessibility:
@@ -1780,7 +1780,7 @@ declare const CommandGroup: react.ForwardRefExoticComponent<Omit<{
 type CommandSeparatorProps = ComponentPropsWithoutRef<typeof Command$1.Separator>;
 /**
  * CommandSeparator - Visual divider between command groups.
- * 1px line with  border border-primary/5 color, 8px margin top/bottom.
+ * 1px line with  border border-border color, 8px margin top/bottom.
  */
 declare const CommandSeparator: react.ForwardRefExoticComponent<Omit<Pick<Pick<react.DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof HTMLAttributes<HTMLDivElement>> & {
     ref?: React.Ref<HTMLDivElement>;

package/dist/index.d.ts

@@ -133,7 +133,7 @@ declare const FormLabelWithTooltip: react.ForwardRefExoticComponent<FormLabelWit
  * - success: Light green background
  * - warning: Light amber background
  * - destructive: Light red background
- * - outline: Transparent background with  border border-primary/5
+ * - outline: Transparent background with  border border-border
  */
 declare const badgeVariants: (props?: ({
     variant?: "default" | "primary" | "destructive" | "outline" | "success" | "warning" | null | undefined;
@@ -152,11 +152,11 @@ declare function Badge({ className, variant, ...props }: BadgeProps): react_jsx_
  * - Border radius: 0px (rounded-none)
  * - Padding: 24px (p-6) for header/content, 16px 24px for footer
  * - Shadow: sm (default), md (hover/elevated)
- * - Border: 1px solid  border border-primary/5 color
+ * - Border: 1px solid  border border-border color
  *
  * Variants:
  * - default: Standard card with subtle shadow
- * - interactive: Hover effects for clickable cards  (border border-primary/5 highlight, shadow increase)
+ * - interactive: Hover effects for clickable cards  (border border-border highlight, shadow increase)
  *   ⚠️ IMPORTANT: When using the interactive variant, you MUST add appropriate
  *   accessibility attributes:
  *   - Add role="button" or use an actual <button> wrapper
@@ -201,8 +201,8 @@ declare const Card: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElemen
 } & class_variance_authority_types.ClassProp) | undefined) => string> & react.RefAttributes<HTMLDivElement>>;
 interface CardHeaderProps extends HTMLAttributes<HTMLDivElement> {
     /**
-     * Whether to hide the bottom  border border-primary/5 separator between header and content.
-     * Default: false  (border border-primary/5 is shown per design spec)
+     * Whether to hide the bottom  border border-border separator between header and content.
+     * Default: false  (border border-border is shown per design spec)
      */
     noBorder?: boolean;
 }
@@ -557,9 +557,9 @@ declare const Checkbox: react.ForwardRefExoticComponent<Omit<CheckboxPrimitive.C
  *
  * Implementation Notes:
  * - Uses Radix UI primitives for robust accessibility
- * - Visual "checked" state achieved via  border border-primary/5 expansion (border-[5px])
- * - No inner indicator needed -  border border-primary/5 expansion provides clear visual feedback
- * - Hover state changes  border border-primary/5 color for better interactivity
+ * - Visual "checked" state achieved via  border border-border expansion (border-[5px])
+ * - No inner indicator needed -  border border-border expansion provides clear visual feedback
+ * - Hover state changes  border border-border color for better interactivity
  */
 declare const RadioGroup: react.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
 declare const RadioGroupItem: react.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupItemProps & react.RefAttributes<HTMLButtonElement>, "ref"> & react.RefAttributes<HTMLButtonElement>>;
@@ -595,7 +595,7 @@ type AccordionContentProps = ComponentPropsWithoutRef<typeof Content>;
  * Built on Radix UI primitives with WAI-ARIA compliance.
  *
  * Design Specs:
- * - AccordionItem border: 1px bottom  border border-primary/5 (border-b)
+ * - AccordionItem border: 1px bottom  border border-border (border-b)
  * - AccordionTrigger padding: 16px vertical (py-4)
  * - AccordionTrigger font: font-medium (500 weight)
  * - AccordionContent padding: 16px bottom, 0 top (pb-4 pt-0)
@@ -686,7 +686,7 @@ declare const Accordion: react.ForwardRefExoticComponent<(AccordionPrimitive.Acc
  * AccordionItem - Container for trigger and content
  *
  * Design Specs:
- * - Border: 1px bottom  border border-primary/5 (border-b) for visual separation
+ * - Border: 1px bottom  border border-border (border-b) for visual separation
  * - Each item represents a collapsible section
  *
  * Accessibility:
@@ -1021,8 +1021,8 @@ declare const TabsList: react.ForwardRefExoticComponent<Omit<_radix_ui_react_tab
  * - Padding: 6px 16px (px-4 py-2)
  * - Font: text-sm (14px), font-medium (500)
  * - Transition: 150ms (design system standard)
- * - Active state: blue text with blue bottom  border border-primary/5 (2px)
- * - Hover: blue text with blue bottom  border border-primary/5
+ * - Active state: blue text with blue bottom  border border-border (2px)
+ * - Hover: blue text with blue bottom  border border-border
  * - Gmail-inspired clean underline style
  *
  * Accessibility:
@@ -1780,7 +1780,7 @@ declare const CommandGroup: react.ForwardRefExoticComponent<Omit<{
 type CommandSeparatorProps = ComponentPropsWithoutRef<typeof Command$1.Separator>;
 /**
  * CommandSeparator - Visual divider between command groups.
- * 1px line with  border border-primary/5 color, 8px margin top/bottom.
+ * 1px line with  border border-border color, 8px margin top/bottom.
  */
 declare const CommandSeparator: react.ForwardRefExoticComponent<Omit<Pick<Pick<react.DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof HTMLAttributes<HTMLDivElement>> & {
     ref?: React.Ref<HTMLDivElement>;