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.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: "sm", ...inputGroup, children: /* @__PURE__ */ jsxs(Box, { position: "relative", w: "full", ...slotProps == null ? void 0 : slotProps.root, children: [
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" : "sm",
408
- borderBottomLeftRadius: (inputGroup == null ? void 0 : inputGroup.startAddon) ? "none" : "sm",
409
- borderTopRightRadius: (inputGroup == null ? void 0 : inputGroup.endAddon) ? "none" : "sm",
410
- borderBottomRightRadius: (inputGroup == null ? void 0 : inputGroup.endAddon) ? "none" : "sm",
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: "primary" }
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