@cryptlex/web-components 6.6.59 → 6.6.60
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/components/badge.d.ts +1 -1
- package/dist/components/badge.js +1 -1
- package/dist/components/badge.js.map +1 -1
- package/lib/index.css +14 -0
- package/lib/tokens.css +34 -0
- package/package.json +1 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { VariantProps } from 'class-variance-authority';
|
|
2
2
|
import { default as React } from 'react';
|
|
3
3
|
export declare const badgeVariants: (props?: ({
|
|
4
|
-
variant?: "success" | "destructive" | "neutral" | "warning" | null | undefined;
|
|
4
|
+
variant?: "success" | "destructive" | "neutral" | "warning" | "info" | "discovery" | null | undefined;
|
|
5
5
|
} & import('class-variance-authority/types').ClassProp) | undefined) => string;
|
|
6
6
|
export declare function Badge({ className, children, variant, ...props }: React.ComponentProps<'span'> & VariantProps<typeof badgeVariants>): import("react/jsx-runtime").JSX.Element;
|
package/dist/components/badge.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsxs as
|
|
1
|
+
import{jsxs as c,jsx as t}from"react/jsx-runtime";import{cva as o}from"class-variance-authority";import{classNames as s}from"../utilities/theme.js";import"clsx";const u=o("leading-tight body-sm px-2 relative rounded-full inline-flex gap-2 items-center justify-start select-none h-input-sm focus:outline-hidden focus:ring-1 focus:ring-ring",{variants:{variant:{success:"bg-success/10 text-success",destructive:"bg-destructive/10 text-destructive",warning:"bg-warning/10 text-warning",neutral:"bg-muted/10 text-muted",info:"bg-primary/10 text-primary",discovery:"bg-discovery/10 text-discovery"}},defaultVariants:{variant:"neutral"}}),d={success:"bg-success",destructive:"bg-destructive",warning:"bg-warning",neutral:"bg-muted",info:"bg-primary",discovery:"bg-discovery"};function b({className:r,children:n,variant:e,...i}){const a=d[e??"neutral"];return c("span",{className:s(u({variant:e}),r),...i,children:[t("span",{role:"presentation",className:s("rounded-full size-2",a)}),t("span",{children:n})]})}export{b as Badge,u as badgeVariants};
|
|
2
2
|
//# sourceMappingURL=badge.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"badge.js","sources":["../../lib/components/badge.tsx"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\nimport React from 'react';\nimport { classNames } from '../utilities/theme';\n\nexport const badgeVariants = cva(\n 'leading-tight body-sm px-2 relative rounded-full inline-flex gap-2 items-center justify-start select-none h-input-sm focus:outline-hidden focus:ring-1 focus:ring-ring',\n {\n variants: {\n variant: {\n success: 'bg-success/
|
|
1
|
+
{"version":3,"file":"badge.js","sources":["../../lib/components/badge.tsx"],"sourcesContent":["import { cva, type VariantProps } from 'class-variance-authority';\nimport React from 'react';\nimport { classNames } from '../utilities/theme';\n\nexport const badgeVariants = cva(\n 'leading-tight body-sm px-2 relative rounded-full inline-flex gap-2 items-center justify-start select-none h-input-sm focus:outline-hidden focus:ring-1 focus:ring-ring',\n {\n variants: {\n variant: {\n success: 'bg-success/10 text-success',\n destructive: 'bg-destructive/10 text-destructive',\n warning: 'bg-warning/10 text-warning',\n neutral: 'bg-muted/10 text-muted',\n info: 'bg-primary/10 text-primary',\n discovery: 'bg-discovery/10 text-discovery',\n },\n },\n defaultVariants: {\n variant: 'neutral',\n },\n }\n);\n\ntype BadgeVariant = NonNullable<VariantProps<typeof badgeVariants>['variant']>;\n\nconst dotVariants: Record<BadgeVariant, string> = {\n success: 'bg-success',\n destructive: 'bg-destructive',\n warning: 'bg-warning',\n neutral: 'bg-muted',\n info: 'bg-primary',\n discovery: 'bg-discovery',\n};\n\nexport function Badge({\n className,\n children,\n variant,\n ...props\n}: React.ComponentProps<'span'> & VariantProps<typeof badgeVariants>) {\n const dotClass = dotVariants[variant ?? 'neutral'];\n return (\n <span className={classNames(badgeVariants({ variant }), className)} {...props}>\n <span role=\"presentation\" className={classNames('rounded-full size-2', dotClass)}></span>\n {/* Contents */}\n <span>{children}</span>\n </span>\n );\n}\n"],"names":["badgeVariants","cva","dotVariants","Badge","className","children","variant","props","dotClass","jsxs","classNames","jsx"],"mappings":"iKAIO,MAAMA,EAAgBC,EACzB,yKACA,CACI,SAAU,CACN,QAAS,CACL,QAAS,6BACT,YAAa,qCACb,QAAS,6BACT,QAAS,yBACT,KAAM,6BACN,UAAW,gCAAA,CACf,EAEJ,gBAAiB,CACb,QAAS,SAAA,CACb,CAER,EAIMC,EAA4C,CAC9C,QAAS,aACT,YAAa,iBACb,QAAS,aACT,QAAS,WACT,KAAM,aACN,UAAW,cACf,EAEO,SAASC,EAAM,CAClB,UAAAC,EACA,SAAAC,EACA,QAAAC,EACA,GAAGC,CACP,EAAsE,CAClE,MAAMC,EAAWN,EAAYI,GAAW,SAAS,EACjD,OACIG,EAAC,OAAA,CAAK,UAAWC,EAAWV,EAAc,CAAE,QAAAM,CAAA,CAAS,EAAGF,CAAS,EAAI,GAAGG,EACpE,SAAA,CAAAI,EAAC,QAAK,KAAK,eAAe,UAAWD,EAAW,sBAAuBF,CAAQ,EAAG,EAElFG,EAAC,QAAM,SAAAN,CAAA,CAAS,CAAA,EACpB,CAER"}
|
package/lib/index.css
CHANGED
|
@@ -75,6 +75,18 @@
|
|
|
75
75
|
--color-warning-900: var(--warning-900);
|
|
76
76
|
--color-warning-950: var(--warning-950);
|
|
77
77
|
|
|
78
|
+
--color-discovery-50: var(--discovery-50);
|
|
79
|
+
--color-discovery-100: var(--discovery-100);
|
|
80
|
+
--color-discovery-200: var(--discovery-200);
|
|
81
|
+
--color-discovery-300: var(--discovery-300);
|
|
82
|
+
--color-discovery-400: var(--discovery-400);
|
|
83
|
+
--color-discovery-500: var(--discovery-500);
|
|
84
|
+
--color-discovery-600: var(--discovery-600);
|
|
85
|
+
--color-discovery-700: var(--discovery-700);
|
|
86
|
+
--color-discovery-800: var(--discovery-800);
|
|
87
|
+
--color-discovery-900: var(--discovery-900);
|
|
88
|
+
--color-discovery-950: var(--discovery-950);
|
|
89
|
+
|
|
78
90
|
--color-foreground: var(--color-neutral-900);
|
|
79
91
|
--color-background: var(--color-neutral-100);
|
|
80
92
|
--color-elevation-1: var(--color-neutral-50);
|
|
@@ -92,6 +104,8 @@
|
|
|
92
104
|
--color-success-foreground: var(--color-elevation-1);
|
|
93
105
|
--color-warning: var(--color-warning-700);
|
|
94
106
|
--color-warning-foreground: var(--color-elevation-1);
|
|
107
|
+
--color-discovery: var(--color-discovery-700);
|
|
108
|
+
--color-discovery-foreground: var(--color-elevation-1);
|
|
95
109
|
|
|
96
110
|
--color-border: var(--color-neutral-300);
|
|
97
111
|
--color-input: var(--color-border);
|
package/lib/tokens.css
CHANGED
|
@@ -115,6 +115,29 @@
|
|
|
115
115
|
--neutral-800: var(--xneutral-800);
|
|
116
116
|
--neutral-900: var(--xneutral-900);
|
|
117
117
|
--neutral-950: var(--xneutral-950);
|
|
118
|
+
--discovery-hue: 292;
|
|
119
|
+
--xdiscovery-50: oklch(97% 0.014 var(--discovery-hue));
|
|
120
|
+
--xdiscovery-100: oklch(93.2% 0.032 var(--discovery-hue));
|
|
121
|
+
--xdiscovery-200: oklch(88.2% 0.059 var(--discovery-hue));
|
|
122
|
+
--xdiscovery-300: oklch(80.9% 0.105 var(--discovery-hue));
|
|
123
|
+
--xdiscovery-400: oklch(70.7% 0.165 var(--discovery-hue));
|
|
124
|
+
--xdiscovery-500: oklch(62.3% 0.214 var(--discovery-hue));
|
|
125
|
+
--xdiscovery-600: oklch(54.6% 0.245 var(--discovery-hue));
|
|
126
|
+
--xdiscovery-700: oklch(48.8% 0.243 var(--discovery-hue));
|
|
127
|
+
--xdiscovery-800: oklch(42.4% 0.199 var(--discovery-hue));
|
|
128
|
+
--xdiscovery-900: oklch(37.9% 0.146 var(--discovery-hue));
|
|
129
|
+
--xdiscovery-950: oklch(28.2% 0.091 var(--discovery-hue));
|
|
130
|
+
--discovery-50: var(--xdiscovery-50);
|
|
131
|
+
--discovery-100: var(--xdiscovery-100);
|
|
132
|
+
--discovery-200: var(--xdiscovery-200);
|
|
133
|
+
--discovery-300: var(--xdiscovery-300);
|
|
134
|
+
--discovery-400: var(--xdiscovery-400);
|
|
135
|
+
--discovery-500: var(--xdiscovery-500);
|
|
136
|
+
--discovery-600: var(--xdiscovery-600);
|
|
137
|
+
--discovery-700: var(--xdiscovery-700);
|
|
138
|
+
--discovery-800: var(--xdiscovery-800);
|
|
139
|
+
--discovery-900: var(--xdiscovery-900);
|
|
140
|
+
--discovery-950: var(--xdiscovery-950);
|
|
118
141
|
}
|
|
119
142
|
@media (prefers-color-scheme: dark) {
|
|
120
143
|
:root {
|
|
@@ -174,5 +197,16 @@
|
|
|
174
197
|
--neutral-800: var(--xneutral-200);
|
|
175
198
|
--neutral-900: var(--xneutral-100);
|
|
176
199
|
--neutral-950: var(--xneutral-50);
|
|
200
|
+
--discovery-50: var(--xdiscovery-950);
|
|
201
|
+
--discovery-100: var(--xdiscovery-900);
|
|
202
|
+
--discovery-200: var(--xdiscovery-800);
|
|
203
|
+
--discovery-300: var(--xdiscovery-700);
|
|
204
|
+
--discovery-400: var(--xdiscovery-600);
|
|
205
|
+
--discovery-500: var(--xdiscovery-500);
|
|
206
|
+
--discovery-600: var(--xdiscovery-400);
|
|
207
|
+
--discovery-700: var(--xdiscovery-300);
|
|
208
|
+
--discovery-800: var(--xdiscovery-200);
|
|
209
|
+
--discovery-900: var(--xdiscovery-100);
|
|
210
|
+
--discovery-950: var(--xdiscovery-50);
|
|
177
211
|
}
|
|
178
212
|
}
|