@ctlyst.id/internal-ui 2.0.7 → 2.0.8

Sign up to get free protection for your applications and to get access to all the features.
Files changed (32) hide show
  1. package/dist/components/button/__stories__/button.stories.d.ts +1 -1
  2. package/dist/components/button/index.d.ts +1 -0
  3. package/dist/components/image/index.d.ts +1 -0
  4. package/dist/components/index.d.ts +1 -0
  5. package/dist/components/layouting/index.d.ts +1 -16
  6. package/dist/components/list/index.d.ts +1 -0
  7. package/dist/components/popover/index.d.ts +1 -0
  8. package/dist/components/text/index.d.ts +1 -2
  9. package/dist/components/tooltip/__stories__/tooltip.stories.d.ts +10 -0
  10. package/dist/components/tooltip/index.d.ts +1 -0
  11. package/dist/config/theme/components/checkbox.d.ts +15 -1
  12. package/dist/config/theme/components/radio.d.ts +3 -0
  13. package/dist/hooks/index.d.ts +1 -2
  14. package/dist/index.d.ts +2 -0
  15. package/dist/internal-ui.cjs.development.js +190 -38
  16. package/dist/internal-ui.cjs.development.js.map +1 -1
  17. package/dist/internal-ui.cjs.production.min.js +5 -5
  18. package/dist/internal-ui.cjs.production.min.js.map +1 -1
  19. package/dist/internal-ui.esm.js +84 -26
  20. package/dist/internal-ui.esm.js.map +1 -1
  21. package/dist/provider/index.d.ts +1 -0
  22. package/package.json +2 -2
  23. package/dist/components/layouting/components/box.d.ts +0 -4
  24. package/dist/components/layouting/components/button-group.d.ts +0 -4
  25. package/dist/components/layouting/components/container.d.ts +0 -4
  26. package/dist/components/layouting/components/flex.d.ts +0 -4
  27. package/dist/components/layouting/components/grid.d.ts +0 -4
  28. package/dist/components/layouting/components/list.d.ts +0 -6
  29. package/dist/components/layouting/components/stack.d.ts +0 -5
  30. package/dist/components/layouting/components/wrap.d.ts +0 -4
  31. package/dist/components/text/components/text.d.ts +0 -4
  32. package/dist/hooks/useDisclosure.d.ts +0 -4
