@orangecheck/design 0.5.2 → 0.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.mts CHANGED
@@ -1,5 +1,5 @@
1
1
  export { DEFAULT_OC_THEME, OC_DEFAULT_ACCENT, OC_SKIN_COOKIE, OC_THEMES, OcAppearanceMenu, OcAppearanceMenuProps, OcTheme, OcThemeBridge, OcThemeId, OcThemePicker, OcThemePickerProps, OcThemeProvider, OcThemeProviderProps, accentFor, cn, getOcThemeInitScript, isKnownTheme, resolveTheme, useOcSkin } from './tokens.mjs';
2
- export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertTitle, AlertWithAction, AlertWithActionProps, AlertWithCountdown, AlertWithCountdownProps, Badge, Bar, BarProps, BitcoinAddress, BitcoinAddressProps, Button, Card, CardProps, ConfirmHost, ConfirmOptions, CopyButton, CopyButtonProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, ErrorBoundary, Input, Label, Modal, ModalProps, Pagination, PaginationProps, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PromptHost, PromptOptions, QrCode, QrCodeProps, SatsAmount, SatsAmountProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Skeleton, SkeletonProps, Sparkline, SparklineProps, StatBlock, StatBlockProps, StatusPill, StatusPillProps, StatusTone, Textarea, ThemeToggle, ThemeToggleLink, Toaster, Working, WorkingPanel, WorkingProps, badgeVariants, buttonVariants, confirm, prompt } from './primitives.mjs';
2
+ export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertTitle, AlertWithAction, AlertWithActionProps, AlertWithCountdown, AlertWithCountdownProps, Badge, Bar, BarProps, BitcoinAddress, BitcoinAddressProps, Button, Card, CardProps, Checkbox, ConfirmHost, ConfirmOptions, CopyButton, CopyButtonProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, ErrorBoundary, Input, Label, Modal, ModalProps, Pagination, PaginationProps, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PromptHost, PromptOptions, QrCode, QrCodeProps, RadioGroup, RadioGroupItem, SatsAmount, SatsAmountProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Skeleton, SkeletonProps, Sparkline, SparklineProps, StatBlock, StatBlockProps, StatusPill, StatusPillProps, StatusTone, Switch, Textarea, ThemeToggle, ThemeToggleLink, Toaster, Working, WorkingPanel, WorkingProps, badgeVariants, buttonVariants, confirm, prompt } from './primitives.mjs';
3
3
  export * from '@orangecheck/ui';
4
4
  export { ExplorerNetwork, ExplorerTarget, REFERENCE_BTC_USD, explorerUrl, formatSats, formatSatsCompact, priceBoth, relativeTime, satsToUsd, shortenAddress, usdToSats } from './format.mjs';
5
5
  import 'clsx';
@@ -8,6 +8,9 @@ import 'react';
8
8
  import 'class-variance-authority/types';
9
9
  import 'class-variance-authority';
10
10
  import '@radix-ui/react-label';
11
+ import '@radix-ui/react-checkbox';
12
+ import '@radix-ui/react-radio-group';
13
+ import '@radix-ui/react-switch';
11
14
  import 'lucide-react';
12
15
  import '@radix-ui/react-separator';
13
16
  import '@radix-ui/react-dialog';
