@xjur-ui/react 1.0.6 → 2.0.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.
Files changed (115) hide show
  1. package/.turbo/turbo-build.log +97 -45
  2. package/CHANGELOG.md +44 -0
  3. package/README.md +146 -0
  4. package/dist/chunk-CBFC4QME.js +2 -0
  5. package/dist/chunk-CBFC4QME.js.map +1 -0
  6. package/dist/chunk-EIG6CBTQ.js +2 -0
  7. package/dist/chunk-EIG6CBTQ.js.map +1 -0
  8. package/dist/chunk-FASEHVMD.js +2 -0
  9. package/dist/chunk-FASEHVMD.js.map +1 -0
  10. package/dist/chunk-KIFR5VIE.js +2 -0
  11. package/dist/chunk-KIFR5VIE.js.map +1 -0
  12. package/dist/chunk-KS6WGBHQ.js +2 -0
  13. package/dist/chunk-KS6WGBHQ.js.map +1 -0
  14. package/dist/chunk-NELCN6E2.js +2 -0
  15. package/dist/chunk-NELCN6E2.js.map +1 -0
  16. package/dist/chunk-NPTLORW5.js +2 -0
  17. package/dist/chunk-NPTLORW5.js.map +1 -0
  18. package/dist/chunk-RWMV7APX.js +2 -0
  19. package/dist/chunk-RWMV7APX.js.map +1 -0
  20. package/dist/chunk-SHHXKVVR.js +2 -0
  21. package/dist/chunk-SHHXKVVR.js.map +1 -0
  22. package/dist/chunk-TB6KI6CL.js +2 -0
  23. package/dist/chunk-TB6KI6CL.js.map +1 -0
  24. package/dist/components/avatar-group.js +2 -179
  25. package/dist/components/avatar-group.js.map +1 -0
  26. package/dist/components/avatar.js +2 -59
  27. package/dist/components/avatar.js.map +1 -0
  28. package/dist/components/badge.js +2 -111
  29. package/dist/components/badge.js.map +1 -0
  30. package/dist/components/button.js +2 -98
  31. package/dist/components/button.js.map +1 -0
  32. package/dist/components/calendar.js +2 -751
  33. package/dist/components/calendar.js.map +1 -0
  34. package/dist/components/checkbox.js +2 -153
  35. package/dist/components/checkbox.js.map +1 -0
  36. package/dist/components/chip.d.ts +3 -1
  37. package/dist/components/chip.js +2 -256
  38. package/dist/components/chip.js.map +1 -0
  39. package/dist/components/collapsible.js +2 -41
  40. package/dist/components/collapsible.js.map +1 -0
  41. package/dist/components/date-picker.d.ts +8 -3
  42. package/dist/components/date-picker.js +2 -232
  43. package/dist/components/date-picker.js.map +1 -0
  44. package/dist/components/divider.js +2 -29
  45. package/dist/components/divider.js.map +1 -0
  46. package/dist/components/dropdown-menu.js +2 -295
  47. package/dist/components/dropdown-menu.js.map +1 -0
  48. package/dist/components/icon.js +2 -177
  49. package/dist/components/icon.js.map +1 -0
  50. package/dist/components/input.d.ts +9 -4
  51. package/dist/components/input.js +2 -315
  52. package/dist/components/input.js.map +1 -0
  53. package/dist/components/list.js +2 -179
  54. package/dist/components/list.js.map +1 -0
  55. package/dist/components/logo.js +2 -324
  56. package/dist/components/logo.js.map +1 -0
  57. package/dist/components/otp-input.js +2 -47
  58. package/dist/components/otp-input.js.map +1 -0
  59. package/dist/components/radio.js +2 -156
  60. package/dist/components/radio.js.map +1 -0
  61. package/dist/components/rich-editor.d.ts +2 -1
  62. package/dist/components/rich-editor.js +2 -723
  63. package/dist/components/rich-editor.js.map +1 -0
  64. package/dist/components/search-input.js +2 -274
  65. package/dist/components/search-input.js.map +1 -0
  66. package/dist/components/select.d.ts +6 -3
  67. package/dist/components/select.js +2 -550
  68. package/dist/components/select.js.map +1 -0
  69. package/dist/components/sheet.js +2 -251
  70. package/dist/components/sheet.js.map +1 -0
  71. package/dist/components/skeleton.js +2 -16
  72. package/dist/components/skeleton.js.map +1 -0
  73. package/dist/components/status.js +2 -111
  74. package/dist/components/status.js.map +1 -0
  75. package/dist/components/switch.js +2 -36
  76. package/dist/components/switch.js.map +1 -0
  77. package/dist/components/table.js +2 -196
  78. package/dist/components/table.js.map +1 -0
  79. package/dist/components/tabs.d.ts +9 -6
  80. package/dist/components/tabs.js +2 -54
  81. package/dist/components/tabs.js.map +1 -0
  82. package/dist/components/tag.d.ts +3 -1
  83. package/dist/components/tag.js +2 -189
  84. package/dist/components/tag.js.map +1 -0
  85. package/dist/components/tooltip.js +2 -58
  86. package/dist/components/tooltip.js.map +1 -0
  87. package/dist/components/typography.js +2 -78
  88. package/dist/components/typography.js.map +1 -0
  89. package/dist/hooks/index.d.ts +7 -0
  90. package/dist/hooks/index.js +2 -0
  91. package/dist/hooks/index.js.map +1 -0
  92. package/dist/index.css +2 -2322
  93. package/dist/index.css.map +1 -0
  94. package/dist/logo-PQRZORCS.js +3 -0
  95. package/dist/logo-PQRZORCS.js.map +1 -0
  96. package/package.json +41 -8
  97. package/src/components/calendar.tsx +7 -6
  98. package/src/components/chip.tsx +11 -3
  99. package/src/components/date-picker.tsx +125 -22
  100. package/src/components/icon.tsx +1 -1
  101. package/src/components/input.tsx +124 -60
  102. package/src/components/logo.tsx +25 -20
  103. package/src/components/rich-editor.tsx +4 -3
  104. package/src/components/select.tsx +104 -26
  105. package/src/components/tabs.tsx +56 -37
  106. package/src/components/tag.tsx +11 -3
  107. package/src/index.css +2 -2
  108. package/src/resources/logo/index.tsx +33 -0
  109. package/tsup.config.ts +23 -5
  110. package/dist/components/test.d.ts +0 -5
  111. package/dist/components/test.js +0 -8
  112. package/dist/index.js +0 -0
  113. package/src/components/test.tsx +0 -3
  114. package/src/index.ts +0 -1
  115. package/src/resources/logo/index.ts +0 -3
