@codefast/ui 0.0.10 → 0.0.12
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/alert-dialog.js +4 -4
- package/dist/alert-dialog.mjs +2 -2
- package/dist/blockquote.js +2 -2
- package/dist/blockquote.js.map +1 -1
- package/dist/blockquote.mjs +2 -2
- package/dist/blockquote.mjs.map +1 -1
- package/dist/box.js +2 -2
- package/dist/box.js.map +1 -1
- package/dist/box.mjs +2 -2
- package/dist/box.mjs.map +1 -1
- package/dist/breadcrumb.js +2 -2
- package/dist/breadcrumb.js.map +1 -1
- package/dist/breadcrumb.mjs +2 -2
- package/dist/breadcrumb.mjs.map +1 -1
- package/dist/button.js +3 -3
- package/dist/button.mjs +2 -2
- package/dist/calendar.js +4 -4
- package/dist/calendar.mjs +2 -2
- package/dist/carousel.js +4 -4
- package/dist/carousel.mjs +2 -2
- package/dist/{chunk-XCBBSHAK.mjs → chunk-6J6VPUBP.mjs} +6 -3
- package/dist/chunk-6J6VPUBP.mjs.map +1 -0
- package/dist/{chunk-ORAVN37L.js → chunk-7S4DOWLB.js} +6 -3
- package/dist/chunk-7S4DOWLB.js.map +1 -0
- package/dist/{chunk-NEP3JDVQ.js → chunk-BWCO2ZQQ.js} +11 -15
- package/dist/chunk-BWCO2ZQQ.js.map +1 -0
- package/dist/{chunk-J6COVJTP.js → chunk-MDSPK3M6.js} +4 -10
- package/dist/chunk-MDSPK3M6.js.map +1 -0
- package/dist/{chunk-5UHPKXF4.mjs → chunk-V2254PQL.mjs} +4 -10
- package/dist/chunk-V2254PQL.mjs.map +1 -0
- package/dist/{chunk-XHZUPL2U.mjs → chunk-WFXEFJRB.mjs} +11 -15
- package/dist/chunk-WFXEFJRB.mjs.map +1 -0
- package/dist/code.js +2 -2
- package/dist/code.js.map +1 -1
- package/dist/code.mjs +2 -2
- package/dist/code.mjs.map +1 -1
- package/dist/container.js +2 -2
- package/dist/container.js.map +1 -1
- package/dist/container.mjs +2 -2
- package/dist/container.mjs.map +1 -1
- package/dist/data-table.js +8 -8
- package/dist/data-table.mjs +2 -2
- package/dist/em.js +2 -2
- package/dist/em.js.map +1 -1
- package/dist/em.mjs +2 -2
- package/dist/em.mjs.map +1 -1
- package/dist/heading.js +2 -2
- package/dist/heading.js.map +1 -1
- package/dist/heading.mjs +2 -2
- package/dist/heading.mjs.map +1 -1
- package/dist/kbd.js +2 -2
- package/dist/kbd.js.map +1 -1
- package/dist/kbd.mjs +2 -2
- package/dist/kbd.mjs.map +1 -1
- package/dist/pagination.js +3 -3
- package/dist/pagination.mjs +2 -2
- package/dist/pre.js +2 -2
- package/dist/pre.js.map +1 -1
- package/dist/pre.mjs +2 -2
- package/dist/pre.mjs.map +1 -1
- package/dist/quote.js +2 -2
- package/dist/quote.js.map +1 -1
- package/dist/quote.mjs +2 -2
- package/dist/quote.mjs.map +1 -1
- package/dist/section.js +2 -2
- package/dist/section.js.map +1 -1
- package/dist/section.mjs +2 -2
- package/dist/section.mjs.map +1 -1
- package/dist/spinner.js +2 -2
- package/dist/spinner.mjs +1 -1
- package/dist/strong.js +2 -2
- package/dist/strong.js.map +1 -1
- package/dist/strong.mjs +2 -2
- package/dist/strong.mjs.map +1 -1
- package/dist/text.js +2 -2
- package/dist/text.js.map +1 -1
- package/dist/text.mjs +2 -2
- package/dist/text.mjs.map +1 -1
- package/dist/toggle-group.js +2 -2
- package/dist/toggle-group.mjs +1 -1
- package/dist/toggle.js +2 -2
- package/dist/toggle.mjs +1 -1
- package/package.json +6 -5
- package/src/blockquote.tsx +2 -2
- package/src/box.tsx +2 -2
- package/src/breadcrumb.tsx +2 -2
- package/src/button.tsx +10 -11
- package/src/code.tsx +2 -2
- package/src/container.tsx +2 -2
- package/src/em.tsx +2 -2
- package/src/heading.tsx +2 -2
- package/src/kbd.tsx +2 -2
- package/src/pre.tsx +2 -2
- package/src/quote.tsx +2 -2
- package/src/section.tsx +2 -2
- package/src/spinner.tsx +3 -7
- package/src/strong.tsx +2 -2
- package/src/text.tsx +2 -2
- package/src/toggle.tsx +4 -1
- package/dist/chunk-5UHPKXF4.mjs.map +0 -1
- package/dist/chunk-J6COVJTP.js.map +0 -1
- package/dist/chunk-NEP3JDVQ.js.map +0 -1
- package/dist/chunk-ORAVN37L.js.map +0 -1
- package/dist/chunk-XCBBSHAK.mjs.map +0 -1
- package/dist/chunk-XHZUPL2U.mjs.map +0 -1
package/dist/text.js
CHANGED
|
@@ -3,8 +3,8 @@ var _react = require('react'); var React = _interopRequireWildcard(_react);
|
|
|
3
3
|
var _reactslot = require('@radix-ui/react-slot');
|
|
4
4
|
var _jsxruntime = require('react/jsx-runtime');
|
|
5
5
|
var Text = React.forwardRef(({ as: Tag = "p", asChild, ...props }, ref) => {
|
|
6
|
-
const
|
|
7
|
-
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
|
|
6
|
+
const Component = asChild ? _reactslot.Slot : Tag;
|
|
7
|
+
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Component, { ref, ...props });
|
|
8
8
|
});
|
|
9
9
|
Text.displayName = "Text";
|
|
10
10
|
|
package/dist/text.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/text.tsx"],"names":[],"mappings":";AAAA,YAAY,WAAW;AACvB,SAAS,YAAY;AAuBZ;AAHT,IAAM,OAAa,iBAAmC,CAAC,EAAE,IAAI,MAAM,KAAK,SAAS,GAAG,MAAM,GAAG,QAAQ;AACnG,QAAM,
|
|
1
|
+
{"version":3,"sources":["../src/text.tsx"],"names":[],"mappings":";AAAA,YAAY,WAAW;AACvB,SAAS,YAAY;AAuBZ;AAHT,IAAM,OAAa,iBAAmC,CAAC,EAAE,IAAI,MAAM,KAAK,SAAS,GAAG,MAAM,GAAG,QAAQ;AACnG,QAAM,YAAY,UAAU,OAAO;AAEnC,SAAO,oBAAC,aAAU,KAAW,GAAG,OAAO;AACzC,CAAC;AAED,KAAK,cAAc","sourcesContent":["import * as React from \"react\";\nimport { Slot } from \"@radix-ui/react-slot\";\n\n/* -----------------------------------------------------------------------------\n * Component: Text\n * -------------------------------------------------------------------------- */\n\ntype TextElement = HTMLParagraphElement;\n\ninterface TextParagraphProps extends React.HTMLAttributes<HTMLParagraphElement> {\n as?: \"p\";\n}\n\ninterface TextSpanProps extends React.HTMLAttributes<HTMLSpanElement> {\n as: \"span\";\n}\n\ntype TextProps = (TextParagraphProps | TextSpanProps) & {\n asChild?: boolean;\n};\n\nconst Text = React.forwardRef<TextElement, TextProps>(({ as: Tag = \"p\", asChild, ...props }, ref) => {\n const Component = asChild ? Slot : Tag;\n\n return <Component ref={ref} {...props} />;\n});\n\nText.displayName = \"Text\";\n\n/* -----------------------------------------------------------------------------\n * Exports\n * -------------------------------------------------------------------------- */\n\nexport { Text, type TextProps };\n"]}
|
package/dist/text.mjs
CHANGED
|
@@ -3,8 +3,8 @@ import * as React from "react";
|
|
|
3
3
|
import { Slot } from "@radix-ui/react-slot";
|
|
4
4
|
import { jsx } from "react/jsx-runtime";
|
|
5
5
|
var Text = React.forwardRef(({ as: Tag = "p", asChild, ...props }, ref) => {
|
|
6
|
-
const
|
|
7
|
-
return /* @__PURE__ */ jsx(
|
|
6
|
+
const Component = asChild ? Slot : Tag;
|
|
7
|
+
return /* @__PURE__ */ jsx(Component, { ref, ...props });
|
|
8
8
|
});
|
|
9
9
|
Text.displayName = "Text";
|
|
10
10
|
export {
|
package/dist/text.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/text.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Slot } from \"@radix-ui/react-slot\";\n\n/* -----------------------------------------------------------------------------\n * Component: Text\n * -------------------------------------------------------------------------- */\n\ntype TextElement = HTMLParagraphElement;\n\ninterface TextParagraphProps extends React.HTMLAttributes<HTMLParagraphElement> {\n as?: \"p\";\n}\n\ninterface TextSpanProps extends React.HTMLAttributes<HTMLSpanElement> {\n as: \"span\";\n}\n\ntype TextProps = (TextParagraphProps | TextSpanProps) & {\n asChild?: boolean;\n};\n\nconst Text = React.forwardRef<TextElement, TextProps>(({ as: Tag = \"p\", asChild, ...props }, ref) => {\n const
|
|
1
|
+
{"version":3,"sources":["../src/text.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Slot } from \"@radix-ui/react-slot\";\n\n/* -----------------------------------------------------------------------------\n * Component: Text\n * -------------------------------------------------------------------------- */\n\ntype TextElement = HTMLParagraphElement;\n\ninterface TextParagraphProps extends React.HTMLAttributes<HTMLParagraphElement> {\n as?: \"p\";\n}\n\ninterface TextSpanProps extends React.HTMLAttributes<HTMLSpanElement> {\n as: \"span\";\n}\n\ntype TextProps = (TextParagraphProps | TextSpanProps) & {\n asChild?: boolean;\n};\n\nconst Text = React.forwardRef<TextElement, TextProps>(({ as: Tag = \"p\", asChild, ...props }, ref) => {\n const Component = asChild ? Slot : Tag;\n\n return <Component ref={ref} {...props} />;\n});\n\nText.displayName = \"Text\";\n\n/* -----------------------------------------------------------------------------\n * Exports\n * -------------------------------------------------------------------------- */\n\nexport { Text, type TextProps };\n"],"mappings":";AAAA,YAAY,WAAW;AACvB,SAAS,YAAY;AAuBZ;AAHT,IAAM,OAAa,iBAAmC,CAAC,EAAE,IAAI,MAAM,KAAK,SAAS,GAAG,MAAM,GAAG,QAAQ;AACnG,QAAM,YAAY,UAAU,OAAO;AAEnC,SAAO,oBAAC,aAAU,KAAW,GAAG,OAAO;AACzC,CAAC;AAED,KAAK,cAAc;","names":[]}
|
package/dist/toggle-group.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use strict";Object.defineProperty(exports, "__esModule", {value: true}); function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { newObj[key] = obj[key]; } } } newObj.default = obj; return newObj; } }"use client";
|
|
2
2
|
|
|
3
3
|
|
|
4
|
-
var
|
|
4
|
+
var _chunk7S4DOWLBjs = require('./chunk-7S4DOWLB.js');
|
|
5
5
|
|
|
6
6
|
|
|
7
7
|
var _chunkG3NP7M2Njs = require('./chunk-G3NP7M2N.js');
|
|
@@ -41,7 +41,7 @@ var ToggleGroupItem = React.forwardRef(
|
|
|
41
41
|
ToggleGroupPrimitive.Item,
|
|
42
42
|
{
|
|
43
43
|
ref,
|
|
44
|
-
className:
|
|
44
|
+
className: _chunk7S4DOWLBjs.toggleVariants.call(void 0, { ...context, className }),
|
|
45
45
|
...toggleGroupScope,
|
|
46
46
|
...props,
|
|
47
47
|
children
|
package/dist/toggle-group.mjs
CHANGED
package/dist/toggle.js
CHANGED
|
@@ -2,10 +2,10 @@
|
|
|
2
2
|
|
|
3
3
|
|
|
4
4
|
|
|
5
|
-
var
|
|
5
|
+
var _chunk7S4DOWLBjs = require('./chunk-7S4DOWLB.js');
|
|
6
6
|
require('./chunk-G3NP7M2N.js');
|
|
7
7
|
|
|
8
8
|
|
|
9
9
|
|
|
10
|
-
exports.Toggle =
|
|
10
|
+
exports.Toggle = _chunk7S4DOWLBjs.Toggle; exports.toggleVariants = _chunk7S4DOWLBjs.toggleVariants;
|
|
11
11
|
//# sourceMappingURL=toggle.js.map
|
package/dist/toggle.mjs
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@codefast/ui",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.12",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"sideEffects": [
|
|
6
6
|
"**/*.css"
|
|
@@ -363,6 +363,7 @@
|
|
|
363
363
|
"@radix-ui/react-toggle-group": "^1.0.4",
|
|
364
364
|
"@radix-ui/react-tooltip": "^1.0.7",
|
|
365
365
|
"@radix-ui/react-use-controllable-state": "^1.0.1",
|
|
366
|
+
"@radix-ui/react-visually-hidden": "^1.0.3",
|
|
366
367
|
"@tanstack/react-table": "^8.15.3",
|
|
367
368
|
"cmdk": "^1.0.0",
|
|
368
369
|
"cva": "1.0.0-beta.1",
|
|
@@ -379,8 +380,8 @@
|
|
|
379
380
|
"devDependencies": {
|
|
380
381
|
"@turbo/gen": "^1.13.2",
|
|
381
382
|
"@types/eslint": "^8.56.7",
|
|
382
|
-
"@types/node": "^20.12.
|
|
383
|
-
"@types/react": "^18.2.
|
|
383
|
+
"@types/node": "^20.12.6",
|
|
384
|
+
"@types/react": "^18.2.75",
|
|
384
385
|
"autoprefixer": "^10.4.19",
|
|
385
386
|
"eslint": "^8.57.0",
|
|
386
387
|
"postcss": "^8.4.38",
|
|
@@ -389,8 +390,8 @@
|
|
|
389
390
|
"tailwindcss-animate": "^1.0.7",
|
|
390
391
|
"tsup": "^8.0.2",
|
|
391
392
|
"typescript": "^5.4.4",
|
|
392
|
-
"@codefast/
|
|
393
|
-
"@codefast/
|
|
393
|
+
"@codefast/typescript-config": "0.0.1",
|
|
394
|
+
"@codefast/eslint-config": "0.0.7"
|
|
394
395
|
},
|
|
395
396
|
"peerDependencies": {
|
|
396
397
|
"@types/react": "*",
|
package/src/blockquote.tsx
CHANGED
|
@@ -12,9 +12,9 @@ interface BlockquoteProps extends React.BlockquoteHTMLAttributes<HTMLQuoteElemen
|
|
|
12
12
|
}
|
|
13
13
|
|
|
14
14
|
const Blockquote = React.forwardRef<BlockquoteElement, BlockquoteProps>(({ asChild, ...props }, ref) => {
|
|
15
|
-
const
|
|
15
|
+
const Component = asChild ? Slot : "blockquote";
|
|
16
16
|
|
|
17
|
-
return <
|
|
17
|
+
return <Component ref={ref} {...props} />;
|
|
18
18
|
});
|
|
19
19
|
|
|
20
20
|
Blockquote.displayName = "Blockquote";
|
package/src/box.tsx
CHANGED
|
@@ -20,9 +20,9 @@ type BoxProps = (BoxDivProps | BoxSpanProps) & {
|
|
|
20
20
|
};
|
|
21
21
|
|
|
22
22
|
const Box = React.forwardRef<BoxElement, BoxProps>(({ as: Tag = "div", asChild, ...props }, ref) => {
|
|
23
|
-
const
|
|
23
|
+
const Component = asChild ? Slot : Tag;
|
|
24
24
|
|
|
25
|
-
return <
|
|
25
|
+
return <Component ref={ref} {...props} />;
|
|
26
26
|
});
|
|
27
27
|
|
|
28
28
|
Box.displayName = "Box";
|
package/src/breadcrumb.tsx
CHANGED
|
@@ -65,9 +65,9 @@ interface BreadcrumbLinkProps extends React.AnchorHTMLAttributes<HTMLAnchorEleme
|
|
|
65
65
|
|
|
66
66
|
const BreadcrumbLink = React.forwardRef<BreadcrumbLinkElement, BreadcrumbLinkProps>(
|
|
67
67
|
({ asChild, className, ...props }, ref) => {
|
|
68
|
-
const
|
|
68
|
+
const Component = asChild ? Slot : "a";
|
|
69
69
|
|
|
70
|
-
return <
|
|
70
|
+
return <Component ref={ref} className={cn("transition-colors", "hover:text-foreground", className)} {...props} />;
|
|
71
71
|
},
|
|
72
72
|
);
|
|
73
73
|
|
package/src/button.tsx
CHANGED
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { Slot } from "@radix-ui/react-slot";
|
|
3
3
|
import { type VariantProps } from "cva";
|
|
4
|
+
import { Fragment } from "react";
|
|
5
|
+
import { VisuallyHidden } from "@radix-ui/react-visually-hidden";
|
|
4
6
|
import { Spinner } from "./spinner";
|
|
5
7
|
import { cva } from "./utils";
|
|
6
8
|
|
|
@@ -58,11 +60,12 @@ interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, But
|
|
|
58
60
|
|
|
59
61
|
const Button = React.forwardRef<ButtonElement, ButtonProps>(
|
|
60
62
|
({ children, className, variant, size, loading = false, asChild = false, ...props }, ref) => {
|
|
61
|
-
const
|
|
63
|
+
const Component = asChild ? Slot : "button";
|
|
64
|
+
const ComponentLoading = asChild ? "span" : Fragment;
|
|
62
65
|
const disabled = loading || props.disabled;
|
|
63
66
|
|
|
64
67
|
return (
|
|
65
|
-
<
|
|
68
|
+
<Component
|
|
66
69
|
ref={ref}
|
|
67
70
|
type={asChild ? undefined : "button"}
|
|
68
71
|
className={buttonVariants({ variant, size, loading, className })}
|
|
@@ -70,23 +73,19 @@ const Button = React.forwardRef<ButtonElement, ButtonProps>(
|
|
|
70
73
|
disabled={disabled}
|
|
71
74
|
>
|
|
72
75
|
{loading ? (
|
|
73
|
-
|
|
74
|
-
<span
|
|
75
|
-
aria-hidden
|
|
76
|
-
className="invisible contents"
|
|
77
|
-
// Workaround to use `inert` until https://github.com/facebook/react/pull/24730 is merged.
|
|
78
|
-
{...{ inert: "" }}
|
|
79
|
-
>
|
|
76
|
+
<ComponentLoading>
|
|
77
|
+
<span aria-hidden className="invisible contents">
|
|
80
78
|
{children}
|
|
81
79
|
</span>
|
|
80
|
+
<VisuallyHidden>{children}</VisuallyHidden>
|
|
82
81
|
<span className="absolute inset-0 flex items-center justify-center">
|
|
83
82
|
<Spinner />
|
|
84
83
|
</span>
|
|
85
|
-
|
|
84
|
+
</ComponentLoading>
|
|
86
85
|
) : (
|
|
87
86
|
children
|
|
88
87
|
)}
|
|
89
|
-
</
|
|
88
|
+
</Component>
|
|
90
89
|
);
|
|
91
90
|
},
|
|
92
91
|
);
|
package/src/code.tsx
CHANGED
|
@@ -12,9 +12,9 @@ interface CodeProps extends React.HTMLAttributes<HTMLElement> {
|
|
|
12
12
|
}
|
|
13
13
|
|
|
14
14
|
const Code = React.forwardRef<CodeElement, CodeProps>(({ asChild, ...props }, ref) => {
|
|
15
|
-
const
|
|
15
|
+
const Component = asChild ? Slot : "code";
|
|
16
16
|
|
|
17
|
-
return <
|
|
17
|
+
return <Component ref={ref} {...props} />;
|
|
18
18
|
});
|
|
19
19
|
|
|
20
20
|
Code.displayName = "Code";
|
package/src/container.tsx
CHANGED
|
@@ -13,9 +13,9 @@ interface ContainerProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
const Container = React.forwardRef<ContainerElement, ContainerProps>(({ className, asChild, ...props }, ref) => {
|
|
16
|
-
const
|
|
16
|
+
const Component = asChild ? Slot : "div";
|
|
17
17
|
|
|
18
|
-
return <
|
|
18
|
+
return <Component ref={ref} className={cn("container", className)} {...props} />;
|
|
19
19
|
});
|
|
20
20
|
|
|
21
21
|
Container.displayName = "Container";
|
package/src/em.tsx
CHANGED
|
@@ -12,9 +12,9 @@ interface EmProps extends React.HTMLAttributes<HTMLElement> {
|
|
|
12
12
|
}
|
|
13
13
|
|
|
14
14
|
const Em = React.forwardRef<EmElement, EmProps>(({ asChild, ...props }, ref) => {
|
|
15
|
-
const
|
|
15
|
+
const Component = asChild ? Slot : "em";
|
|
16
16
|
|
|
17
|
-
return <
|
|
17
|
+
return <Component ref={ref} {...props} />;
|
|
18
18
|
});
|
|
19
19
|
|
|
20
20
|
Em.displayName = "Em";
|
package/src/heading.tsx
CHANGED
|
@@ -13,9 +13,9 @@ interface HeadingProps extends React.HTMLAttributes<HTMLHeadingElement> {
|
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
const Heading = React.forwardRef<HeadingElement, HeadingProps>(({ asChild, as: Tag = "h1", ...props }, ref) => {
|
|
16
|
-
const
|
|
16
|
+
const Component = asChild ? Slot : Tag;
|
|
17
17
|
|
|
18
|
-
return <
|
|
18
|
+
return <Component ref={ref} {...props} />;
|
|
19
19
|
});
|
|
20
20
|
|
|
21
21
|
Heading.displayName = "Heading";
|
package/src/kbd.tsx
CHANGED
|
@@ -13,10 +13,10 @@ interface KbdProps extends React.HTMLAttributes<HTMLElement> {
|
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
const Kbd = React.forwardRef<KbdElement, KbdProps>(({ asChild, className, ...props }, ref) => {
|
|
16
|
-
const
|
|
16
|
+
const Component = asChild ? Slot : "kbd";
|
|
17
17
|
|
|
18
18
|
return (
|
|
19
|
-
<
|
|
19
|
+
<Component
|
|
20
20
|
ref={ref}
|
|
21
21
|
className={cn(
|
|
22
22
|
"bg-muted text-muted-foreground inline-flex h-5 select-none items-center gap-1 rounded border px-1.5 font-mono text-xs font-medium",
|
package/src/pre.tsx
CHANGED
|
@@ -12,9 +12,9 @@ interface PreProps extends React.HTMLAttributes<HTMLPreElement> {
|
|
|
12
12
|
}
|
|
13
13
|
|
|
14
14
|
const Pre = React.forwardRef<PreElement, PreProps>(({ asChild, ...props }, ref) => {
|
|
15
|
-
const
|
|
15
|
+
const Component = asChild ? Slot : "pre";
|
|
16
16
|
|
|
17
|
-
return <
|
|
17
|
+
return <Component ref={ref} {...props} />;
|
|
18
18
|
});
|
|
19
19
|
|
|
20
20
|
Pre.displayName = "Pre";
|
package/src/quote.tsx
CHANGED
|
@@ -12,9 +12,9 @@ interface QuoteProps extends React.QuoteHTMLAttributes<HTMLQuoteElement> {
|
|
|
12
12
|
}
|
|
13
13
|
|
|
14
14
|
const Quote = React.forwardRef<QuoteElement, QuoteProps>(({ asChild, ...props }, ref) => {
|
|
15
|
-
const
|
|
15
|
+
const Component = asChild ? Slot : "q";
|
|
16
16
|
|
|
17
|
-
return <
|
|
17
|
+
return <Component ref={ref} {...props} />;
|
|
18
18
|
});
|
|
19
19
|
|
|
20
20
|
Quote.displayName = "Quote";
|
package/src/section.tsx
CHANGED
|
@@ -12,9 +12,9 @@ interface SectionProps extends React.HTMLAttributes<HTMLElement> {
|
|
|
12
12
|
}
|
|
13
13
|
|
|
14
14
|
const Section = React.forwardRef<SectionElement, SectionProps>(({ asChild, ...props }, ref) => {
|
|
15
|
-
const
|
|
15
|
+
const Component = asChild ? Slot : "section";
|
|
16
16
|
|
|
17
|
-
return <
|
|
17
|
+
return <Component ref={ref} {...props} />;
|
|
18
18
|
});
|
|
19
19
|
|
|
20
20
|
Section.displayName = "Section";
|
package/src/spinner.tsx
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
+
import { VisuallyHidden } from "@radix-ui/react-visually-hidden";
|
|
2
3
|
import { cn } from "./utils";
|
|
3
4
|
|
|
4
5
|
/* -----------------------------------------------------------------------------
|
|
@@ -51,15 +52,10 @@ const Spinner = React.forwardRef<SpinnerElement, SpinnerProps>(
|
|
|
51
52
|
|
|
52
53
|
return (
|
|
53
54
|
<span className="relative">
|
|
54
|
-
<span
|
|
55
|
-
aria-hidden
|
|
56
|
-
className="invisible contents"
|
|
57
|
-
// Workaround to use `inert` until https://github.com/facebook/react/pull/24730 is merged.
|
|
58
|
-
{...{ inert: "" }}
|
|
59
|
-
>
|
|
55
|
+
<span aria-hidden className="invisible contents">
|
|
60
56
|
{children}
|
|
61
57
|
</span>
|
|
62
|
-
|
|
58
|
+
<VisuallyHidden>{children}</VisuallyHidden>
|
|
63
59
|
<span className="absolute inset-0 flex items-center justify-center">{spinner}</span>
|
|
64
60
|
</span>
|
|
65
61
|
);
|
package/src/strong.tsx
CHANGED
|
@@ -12,9 +12,9 @@ interface StrongProps extends React.HTMLAttributes<HTMLElement> {
|
|
|
12
12
|
}
|
|
13
13
|
|
|
14
14
|
const Strong = React.forwardRef<StrongElement, StrongProps>(({ asChild, ...props }, ref) => {
|
|
15
|
-
const
|
|
15
|
+
const Component = asChild ? Slot : "strong";
|
|
16
16
|
|
|
17
|
-
return <
|
|
17
|
+
return <Component ref={ref} {...props} />;
|
|
18
18
|
});
|
|
19
19
|
|
|
20
20
|
Strong.displayName = "Strong";
|
package/src/text.tsx
CHANGED
|
@@ -20,9 +20,9 @@ type TextProps = (TextParagraphProps | TextSpanProps) & {
|
|
|
20
20
|
};
|
|
21
21
|
|
|
22
22
|
const Text = React.forwardRef<TextElement, TextProps>(({ as: Tag = "p", asChild, ...props }, ref) => {
|
|
23
|
-
const
|
|
23
|
+
const Component = asChild ? Slot : Tag;
|
|
24
24
|
|
|
25
|
-
return <
|
|
25
|
+
return <Component ref={ref} {...props} />;
|
|
26
26
|
});
|
|
27
27
|
|
|
28
28
|
Text.displayName = "Text";
|
package/src/toggle.tsx
CHANGED
|
@@ -11,8 +11,11 @@ import { cva } from "./utils";
|
|
|
11
11
|
|
|
12
12
|
const toggleVariants = cva({
|
|
13
13
|
base: [
|
|
14
|
-
"
|
|
14
|
+
"inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors",
|
|
15
|
+
"hover:bg-muted hover:text-muted-foreground",
|
|
15
16
|
"focus-visible:ring-ring focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2",
|
|
17
|
+
"data-[state=on]:bg-accent data-[state=on]:text-accent-foreground",
|
|
18
|
+
"disabled:pointer-events-none disabled:opacity-50",
|
|
16
19
|
],
|
|
17
20
|
variants: {
|
|
18
21
|
variant: {
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/spinner.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"./utils\";\n\n/* -----------------------------------------------------------------------------\n * Component: Spinner\n * -------------------------------------------------------------------------- */\n\nconst spinnerCount = 8;\n\ntype SpinnerElement = HTMLSpanElement;\n\ninterface SpinnerProps extends React.HTMLAttributes<HTMLSpanElement> {\n loading?: boolean;\n}\n\nconst Spinner = React.forwardRef<SpinnerElement, SpinnerProps>(\n ({ className, loading = true, children, ...props }, ref) => {\n if (!loading) {\n return children;\n }\n\n const spinner = (\n <span\n ref={ref}\n className={cn(\"relative flex size-4 items-center justify-center opacity-60\", className)}\n {...props}\n >\n {Array.from({ length: spinnerCount }, (_, i) => (\n <span\n key={i}\n className={cn(\n \"absolute h-full rotate-[var(--spinner-rotate)]\",\n \"before:fade-out-25 before:animate-out before:repeat-infinite before:block before:h-1/3 before:w-full before:rounded-full before:bg-current before:[animation-delay:var(--spinner-delay)] before:[animation-duration:var(--spinner-duration)]\",\n )}\n style={\n {\n width: `${(100 / spinnerCount).toString()}%`,\n \"--spinner-delay\": `-${((spinnerCount - i) * 100).toString()}ms`,\n \"--spinner-rotate\": `${((360 / spinnerCount) * i).toString()}deg`,\n \"--spinner-duration\": `${(spinnerCount * 100).toString()}ms`,\n } as React.CSSProperties\n }\n />\n ))}\n </span>\n );\n\n if (children === undefined) {\n return spinner;\n }\n\n return (\n <span className=\"relative\">\n <span\n aria-hidden\n className=\"invisible contents\"\n // Workaround to use `inert` until https://github.com/facebook/react/pull/24730 is merged.\n {...{ inert: \"\" }}\n >\n {children}\n </span>\n\n <span className=\"absolute inset-0 flex items-center justify-center\">{spinner}</span>\n </span>\n );\n },\n);\n\nSpinner.displayName = \"Spinner\";\n\n/* -----------------------------------------------------------------------------\n * Exports\n * -------------------------------------------------------------------------- */\n\nexport { Spinner, type SpinnerProps };\n"],"mappings":";;;;;AAAA,YAAY,WAAW;AA4Bb,cAwBJ,YAxBI;AArBV,IAAM,eAAe;AAQrB,IAAM,UAAgB;AAAA,EACpB,CAAC,EAAE,WAAW,UAAU,MAAM,UAAU,GAAG,MAAM,GAAG,QAAQ;AAC1D,QAAI,CAAC,SAAS;AACZ,aAAO;AAAA,IACT;AAEA,UAAM,UACJ;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,WAAW,GAAG,+DAA+D,SAAS;AAAA,QACrF,GAAG;AAAA,QAEH,gBAAM,KAAK,EAAE,QAAQ,aAAa,GAAG,CAAC,GAAG,MACxC;AAAA,UAAC;AAAA;AAAA,YAEC,WAAW;AAAA,cACT;AAAA,cACA;AAAA,YACF;AAAA,YACA,OACE;AAAA,cACE,OAAO,IAAI,MAAM,cAAc,SAAS,CAAC;AAAA,cACzC,mBAAmB,MAAM,eAAe,KAAK,KAAK,SAAS,CAAC;AAAA,cAC5D,oBAAoB,IAAK,MAAM,eAAgB,GAAG,SAAS,CAAC;AAAA,cAC5D,sBAAsB,IAAI,eAAe,KAAK,SAAS,CAAC;AAAA,YAC1D;AAAA;AAAA,UAXG;AAAA,QAaP,CACD;AAAA;AAAA,IACH;AAGF,QAAI,aAAa,QAAW;AAC1B,aAAO;AAAA,IACT;AAEA,WACE,qBAAC,UAAK,WAAU,YACd;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,eAAW;AAAA,UACX,WAAU;AAAA,UAET,GAAG,EAAE,OAAO,GAAG;AAAA,UAEf;AAAA;AAAA,MACH;AAAA,MAEA,oBAAC,UAAK,WAAU,qDAAqD,mBAAQ;AAAA,OAC/E;AAAA,EAEJ;AACF;AAEA,QAAQ,cAAc;","names":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/spinner.tsx"],"names":[],"mappings":";;;;;AAAA,YAAY,WAAW;AA4Bb,cAwBJ,YAxBI;AArBV,IAAM,eAAe;AAQrB,IAAM,UAAgB;AAAA,EACpB,CAAC,EAAE,WAAW,UAAU,MAAM,UAAU,GAAG,MAAM,GAAG,QAAQ;AAC1D,QAAI,CAAC,SAAS;AACZ,aAAO;AAAA,IACT;AAEA,UAAM,UACJ;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,WAAW,GAAG,+DAA+D,SAAS;AAAA,QACrF,GAAG;AAAA,QAEH,gBAAM,KAAK,EAAE,QAAQ,aAAa,GAAG,CAAC,GAAG,MACxC;AAAA,UAAC;AAAA;AAAA,YAEC,WAAW;AAAA,cACT;AAAA,cACA;AAAA,YACF;AAAA,YACA,OACE;AAAA,cACE,OAAO,IAAI,MAAM,cAAc,SAAS,CAAC;AAAA,cACzC,mBAAmB,MAAM,eAAe,KAAK,KAAK,SAAS,CAAC;AAAA,cAC5D,oBAAoB,IAAK,MAAM,eAAgB,GAAG,SAAS,CAAC;AAAA,cAC5D,sBAAsB,IAAI,eAAe,KAAK,SAAS,CAAC;AAAA,YAC1D;AAAA;AAAA,UAXG;AAAA,QAaP,CACD;AAAA;AAAA,IACH;AAGF,QAAI,aAAa,QAAW;AAC1B,aAAO;AAAA,IACT;AAEA,WACE,qBAAC,UAAK,WAAU,YACd;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,eAAW;AAAA,UACX,WAAU;AAAA,UAET,GAAG,EAAE,OAAO,GAAG;AAAA,UAEf;AAAA;AAAA,MACH;AAAA,MAEA,oBAAC,UAAK,WAAU,qDAAqD,mBAAQ;AAAA,OAC/E;AAAA,EAEJ;AACF;AAEA,QAAQ,cAAc","sourcesContent":["import * as React from \"react\";\nimport { cn } from \"./utils\";\n\n/* -----------------------------------------------------------------------------\n * Component: Spinner\n * -------------------------------------------------------------------------- */\n\nconst spinnerCount = 8;\n\ntype SpinnerElement = HTMLSpanElement;\n\ninterface SpinnerProps extends React.HTMLAttributes<HTMLSpanElement> {\n loading?: boolean;\n}\n\nconst Spinner = React.forwardRef<SpinnerElement, SpinnerProps>(\n ({ className, loading = true, children, ...props }, ref) => {\n if (!loading) {\n return children;\n }\n\n const spinner = (\n <span\n ref={ref}\n className={cn(\"relative flex size-4 items-center justify-center opacity-60\", className)}\n {...props}\n >\n {Array.from({ length: spinnerCount }, (_, i) => (\n <span\n key={i}\n className={cn(\n \"absolute h-full rotate-[var(--spinner-rotate)]\",\n \"before:fade-out-25 before:animate-out before:repeat-infinite before:block before:h-1/3 before:w-full before:rounded-full before:bg-current before:[animation-delay:var(--spinner-delay)] before:[animation-duration:var(--spinner-duration)]\",\n )}\n style={\n {\n width: `${(100 / spinnerCount).toString()}%`,\n \"--spinner-delay\": `-${((spinnerCount - i) * 100).toString()}ms`,\n \"--spinner-rotate\": `${((360 / spinnerCount) * i).toString()}deg`,\n \"--spinner-duration\": `${(spinnerCount * 100).toString()}ms`,\n } as React.CSSProperties\n }\n />\n ))}\n </span>\n );\n\n if (children === undefined) {\n return spinner;\n }\n\n return (\n <span className=\"relative\">\n <span\n aria-hidden\n className=\"invisible contents\"\n // Workaround to use `inert` until https://github.com/facebook/react/pull/24730 is merged.\n {...{ inert: \"\" }}\n >\n {children}\n </span>\n\n <span className=\"absolute inset-0 flex items-center justify-center\">{spinner}</span>\n </span>\n );\n },\n);\n\nSpinner.displayName = \"Spinner\";\n\n/* -----------------------------------------------------------------------------\n * Exports\n * -------------------------------------------------------------------------- */\n\nexport { Spinner, type SpinnerProps };\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/button.tsx"],"names":[],"mappings":";;;;;;;;AAAA,YAAY,WAAW;AACvB,SAAS,YAAY;AAuEX,mBACE,KADF;AA9DV,IAAM,iBAAiB,IAAI;AAAA,EACzB,MAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAAA,EACA,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,MACT,aAAa;AAAA,MACb,OAAO;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA,MACT,WAAW;AAAA,IACb;AAAA,IACA,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,MAAM;AAAA,MACN,WAAW;AAAA,MACX,WAAW;AAAA,MACX,WAAW;AAAA,IACb;AAAA,IACA,SAAS;AAAA,MACP,MAAM;AAAA,IACR;AAAA,EACF;AAAA,EACA,iBAAiB;AAAA,IACf,MAAM;AAAA,IACN,SAAS;AAAA,IACT,SAAS;AAAA,EACX;AACF,CAAC;AAcD,IAAM,SAAe;AAAA,EACnB,CAAC,EAAE,UAAU,WAAW,SAAS,MAAM,UAAU,OAAO,UAAU,OAAO,GAAG,MAAM,GAAG,QAAQ;AAC3F,UAAM,OAAO,UAAU,OAAO;AAC9B,UAAM,WAAW,WAAW,MAAM;AAElC,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,MAAM,UAAU,SAAY;AAAA,QAC5B,WAAW,eAAe,EAAE,SAAS,MAAM,SAAS,UAAU,CAAC;AAAA,QAC9D,GAAG;AAAA,QACJ;AAAA,QAEC,oBACC,iCACE;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,eAAW;AAAA,cACX,WAAU;AAAA,cAET,GAAG,EAAE,OAAO,GAAG;AAAA,cAEf;AAAA;AAAA,UACH;AAAA,UACA,oBAAC,UAAK,WAAU,qDACd,8BAAC,WAAQ,GACX;AAAA,WACF,IAEA;AAAA;AAAA,IAEJ;AAAA,EAEJ;AACF;AAEA,OAAO,cAAc","sourcesContent":["import * as React from \"react\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { type VariantProps } from \"cva\";\nimport { Spinner } from \"./spinner\";\nimport { cva } from \"./utils\";\n\n/* -----------------------------------------------------------------------------\n * Variant: Button\n * -------------------------------------------------------------------------- */\n\nconst buttonVariants = cva({\n base: [\n \"inline-flex select-none items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors\",\n \"disabled:pointer-events-none disabled:opacity-50\",\n \"focus-visible:ring-ring focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2\",\n ],\n variants: {\n variant: {\n default: \"bg-primary text-primary-foreground hover:bg-primary/90 shadow\",\n destructive: \"bg-destructive text-destructive-foreground hover:bg-destructive/90 shadow-sm\",\n ghost: \"hover:bg-accent hover:text-accent-foreground\",\n link: \"text-primary underline-offset-4 hover:underline\",\n outline: \"border-input bg-background hover:bg-accent hover:text-accent-foreground border shadow-sm\",\n secondary: \"bg-secondary text-secondary-foreground hover:bg-secondary/80 shadow-sm\",\n },\n size: {\n default: \"h-10 px-4\",\n xs: \"h-8 px-2\",\n sm: \"h-9 px-3\",\n lg: \"h-11 px-8\",\n icon: \"size-10\",\n \"icon-xs\": \"size-8\",\n \"icon-sm\": \"size-9\",\n \"icon-lg\": \"size-11\",\n },\n loading: {\n true: \"relative\",\n },\n },\n defaultVariants: {\n size: \"default\",\n variant: \"default\",\n loading: false,\n },\n});\n\ntype ButtonVariantsProps = VariantProps<typeof buttonVariants>;\n\n/* -----------------------------------------------------------------------------\n * Component: Button\n * -------------------------------------------------------------------------- */\n\ntype ButtonElement = HTMLButtonElement;\n\ninterface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, ButtonVariantsProps {\n asChild?: boolean;\n}\n\nconst Button = React.forwardRef<ButtonElement, ButtonProps>(\n ({ children, className, variant, size, loading = false, asChild = false, ...props }, ref) => {\n const Comp = asChild ? Slot : \"button\";\n const disabled = loading || props.disabled;\n\n return (\n <Comp\n ref={ref}\n type={asChild ? undefined : \"button\"}\n className={buttonVariants({ variant, size, loading, className })}\n {...props}\n disabled={disabled}\n >\n {loading ? (\n <>\n <span\n aria-hidden\n className=\"invisible contents\"\n // Workaround to use `inert` until https://github.com/facebook/react/pull/24730 is merged.\n {...{ inert: \"\" }}\n >\n {children}\n </span>\n <span className=\"absolute inset-0 flex items-center justify-center\">\n <Spinner />\n </span>\n </>\n ) : (\n children\n )}\n </Comp>\n );\n },\n);\n\nButton.displayName = \"Button\";\n\n/* -----------------------------------------------------------------------------\n * Exports\n * -------------------------------------------------------------------------- */\n\nexport { Button, buttonVariants, type ButtonProps, type ButtonVariantsProps };\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/toggle.tsx"],"names":[],"mappings":";;;;;AAEA,YAAY,WAAW;AACvB,YAAY,qBAAqB;AAwC/B;AAhCF,IAAM,iBAAiB,IAAI;AAAA,EACzB,MAAM;AAAA,IACJ;AAAA,IACA;AAAA,EACF;AAAA,EACA,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,MACT,SAAS;AAAA,IACX;AAAA,IACA,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,IAAI;AAAA,MACJ,IAAI;AAAA,IACN;AAAA,EACF;AAAA,EACA,iBAAiB;AAAA,IACf,SAAS;AAAA,IACT,MAAM;AAAA,EACR;AACF,CAAC;AAWD,IAAM,SAAe,iBAAuC,CAAC,EAAE,WAAW,SAAS,MAAM,GAAG,MAAM,GAAG,QACnG,oBAAiB,sBAAhB,EAAqB,KAAU,WAAW,eAAe,EAAE,SAAS,MAAM,UAAU,CAAC,GAAI,GAAG,OAAO,CACrG;AAED,OAAO,cAA8B,qBAAK","sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport * as TogglePrimitive from \"@radix-ui/react-toggle\";\nimport { type VariantProps } from \"cva\";\nimport { cva } from \"./utils\";\n\n/* -----------------------------------------------------------------------------\n * Variant: Toggle\n * -------------------------------------------------------------------------- */\n\nconst toggleVariants = cva({\n base: [\n \"hover:bg-muted hover:text-muted-foreground data-[state=on]:bg-accent data-[state=on]:text-accent-foreground inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors disabled:pointer-events-none disabled:opacity-50\",\n \"focus-visible:ring-ring focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2\",\n ],\n variants: {\n variant: {\n default: \"bg-transparent\",\n outline: \"border-input hover:bg-accent hover:text-accent-foreground border bg-transparent shadow-sm\",\n },\n size: {\n default: \"h-10 px-3\",\n sm: \"h-9 px-2.5\",\n lg: \"h-11 px-5\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n size: \"default\",\n },\n});\n\ntype ToggleVariantsProps = VariantProps<typeof toggleVariants>;\n\n/* -----------------------------------------------------------------------------\n * Component: Toggle\n * -------------------------------------------------------------------------- */\n\ntype ToggleElement = React.ElementRef<typeof TogglePrimitive.Root>;\ntype ToggleProps = React.ComponentPropsWithoutRef<typeof TogglePrimitive.Root> & ToggleVariantsProps;\n\nconst Toggle = React.forwardRef<ToggleElement, ToggleProps>(({ className, variant, size, ...props }, ref) => (\n <TogglePrimitive.Root ref={ref} className={toggleVariants({ variant, size, className })} {...props} />\n));\n\nToggle.displayName = TogglePrimitive.Root.displayName;\n\n/* -----------------------------------------------------------------------------\n * Exports\n * -------------------------------------------------------------------------- */\nexport { Toggle, toggleVariants, type ToggleProps, type ToggleVariantsProps };\n"]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/toggle.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport * as TogglePrimitive from \"@radix-ui/react-toggle\";\nimport { type VariantProps } from \"cva\";\nimport { cva } from \"./utils\";\n\n/* -----------------------------------------------------------------------------\n * Variant: Toggle\n * -------------------------------------------------------------------------- */\n\nconst toggleVariants = cva({\n base: [\n \"hover:bg-muted hover:text-muted-foreground data-[state=on]:bg-accent data-[state=on]:text-accent-foreground inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors disabled:pointer-events-none disabled:opacity-50\",\n \"focus-visible:ring-ring focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2\",\n ],\n variants: {\n variant: {\n default: \"bg-transparent\",\n outline: \"border-input hover:bg-accent hover:text-accent-foreground border bg-transparent shadow-sm\",\n },\n size: {\n default: \"h-10 px-3\",\n sm: \"h-9 px-2.5\",\n lg: \"h-11 px-5\",\n },\n },\n defaultVariants: {\n variant: \"default\",\n size: \"default\",\n },\n});\n\ntype ToggleVariantsProps = VariantProps<typeof toggleVariants>;\n\n/* -----------------------------------------------------------------------------\n * Component: Toggle\n * -------------------------------------------------------------------------- */\n\ntype ToggleElement = React.ElementRef<typeof TogglePrimitive.Root>;\ntype ToggleProps = React.ComponentPropsWithoutRef<typeof TogglePrimitive.Root> & ToggleVariantsProps;\n\nconst Toggle = React.forwardRef<ToggleElement, ToggleProps>(({ className, variant, size, ...props }, ref) => (\n <TogglePrimitive.Root ref={ref} className={toggleVariants({ variant, size, className })} {...props} />\n));\n\nToggle.displayName = TogglePrimitive.Root.displayName;\n\n/* -----------------------------------------------------------------------------\n * Exports\n * -------------------------------------------------------------------------- */\nexport { Toggle, toggleVariants, type ToggleProps, type ToggleVariantsProps };\n"],"mappings":";;;;;AAEA,YAAY,WAAW;AACvB,YAAY,qBAAqB;AAwC/B;AAhCF,IAAM,iBAAiB,IAAI;AAAA,EACzB,MAAM;AAAA,IACJ;AAAA,IACA;AAAA,EACF;AAAA,EACA,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,MACT,SAAS;AAAA,IACX;AAAA,IACA,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,IAAI;AAAA,MACJ,IAAI;AAAA,IACN;AAAA,EACF;AAAA,EACA,iBAAiB;AAAA,IACf,SAAS;AAAA,IACT,MAAM;AAAA,EACR;AACF,CAAC;AAWD,IAAM,SAAe,iBAAuC,CAAC,EAAE,WAAW,SAAS,MAAM,GAAG,MAAM,GAAG,QACnG,oBAAiB,sBAAhB,EAAqB,KAAU,WAAW,eAAe,EAAE,SAAS,MAAM,UAAU,CAAC,GAAI,GAAG,OAAO,CACrG;AAED,OAAO,cAA8B,qBAAK;","names":[]}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/button.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { Slot } from \"@radix-ui/react-slot\";\nimport { type VariantProps } from \"cva\";\nimport { Spinner } from \"./spinner\";\nimport { cva } from \"./utils\";\n\n/* -----------------------------------------------------------------------------\n * Variant: Button\n * -------------------------------------------------------------------------- */\n\nconst buttonVariants = cva({\n base: [\n \"inline-flex select-none items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors\",\n \"disabled:pointer-events-none disabled:opacity-50\",\n \"focus-visible:ring-ring focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2\",\n ],\n variants: {\n variant: {\n default: \"bg-primary text-primary-foreground hover:bg-primary/90 shadow\",\n destructive: \"bg-destructive text-destructive-foreground hover:bg-destructive/90 shadow-sm\",\n ghost: \"hover:bg-accent hover:text-accent-foreground\",\n link: \"text-primary underline-offset-4 hover:underline\",\n outline: \"border-input bg-background hover:bg-accent hover:text-accent-foreground border shadow-sm\",\n secondary: \"bg-secondary text-secondary-foreground hover:bg-secondary/80 shadow-sm\",\n },\n size: {\n default: \"h-10 px-4\",\n xs: \"h-8 px-2\",\n sm: \"h-9 px-3\",\n lg: \"h-11 px-8\",\n icon: \"size-10\",\n \"icon-xs\": \"size-8\",\n \"icon-sm\": \"size-9\",\n \"icon-lg\": \"size-11\",\n },\n loading: {\n true: \"relative\",\n },\n },\n defaultVariants: {\n size: \"default\",\n variant: \"default\",\n loading: false,\n },\n});\n\ntype ButtonVariantsProps = VariantProps<typeof buttonVariants>;\n\n/* -----------------------------------------------------------------------------\n * Component: Button\n * -------------------------------------------------------------------------- */\n\ntype ButtonElement = HTMLButtonElement;\n\ninterface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, ButtonVariantsProps {\n asChild?: boolean;\n}\n\nconst Button = React.forwardRef<ButtonElement, ButtonProps>(\n ({ children, className, variant, size, loading = false, asChild = false, ...props }, ref) => {\n const Comp = asChild ? Slot : \"button\";\n const disabled = loading || props.disabled;\n\n return (\n <Comp\n ref={ref}\n type={asChild ? undefined : \"button\"}\n className={buttonVariants({ variant, size, loading, className })}\n {...props}\n disabled={disabled}\n >\n {loading ? (\n <>\n <span\n aria-hidden\n className=\"invisible contents\"\n // Workaround to use `inert` until https://github.com/facebook/react/pull/24730 is merged.\n {...{ inert: \"\" }}\n >\n {children}\n </span>\n <span className=\"absolute inset-0 flex items-center justify-center\">\n <Spinner />\n </span>\n </>\n ) : (\n children\n )}\n </Comp>\n );\n },\n);\n\nButton.displayName = \"Button\";\n\n/* -----------------------------------------------------------------------------\n * Exports\n * -------------------------------------------------------------------------- */\n\nexport { Button, buttonVariants, type ButtonProps, type ButtonVariantsProps };\n"],"mappings":";;;;;;;;AAAA,YAAY,WAAW;AACvB,SAAS,YAAY;AAuEX,mBACE,KADF;AA9DV,IAAM,iBAAiB,IAAI;AAAA,EACzB,MAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAAA,EACA,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,MACT,aAAa;AAAA,MACb,OAAO;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA,MACT,WAAW;AAAA,IACb;AAAA,IACA,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,IAAI;AAAA,MACJ,MAAM;AAAA,MACN,WAAW;AAAA,MACX,WAAW;AAAA,MACX,WAAW;AAAA,IACb;AAAA,IACA,SAAS;AAAA,MACP,MAAM;AAAA,IACR;AAAA,EACF;AAAA,EACA,iBAAiB;AAAA,IACf,MAAM;AAAA,IACN,SAAS;AAAA,IACT,SAAS;AAAA,EACX;AACF,CAAC;AAcD,IAAM,SAAe;AAAA,EACnB,CAAC,EAAE,UAAU,WAAW,SAAS,MAAM,UAAU,OAAO,UAAU,OAAO,GAAG,MAAM,GAAG,QAAQ;AAC3F,UAAM,OAAO,UAAU,OAAO;AAC9B,UAAM,WAAW,WAAW,MAAM;AAElC,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,MAAM,UAAU,SAAY;AAAA,QAC5B,WAAW,eAAe,EAAE,SAAS,MAAM,SAAS,UAAU,CAAC;AAAA,QAC9D,GAAG;AAAA,QACJ;AAAA,QAEC,oBACC,iCACE;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,eAAW;AAAA,cACX,WAAU;AAAA,cAET,GAAG,EAAE,OAAO,GAAG;AAAA,cAEf;AAAA;AAAA,UACH;AAAA,UACA,oBAAC,UAAK,WAAU,qDACd,8BAAC,WAAQ,GACX;AAAA,WACF,IAEA;AAAA;AAAA,IAEJ;AAAA,EAEJ;AACF;AAEA,OAAO,cAAc;","names":[]}
|