package/dist/index.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  export { DEFAULT_OC_THEME, OC_DEFAULT_ACCENT, OC_SKIN_COOKIE, OC_THEMES, OcAppearanceMenu, OcAppearanceMenuProps, OcTheme, OcThemeBridge, OcThemeId, OcThemePicker, OcThemePickerProps, OcThemeProvider, OcThemeProviderProps, accentFor, cn, getOcThemeInitScript, isKnownTheme, resolveTheme, useOcSkin } from './tokens.js';
2
- export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertTitle, AlertWithAction, AlertWithActionProps, AlertWithCountdown, AlertWithCountdownProps, Badge, Bar, BarProps, BitcoinAddress, BitcoinAddressProps, Button, Card, CardProps, ConfirmHost, ConfirmOptions, CopyButton, CopyButtonProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, ErrorBoundary, Input, Label, Modal, ModalProps, Pagination, PaginationProps, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PromptHost, PromptOptions, QrCode, QrCodeProps, SatsAmount, SatsAmountProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Skeleton, SkeletonProps, Sparkline, SparklineProps, StatBlock, StatBlockProps, StatusPill, StatusPillProps, StatusTone, Textarea, ThemeToggle, ThemeToggleLink, Toaster, Working, WorkingPanel, WorkingProps, badgeVariants, buttonVariants, confirm, prompt } from './primitives.js';
2
+ export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertTitle, AlertWithAction, AlertWithActionProps, AlertWithCountdown, AlertWithCountdownProps, Badge, Bar, BarProps, BitcoinAddress, BitcoinAddressProps, Button, Card, CardProps, Checkbox, ConfirmHost, ConfirmOptions, CopyButton, CopyButtonProps, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, ErrorBoundary, Input, Label, Modal, ModalProps, Pagination, PaginationProps, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PromptHost, PromptOptions, QrCode, QrCodeProps, RadioGroup, RadioGroupItem, SatsAmount, SatsAmountProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Skeleton, SkeletonProps, Sparkline, SparklineProps, StatBlock, StatBlockProps, StatusPill, StatusPillProps, StatusTone, Switch, Textarea, ThemeToggle, ThemeToggleLink, Toaster, Working, WorkingPanel, WorkingProps, badgeVariants, buttonVariants, confirm, prompt } from './primitives.js';
3
3
  export * from '@orangecheck/ui';
4
4
  export { ExplorerNetwork, ExplorerTarget, REFERENCE_BTC_USD, explorerUrl, formatSats, formatSatsCompact, priceBoth, relativeTime, satsToUsd, shortenAddress, usdToSats } from './format.js';
5
5
  import 'clsx';
@@ -8,6 +8,9 @@ import 'react';
8
8
  import 'class-variance-authority/types';
9
9
  import 'class-variance-authority';
10
10
  import '@radix-ui/react-label';
11
+ import '@radix-ui/react-checkbox';
12
+ import '@radix-ui/react-radio-group';
13
+ import '@radix-ui/react-switch';
11
14
  import 'lucide-react';
12
15
  import '@radix-ui/react-separator';
13
16
  import '@radix-ui/react-dialog';
package/dist/index.js CHANGED
@@ -9,6 +9,9 @@ var lucideReact = require('lucide-react');
9
9
  var reactSlot = require('@radix-ui/react-slot');
10
10
  var classVarianceAuthority = require('class-variance-authority');
11
11
  var LabelPrimitive = require('@radix-ui/react-label');
12
+ var CheckboxPrimitive = require('@radix-ui/react-checkbox');
13
+ var RadioGroupPrimitive = require('@radix-ui/react-radio-group');
14
+ var SwitchPrimitive = require('@radix-ui/react-switch');
12
15
  var SeparatorPrimitive = require('@radix-ui/react-separator');
13
16
  var SheetPrimitive = require('@radix-ui/react-dialog');
14
17
  var PopoverPrimitive = require('@radix-ui/react-popover');