@@ -4,8 +4,8 @@ import React__default, { createElement, forwardRef as forwardRef$2, useRef, useE
4
4
  import { createContext } from '@chakra-ui/react-context';
5
5
  import { CheckCircle, Info, AlertTriangle, Close, EyeOff, Eye, Rating as Rating$1, Check } from '@ctlyst.id/internal-icon';
6
6
  import { cx as cx$1 } from '@chakra-ui/utils';
7
- import { forwardRef as forwardRef$1, useStyleConfig, Box, Button as Button$2, Badge as Badge$2, useToken, Text, useColorModeValue, Breadcrumb, BreadcrumbItem, BreadcrumbLink, Card, Checkbox as Checkbox$1, FormControl, FormLabel as FormLabel$1, FormHelperText, FormErrorMessage, CheckboxGroup, Stack, Flex, Spinner, Table, Thead, Tr, Th, Tbody, Td, defineStyle, InputGroup, Input as Input$1, InputRightAddon, InputRightElement, theme as theme$1, InputLeftAddon, Textarea as Textarea$1, Image, useDisclosure, Popover as Popover$1, HStack, VStack, PopoverTrigger, Avatar, PopoverContent, PopoverArrow, PopoverBody, useColorMode as useColorMode$1, ButtonGroup, Container, Grid, List, Wrap, ModalBody as ModalBody$1, ModalCloseButton as ModalCloseButton$1, ModalFooter as ModalFooter$1, ModalHeader as ModalHeader$1, createIcon, Icon, Portal, Link, VisuallyHidden, Select as Select$1, Radio as Radio$1, RadioGroup, useMultiStyleConfig as useMultiStyleConfig$1, omitThemingProps as omitThemingProps$1, useCheckbox, chakra as chakra$1, useTab, TabList as TabList$1, TabPanel as TabPanel$1, Heading, createMultiStyleConfigHelpers as createMultiStyleConfigHelpers$1, defineStyleConfig as defineStyleConfig$1, extendTheme } from '@chakra-ui/react';
8
- export { AlertDialog, ModalBody as AlertDialogBody, ModalCloseButton as AlertDialogCloseButton, AlertDialogContent, ModalFooter as AlertDialogFooter, ModalHeader as AlertDialogHeader, ModalOverlay as AlertDialogOverlay, Drawer, ModalBody as DrawerBody, ModalCloseButton as DrawerCloseButton, DrawerContent, ModalFooter as DrawerFooter, ModalHeader as DrawerHeader, ModalOverlay as DrawerOverlay, HStack, InputLeftElement as InputElementLeft, InputRightElement as InputElementRight, ListItem, Modal, ModalContent, ModalContextProvider, ModalFocusScope, ModalOverlay, TabIndicator, TabPanels, Tabs, TabsDescendantsProvider, TabsProvider, VStack, useDrawerContext, useModal, useModalContext, useModalStyles, useTab, useTabIndicator, useTabList, useTabPanel, useTabPanels, useTabs, useTabsContext, useTabsDescendant, useTabsDescendants, useTabsDescendantsContext, useTabsStyles } from '@chakra-ui/react';
7
+ import { forwardRef as forwardRef$1, useStyleConfig, Box, Button as Button$2, Badge as Badge$2, useToken, Text, useColorModeValue, Breadcrumb, BreadcrumbItem, BreadcrumbLink, Card, Checkbox as Checkbox$1, FormControl, FormLabel as FormLabel$1, FormHelperText, FormErrorMessage, CheckboxGroup, Stack, Flex, Spinner, Table, Thead, Tr, Th, Tbody, Td, defineStyle, InputGroup, Input as Input$1, InputRightAddon, InputRightElement, theme as theme$1, InputLeftAddon, Textarea as Textarea$1, Image, useDisclosure, Popover as Popover$1, HStack, VStack, PopoverTrigger, Avatar, PopoverContent, PopoverArrow, PopoverBody, useColorMode as useColorMode$1, ModalBody as ModalBody$1, ModalCloseButton as ModalCloseButton$1, ModalFooter as ModalFooter$1, ModalHeader as ModalHeader$1, createIcon, Icon, Portal, Link, VisuallyHidden, Select as Select$1, Radio as Radio$1, RadioGroup, Grid, useMultiStyleConfig as useMultiStyleConfig$1, omitThemingProps as omitThemingProps$1, useCheckbox, chakra as chakra$1, useTab, TabList as TabList$1, TabPanel as TabPanel$1, Heading, createMultiStyleConfigHelpers as createMultiStyleConfigHelpers$1, defineStyleConfig as defineStyleConfig$1, extendTheme } from '@chakra-ui/react';
8
+ export { AlertDialog, ModalBody as AlertDialogBody, ModalCloseButton as AlertDialogCloseButton, AlertDialogContent, ModalFooter as AlertDialogFooter, ModalHeader as AlertDialogHeader, ModalOverlay as AlertDialogOverlay, Box, ButtonGroup, ChakraProvider, CloseButton, Container, Divider, Drawer, ModalBody as DrawerBody, ModalCloseButton as DrawerCloseButton, DrawerContent, ModalFooter as DrawerFooter, ModalHeader as DrawerHeader, ModalOverlay as DrawerOverlay, Flex, Grid, GridItem, HStack, Heading, InputLeftElement as InputElementLeft, InputRightElement as InputElementRight, Modal, ModalContent, ModalContextProvider, ModalFocusScope, ModalOverlay, Stack, TabIndicator, TabPanels, Tabs, TabsDescendantsProvider, TabsProvider, Text, Tooltip, VStack, Wrap, WrapItem, extendTheme, useColorModeValue, useDisclosure, useDrawerContext, useModal, useModalContext, useModalStyles, useTab, useTabIndicator, useTabList, useTabPanel, useTabPanels, useTabs, useTabsContext, useTabsDescendant, useTabsDescendants, useTabsDescendantsContext, useTabsStyles } from '@chakra-ui/react';
9
9
  import { FiChevronsRight, FiHome, FiCalendar, FiX, FiPower, FiMoon, FiSun, FiShoppingBag, FiShoppingCart, FiRepeat, FiBox, FiLayers, FiDollarSign, FiUsers, FiRotateCcw, FiSettings, FiLayout, FiGift, FiChevronDown } from 'react-icons/fi';
10
10
  import { ChevronUpIcon, ChevronDownIcon, UpDownIcon, ArrowLeftIcon, ChevronLeftIcon, ChevronRightIcon, ArrowRightIcon } from '@chakra-ui/icons';
11
11
  import { css, Global, keyframes } from '@emotion/react';
@@ -399,15 +399,21 @@ function CheckboxComponent({
399
399
  }, rest, {
400
400
  isDisabled: isDisabled
401
401
  }), children && /*#__PURE__*/React__default.createElement(Text, {
402
+ as: "span",
403
+ display: "block",
402
404
  textStyle: "text.sm",
403
- color: isDisabled ? 'black.low' : 'black.high'
405
+ color: isDisabled ? 'black.medium' : 'black.high'
404
406
  }, children))), /*#__PURE__*/React__default.createElement(Box, {
405
407
  mt: "5px",
406
408
  ml: "24px"
407
409
  }, isError ? /*#__PURE__*/React__default.createElement(Text, {
410
+ as: "span",
411
+ display: "block",
408
412
  textStyle: "text.xs",
409
413
  color: "danger.500"
410
414
  }, errorText) : /*#__PURE__*/React__default.createElement(Text, {
415
+ as: "span",
416
+ display: "block",
411
417
  textStyle: "text.xs",
412
418
  color: "black.medium"
413
419
  }, helpText)));
