bako-ui 0.4.2 → 0.5.1
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 +5 -3
- package/dist/index.d.ts +5 -3
- package/dist/index.js +88 -19
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +90 -22
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Button as Button$1, CloseButton, IconButton, Icon as Icon$1, Link, LinkOverlay, Checkbox as Checkbox$1, Combobox as Combobox$1, Input, RadioGroup as RadioGroup$1, Select as Select$1, Switch as Switch$1, mergeRefs, Progress as Progress$1, Tooltip as Tooltip$1, Portal, Dialog as Dialog$1, Drawer as Drawer$1, Popover as Popover$1, createToaster, Toast as Toast$1, Accordion as Accordion$1, Breadcrumb as Breadcrumb$1, Steps as Steps$1, Menu as Menu$1, createIcon, defineRecipe, defineSemanticTokens, defineSlotRecipe, defineTokens, defineConfig, createSystem, defaultConfig, Badge as Badge$1, Box, Card as Card$1, Clipboard as Clipboard$1, EmptyState as EmptyState$1, Flex, Float, HStack as HStack$1, Heading, Image, List as List$1, Spinner, QrCode as QrCode$1, Separator, Skeleton as Skeleton$1, SkeletonCircle as SkeletonCircle$1, SkeletonText as SkeletonText$1, Stack as Stack$1, Tabs as Tabs$1, Text, Toaster, VStack as VStack$1, defineStyle, Grid as Grid$1, GridItem as GridItem$1, Container as Container$1, useFilter, useListCollection, Field, Span, InputGroup, Textarea, useAvatar, Avatar as Avatar$1, Group, ChakraProvider } from '@chakra-ui/react';
|
|
1
|
+
import { Button as Button$1, CloseButton, IconButton, Icon as Icon$1, Link, LinkOverlay, Checkbox as Checkbox$1, Combobox as Combobox$1, Input, RadioGroup as RadioGroup$1, Select as Select$1, Switch as Switch$1, mergeRefs, Progress as Progress$1, Tooltip as Tooltip$1, Portal, Dialog as Dialog$1, Drawer as Drawer$1, Popover as Popover$1, createToaster, Toast as Toast$1, Accordion as Accordion$1, Breadcrumb as Breadcrumb$1, Steps as Steps$1, Menu as Menu$1, createIcon, defineRecipe, defineSemanticTokens, defineSlotRecipe, defineTokens, defineConfig, createSystem, defaultConfig, Badge as Badge$1, Box, Card as Card$1, Clipboard as Clipboard$1, EmptyState as EmptyState$1, Flex, Float, HStack as HStack$1, Heading, Image, List as List$1, Spinner, QrCode as QrCode$1, ScrollArea as ScrollArea$1, Separator, Skeleton as Skeleton$1, SkeletonCircle as SkeletonCircle$1, SkeletonText as SkeletonText$1, Stack as Stack$1, Tabs as Tabs$1, Text, Toaster, VStack as VStack$1, defineStyle, Grid as Grid$1, GridItem as GridItem$1, Container as Container$1, useFilter, useListCollection, Field, Span, InputGroup, Textarea, useAvatar, Avatar as Avatar$1, Group, ChakraProvider } from '@chakra-ui/react';
|
|
2
2
|
export { Alert, ButtonGroup, Center, Icon as ChakraIcon, ClientOnly, Field, FormatNumber, InputGroup, Portal, Spacer, Span, createIcon, createListCollection, createToaster, useAccordion, useAccordionContext, useAccordionItemContext, useClipboard, useMediaQuery, useSelect, useSelectContext, useSelectItemContext, useSteps, useStepsContext, useStepsItemContext } from '@chakra-ui/react';
|
|
3
3
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
4
4
|
import * as React from 'react';
|
|
@@ -7,7 +7,7 @@ import { flushSync } from 'react-dom';
|
|
|
7
7
|
import { useController } from 'react-hook-form';
|
|
8
8
|
import { withMask } from 'use-mask-input';
|
|
9
9
|
export { Chart, ChartGradient, ChartLegend, ChartRadialText, ChartRoot, ChartTooltip, useChart } from '@chakra-ui/charts';
|
|
10
|
-
import { accordionAnatomy, fieldAnatomy, menuAnatomy, progressAnatomy, tabsAnatomy, toastAnatomy } from '@chakra-ui/react/anatomy';
|
|
10
|
+
import { accordionAnatomy, cardAnatomy, checkboxAnatomy, comboboxAnatomy, dialogAnatomy, fieldAnatomy, menuAnatomy, popoverAnatomy, progressAnatomy, selectAnatomy, tabsAnatomy, toastAnatomy, tooltipAnatomy } from '@chakra-ui/react/anatomy';
|
|
11
11
|
|
|
12
12
|
// src/components/Stack/stack.tsx
|
|
13
13
|
var Stack = Stack$1;
|
|
@@ -398,16 +398,16 @@ function RhfInput({
|
|
|
398
398
|
[value]
|
|
399
399
|
);
|
|
400
400
|
return /* @__PURE__ */ jsxs(Field.Root, { invalid: !!error, children: [
|
|
401
|
-
/* @__PURE__ */ jsx(InputGroup, { borderRadius: "
|
|
401
|
+
/* @__PURE__ */ jsx(InputGroup, { borderRadius: "lg", ...inputGroup, children: /* @__PURE__ */ jsxs(Box, { position: "relative", w: "full", ...slotProps == null ? void 0 : slotProps.root, children: [
|
|
402
402
|
/* @__PURE__ */ jsx(
|
|
403
403
|
Input,
|
|
404
404
|
{
|
|
405
405
|
value,
|
|
406
406
|
ref,
|
|
407
|
-
borderTopLeftRadius: (inputGroup == null ? void 0 : inputGroup.startAddon) ? "none" : "
|
|
408
|
-
borderBottomLeftRadius: (inputGroup == null ? void 0 : inputGroup.startAddon) ? "none" : "
|
|
409
|
-
borderTopRightRadius: (inputGroup == null ? void 0 : inputGroup.endAddon) ? "none" : "
|
|
410
|
-
borderBottomRightRadius: (inputGroup == null ? void 0 : inputGroup.endAddon) ? "none" : "
|
|
407
|
+
borderTopLeftRadius: (inputGroup == null ? void 0 : inputGroup.startAddon) ? "none" : "lg",
|
|
408
|
+
borderBottomLeftRadius: (inputGroup == null ? void 0 : inputGroup.startAddon) ? "none" : "lg",
|
|
409
|
+
borderTopRightRadius: (inputGroup == null ? void 0 : inputGroup.endAddon) ? "none" : "lg",
|
|
410
|
+
borderBottomRightRadius: (inputGroup == null ? void 0 : inputGroup.endAddon) ? "none" : "lg",
|
|
411
411
|
type,
|
|
412
412
|
onChange,
|
|
413
413
|
className: `peer ${((_a = slotProps == null ? void 0 : slotProps.input) == null ? void 0 : _a.className) || ""}`,
|
|
@@ -596,6 +596,7 @@ var ProgressTrack = Progress$1.Track;
|
|
|
596
596
|
var ProgressRange = Progress$1.Range;
|
|
597
597
|
var ProgressLabel = Progress$1.Label;
|
|
598
598
|
var ProgressValueText = Progress$1.ValueText;
|
|
599
|
+
var ScrollArea = ScrollArea$1;
|
|
599
600
|
var Tooltip = React.forwardRef(
|
|
600
601
|
function Tooltip2(props, ref) {
|
|
601
602
|
const {
|
|
@@ -735,17 +736,7 @@ var buttonRecipe = defineRecipe({
|
|
|
735
736
|
variants: {
|
|
736
737
|
variant: {}
|
|
737
738
|
},
|
|
738
|
-
defaultVariants: { colorPalette: "
|
|
739
|
-
});
|
|
740
|
-
var cardRecipe = defineRecipe({
|
|
741
|
-
variants: {
|
|
742
|
-
variant: {
|
|
743
|
-
subtle: {}
|
|
744
|
-
}
|
|
745
|
-
},
|
|
746
|
-
defaultVariants: {
|
|
747
|
-
variant: "subtle"
|
|
748
|
-
}
|
|
739
|
+
defaultVariants: { colorPalette: "yellow" }
|
|
749
740
|
});
|
|
750
741
|
var iconRecipe = defineRecipe({
|
|
751
742
|
variants: {
|
|
@@ -804,7 +795,6 @@ var textareaRecipe = defineRecipe({
|
|
|
804
795
|
// src/theme/recipes/index.ts
|
|
805
796
|
var recipes = {
|
|
806
797
|
button: buttonRecipe,
|
|
807
|
-
card: cardRecipe,
|
|
808
798
|
input: inputRecipe,
|
|
809
799
|
badge: badgeRecipe,
|
|
810
800
|
icon: iconRecipe,
|
|
@@ -983,6 +973,50 @@ var accordionSlotRecipe = defineSlotRecipe({
|
|
|
983
973
|
}
|
|
984
974
|
}
|
|
985
975
|
});
|
|
976
|
+
var cardSlotRecipe = defineSlotRecipe({
|
|
977
|
+
slots: cardAnatomy.keys(),
|
|
978
|
+
base: {
|
|
979
|
+
root: {
|
|
980
|
+
borderRadius: "2xl"
|
|
981
|
+
}
|
|
982
|
+
},
|
|
983
|
+
variants: {
|
|
984
|
+
variant: {
|
|
985
|
+
subtle: {
|
|
986
|
+
root: {
|
|
987
|
+
bg: "bg.panel"
|
|
988
|
+
}
|
|
989
|
+
}
|
|
990
|
+
}
|
|
991
|
+
},
|
|
992
|
+
defaultVariants: {
|
|
993
|
+
variant: "subtle"
|
|
994
|
+
}
|
|
995
|
+
});
|
|
996
|
+
var checkboxSlotRecipe = defineSlotRecipe({
|
|
997
|
+
slots: checkboxAnatomy.keys(),
|
|
998
|
+
base: {
|
|
999
|
+
control: {
|
|
1000
|
+
borderRadius: "sm"
|
|
1001
|
+
}
|
|
1002
|
+
}
|
|
1003
|
+
});
|
|
1004
|
+
var comboboxSlotRecipe = defineSlotRecipe({
|
|
1005
|
+
slots: comboboxAnatomy.keys(),
|
|
1006
|
+
base: {
|
|
1007
|
+
input: {
|
|
1008
|
+
borderRadius: "lg"
|
|
1009
|
+
}
|
|
1010
|
+
}
|
|
1011
|
+
});
|
|
1012
|
+
var dialogSlotRecipe = defineSlotRecipe({
|
|
1013
|
+
slots: dialogAnatomy.keys(),
|
|
1014
|
+
base: {
|
|
1015
|
+
content: {
|
|
1016
|
+
borderRadius: "2xl"
|
|
1017
|
+
}
|
|
1018
|
+
}
|
|
1019
|
+
});
|
|
986
1020
|
var fieldSlotRecipe = defineSlotRecipe({
|
|
987
1021
|
slots: fieldAnatomy.keys(),
|
|
988
1022
|
base: {
|
|
@@ -995,7 +1029,8 @@ var menuSlotRecipe = defineSlotRecipe({
|
|
|
995
1029
|
slots: menuAnatomy.keys(),
|
|
996
1030
|
base: {
|
|
997
1031
|
content: {
|
|
998
|
-
color: "primary.fg"
|
|
1032
|
+
color: "primary.fg",
|
|
1033
|
+
borderRadius: "2xl"
|
|
999
1034
|
},
|
|
1000
1035
|
item: {
|
|
1001
1036
|
color: "primary.fg"
|
|
@@ -1013,6 +1048,14 @@ var menuSlotRecipe = defineSlotRecipe({
|
|
|
1013
1048
|
}
|
|
1014
1049
|
}
|
|
1015
1050
|
});
|
|
1051
|
+
var popoverSlotRecipe = defineSlotRecipe({
|
|
1052
|
+
slots: popoverAnatomy.keys(),
|
|
1053
|
+
base: {
|
|
1054
|
+
content: {
|
|
1055
|
+
borderRadius: "lg"
|
|
1056
|
+
}
|
|
1057
|
+
}
|
|
1058
|
+
});
|
|
1016
1059
|
var progessSlotRecipes = defineSlotRecipe({
|
|
1017
1060
|
slots: progressAnatomy.keys(),
|
|
1018
1061
|
variants: {
|
|
@@ -1035,6 +1078,14 @@ var progessSlotRecipes = defineSlotRecipe({
|
|
|
1035
1078
|
}
|
|
1036
1079
|
}
|
|
1037
1080
|
});
|
|
1081
|
+
var selectSlotRecipe = defineSlotRecipe({
|
|
1082
|
+
slots: selectAnatomy.keys(),
|
|
1083
|
+
base: {
|
|
1084
|
+
trigger: {
|
|
1085
|
+
borderRadius: "lg"
|
|
1086
|
+
}
|
|
1087
|
+
}
|
|
1088
|
+
});
|
|
1038
1089
|
var tabsSlotRecipe = defineSlotRecipe({
|
|
1039
1090
|
slots: tabsAnatomy.keys(),
|
|
1040
1091
|
variants: {
|
|
@@ -1123,15 +1174,32 @@ var toastSlotRecipe = defineSlotRecipe({
|
|
|
1123
1174
|
}
|
|
1124
1175
|
}
|
|
1125
1176
|
});
|
|
1177
|
+
var tooltipSlotRecipe = defineSlotRecipe({
|
|
1178
|
+
slots: tooltipAnatomy.keys(),
|
|
1179
|
+
base: {
|
|
1180
|
+
content: {
|
|
1181
|
+
"--tooltip-bg": "colors.bg.muted",
|
|
1182
|
+
color: "fg",
|
|
1183
|
+
borderRadius: "lg"
|
|
1184
|
+
}
|
|
1185
|
+
}
|
|
1186
|
+
});
|
|
1126
1187
|
|
|
1127
1188
|
// src/theme/slot-recipes/index.ts
|
|
1128
1189
|
var slotRecipes = {
|
|
1190
|
+
card: cardSlotRecipe,
|
|
1129
1191
|
menu: menuSlotRecipe,
|
|
1130
1192
|
tabs: tabsSlotRecipe,
|
|
1131
1193
|
progress: progessSlotRecipes,
|
|
1132
1194
|
toast: toastSlotRecipe,
|
|
1133
1195
|
accordion: accordionSlotRecipe,
|
|
1134
|
-
field: fieldSlotRecipe
|
|
1196
|
+
field: fieldSlotRecipe,
|
|
1197
|
+
select: selectSlotRecipe,
|
|
1198
|
+
dialog: dialogSlotRecipe,
|
|
1199
|
+
combobox: comboboxSlotRecipe,
|
|
1200
|
+
checkbox: checkboxSlotRecipe,
|
|
1201
|
+
tooltip: tooltipSlotRecipe,
|
|
1202
|
+
popover: popoverSlotRecipe
|
|
1135
1203
|
};
|
|
1136
1204
|
var colorsTokens = defineTokens.colors({
|
|
1137
1205
|
primary: {
|
|
@@ -1225,6 +1293,6 @@ var config = defineConfig({
|
|
|
1225
1293
|
var theme = createSystem(defaultConfig, config);
|
|
1226
1294
|
var theme_default = theme;
|
|
1227
1295
|
|
|
1228
|
-
export { Accordion, Avatar, AvatarGroup, Badge, box_default as Box, Breadcrumb, button_default as Button, card_default as Card, CheckIcon, checkbox_default as Checkbox, Clipboard, close_button_default as CloseButton, CloseIcon, Combobox, Container, Dialog, Drawer, EmptyState, flex_default as Flex, float_default as Float, Grid, GridItem, HStack, heading_default as Heading, icon_default as Icon, icon_button_default as IconButton, image_default as Image, input_default as Input, link_default as Link, link_overlay_default as LinkOverlay, List, loader_default as Loader, Menu, MoneyField, Popover, Progress, ProgressLabel, ProgressRange, ProgressRoot, ProgressTrack, ProgressValueText, QrCode, radio_default as Radio, RadioGroup, RhfCombobox, RhfInput, RhfMoneyField, Select, separator_default as Separator, Skeleton, SkeletonCircle, SkeletonText, Stack, Steps, switch_default as Switch, Tabs, text_default as Text, TextArea, text_mask_default as TextMask, ThemeProvider, Toast, tooltip_default as Tooltip, VStack, WalletIcon, floatingStyles, theme_default as theme, toaster };
|
|
1296
|
+
export { Accordion, Avatar, AvatarGroup, Badge, box_default as Box, Breadcrumb, button_default as Button, card_default as Card, CheckIcon, checkbox_default as Checkbox, Clipboard, close_button_default as CloseButton, CloseIcon, Combobox, Container, Dialog, Drawer, EmptyState, flex_default as Flex, float_default as Float, Grid, GridItem, HStack, heading_default as Heading, icon_default as Icon, icon_button_default as IconButton, image_default as Image, input_default as Input, link_default as Link, link_overlay_default as LinkOverlay, List, loader_default as Loader, Menu, MoneyField, Popover, Progress, ProgressLabel, ProgressRange, ProgressRoot, ProgressTrack, ProgressValueText, QrCode, radio_default as Radio, RadioGroup, RhfCombobox, RhfInput, RhfMoneyField, ScrollArea, Select, separator_default as Separator, Skeleton, SkeletonCircle, SkeletonText, Stack, Steps, switch_default as Switch, Tabs, text_default as Text, TextArea, text_mask_default as TextMask, ThemeProvider, Toast, tooltip_default as Tooltip, VStack, WalletIcon, floatingStyles, theme_default as theme, toaster };
|
|
1229
1297
|
//# sourceMappingURL=index.mjs.map
|
|
1230
1298
|
//# sourceMappingURL=index.mjs.map
|