@@ -40,6 +43,9 @@ function _interopNamespace(e) {
40
43
 
41
44
  var React2__namespace = /*#__PURE__*/_interopNamespace(React2);
42
45
  var LabelPrimitive__namespace = /*#__PURE__*/_interopNamespace(LabelPrimitive);
46
+ var CheckboxPrimitive__namespace = /*#__PURE__*/_interopNamespace(CheckboxPrimitive);
47
+ var RadioGroupPrimitive__namespace = /*#__PURE__*/_interopNamespace(RadioGroupPrimitive);
48
+ var SwitchPrimitive__namespace = /*#__PURE__*/_interopNamespace(SwitchPrimitive);
43
49
  var SeparatorPrimitive__namespace = /*#__PURE__*/_interopNamespace(SeparatorPrimitive);
44
50
  var SheetPrimitive__namespace = /*#__PURE__*/_interopNamespace(SheetPrimitive);
45
51
  var PopoverPrimitive__namespace = /*#__PURE__*/_interopNamespace(PopoverPrimitive);
@@ -83,6 +89,7 @@ __export(src_exports, {
83
89
  BitcoinAddress: () => BitcoinAddress,
84
90
  Button: () => Button,
85
91
  Card: () => Card,
92
+ Checkbox: () => Checkbox,
86
93
  ConfirmHost: () => ConfirmHost,
87
94
  CopyButton: () => CopyButton,
88
95
  DEFAULT_OC_THEME: () => DEFAULT_OC_THEME,
@@ -115,6 +122,8 @@ __export(src_exports, {
115
122
  PromptHost: () => PromptHost,
116
123
  QrCode: () => QrCode,
117
124
  REFERENCE_BTC_USD: () => REFERENCE_BTC_USD,
125
+ RadioGroup: () => RadioGroup,
126
+ RadioGroupItem: () => RadioGroupItem,
118
127
  SatsAmount: () => SatsAmount,
119
128
  Select: () => Select,
120
129
  SelectContent: () => SelectContent,
@@ -141,6 +150,7 @@ __export(src_exports, {
141
150
  Sparkline: () => Sparkline,
142
151
  StatBlock: () => StatBlock,
143
152
  StatusPill: () => StatusPill,
153
+ Switch: () => Switch,
144
154
  Textarea: () => Textarea,
145
155
  ThemeToggle: () => ThemeToggle,
146
156
  ThemeToggleLink: () => ThemeToggleLink,
@@ -636,6 +646,99 @@ function Label({ className, ...props }) {
636
646
  }
637
647
  );
638
648
  }
649
+ function Checkbox({ className, ...props }) {
650
+ return /* @__PURE__ */ jsxRuntime.jsx(
651
+ CheckboxPrimitive__namespace.Root,
652
+ {
653
+ "data-slot": "checkbox",
654
+ className: cn(
655
+ "peer border-input bg-input/30 size-4 shrink-0 rounded-sm border shadow-xs transition-[color,box-shadow,background-color] outline-none",
656
+ "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
657
+ "disabled:cursor-not-allowed disabled:opacity-50",
658
+ "data-[state=checked]:bg-primary data-[state=checked]:border-primary data-[state=checked]:text-primary-foreground",
659
+ "aria-invalid:ring-brand/25 dark:aria-invalid:ring-brand/35 aria-invalid:border-brand",
660
+ className
661
+ ),
662
+ ...props,
663
+ children: /* @__PURE__ */ jsxRuntime.jsx(
664
+ CheckboxPrimitive__namespace.Indicator,
665
+ {
666
+ "data-slot": "checkbox-indicator",
667
+ className: "flex items-center justify-center text-current",
668
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CheckIcon, { className: "size-3.5", strokeWidth: 3 })
669
+ }
670
+ )
671
+ }
672
+ );
673
+ }
674
+ function RadioGroup({
675
+ className,
676
+ ...props
677
+ }) {
678
+ return /* @__PURE__ */ jsxRuntime.jsx(
679
+ RadioGroupPrimitive__namespace.Root,
680
+ {
681
+ "data-slot": "radio-group",
682
+ className: cn("grid gap-2", className),
683
+ ...props
684
+ }
685
+ );
686
+ }
687
+ function RadioGroupItem({
688
+ className,
689
+ ...props
690
+ }) {
691
+ return /* @__PURE__ */ jsxRuntime.jsx(
692
+ RadioGroupPrimitive__namespace.Item,
693
+ {
694
+ "data-slot": "radio-group-item",
695
+ className: cn(
696
+ "border-input bg-input/30 text-primary aspect-square size-4 shrink-0 rounded-full border shadow-xs transition-[color,box-shadow,background-color] outline-none",
697
+ "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
698
+ "disabled:cursor-not-allowed disabled:opacity-50",
699
+ "data-[state=checked]:border-primary",
700
+ "aria-invalid:ring-brand/25 dark:aria-invalid:ring-brand/35 aria-invalid:border-brand",
701
+ className
702
+ ),
703
+ ...props,
704
+ children: /* @__PURE__ */ jsxRuntime.jsx(
705
+ RadioGroupPrimitive__namespace.Indicator,
706
+ {
707
+ "data-slot": "radio-group-indicator",
708
+ className: "relative flex items-center justify-center",
709
+ children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CircleIcon, { className: "fill-primary text-primary absolute size-2" })
710
+ }
711
+ )
712
+ }
713
+ );
714
+ }
715
+ function Switch({ className, ...props }) {
716
+ return /* @__PURE__ */ jsxRuntime.jsx(
717
+ SwitchPrimitive__namespace.Root,
718
+ {
719
+ "data-slot": "switch",
720
+ className: cn(
721
+ "peer inline-flex h-5 w-9 shrink-0 items-center rounded-full border border-transparent shadow-xs transition-[color,box-shadow,background-color] outline-none",
722
+ "data-[state=checked]:bg-primary data-[state=unchecked]:bg-input",
723
+ "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
724
+ "disabled:cursor-not-allowed disabled:opacity-50",
725
+ "aria-invalid:ring-brand/25 dark:aria-invalid:ring-brand/35",
726
+ className
727
+ ),
728
+ ...props,
729
+ children: /* @__PURE__ */ jsxRuntime.jsx(
730
+ SwitchPrimitive__namespace.Thumb,
731
+ {
732
+ "data-slot": "switch-thumb",
733
+ className: cn(
734
+ "bg-background pointer-events-none block size-4 rounded-full shadow-sm ring-0 transition-transform",
735
+ "data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-0.5"
736
+ )
737
+ }
738
+ )
739
+ }
740
+ );
741
+ }
639
742
  var alertVariants = classVarianceAuthority.cva(
640
743
  "relative grid w-full grid-cols-[0_1fr] items-start gap-x-0 gap-y-0.5 rounded-md border px-4 py-3 text-sm has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] has-[>svg]:gap-x-3 [&>svg]:size-4 [&>svg]:translate-y-0.5 [&>svg]:text-current",
641
744
  {
@@ -775,6 +878,9 @@ function Textarea({ className, ...props }) {
775
878
  className: cn(
776
879
  "placeholder:text-muted-foreground border-input bg-input/30 hover:bg-input/50 dark:bg-input/30 dark:hover:bg-input/50 w-full min-w-0 rounded-md border px-3 py-2 font-mono text-xs leading-relaxed shadow-xs transition-[color,box-shadow,background-color] outline-none disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50",
777
880
  "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]",
881
+ // aria-invalid parity with Input — error styling when a consumer
882
+ // marks the field invalid.
883
+ "aria-invalid:ring-brand/25 dark:aria-invalid:ring-brand/35 aria-invalid:border-brand",
778
884
  className
779
885
  ),
780
886
  ...props
@@ -2035,6 +2141,7 @@ exports.Bar = Bar;
2035
2141
  exports.BitcoinAddress = BitcoinAddress;
2036
2142
  exports.Button = Button;
2037
2143
  exports.Card = Card;
2144
+ exports.Checkbox = Checkbox;
2038
2145
  exports.ConfirmHost = ConfirmHost;
2039
2146
  exports.CopyButton = CopyButton;
2040
2147
  exports.DEFAULT_OC_THEME = DEFAULT_OC_THEME;
@@ -2067,6 +2174,8 @@ exports.PopoverTrigger = PopoverTrigger;
2067
2174
  exports.PromptHost = PromptHost;
2068
2175
  exports.QrCode = QrCode;
2069
2176
  exports.REFERENCE_BTC_USD = REFERENCE_BTC_USD;
2177
+ exports.RadioGroup = RadioGroup;
2178
+ exports.RadioGroupItem = RadioGroupItem;
2070
2179
  exports.SatsAmount = SatsAmount;
2071
2180
  exports.Select = Select;
2072
2181
  exports.SelectContent = SelectContent;
@@ -2093,6 +2202,7 @@ exports.Skeleton = Skeleton;
2093
2202
  exports.Sparkline = Sparkline;
2094
2203
  exports.StatBlock = StatBlock;
2095
2204
  exports.StatusPill = StatusPill;
2205
+ exports.Switch = Switch;
2096
2206
  exports.Textarea = Textarea;
2097
2207
  exports.ThemeToggle = ThemeToggle;
2098
2208
  exports.ThemeToggleLink = ThemeToggleLink;