@@ -1,179 +1,2 @@
1
- // src/components/avatar-group.tsx
2
- import { cx as cx2 } from "@xjur-ui/util";
3
-
4
- // src/components/avatar.tsx
5
- import "react";
6
- import * as AvatarPrimitive from "@radix-ui/react-avatar";
7
- import { cx } from "@xjur-ui/util";
8
- import { jsx } from "react/jsx-runtime";
9
- function AvatarRoot({
10
- className,
11
- size = "md",
12
- ...props
13
- }) {
14
- return /* @__PURE__ */ jsx(
15
- AvatarPrimitive.Root,
16
- {
17
- className: cx(
18
- "rounded-circle relative flex shrink-0 overflow-hidden",
19
- "data-[size=lg]:size-large-8x data-[size=md]:size-large-4x data-[size=sm]:size-large-2x data-[size=xs]:size-large-1x",
20
- "data-[size=lg]:text-size-headline-md data-[size=md]:text-size-label-lg data-[size=sm]:text-size-label-sm data-[size=xs]:text-size-label-sm",
21
- className
22
- ),
23
- "data-size": size,
24
- "data-slot": "avatar",
25
- ...props
26
- }
27
- );
28
- }
29
- function AvatarImage({
30
- className,
31
- ...props
32
- }) {
33
- return /* @__PURE__ */ jsx(
34
- AvatarPrimitive.Image,
35
- {
36
- className: cx("aspect-square size-full", className),
37
- "data-slot": "avatar-image",
38
- ...props
39
- }
40
- );
41
- }
42
- function AvatarFallback({
43
- className,
44
- ...props
45
- }) {
46
- return /* @__PURE__ */ jsx(
47
- AvatarPrimitive.Fallback,
48
- {
49
- className: cx(
50
- "bg-alt-1 rounded-circle flex size-full items-center justify-center font-medium text-white",
51
- className
52
- ),
53
- "data-slot": "avatar-fallback",
54
- ...props
55
- }
56
- );
57
- }
58
-
59
- // src/components/typography.tsx
60
- import { Slot } from "@radix-ui/react-slot";
61
- import { cva } from "@xjur-ui/util";
62
- import { memo } from "react";
63
- import { jsx as jsx2 } from "react/jsx-runtime";
64
- var typographyVariants = cva("", {
65
- variants: {
66
- variant: {
67
- body: "",
68
- label: "",
69
- title: "",
70
- headline: ""
71
- },
72
- size: {
73
- "sm-2x": "",
74
- "sm-1x": "",
75
- sm: "",
76
- md: "",
77
- lg: ""
78
- },
79
- weight: {
80
- thin: "font-thin",
81
- extraLight: "font-extralight",
82
- light: "font-light",
83
- normal: "font-normal",
84
- medium: "font-medium",
85
- semibold: "font-semibold",
86
- bold: "font-bold",
87
- extraBold: "font-extrabold",
88
- black: "font-black"
89
- }
90
- },
91
- compoundVariants: [
92
- { variant: "body", size: "sm-1x", class: "text-size-body-sm-1x" },
93
- { variant: "body", size: "sm", class: "text-size-body-sm" },
94
- { variant: "body", size: "md", class: "text-size-body-md" },
95
- { variant: "body", size: "lg", class: "text-size-body-lg" },
96
- { variant: "label", size: "sm-2x", class: "text-size-label-sm-2x" },
97
- { variant: "label", size: "sm-1x", class: "text-size-label-sm-1x" },
98
- { variant: "label", size: "sm", class: "text-size-label-sm" },
99
- { variant: "label", size: "md", class: "text-size-label-md" },
100
- { variant: "label", size: "lg", class: "text-size-label-lg" },
101
- { variant: "title", size: "sm", class: "text-size-title-sm" },
102
- { variant: "title", size: "md", class: "text-size-title-md" },
103
- { variant: "title", size: "lg", class: "text-size-title-lg" },
104
- { variant: "headline", size: "sm", class: "text-size-headline-sm" },
105
- { variant: "headline", size: "md", class: "text-size-headline-md" },
106
- { variant: "headline", size: "lg", class: "text-size-headline-lg" }
107
- ],
108
- defaultVariants: {
109
- variant: "body",
110
- size: "md",
111
- weight: "normal"
112
- }
113
- });
114
- var Typography = memo(
115
- ({
116
- variant,
117
- size,
118
- weight,
119
- asChild,
120
- className,
121
- ...props
122
- }) => {
123
- const Component = asChild ? Slot : "span";
124
- return /* @__PURE__ */ jsx2(
125
- Component,
126
- {
127
- className: typographyVariants({ variant, size, weight, className }),
128
- ...props
129
- }
130
- );
131
- }
132
- );
133
- Typography.displayName = "Typography";
134
-
135
- // src/components/avatar-group.tsx
136
- import { jsx as jsx3, jsxs } from "react/jsx-runtime";
137
- function AvatarGroup({
138
- avatars,
139
- max = 3,
140
- size = "md",
141
- className
142
- }) {
143
- const visibleAvatars = avatars.slice(0, max);
144
- const remainingCount = avatars.length - max;
145
- return /* @__PURE__ */ jsxs(
146
- "div",
147
- {
148
- className: cx2("-space-x-small-1x flex items-center", className),
149
- "data-slot": "avatar-group",
150
- children: [
151
- visibleAvatars.map((avatar, index) => /* @__PURE__ */ jsxs(
152
- AvatarRoot,
153
- {
154
- className: "border-icon-neutral-5 border-2",
155
- size,
156
- children: [
157
- avatar.src && /* @__PURE__ */ jsx3(
158
- AvatarImage,
159
- {
160
- alt: avatar.alt || `Avatar ${index + 1}`,
161
- src: avatar.src
162
- }
163
- ),
164
- /* @__PURE__ */ jsx3(AvatarFallback, { children: avatar.fallback || `A${index + 1}` })
165
- ]
166
- },
167
- index
168
- )),
169
- remainingCount > 0 && /* @__PURE__ */ jsx3(AvatarRoot, { className: "bg-layer-1-hover", size, children: /* @__PURE__ */ jsx3(AvatarFallback, { className: "bg-layer-1-hover font-medium", children: /* @__PURE__ */ jsxs(Typography, { className: "text-neutral-dark", weight: "medium", children: [
170
- "+",
171
- remainingCount
172
- ] }) }) })
173
- ]
174
- }
175
- );
176
- }
177
- export {
178
- AvatarGroup
179
- };
1
+ import {a,b,c}from'../chunk-TB6KI6CL.js';import {a as a$1}from'../chunk-EIG6CBTQ.js';import {cx}from'@xjur-ui/util';import {jsxs,jsx}from'react/jsx-runtime';function d({avatars:l,max:m=3,size:c$1="md",className:g}){let v=l.slice(0,m),i=l.length-m;return jsxs("div",{className:cx("-space-x-small-1x flex items-center",g),"data-slot":"avatar-group",children:[v.map((a$1,t)=>jsxs(a,{className:"border-icon-neutral-5 border-2",size:c$1,children:[a$1.src&&jsx(b,{alt:a$1.alt||`Avatar ${t+1}`,src:a$1.src}),jsx(c,{children:a$1.fallback||`A${t+1}`})]},t)),i>0&&jsx(a,{className:"bg-layer-1-hover",size:c$1,children:jsx(c,{className:"bg-layer-1-hover font-medium",children:jsxs(a$1,{className:"text-neutral-dark",weight:"medium",children:["+",i]})})})]})}export{d as AvatarGroup};//# sourceMappingURL=avatar-group.js.map
2
+ //# sourceMappingURL=avatar-group.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/components/avatar-group.tsx"],"names":["AvatarGroup","avatars","max","size","className","visibleAvatars","remainingCount","jsxs","cx","avatar","index","AvatarRoot","jsx","AvatarImage","AvatarFallback","Typography"],"mappings":"6JAkCO,SAASA,CAAAA,CAAY,CAC1B,OAAA,CAAAC,EACA,GAAA,CAAAC,CAAAA,CAAM,CAAA,CACN,IAAA,CAAAC,GAAAA,CAAO,IAAA,CACP,SAAA,CAAAC,CACF,CAAA,CAAqB,CACnB,IAAMC,CAAAA,CAAiBJ,CAAAA,CAAQ,KAAA,CAAM,EAAGC,CAAG,CAAA,CACrCI,CAAAA,CAAiBL,CAAAA,CAAQ,MAAA,CAASC,CAAAA,CAExC,OACEK,IAAAA,CAAC,KAAA,CAAA,CACC,SAAA,CAAWC,EAAAA,CAAG,qCAAA,CAAuCJ,CAAS,CAAA,CAC9D,YAAU,cAAA,CAET,QAAA,CAAA,CAAAC,CAAAA,CAAe,GAAA,CAAI,CAACI,GAAAA,CAAQC,CAAAA,GAC3BH,IAAAA,CAACI,CAAAA,CAAA,CACC,SAAA,CAAU,gCAAA,CAEV,IAAA,CAAMR,GAAAA,CAEL,UAAAM,GAAAA,CAAO,GAAA,EACNG,GAAAA,CAACC,CAAAA,CAAA,CACC,GAAA,CAAKJ,GAAAA,CAAO,GAAA,EAAO,CAAA,OAAA,EAAUC,CAAAA,CAAQ,CAAC,CAAA,CAAA,CACtC,GAAA,CAAKD,GAAAA,CAAO,IACd,CAAA,CAEFG,GAAAA,CAACE,CAAAA,CAAA,CAAgB,QAAA,CAAAL,GAAAA,CAAO,QAAA,EAAY,CAAA,CAAA,EAAIC,CAAAA,CAAQ,CAAC,CAAA,CAAA,CAAG,CAAA,CAAA,CAAA,CAT/CA,CAUP,CACD,EAEAJ,CAAAA,CAAiB,CAAA,EAChBM,GAAAA,CAACD,CAAAA,CAAA,CAAW,SAAA,CAAU,kBAAA,CAAmB,IAAA,CAAMR,GAAAA,CAC7C,QAAA,CAAAS,GAAAA,CAACE,CAAAA,CAAA,CAAe,SAAA,CAAU,8BAAA,CACxB,QAAA,CAAAP,IAAAA,CAACQ,GAAAA,CAAA,CAAW,SAAA,CAAU,mBAAA,CAAoB,MAAA,CAAO,QAAA,CAAS,QAAA,CAAA,CAAA,GAAA,CACtDT,CAAAA,CAAAA,CACJ,CAAA,CACF,CAAA,CACF,CAAA,CAAA,CAEJ,CAEJ","file":"avatar-group.js","sourcesContent":["import { cx } from '@xjur-ui/util'\nimport { AvatarRoot, AvatarImage, AvatarFallback } from './avatar'\nimport { Typography } from './typography'\n\nexport interface AvatarGroupProps {\n /**\n * Lista de avatares para exibir\n */\n avatars: Array<{\n src?: string\n alt?: string\n fallback?: string\n }>\n /**\n * Número máximo de avatares a exibir antes de mostrar o indicador de overflow\n * @default 3\n */\n max?: number\n /**\n * Tamanho dos avatares\n * @default 'md'\n */\n size?: 'xs' | 'sm' | 'md' | 'lg'\n /**\n * Classe CSS adicional\n */\n className?: string\n /**\n * Espaçamento entre os avatares (em pixels)\n * @default -8\n */\n spacing?: number\n}\n\nexport function AvatarGroup({\n avatars,\n max = 3,\n size = 'md',\n className\n}: AvatarGroupProps) {\n const visibleAvatars = avatars.slice(0, max)\n const remainingCount = avatars.length - max\n\n return (\n <div\n className={cx('-space-x-small-1x flex items-center', className)}\n data-slot=\"avatar-group\"\n >\n {visibleAvatars.map((avatar, index) => (\n <AvatarRoot\n className=\"border-icon-neutral-5 border-2\"\n key={index}\n size={size}\n >\n {avatar.src && (\n <AvatarImage\n alt={avatar.alt || `Avatar ${index + 1}`}\n src={avatar.src}\n />\n )}\n <AvatarFallback>{avatar.fallback || `A${index + 1}`}</AvatarFallback>\n </AvatarRoot>\n ))}\n\n {remainingCount > 0 && (\n <AvatarRoot className=\"bg-layer-1-hover\" size={size}>\n <AvatarFallback className=\"bg-layer-1-hover font-medium\">\n <Typography className=\"text-neutral-dark\" weight=\"medium\">\n +{remainingCount}\n </Typography>\n </AvatarFallback>\n </AvatarRoot>\n )}\n </div>\n )\n}\n"]}
@@ -1,59 +1,2 @@
1
- // src/components/avatar.tsx
2
- import "react";
3
- import * as AvatarPrimitive from "@radix-ui/react-avatar";
4
- import { cx } from "@xjur-ui/util";
5
- import { jsx } from "react/jsx-runtime";
6
- function AvatarRoot({
7
- className,
8
- size = "md",
9
- ...props
10
- }) {
11
- return /* @__PURE__ */ jsx(
12
- AvatarPrimitive.Root,
13
- {
14
- className: cx(
15
- "rounded-circle relative flex shrink-0 overflow-hidden",
16
- "data-[size=lg]:size-large-8x data-[size=md]:size-large-4x data-[size=sm]:size-large-2x data-[size=xs]:size-large-1x",
17
- "data-[size=lg]:text-size-headline-md data-[size=md]:text-size-label-lg data-[size=sm]:text-size-label-sm data-[size=xs]:text-size-label-sm",
18
- className
19
- ),
20
- "data-size": size,
21
- "data-slot": "avatar",
22
- ...props
23
- }
24
- );
25
- }
26
- function AvatarImage({
27
- className,
28
- ...props
29
- }) {
30
- return /* @__PURE__ */ jsx(
31
- AvatarPrimitive.Image,
32
- {
33
- className: cx("aspect-square size-full", className),
34
- "data-slot": "avatar-image",
35
- ...props
36
- }
37
- );
38
- }
39
- function AvatarFallback({
40
- className,
41
- ...props
42
- }) {
43
- return /* @__PURE__ */ jsx(
44
- AvatarPrimitive.Fallback,
45
- {
46
- className: cx(
47
- "bg-alt-1 rounded-circle flex size-full items-center justify-center font-medium text-white",
48
- className
49
- ),
50
- "data-slot": "avatar-fallback",
51
- ...props
52
- }
53
- );
54
- }
55
- export {
56
- AvatarFallback,
57
- AvatarImage,
58
- AvatarRoot
59
- };
1
+ export{c as AvatarFallback,b as AvatarImage,a as AvatarRoot}from'../chunk-TB6KI6CL.js';//# sourceMappingURL=avatar.js.map
2
+ //# sourceMappingURL=avatar.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":[],"names":[],"mappings":"","file":"avatar.js"}
@@ -1,111 +1,2 @@
1
- // src/components/badge.tsx
2
- import { cva as cva2, cx } from "@xjur-ui/util";
3
-
4
- // src/components/typography.tsx
5
- import { Slot } from "@radix-ui/react-slot";
6
- import { cva } from "@xjur-ui/util";
7
- import { memo } from "react";
8
- import { jsx } from "react/jsx-runtime";
9
- var typographyVariants = cva("", {
10
- variants: {
11
- variant: {
12
- body: "",
13
- label: "",
14
- title: "",
15
- headline: ""
16
- },
17
- size: {
18
- "sm-2x": "",
19
- "sm-1x": "",
20
- sm: "",
21
- md: "",
22
- lg: ""
23
- },
24
- weight: {
25
- thin: "font-thin",
26
- extraLight: "font-extralight",
27
- light: "font-light",
28
- normal: "font-normal",
29
- medium: "font-medium",
30
- semibold: "font-semibold",
31
- bold: "font-bold",
32
- extraBold: "font-extrabold",
33
- black: "font-black"
34
- }
35
- },
36
- compoundVariants: [
37
- { variant: "body", size: "sm-1x", class: "text-size-body-sm-1x" },
38
- { variant: "body", size: "sm", class: "text-size-body-sm" },
39
- { variant: "body", size: "md", class: "text-size-body-md" },
40
- { variant: "body", size: "lg", class: "text-size-body-lg" },
41
- { variant: "label", size: "sm-2x", class: "text-size-label-sm-2x" },
42
- { variant: "label", size: "sm-1x", class: "text-size-label-sm-1x" },
43
- { variant: "label", size: "sm", class: "text-size-label-sm" },
44
- { variant: "label", size: "md", class: "text-size-label-md" },
45
- { variant: "label", size: "lg", class: "text-size-label-lg" },
46
- { variant: "title", size: "sm", class: "text-size-title-sm" },
47
- { variant: "title", size: "md", class: "text-size-title-md" },
48
- { variant: "title", size: "lg", class: "text-size-title-lg" },
49
- { variant: "headline", size: "sm", class: "text-size-headline-sm" },
50
- { variant: "headline", size: "md", class: "text-size-headline-md" },
51
- { variant: "headline", size: "lg", class: "text-size-headline-lg" }
52
- ],
53
- defaultVariants: {
54
- variant: "body",
55
- size: "md",
56
- weight: "normal"
57
- }
58
- });
59
- var Typography = memo(
60
- ({
61
- variant,
62
- size,
63
- weight,
64
- asChild,
65
- className,
66
- ...props
67
- }) => {
68
- const Component = asChild ? Slot : "span";
69
- return /* @__PURE__ */ jsx(
70
- Component,
71
- {
72
- className: typographyVariants({ variant, size, weight, className }),
73
- ...props
74
- }
75
- );
76
- }
77
- );
78
- Typography.displayName = "Typography";
79
-
80
- // src/components/badge.tsx
81
- import { jsx as jsx2 } from "react/jsx-runtime";
82
- var badgeVariants = cva2(
83
- [
84
- "flex items-center justify-center size-large p-small-2x text-neutral-label rounded-circle"
85
- ],
86
- {
87
- variants: {
88
- variant: {
89
- primary: "bg-primary-idle",
90
- secondary: "bg-secondary-idle",
91
- neutral: "bg-alt-2-idle",
92
- success: "bg-success-idle",
93
- warning: "bg-warning-idle",
94
- danger: "bg-danger-idle"
95
- }
96
- },
97
- defaultVariants: {
98
- variant: "neutral"
99
- }
100
- }
101
- );
102
- function Badge({
103
- variant = "neutral",
104
- children,
105
- className
106
- }) {
107
- return /* @__PURE__ */ jsx2("span", { className: cx(badgeVariants({ variant }), className), children: /* @__PURE__ */ jsx2(Typography, { className: "text-inherit", size: "sm-2x", variant: "label", children }) });
108
- }
109
- export {
110
- Badge
111
- };
1
+ import {a}from'../chunk-EIG6CBTQ.js';import {cva,cx}from'@xjur-ui/util';import {jsx}from'react/jsx-runtime';var l=cva(["flex items-center justify-center size-large p-small-2x text-neutral-label rounded-circle"],{variants:{variant:{primary:"bg-primary-idle",secondary:"bg-secondary-idle",neutral:"bg-alt-2-idle",success:"bg-success-idle",warning:"bg-warning-idle",danger:"bg-danger-idle"}},defaultVariants:{variant:"neutral"}});function d({variant:r="neutral",children:s,className:n}){return jsx("span",{className:cx(l({variant:r}),n),children:jsx(a,{className:"text-inherit",size:"sm-2x",variant:"label",children:s})})}export{d as Badge};//# sourceMappingURL=badge.js.map
2
+ //# sourceMappingURL=badge.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/components/badge.tsx"],"names":["badgeVariants","cva","Badge","variant","children","className","jsx","cx","Typography"],"mappings":"4GAGA,IAAMA,CAAAA,CAAgBC,IACpB,CACE,0FACF,CAAA,CACA,CACE,SAAU,CACR,OAAA,CAAS,CACP,OAAA,CAAS,kBACT,SAAA,CAAW,mBAAA,CACX,OAAA,CAAS,eAAA,CACT,QAAS,iBAAA,CACT,OAAA,CAAS,iBAAA,CACT,MAAA,CAAQ,gBACV,CACF,CAAA,CACA,gBAAiB,CACf,OAAA,CAAS,SACX,CACF,CACF,CAAA,CAEO,SAASC,EAAM,CACpB,OAAA,CAAAC,CAAAA,CAAU,SAAA,CACV,SAAAC,CAAAA,CACA,SAAA,CAAAC,CACF,CAAA,CAGG,CACD,OACEC,GAAAA,CAAC,MAAA,CAAA,CAAK,SAAA,CAAWC,GAAGP,CAAAA,CAAc,CAAE,OAAA,CAAAG,CAAQ,CAAC,CAAA,CAAGE,CAAS,CAAA,CACvD,QAAA,CAAAC,IAACE,CAAAA,CAAA,CAAW,SAAA,CAAU,cAAA,CAAe,KAAK,OAAA,CAAQ,OAAA,CAAQ,QACvD,QAAA,CAAAJ,CAAAA,CACH,EACF,CAEJ","file":"badge.js","sourcesContent":["import { cva, type ClassVariantProps, cx } from '@xjur-ui/util'\nimport { Typography } from './typography'\n\nconst badgeVariants = cva(\n [\n 'flex items-center justify-center size-large p-small-2x text-neutral-label rounded-circle'\n ],\n {\n variants: {\n variant: {\n primary: 'bg-primary-idle',\n secondary: 'bg-secondary-idle',\n neutral: 'bg-alt-2-idle',\n success: 'bg-success-idle',\n warning: 'bg-warning-idle',\n danger: 'bg-danger-idle'\n }\n },\n defaultVariants: {\n variant: 'neutral'\n }\n }\n)\n\nexport function Badge({\n variant = 'neutral',\n children,\n className\n}: ClassVariantProps<typeof badgeVariants> & {\n children: string\n className?: string\n}) {\n return (\n <span className={cx(badgeVariants({ variant }), className)}>\n <Typography className=\"text-inherit\" size=\"sm-2x\" variant=\"label\">\n {children}\n </Typography>\n </span>\n )\n}\n"]}
@@ -1,98 +1,2 @@
1
- // src/components/button.tsx
2
- import { Slot } from "@radix-ui/react-slot";
3
- import { cva, cx } from "@xjur-ui/util";
4
- import { jsx } from "react/jsx-runtime";
5
- var buttonVariants = cva(
6
- [
7
- "outline-none inline-flex items-center justify-center rounded-circle gap-small cursor-pointer disabled:opacity-38 disabled:pointer-events-none transition-colors"
8
- ],
9
- {
10
- variants: {
11
- size: {
12
- md: "py-small_1x-alt px-medium text-size-body-md",
13
- sm: "py-small-1x px-small text-size-label-sm",
14
- icon_md: "p-small text-size-body-md h-large-4x w-large-4x",
15
- icon_sm: "p-small-1x text-size-label-sm h-large-2x w-large-2x"
16
- },
17
- variant: {
18
- primary: "",
19
- secondary: "",
20
- tertiary: "",
21
- destructive: "",
22
- outlined: "bg-layer-2-idle border border-border-layer-2 hover:bg-layer-2-hover active:bg-layer-2-pressed"
23
- },
24
- appearance: {
25
- solid: "",
26
- ghost: "bg-transparent"
27
- }
28
- },
29
- compoundVariants: [
30
- {
31
- variant: "primary",
32
- appearance: "solid",
33
- class: "bg-primary-idle text-neutral-label hover:bg-primary-hover active:bg-primary-pressed"
34
- },
35
- {
36
- variant: "primary",
37
- appearance: "ghost",
38
- class: "text-primary-idle hover:bg-primary-alt-idle active:bg-primary-alt-pressed"
39
- },
40
- {
41
- variant: "secondary",
42
- appearance: "solid",
43
- class: "bg-layer-1-hover text-neutral-dark hover:bg-layer-1-pressed active:bg-layer-1-active"
44
- },
45
- {
46
- variant: "secondary",
47
- appearance: "ghost",
48
- class: "hover:bg-layer-1-hover active:bg-layer-1-pressed"
49
- },
50
- {
51
- variant: "tertiary",
52
- appearance: "solid",
53
- class: "bg-layer-2-hover text-neutral-dark hover:bg-layer-2-pressed active:bg-layer-2-active"
54
- },
55
- {
56
- variant: "tertiary",
57
- appearance: "ghost",
58
- class: "hover:bg-layer-2-hover active:bg-layer-2-pressed"
59
- },
60
- {
61
- variant: "destructive",
62
- appearance: "solid",
63
- class: "bg-danger-idle text-neutral-label hover:bg-danger-hover active:bg-danger-pressed"
64
- },
65
- {
66
- variant: "destructive",
67
- appearance: "ghost",
68
- class: "text-danger-label-idle hover:bg-danger-alt-idle active:bg-danger-alt-pressed"
69
- }
70
- ],
71
- defaultVariants: {
72
- size: "md",
73
- variant: "primary",
74
- appearance: "solid"
75
- }
76
- }
77
- );
78
- function Button({
79
- asChild,
80
- className,
81
- variant = "primary",
82
- size = "md",
83
- appearance = "solid",
84
- ...props
85
- }) {
86
- const Component = asChild ? Slot : "button";
87
- return /* @__PURE__ */ jsx(
88
- Component,
89
- {
90
- className: cx(buttonVariants({ variant, appearance, size }), className),
91
- ...props
92
- }
93
- );
94
- }
95
- export {
96
- Button,
97
- buttonVariants
98
- };
1
+ export{b as Button,a as buttonVariants}from'../chunk-FASEHVMD.js';//# sourceMappingURL=button.js.map
2
+ //# sourceMappingURL=button.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":[],"names":[],"mappings":"","file":"button.js"}