@@ -2900,15 +2906,21 @@ function RadioComponent({
2900
2906
  }, rest, {
2901
2907
  isDisabled: isDisabled
2902
2908
  }), children && /*#__PURE__*/React__default.createElement(Text, {
2909
+ as: "span",
2910
+ display: "block",
2903
2911
  textStyle: "text.sm",
2904
- color: isDisabled ? 'black.low' : 'black.high'
2912
+ color: isDisabled ? 'black.medium' : 'black.high'
2905
2913
  }, children))), /*#__PURE__*/React__default.createElement(Box, {
2906
2914
  mt: "5px",
2907
2915
  ml: "24px"
2908
2916
  }, isError ? /*#__PURE__*/React__default.createElement(Text, {
2917
+ as: "span",
2918
+ display: "block",
2909
2919
  textStyle: "text.xs",
2910
2920
  color: "danger.500"
2911
2921
  }, errorText) : /*#__PURE__*/React__default.createElement(Text, {
2922
+ as: "span",
2923
+ display: "block",
2912
2924
  textStyle: "text.xs",
2913
2925
  color: "black.medium"
2914
2926
  }, helpText)));
@@ -3834,8 +3846,7 @@ const baseStyle$1 = /*#__PURE__*/definePartsStyle$1({
3834
3846
  border: '1px solid'
3835
3847
  },
3836
3848
  icon: {
3837
- color: 'neutral.50',
3838
- width: '9px'
3849
+ color: 'neutral.50'
3839
3850
  },
3840
3851
  label: {
3841
3852
  fontWeight: '400',
@@ -3844,8 +3855,8 @@ const baseStyle$1 = /*#__PURE__*/definePartsStyle$1({
3844
3855
  ml: '8px'
3845
3856
  },
3846
3857
  _disabled: {
3847
- background: 'neutral.500',
3848
- border: '1px solid',
3858
+ background: 'neutral.200',
3859
+ border: '0',
3849
3860
  borderColor: 'neutral.500',
3850
3861
  cursor: 'not-allowed'
3851
3862
  }
@@ -3868,11 +3879,14 @@ const errors = /*#__PURE__*/definePartsStyle$1({
3868
3879
  },
3869
3880
  label: {
3870
3881
  fontSize: '12px'
3882
+ },
3883
+ icon: {
3884
+ fontSize: '7px'
3871
3885
  }
3872
3886
  });
3873
3887
  const unstyled = /*#__PURE__*/definePartsStyle$1({
3874
3888
  control: {
3875
- borderColor: 'neutral.500',
3889
+ borderColor: 'neutral.600',
3876
3890
  _checked: {
3877
3891
  borderColor: 'primary.500',
3878
3892
  backgroundColor: 'primary.500',
@@ -3881,21 +3895,33 @@ const unstyled = /*#__PURE__*/definePartsStyle$1({
3881
3895
  backgroundColor: 'primary.600'
3882
3896
  },
3883
3897
  _disabled: {
3884
- backgroundColor: 'neutral.500',
3885
- borderColor: 'neutral.500'
3898
+ backgroundColor: 'primary.500',
3899
+ borderColor: 'primary.500',
3900
+ opacity: 0.3
3886
3901
  }
3887
3902
  },
3888
3903
  _disabled: {
3889
- backgroundColor: 'neutral.500',
3890
- borderColor: 'neutral.500'
3904
+ backgroundColor: 'neutral.200',
3905
+ borderColor: 'neutral.200'
3891
3906
  },
3892
3907
  _indeterminate: {
3893
3908
  borderColor: 'primary.500',
3894
- backgroundColor: 'primary.500'
3909
+ backgroundColor: 'primary.500',
3910
+ _disabled: {
3911
+ backgroundColor: 'primary.500',
3912
+ borderColor: 'primary.500',
3913
+ opacity: 0.3
3914
+ }
3895
3915
  }
3896
3916
  },
3897
3917
  label: {
3898
- fontSize: '12px'
3918
+ fontSize: '12px',
3919
+ _disabled: {
3920
+ opacity: 1
3921
+ }
3922
+ },
3923
+ icon: {
3924
+ fontSize: '7px'
3899
3925
  }
3900
3926
  });
3901
3927
  const variants$1 = {
@@ -4208,7 +4234,8 @@ const baseStyle$4 = /*#__PURE__*/definePartsStyle$4({
4208
4234
  textStyle: 'text.sm',
4209
4235
  color: 'black.high',
4210
4236
  _disabled: {
4211
- color: 'black.low'
4237
+ opacity: 1,
4238
+ color: 'black.medium'
4212
4239
  }
4213
4240
  }
4214
4241
  });
@@ -4225,21 +4252,22 @@ const errors$1 = /*#__PURE__*/definePartsStyle$4({
4225
4252
  },
4226
4253
  _hover: {
4227
4254
  borderColor: 'danger.500',
4228
- bg: 'gray.200'
4255
+ bg: 'neutral.200'
4229
4256
  },
4230
4257
  _disabled: {
4231
4258
  borderColor: 'danger.500',
4232
- bg: 'white',
4259
+ bg: 'white.high',
4233
4260
  _before: {
4234
4261
  h: '10px',
4235
4262
  w: '10px',
4236
- bg: 'neutral.500'
4263
+ bg: 'primary.500',
4264
+ opacity: 0.3
4237
4265
  }
4238
4266
  }
4239
4267
  },
4240
4268
  _disabled: {
4241
4269
  borderColor: 'danger.500',
4242
- bg: 'neutral.500'
4270
+ bg: 'neutral.200'
4243
4271
  }
4244
4272
  },
4245
4273
  label: {
@@ -4262,18 +4290,19 @@ const unstyled$2 = /*#__PURE__*/definePartsStyle$4({
4262
4290
  bg: 'gray.200'
4263
4291
  },
4264
4292
  _disabled: {
4265
- borderColor: 'neutral.500',
4266
- bg: 'white',
4293
+ borderColor: 'primary.500',
4294
+ bg: 'white.high',
4295
+ opacity: 0.3,
4267
4296
  _before: {
4268
4297
  h: '10px',
4269
4298
  w: '10px',
4270
- bg: 'neutral.500'
4299
+ bg: 'primary.500'
4271
4300
  }
4272
4301
  }
4273
4302
  },
4274
4303
  _disabled: {
4275
- borderColor: 'neutral.500',
4276
- bg: 'neutral.500'
4304
+ borderColor: 'neutral.200',
4305
+ bg: 'neutral.200'
4277
4306
  }
4278
4307
  },
4279
4308
  label: {
@@ -4520,5 +4549,34 @@ const Provider = ({
4520
4549
  };
4521
4550
  Provider.displayName = 'Provider';
4522
4551
 
4523
- export { Alert, AlertAction, AlertClose, AlertDescription, AlertIcon, AlertTitle, Badge, Box, BreadCrumb, Button, ButtonGroup, CardCustom as Card, CheckboxComponent as Checkbox, CheckboxGroupComponent as CheckboxGroup, Container, DataTable, DatePickerMonth, Datepicker, Field, Flex, Grid, Header, InputAddonLeft, InputAddonRight, InputField, List, Loader, Navigation as MainMenu, ModalBody, ModalCloseButton, ModalFooter, ModalHeader, MultiDatePickerMonth, Pagination, PaginationDetail, PaginationFilter, Provider, ProviderContext, RadioComponent as Radio, RadioGroupComponent as RadioGroup, Rating, Select, SelectAsync, SelectAsyncCreatable, SelectCreatable, Stack, Switch, Tab, TabList, TabPanel, Text, TextareaField, Uploader, Wrap, foundations, theme, useAlertStyles, useInternalUI };
4552
+ function useFetcher() {
4553
+ const {
4554
+ instance
4555
+ } = useInternalUI();
4556
+ const axiosInstance = useMemo(() => instance || axios, [instance]);
4557
+ const fetcher = async ({
4558
+ url,
4559
+ data,
4560
+ method,
4561
+ headers,
4562
+ ...config
4563
+ }) => {
4564
+ const response = await axiosInstance.request({
4565
+ data,
4566
+ url,
4567
+ method,
4568
+ headers: {
4569
+ 'Content-Type': 'application/json; charset=utf-8',
4570
+ ...headers
4571
+ },
4572
+ ...config
4573
+ });
4574
+ return response;
4575
+ };
4576
+ return {
4577
+ fetcher
4578
+ };
4579
+ }
4580
+
4581
+ export { Alert, AlertAction, AlertClose, AlertDescription, AlertIcon, AlertTitle, Badge, BreadCrumb, Button, CardCustom as Card, CheckboxComponent as Checkbox, CheckboxGroupComponent as CheckboxGroup, DataTable, DatePickerMonth, Datepicker, Field, Header, InputAddonLeft, InputAddonRight, InputField, Loader, Navigation as MainMenu, ModalBody, ModalCloseButton, ModalFooter, ModalHeader, MultiDatePickerMonth, Pagination, PaginationDetail, PaginationFilter, Provider, ProviderContext, RadioComponent as Radio, RadioGroupComponent as RadioGroup, Rating, Select, SelectAsync, SelectAsyncCreatable, SelectCreatable, Switch, Tab, TabList, TabPanel, TextareaField, Uploader, foundations, theme, useAlertStyles, useFetcher, useInternalUI };
4524
4582
  //# sourceMappingURL=internal-ui.esm.js.map