@orangecheck/design 0.21.0 → 0.23.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/README.md +29 -8
- package/dist/components.d.mts +1 -1
- package/dist/components.d.ts +1 -1
- package/dist/components.js +20 -6
- package/dist/components.js.map +1 -1
- package/dist/components.mjs +20 -7
- package/dist/components.mjs.map +1 -1
- package/dist/composites.d.mts +11 -1
- package/dist/composites.d.ts +11 -1
- package/dist/composites.js +20 -6
- package/dist/composites.js.map +1 -1
- package/dist/composites.mjs +20 -7
- package/dist/composites.mjs.map +1 -1
- package/dist/index.d.mts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +27 -13
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +27 -14
- package/dist/index.mjs.map +1 -1
- package/dist/styles/theme.css +8 -4
- package/dist/styles/themes/ember.css +93 -3
- package/dist/styles/themes/orangecheck.css +6 -6
- package/dist/styles/themes.css +4 -3
- package/dist/tokens.d.mts +1 -1
- package/dist/tokens.d.ts +1 -1
- package/dist/tokens.js +7 -7
- package/dist/tokens.js.map +1 -1
- package/dist/tokens.mjs +7 -7
- package/dist/tokens.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -30,6 +30,12 @@ function cn(...inputs) {
|
|
|
30
30
|
|
|
31
31
|
// src/tokens/themes.ts
|
|
32
32
|
var OC_THEMES = [
|
|
33
|
+
{
|
|
34
|
+
id: "ember",
|
|
35
|
+
label: "ember",
|
|
36
|
+
description: "the warmth \u2014 burnt-sienna terracotta, soft 1rem corners, pill buttons, Hanken Grotesk \xB7 approachable, human",
|
|
37
|
+
accent: "#da6736"
|
|
38
|
+
},
|
|
33
39
|
{
|
|
34
40
|
id: "orangecheck",
|
|
35
41
|
label: "orangecheck",
|
|
@@ -53,19 +59,13 @@ var OC_THEMES = [
|
|
|
53
59
|
label: "gold",
|
|
54
60
|
description: "sound money \u2014 digital gold, hard 0.125rem milled edge, mono ledger \xB7 21M",
|
|
55
61
|
accent: "#e3b831"
|
|
56
|
-
},
|
|
57
|
-
{
|
|
58
|
-
id: "ember",
|
|
59
|
-
label: "ember",
|
|
60
|
-
description: "the warmth \u2014 burnt-sienna terracotta, soft 1rem corners, pill buttons, Hanken Grotesk \xB7 approachable, human",
|
|
61
|
-
accent: "#da6736"
|
|
62
62
|
}
|
|
63
63
|
];
|
|
64
64
|
var OC_DEFAULT_ACCENT = "#f97316";
|
|
65
65
|
function accentFor(id) {
|
|
66
66
|
return OC_THEMES.find((t) => t.id === id)?.accent ?? OC_DEFAULT_ACCENT;
|
|
67
67
|
}
|
|
68
|
-
var DEFAULT_OC_THEME = "
|
|
68
|
+
var DEFAULT_OC_THEME = "ember";
|
|
69
69
|
function isKnownTheme(id) {
|
|
70
70
|
return !!id && OC_THEMES.some((t) => t.id === id);
|
|
71
71
|
}
|
|
@@ -2509,11 +2509,11 @@ var COL_CLASS = {
|
|
|
2509
2509
|
4: "md:grid-cols-2 lg:grid-cols-4"
|
|
2510
2510
|
};
|
|
2511
2511
|
function StatGrid({ items, columns = 3, className = "" }) {
|
|
2512
|
-
return /* @__PURE__ */ jsx("div", { className: `bg-border grid gap-px border ${COL_CLASS[columns]} ${className}`, children: items.map((it, i) => /* @__PURE__ */ jsx(Tile, { item: it }, `${it.label}-${i}`)) });
|
|
2512
|
+
return /* @__PURE__ */ jsx("div", { className: `oc-stat-grid bg-border grid gap-px border ${COL_CLASS[columns]} ${className}`, children: items.map((it, i) => /* @__PURE__ */ jsx(Tile, { item: it }, `${it.label}-${i}`)) });
|
|
2513
2513
|
}
|
|
2514
2514
|
function Tile({ item }) {
|
|
2515
2515
|
const tone = item.tone ?? (item.accent ? "primary" : "default");
|
|
2516
|
-
return /* @__PURE__ */ jsxs("div", { className: "bg-background p-5", children: [
|
|
2516
|
+
return /* @__PURE__ */ jsxs("div", { className: "oc-stat-tile bg-background p-5", children: [
|
|
2517
2517
|
/* @__PURE__ */ jsx("div", { className: "text-muted-foreground/80 font-mono text-[10px] tracking-widest uppercase", children: item.label }),
|
|
2518
2518
|
/* @__PURE__ */ jsx(
|
|
2519
2519
|
"div",
|
|
@@ -2532,7 +2532,7 @@ function StatTile({ children, ...item }) {
|
|
|
2532
2532
|
] });
|
|
2533
2533
|
}
|
|
2534
2534
|
function StatCard({ pad = "default", className, ...stat }) {
|
|
2535
|
-
return /* @__PURE__ */ jsx("div", { className: cn("border bg-card", pad === "sm" ? "p-3 md:p-4" : "p-5", className), children: /* @__PURE__ */ jsx(StatBlock, { ...stat }) });
|
|
2535
|
+
return /* @__PURE__ */ jsx("div", { className: cn("oc-stat-card border bg-card", pad === "sm" ? "p-3 md:p-4" : "p-5", className), children: /* @__PURE__ */ jsx(StatBlock, { ...stat }) });
|
|
2536
2536
|
}
|
|
2537
2537
|
var FRAME = {
|
|
2538
2538
|
info: "border-primary/30 bg-primary/5",
|
|
@@ -2569,7 +2569,7 @@ function DefinitionList({ items, className }) {
|
|
|
2569
2569
|
"dl",
|
|
2570
2570
|
{
|
|
2571
2571
|
className: cn(
|
|
2572
|
-
"grid gap-x-5 gap-y-2 text-sm sm:grid-cols-[auto_1fr] sm:items-baseline",
|
|
2572
|
+
"oc-deflist grid gap-x-5 gap-y-2 text-sm sm:grid-cols-[auto_1fr] sm:items-baseline",
|
|
2573
2573
|
className
|
|
2574
2574
|
),
|
|
2575
2575
|
children: items.map((item, i) => /* @__PURE__ */ jsxs(Fragment$1, { children: [
|
|
@@ -2585,7 +2585,7 @@ function DataRow({ children, meta, action, as, className }) {
|
|
|
2585
2585
|
Tag,
|
|
2586
2586
|
{
|
|
2587
2587
|
className: cn(
|
|
2588
|
-
"flex flex-col gap-1 py-3 sm:flex-row sm:items-baseline sm:justify-between sm:gap-4",
|
|
2588
|
+
"oc-data-row flex flex-col gap-1 py-3 sm:flex-row sm:items-baseline sm:justify-between sm:gap-4",
|
|
2589
2589
|
className
|
|
2590
2590
|
),
|
|
2591
2591
|
children: [
|
|
@@ -2598,6 +2598,19 @@ function DataRow({ children, meta, action, as, className }) {
|
|
|
2598
2598
|
}
|
|
2599
2599
|
);
|
|
2600
2600
|
}
|
|
2601
|
+
function Panel({ label, title, action, flush, className, children }) {
|
|
2602
|
+
const hasHeader = label || title || action;
|
|
2603
|
+
return /* @__PURE__ */ jsxs("section", { className: cn("oc-panel py-8", !flush && "border-t", className), children: [
|
|
2604
|
+
hasHeader && /* @__PURE__ */ jsxs("div", { className: "mb-4 flex items-start justify-between gap-3", children: [
|
|
2605
|
+
/* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
|
|
2606
|
+
label && /* @__PURE__ */ jsx("div", { className: "label-mono text-primary mb-1", children: label }),
|
|
2607
|
+
title && /* @__PURE__ */ jsx("h2", { className: "font-display text-lg font-bold tracking-tight", children: title })
|
|
2608
|
+
] }),
|
|
2609
|
+
action && /* @__PURE__ */ jsx("div", { className: "shrink-0", children: action })
|
|
2610
|
+
] }),
|
|
2611
|
+
children
|
|
2612
|
+
] });
|
|
2613
|
+
}
|
|
2601
2614
|
function TwoToneHeading({
|
|
2602
2615
|
lead,
|
|
2603
2616
|
muted,
|
|
@@ -2607,7 +2620,7 @@ function TwoToneHeading({
|
|
|
2607
2620
|
}) {
|
|
2608
2621
|
const Tag = as ?? "h2";
|
|
2609
2622
|
const leadColor = tone === "onBrand" ? "text-primary-foreground" : "text-foreground";
|
|
2610
|
-
const mutedColor = tone === "onBrand" ? "text-primary-foreground/
|
|
2623
|
+
const mutedColor = tone === "onBrand" ? "text-primary-foreground/75" : "text-foreground/40";
|
|
2611
2624
|
return /* @__PURE__ */ jsxs(
|
|
2612
2625
|
Tag,
|
|
2613
2626
|
{
|
|
@@ -4838,6 +4851,6 @@ function OcAppBar({
|
|
|
4838
4851
|
);
|
|
4839
4852
|
}
|
|
4840
4853
|
|
|
4841
|
-
export { AccentList, AccentNote, Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertTitle, AlertWithAction, AlertWithCountdown, AppShell, AppearanceControls, Badge, Bar, BitcoinAddress, BrandBand, Button, Callout, Card, CheckList, Checkbox, ComparisonTable, ConfirmHost, CopyButton, DEFAULT_OC_THEME, DataRow, DefinitionList, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, EcosystemSwitcher, EmailCapture, EmptyState, ErrorBoundary, FAMILY_PROPERTIES, Faq, FeatureCard, HelpHint, IconBadge, Input, Label, LayoutSubHeader, MarketingHeading, Modal, NumberedStep, OC_DEFAULT_ACCENT, OC_SKIN_COOKIE, OC_THEMES, OcAccountMenu, OcAccountMenuView, OcAppBar, OcAppearanceMenu, OcAurora, OcDashboardHub, OcDashboardShell, OcLogoDropdown, OcPrimaryNav, OcThemeBridge, OcThemePicker, OcThemeProvider, Pagination, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PromptHost, QrCode, REFERENCE_BTC_USD, RadioGroup, RadioGroupItem, SITE_STATE_LABEL, SatsAmount, Section, SectionHeader, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Skeleton, Sparkline, StatBlock, StatCard, StatGrid, StatTile, StatusPill, StepList, Surface, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, ThemeToggle, ThemeToggleLink, Toaster, Tooltip, TwoToneHeading, VerifiedChip, Working, WorkingPanel, accentFor, asOf, badgeVariants, buttonVariants, cn, confirm, explorerUrl, findFamilyProperty, formatSats, formatSatsCompact, getOcThemeInitScript, iconBadgeVariants, isKnownTheme, makeStatusPill, priceBoth, prompt, relativeTime, resolveTheme, satsToUsd, shortenAddress, surfaceVariants, usdToSats, useOcSkin, useSpotPrice };
|
|
4854
|
+
export { AccentList, AccentNote, Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertTitle, AlertWithAction, AlertWithCountdown, AppShell, AppearanceControls, Badge, Bar, BitcoinAddress, BrandBand, Button, Callout, Card, CheckList, Checkbox, ComparisonTable, ConfirmHost, CopyButton, DEFAULT_OC_THEME, DataRow, DefinitionList, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, EcosystemSwitcher, EmailCapture, EmptyState, ErrorBoundary, FAMILY_PROPERTIES, Faq, FeatureCard, HelpHint, IconBadge, Input, Label, LayoutSubHeader, MarketingHeading, Modal, NumberedStep, OC_DEFAULT_ACCENT, OC_SKIN_COOKIE, OC_THEMES, OcAccountMenu, OcAccountMenuView, OcAppBar, OcAppearanceMenu, OcAurora, OcDashboardHub, OcDashboardShell, OcLogoDropdown, OcPrimaryNav, OcThemeBridge, OcThemePicker, OcThemeProvider, Pagination, Panel, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PromptHost, QrCode, REFERENCE_BTC_USD, RadioGroup, RadioGroupItem, SITE_STATE_LABEL, SatsAmount, Section, SectionHeader, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, Skeleton, Sparkline, StatBlock, StatCard, StatGrid, StatTile, StatusPill, StepList, Surface, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, ThemeToggle, ThemeToggleLink, Toaster, Tooltip, TwoToneHeading, VerifiedChip, Working, WorkingPanel, accentFor, asOf, badgeVariants, buttonVariants, cn, confirm, explorerUrl, findFamilyProperty, formatSats, formatSatsCompact, getOcThemeInitScript, iconBadgeVariants, isKnownTheme, makeStatusPill, priceBoth, prompt, relativeTime, resolveTheme, satsToUsd, shortenAddress, surfaceVariants, usdToSats, useOcSkin, useSpotPrice };
|
|
4842
4855
|
//# sourceMappingURL=index.mjs.map
|
|
4843
4856
|
//# sourceMappingURL=index.mjs.map
|