react-restyle-components 0.4.37 → 0.4.39

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 (225) hide show
  1. package/lib/index.js +1 -3
  2. package/lib/src/core-components/index.js +1 -1
  3. package/lib/src/core-components/src/components/Accordion/AccordionSection/Accordion.js +1 -15
  4. package/lib/src/core-components/src/components/Accordion/AccordionSection/AccordionContext.js +1 -6
  5. package/lib/src/core-components/src/components/Accordion/AccordionSection/AccordionSection.js +1 -39
  6. package/lib/src/core-components/src/components/Accordion/AccordionSection/Header.js +1 -39
  7. package/lib/src/core-components/src/components/Accordion/AccordionSection/elements.js +57 -94
  8. package/lib/src/core-components/src/components/Accordion/AccordionSection/hooks/useCurrentAccordionIndex.js +1 -13
  9. package/lib/src/core-components/src/components/Accordion/AccordionSection/index.js +1 -3
  10. package/lib/src/core-components/src/components/Accordion/AccordionSection/types.js +1 -9
  11. package/lib/src/core-components/src/components/Accordion/Collapsible/Collapsible2.component.js +1 -249
  12. package/lib/src/core-components/src/components/Action/types.js +1 -8
  13. package/lib/src/core-components/src/components/AlertBanner/AlertBanner.js +1 -45
  14. package/lib/src/core-components/src/components/AlertBanner/elements.js +45 -120
  15. package/lib/src/core-components/src/components/AlertBanner/index.js +1 -2
  16. package/lib/src/core-components/src/components/AlertBanner/types.js +1 -10
  17. package/lib/src/core-components/src/components/AutoComplete/auto-complete-filter-group-by-multiple-select-multiple-fields-display/auto-complete-filter-group-by-multiple-select-multiple-fields-display.component.js +1 -334
  18. package/lib/src/core-components/src/components/AutoComplete/auto-complete-filter-multi-select-multi-fields-display-drag-drop/auto-complete-filter-multi-select-multi-fields-display-drag-drop.component.js +1 -229
  19. package/lib/src/core-components/src/components/AutoComplete/auto-complete-filter-multi-select-selected-top-display/auto-complete-filter-multi-select-selected-top-display.component.js +1 -174
  20. package/lib/src/core-components/src/components/AutoComplete/auto-complete-filter-multiple-select-multiple-fields-display/auto-complete-filter-multiple-select-multiple-fields-display.component.js +2 -129
  21. package/lib/src/core-components/src/components/AutoComplete/auto-complete-filter-single-select/auto-complete-filter-single-select.component.js +1 -55
  22. package/lib/src/core-components/src/components/AutoComplete/auto-complete-filter-single-select-multiple-fields-display/auto-complete-filter-single-select-multiple-fields-display.component.js +2 -308
  23. package/lib/src/core-components/src/components/AutoComplete/auto-complete-group-by/auto-complete-group-by.component.js +1 -115
  24. package/lib/src/core-components/src/components/AutoComplete/autocomplete/autocomplete.js +2 -442
  25. package/lib/src/core-components/src/components/AutoComplete/index.js +1 -8
  26. package/lib/src/core-components/src/components/Avatar/Avatar.js +14 -148
  27. package/lib/src/core-components/src/components/Badge/Badge.js +2 -25
  28. package/lib/src/core-components/src/components/Badge/InnerBadge/Inline.js +1 -25
  29. package/lib/src/core-components/src/components/Badge/InnerBadge/InnerBadge.js +1 -25
  30. package/lib/src/core-components/src/components/Badge/InnerBadge/elements.js +32 -78
  31. package/lib/src/core-components/src/components/Badge/InnerBadge/index.js +1 -1
  32. package/lib/src/core-components/src/components/Badge/index.js +1 -1
  33. package/lib/src/core-components/src/components/Badge/types.js +1 -5
  34. package/lib/src/core-components/src/components/Breadcrumb/Breadcrumb.js +1 -83
  35. package/lib/src/core-components/src/components/Breadcrumb/elements.js +94 -166
  36. package/lib/src/core-components/src/components/Breadcrumb/index.js +1 -3
  37. package/lib/src/core-components/src/components/Breadcrumb/types.js +1 -3
  38. package/lib/src/core-components/src/components/Button/button.component.js +1 -18
  39. package/lib/src/core-components/src/components/Button/buttonGroup/buttonGroup.component.js +1 -4
  40. package/lib/src/core-components/src/components/Button/index.js +1 -2
  41. package/lib/src/core-components/src/components/Button/types.js +1 -1
  42. package/lib/src/core-components/src/components/Chip/Chip.js +1 -64
  43. package/lib/src/core-components/src/components/Chip/elements.js +48 -148
  44. package/lib/src/core-components/src/components/Chip/index.js +1 -2
  45. package/lib/src/core-components/src/components/Chip/types.js +1 -4
  46. package/lib/src/core-components/src/components/Divider/Divider.js +1 -25
  47. package/lib/src/core-components/src/components/Divider/elements.js +31 -68
  48. package/lib/src/core-components/src/components/Divider/index.js +1 -2
  49. package/lib/src/core-components/src/components/Divider/types.js +1 -4
  50. package/lib/src/core-components/src/components/DynamicGrid/DynamicGrid.js +1 -147
  51. package/lib/src/core-components/src/components/DynamicGrid/GridContainer.js +17 -24
  52. package/lib/src/core-components/src/components/DynamicGrid/elements.js +100 -162
  53. package/lib/src/core-components/src/components/DynamicGrid/index.js +1 -3
  54. package/lib/src/core-components/src/components/DynamicGrid/types.js +1 -28
  55. package/lib/src/core-components/src/components/DynamicGrid/utils.js +1 -193
  56. package/lib/src/core-components/src/components/FormField/FormField.js +1 -103
  57. package/lib/src/core-components/src/components/FormField/components/CheckboxGroupInput.js +1 -37
  58. package/lib/src/core-components/src/components/FormField/components/CheckboxInput.js +1 -8
  59. package/lib/src/core-components/src/components/FormField/components/CssMultilineInput.js +1 -192
  60. package/lib/src/core-components/src/components/FormField/components/DatePickerInput.js +1 -99
  61. package/lib/src/core-components/src/components/FormField/components/DropdownInput.js +1 -70
  62. package/lib/src/core-components/src/components/FormField/components/OtpInput.js +1 -81
  63. package/lib/src/core-components/src/components/FormField/components/PasswordInput.js +1 -40
  64. package/lib/src/core-components/src/components/FormField/components/PinInput.js +1 -75
  65. package/lib/src/core-components/src/components/FormField/components/RadioInput.js +1 -54
  66. package/lib/src/core-components/src/components/FormField/components/TextDropdownInput.js +1 -94
  67. package/lib/src/core-components/src/components/FormField/components/ToggleInput.js +1 -36
  68. package/lib/src/core-components/src/components/FormField/components/index.js +1 -11
  69. package/lib/src/core-components/src/components/FormField/css-properties.js +1 -161
  70. package/lib/src/core-components/src/components/FormField/index.js +1 -2
  71. package/lib/src/core-components/src/components/Icon/Icon.js +1 -79
  72. package/lib/src/core-components/src/components/Icon/index.js +1 -2
  73. package/lib/src/core-components/src/components/Icon/types.js +1 -9
  74. package/lib/src/core-components/src/components/Loader/loader.component.js +2 -215
  75. package/lib/src/core-components/src/components/Masonry/Masonry.js +1 -73
  76. package/lib/src/core-components/src/components/Masonry/elements.js +29 -46
  77. package/lib/src/core-components/src/components/Masonry/hooks.js +1 -100
  78. package/lib/src/core-components/src/components/Masonry/index.js +1 -3
  79. package/lib/src/core-components/src/components/Masonry/types.js +1 -1
  80. package/lib/src/core-components/src/components/Modal/BasicModal/modal.component.js +1 -116
  81. package/lib/src/core-components/src/components/Modal/index.js +1 -2
  82. package/lib/src/core-components/src/components/Modal/modal-confirm/modal-confirm.component.js +1 -147
  83. package/lib/src/core-components/src/components/Picker/color-picker/color-picker.component.js +1 -12
  84. package/lib/src/core-components/src/components/Picker/color-picker-modal/color-picker-modal.component.js +1 -40
  85. package/lib/src/core-components/src/components/Picker/index.js +1 -2
  86. package/lib/src/core-components/src/components/Selection/index.js +1 -4
  87. package/lib/src/core-components/src/components/Selection/multi-select/multi-select.component.js +1 -49
  88. package/lib/src/core-components/src/components/Selection/multi-select-with-field/multi-select-with-field.component.js +1 -58
  89. package/lib/src/core-components/src/components/Selection/multi-selection-dropdown/multi-selection-dropdown.component.js +1 -43
  90. package/lib/src/core-components/src/components/Selection/single-select/single-select.component.js +1 -87
  91. package/lib/src/core-components/src/components/Skeleton/Skeleton.js +1 -51
  92. package/lib/src/core-components/src/components/Skeleton/elements.js +54 -143
  93. package/lib/src/core-components/src/components/Skeleton/index.js +1 -2
  94. package/lib/src/core-components/src/components/Skeleton/types.js +1 -4
  95. package/lib/src/core-components/src/components/SpeedDial/SpeedDial.js +1 -128
  96. package/lib/src/core-components/src/components/SpeedDial/elements.js +62 -132
  97. package/lib/src/core-components/src/components/SpeedDial/index.js +1 -2
  98. package/lib/src/core-components/src/components/SpeedDial/types.js +1 -3
  99. package/lib/src/core-components/src/components/Stepper2/stepper.component.js +1 -139
  100. package/lib/src/core-components/src/components/Switch/Switch.js +1 -26
  101. package/lib/src/core-components/src/components/Switch/elements.js +34 -103
  102. package/lib/src/core-components/src/components/Switch/index.js +1 -2
  103. package/lib/src/core-components/src/components/Switch/types.js +1 -3
  104. package/lib/src/core-components/src/components/Table/Table.js +1 -1100
  105. package/lib/src/core-components/src/components/Table/elements.js +153 -240
  106. package/lib/src/core-components/src/components/Table/filters.js +30 -555
  107. package/lib/src/core-components/src/components/Table/hooks.js +2 -536
  108. package/lib/src/core-components/src/components/Table/index.js +1 -4
  109. package/lib/src/core-components/src/components/Table/types.js +1 -1
  110. package/lib/src/core-components/src/components/Tabs/tabs.component.js +1 -22
  111. package/lib/src/core-components/src/components/Tags1/Tags.component.js +1 -118
  112. package/lib/src/core-components/src/components/Tags1/types.js +1 -20
  113. package/lib/src/core-components/src/components/Timer1/timer.component.js +1 -76
  114. package/lib/src/core-components/src/components/Toast/Toast.js +1 -50
  115. package/lib/src/core-components/src/components/Toast/elements.js +41 -122
  116. package/lib/src/core-components/src/components/Toast/index.js +1 -2
  117. package/lib/src/core-components/src/components/Toast/types.js +1 -9
  118. package/lib/src/core-components/src/components/Tooltip/Tooltip.js +1 -200
  119. package/lib/src/core-components/src/components/Tooltip/elements.js +55 -117
  120. package/lib/src/core-components/src/components/Tooltip/index.js +1 -2
  121. package/lib/src/core-components/src/components/Tooltip/types.js +1 -17
  122. package/lib/src/core-components/src/components/Tooltip/utils.js +1 -140
  123. package/lib/src/core-components/src/components/TreeSelect/TreeSelect.js +1 -303
  124. package/lib/src/core-components/src/components/TreeSelect/elements.js +117 -216
  125. package/lib/src/core-components/src/components/TreeSelect/hooks.js +1 -252
  126. package/lib/src/core-components/src/components/TreeSelect/index.js +1 -3
  127. package/lib/src/core-components/src/components/TreeSelect/types.js +1 -1
  128. package/lib/src/core-components/src/components/index.js +1 -30
  129. package/lib/src/core-components/src/components/pdf/pdf-images.components.js +1 -7
  130. package/lib/src/core-components/src/components/pdf/pdf-table.components.js +5 -48
  131. package/lib/src/core-components/src/components/pdf/pdf-typography.components.js +1 -70
  132. package/lib/src/core-components/src/components/pdf/pdf-wrapped-view.components.js +1 -50
  133. package/lib/src/core-components/src/core-components/Avatar.js +4 -33
  134. package/lib/src/core-components/src/core-components/CoreButton/CoreButton.js +1 -10
  135. package/lib/src/core-components/src/core-components/CoreButton/elements.js +67 -176
  136. package/lib/src/core-components/src/core-components/CoreButton/index.js +1 -3
  137. package/lib/src/core-components/src/core-components/CoreButton/types.js +1 -6
  138. package/lib/src/core-components/src/core-components/CoreButton/utils.js +1 -12
  139. package/lib/src/core-components/src/core-components/Divider/Divider.js +4 -19
  140. package/lib/src/core-components/src/core-components/Divider/index.js +1 -1
  141. package/lib/src/core-components/src/core-components/SelectionCardStrip/index.js +1 -1
  142. package/lib/src/core-components/src/core-components/SelectionCardStrip/selectionCardStrip.js +10 -33
  143. package/lib/src/core-components/src/core-components/StateLayer.js +3 -5
  144. package/lib/src/core-components/src/core-components/ToggleCore/elements.js +25 -50
  145. package/lib/src/core-components/src/core-components/ToggleCore/index.js +1 -2
  146. package/lib/src/core-components/src/core-components/ToggleCore/toggleCore.js +1 -14
  147. package/lib/src/core-components/src/core-components/atoms/Input/Input.js +1 -22
  148. package/lib/src/core-components/src/core-components/atoms/Label/Label.js +1 -21
  149. package/lib/src/core-components/src/core-components/atoms/Textarea/Textarea.js +1 -19
  150. package/lib/src/core-components/src/core-components/index.js +1 -3
  151. package/lib/src/core-components/src/helpers/constants.js +1 -11
  152. package/lib/src/core-components/src/hooks/index.js +1 -1
  153. package/lib/src/core-components/src/hooks/outside.hook.js +1 -28
  154. package/lib/src/core-components/src/index.js +1 -12
  155. package/lib/src/core-components/src/tc.global.css +1 -0
  156. package/lib/src/core-components/src/utils/abstracts/breakpoints/index.js +1 -28
  157. package/lib/src/core-components/src/utils/abstracts/colors/index.js +1 -49
  158. package/lib/src/core-components/src/utils/abstracts/index.js +1 -5
  159. package/lib/src/core-components/src/utils/abstracts/space/index.js +1 -26
  160. package/lib/src/core-components/src/utils/abstracts/theme/ThemeBoundary.js +1 -8
  161. package/lib/src/core-components/src/utils/abstracts/theme/default-themes.js +1 -30
  162. package/lib/src/core-components/src/utils/abstracts/theme/index.js +1 -3
  163. package/lib/src/core-components/src/utils/abstracts/theme/theme.js +1 -30
  164. package/lib/src/core-components/src/utils/abstracts/theme/types.js +1 -1
  165. package/lib/src/core-components/src/utils/abstracts/theme/useTheme.js +1 -17
  166. package/lib/src/core-components/src/utils/abstracts/typography/index.js +1 -25
  167. package/lib/src/core-components/src/utils/context/DefaultsProvider.js +1 -8
  168. package/lib/src/core-components/src/utils/context/InternalProvider.js +1 -24
  169. package/lib/src/core-components/src/utils/context/index.js +1 -2
  170. package/lib/src/core-components/src/utils/designTokens.js +1 -125
  171. package/lib/src/core-components/src/utils/helpers/attachSubComponents.js +1 -23
  172. package/lib/src/core-components/src/utils/helpers/flattenChildren.js +1 -11
  173. package/lib/src/core-components/src/utils/helpers/getChildByType.js +1 -3
  174. package/lib/src/core-components/src/utils/helpers/index.js +1 -5
  175. package/lib/src/core-components/src/utils/helpers/isComponentType.js +1 -16
  176. package/lib/src/core-components/src/utils/helpers/separateChildrenByType.js +1 -12
  177. package/lib/src/core-components/src/utils/hooks/index.js +1 -18
  178. package/lib/src/core-components/src/utils/hooks/useClickOutside.js +1 -18
  179. package/lib/src/core-components/src/utils/hooks/useCombinedRefs.js +1 -17
  180. package/lib/src/core-components/src/utils/hooks/useDebouncedCallback.js +1 -12
  181. package/lib/src/core-components/src/utils/hooks/useDebouncedValue.js +1 -20
  182. package/lib/src/core-components/src/utils/hooks/useDeprecation.js +1 -40
  183. package/lib/src/core-components/src/utils/hooks/useDeviceDetect.js +1 -10
  184. package/lib/src/core-components/src/utils/hooks/useDeviceForm.js +1 -24
  185. package/lib/src/core-components/src/utils/hooks/useDisableBodyScroll.js +1 -16
  186. package/lib/src/core-components/src/utils/hooks/useHoverState.js +1 -36
  187. package/lib/src/core-components/src/utils/hooks/useId.js +1 -7
  188. package/lib/src/core-components/src/utils/hooks/useIsBrowser.js +1 -11
  189. package/lib/src/core-components/src/utils/hooks/useMediaQuery.js +1 -16
  190. package/lib/src/core-components/src/utils/hooks/useOverflow.js +1 -22
  191. package/lib/src/core-components/src/utils/hooks/useSafeLayoutEffect.js +1 -5
  192. package/lib/src/core-components/src/utils/hooks/useScrollingUp.js +1 -18
  193. package/lib/src/core-components/src/utils/hooks/useTrapFocus.js +1 -30
  194. package/lib/src/core-components/src/utils/hooks/useWindowDimensions.js +1 -23
  195. package/lib/src/core-components/src/utils/index.js +1 -9
  196. package/lib/src/core-components/src/utils/stories/Wrappers.js +8 -23
  197. package/lib/src/core-components/src/utils/stories/cleanProps.js +1 -5
  198. package/lib/src/core-components/src/utils/stories/index.js +1 -4
  199. package/lib/src/core-components/src/utils/stories/sleep.js +1 -4
  200. package/lib/src/core-components/src/utils/stories/view-ports.js +1 -50
  201. package/lib/src/core-components/src/utils/styling/calcWidthOfColumns.js +1 -5
  202. package/lib/src/core-components/src/utils/styling/createGridContainer.js +6 -12
  203. package/lib/src/core-components/src/utils/styling/createTransition.js +2 -7
  204. package/lib/src/core-components/src/utils/styling/forwardProps.js +1 -10
  205. package/lib/src/core-components/src/utils/styling/index.js +1 -5
  206. package/lib/src/core-components/src/utils/styling/pxToRem.js +1 -6
  207. package/lib/src/core-components/src/utils/testing/getComputedStyle.js +1 -3
  208. package/lib/src/core-components/src/utils/testing/index.js +1 -1
  209. package/lib/src/core-components/src/utils/utility.util.js +1 -14
  210. package/lib/src/core-components/tailwind.config.js +1 -233
  211. package/lib/src/core-hooks/index.js +1 -3
  212. package/lib/src/core-hooks/src/useClickOutside/useClickOutside.hook.js +1 -46
  213. package/lib/src/core-hooks/src/useDebounce/useDebounce.hook.js +1 -30
  214. package/lib/src/core-hooks/src/usePreventEKey/usePreventEKey.hook.js +1 -8
  215. package/lib/src/core-utils/index.js +1 -7
  216. package/lib/src/core-utils/src/calculation/calculation.util.js +1 -89
  217. package/lib/src/core-utils/src/colors/color.util.js +1 -15
  218. package/lib/src/core-utils/src/convert/numberToWords/numToWords.util.js +1 -145
  219. package/lib/src/core-utils/src/convert/typography/camelCaseToTitleCase.util.js +1 -5
  220. package/lib/src/core-utils/src/form-helper/form-helper.util.js +1 -82
  221. package/lib/src/core-utils/src/index.js +1 -7
  222. package/lib/src/core-utils/src/utility/utility.util.js +1 -12
  223. package/lib/src/core-utils/src/uuid/uuid.util.js +1 -8
  224. package/package.json +2 -1
  225. package/lib/src/core-components/src/assets/styles/fontface.css +0 -17
@@ -1,11 +1 @@
1
- import React from 'react';
2
- import { isComponentType } from './isComponentType';
3
- // Source: https://github.com/grrowl/react-keyed-flatten-children/blob/master/index.ts
4
- export const flattenChildren = (children) => React.Children.toArray(children).reduce((acc, child) => {
5
- if (isComponentType(child, React.Fragment)) {
6
- return acc.concat(...flattenChildren(child.props.children));
7
- }
8
- else {
9
- return acc.concat(child);
10
- }
11
- }, []);
1
+ "use strict";import t from"react";import{isComponentType as o}from"./isComponentType";export const flattenChildren=n=>t.Children.toArray(n).reduce((e,r)=>o(r,t.Fragment)?e.concat(...flattenChildren(r.props.children)):e.concat(r),[]);
@@ -1,3 +1 @@
1
- import React from 'react';
2
- import { isComponentType } from './isComponentType';
3
- export const getChildByType = (children, componentType) => React.Children.toArray(children).find((element) => isComponentType(element, componentType));
1
+ "use strict";import e from"react";import{isComponentType as i}from"./isComponentType";export const getChildByType=(o,r)=>e.Children.toArray(o).find(t=>i(t,r));
@@ -1,5 +1 @@
1
- export * from './attachSubComponents';
2
- export * from './getChildByType';
3
- export * from './flattenChildren';
4
- export * from './isComponentType';
5
- export * from './separateChildrenByType';
1
+ "use strict";export*from"./attachSubComponents";export*from"./getChildByType";export*from"./flattenChildren";export*from"./isComponentType";export*from"./separateChildrenByType";
@@ -1,16 +1 @@
1
- import React from 'react';
2
- /**
3
- * Checks if a ReactNode is an Element of some component.
4
- * Supports components that are styled using styled-components.
5
- * Returns false if element is not a ReactElement.
6
- *
7
- * @param element a react node to check
8
- * @param componentType the component type to check
9
- * @returns true if element is an element with type == componentType
10
- */
11
- export const isComponentType = (element, componentType) => {
12
- if (!React.isValidElement(element))
13
- return false;
14
- return (element.type === componentType ||
15
- element.type.target === componentType);
16
- };
1
+ "use strict";import i from"react";export const isComponentType=(t,r)=>i.isValidElement(t)?t.type===r||t.type.target===r:!1;
@@ -1,12 +1 @@
1
- import { isComponentType } from './isComponentType';
2
- import { flattenChildren } from './flattenChildren';
3
- export const separateChildrenByType = (children, ...componentTypes) => flattenChildren(children).reduce((acc, element) => {
4
- const typeIndex = componentTypes.findIndex((componentType) => isComponentType(element, componentType));
5
- if (typeIndex !== -1) {
6
- acc[typeIndex].push(element);
7
- }
8
- else {
9
- acc[componentTypes.length].push(element);
10
- }
11
- return acc;
12
- }, [...componentTypes.map(() => []), []]);
1
+ "use strict";import{isComponentType as n}from"./isComponentType";import{flattenChildren as f}from"./flattenChildren";export const separateChildrenByType=(p,...r)=>f(p).reduce((e,t)=>{const i=r.findIndex(d=>n(t,d));return i!==-1?e[i].push(t):e[r.length].push(t),e},[...r.map(()=>[]),[]]);
@@ -1,18 +1 @@
1
- 'use client';
2
- export * from './useClickOutside';
3
- export * from './useCombinedRefs';
4
- export * from './useDebouncedCallback';
5
- export * from './useDebouncedValue';
6
- export * from './useDeprecation';
7
- export * from './useDeviceDetect';
8
- export * from './useDeviceForm';
9
- export * from './useDisableBodyScroll';
10
- export * from './useHoverState';
11
- export * from './useId';
12
- export * from './useIsBrowser';
13
- export * from './useMediaQuery';
14
- export * from './useOverflow';
15
- export * from './useSafeLayoutEffect';
16
- export * from './useScrollingUp';
17
- export * from './useTrapFocus';
18
- export * from './useWindowDimensions';
1
+ "use strict";"use client";export*from"./useClickOutside";export*from"./useCombinedRefs";export*from"./useDebouncedCallback";export*from"./useDebouncedValue";export*from"./useDeprecation";export*from"./useDeviceDetect";export*from"./useDeviceForm";export*from"./useDisableBodyScroll";export*from"./useHoverState";export*from"./useId";export*from"./useIsBrowser";export*from"./useMediaQuery";export*from"./useOverflow";export*from"./useSafeLayoutEffect";export*from"./useScrollingUp";export*from"./useTrapFocus";export*from"./useWindowDimensions";
@@ -1,18 +1 @@
1
- import { useEffect, useRef } from 'react';
2
- const CLICK_EVENTS = ['mousedown', 'touchstart'];
3
- export function useClickOutside(handler, targetRef) {
4
- const defaultRef = useRef(null);
5
- const ref = targetRef ?? defaultRef;
6
- useEffect(() => {
7
- const listener = (event) => {
8
- if (ref.current && !ref.current.contains(event.target)) {
9
- handler();
10
- }
11
- };
12
- CLICK_EVENTS.forEach((fn) => document.addEventListener(fn, listener));
13
- return () => {
14
- CLICK_EVENTS.forEach((fn) => document.removeEventListener(fn, listener));
15
- };
16
- }, [ref, handler]);
17
- return ref;
18
- }
1
+ "use strict";import{useEffect as s,useRef as f}from"react";const o=["mousedown","touchstart"];export function useClickOutside(n,c){const u=f(null),t=c??u;return s(()=>{const r=e=>{t.current&&!t.current.contains(e.target)&&n()};return o.forEach(e=>document.addEventListener(e,r)),()=>{o.forEach(e=>document.removeEventListener(e,r))}},[t,n]),t}
@@ -1,17 +1 @@
1
- import { useCallback } from 'react';
2
- export function useCombinedRefs(
3
- // eslint-disable-next-line @typescript-eslint/no-unused-vars
4
- ...refs) {
5
- return useCallback((value) => {
6
- refs.forEach((ref) => {
7
- if (!ref)
8
- return;
9
- if (typeof ref === 'function') {
10
- ref(value);
11
- }
12
- else {
13
- ref.current = value;
14
- }
15
- });
16
- }, []);
17
- }
1
+ "use strict";import{useCallback as e}from"react";export function useCombinedRefs(...t){return e(o=>{t.forEach(n=>{n&&(typeof n=="function"?n(o):n.current=o)})},[])}
@@ -1,12 +1 @@
1
- import { useRef, useCallback } from 'react';
2
- export function useDebouncedCallback(func, deps, wait) {
3
- const timeout = useRef();
4
- return useCallback((...args) => {
5
- const later = () => {
6
- clearTimeout(timeout.current);
7
- func(...args);
8
- };
9
- clearTimeout(timeout.current);
10
- timeout.current = setTimeout(later, wait);
11
- }, [func, wait, ...deps]);
12
- }
1
+ "use strict";import{useRef as n,useCallback as l}from"react";export function useDebouncedCallback(t,u,r){const e=n();return l((...o)=>{const c=()=>{clearTimeout(e.current),t(...o)};clearTimeout(e.current),e.current=setTimeout(c,r)},[t,r,...u])}
@@ -1,20 +1 @@
1
- import { useEffect, useState, useRef } from 'react';
2
- export function useDebouncedValue(value, options = { wait: 300 }) {
3
- const [debouncedValue, setValue] = useState(value);
4
- const mountedRef = useRef(false);
5
- const timeoutRef = useRef(null);
6
- const cancel = () => window.clearTimeout(timeoutRef.current);
7
- useEffect(() => {
8
- if (mountedRef.current) {
9
- cancel();
10
- timeoutRef.current = window.setTimeout(() => {
11
- setValue(value);
12
- }, options.wait);
13
- }
14
- }, [value]);
15
- useEffect(() => {
16
- mountedRef.current = true;
17
- return cancel;
18
- }, []);
19
- return [debouncedValue, cancel];
20
- }
1
+ "use strict";import{useEffect as r,useState as f,useRef as o}from"react";export function useDebouncedValue(e,c={wait:300}){const[s,i]=f(e),u=o(!1),n=o(null),t=()=>window.clearTimeout(n.current);return r(()=>{u.current&&(t(),n.current=window.setTimeout(()=>{i(e)},c.wait))},[e]),r(()=>(u.current=!0,t),[]),[s,t]}
@@ -1,40 +1 @@
1
- /* eslint-disable @typescript-eslint/no-unused-vars */
2
- import React, { useEffect } from 'react';
3
- // Since we have no module bundler it's the only way to detect dev env
4
- export const isReactDevelopment = () => '_self' in React.createElement('div');
5
- export const useDeprecation = ({ name, message, version }) => {
6
- if (!isReactDevelopment())
7
- return;
8
- useEffect(() => {
9
- console.warn(`DEPRECATED: ${name} is deprecated and will be removed in version ${version}. ${message}`);
10
- }, []);
11
- };
12
- export const useComponentDeprecation = ({ name, version, alternative, }) => {
13
- useDeprecation({
14
- name,
15
- version,
16
- message: alternative
17
- ? `Please use ${alternative} component instead.`
18
- : `Please remove it carefully.`,
19
- });
20
- };
21
- export const usePropDeprecation = ({ name, value, version, alternative, }) => {
22
- if (value) {
23
- useDeprecation({
24
- name,
25
- version,
26
- message: alternative
27
- ? `Please use ${alternative} prop instead.`
28
- : `Please remove it carefully.`,
29
- });
30
- }
31
- };
32
- export const usePropValueDeprecation = ({ component, prop, currentValue, deprecatedValues, version, }) => {
33
- useEffect(() => {
34
- if (!isReactDevelopment())
35
- return;
36
- if (deprecatedValues.includes(currentValue)) {
37
- console.warn(`DEPRECATED: The ${currentValue} value for the ${prop} prop on the ${component} component is deprecated and will be removed in version ${version}.`);
38
- }
39
- }, [currentValue]);
40
- };
1
+ "use strict";import i,{useEffect as t}from"react";export const isReactDevelopment=()=>"_self"in i.createElement("div"),useDeprecation=({name:o,message:s,version:e})=>{isReactDevelopment()&&t(()=>{console.warn(`DEPRECATED: ${o} is deprecated and will be removed in version ${e}. ${s}`)},[])},useComponentDeprecation=({name:o,version:s,alternative:e})=>{useDeprecation({name:o,version:s,message:e?`Please use ${e} component instead.`:"Please remove it carefully."})},usePropDeprecation=({name:o,value:s,version:e,alternative:n})=>{s&&useDeprecation({name:o,version:e,message:n?`Please use ${n} prop instead.`:"Please remove it carefully."})},usePropValueDeprecation=({component:o,prop:s,currentValue:e,deprecatedValues:n,version:r})=>{t(()=>{isReactDevelopment()&&n.includes(e)&&console.warn(`DEPRECATED: The ${e} value for the ${s} prop on the ${o} component is deprecated and will be removed in version ${r}.`)},[e])};
@@ -1,10 +1 @@
1
- import { useMemo } from 'react';
2
- export const useDeviceDetect = () => useMemo(() => {
3
- if (typeof window !== 'undefined') {
4
- return {
5
- isMobile: !!navigator.userAgent.match(/Android|BlackBerry|iPhone|iPad|iPod|Opera Mini|IEMobile/i),
6
- isFirefox: !!navigator.userAgent.toLowerCase().includes('firefox'),
7
- };
8
- }
9
- return { isMobile: false, isFirefox: false };
10
- }, []);
1
+ "use strict";import{useMemo as e}from"react";export const useDeviceDetect=()=>e(()=>typeof window<"u"?{isMobile:!!navigator.userAgent.match(/Android|BlackBerry|iPhone|iPad|iPod|Opera Mini|IEMobile/i),isFirefox:!!navigator.userAgent.toLowerCase().includes("firefox")}:{isMobile:!1,isFirefox:!1},[]);
@@ -1,24 +1 @@
1
- import { useWindowDimensions } from './useWindowDimensions';
2
- import { Size } from '../abstracts';
3
- export var DeviceFormFactor;
4
- (function (DeviceFormFactor) {
5
- DeviceFormFactor["Mobile"] = "mobile";
6
- DeviceFormFactor["Tablet"] = "tablet";
7
- DeviceFormFactor["Laptop"] = "laptop";
8
- DeviceFormFactor["Desktop"] = "desktop";
9
- })(DeviceFormFactor || (DeviceFormFactor = {}));
10
- export function useDeviceForm() {
11
- const { width } = useWindowDimensions();
12
- if (width < Size.MD) {
13
- return DeviceFormFactor.Mobile;
14
- }
15
- else if (width < Size.MD2) {
16
- return DeviceFormFactor.Tablet;
17
- }
18
- else if (width < Size.XL) {
19
- return DeviceFormFactor.Laptop;
20
- }
21
- else {
22
- return DeviceFormFactor.Desktop;
23
- }
24
- }
1
+ "use strict";import{useWindowDimensions as o}from"./useWindowDimensions";import{Size as t}from"../abstracts";export var DeviceFormFactor;(function(e){e.Mobile="mobile",e.Tablet="tablet",e.Laptop="laptop",e.Desktop="desktop"})(DeviceFormFactor||(DeviceFormFactor={}));export function useDeviceForm(){const{width:e}=o();return e<t.MD?DeviceFormFactor.Mobile:e<t.MD2?DeviceFormFactor.Tablet:e<t.XL?DeviceFormFactor.Laptop:DeviceFormFactor.Desktop}
@@ -1,16 +1 @@
1
- import { useEffect } from 'react';
2
- import { useId } from './useId';
3
- export const useDisableBackgroundScroll = (shouldDisableScroll, backgroundElement) => {
4
- const className = useId('disable-scroll');
5
- useEffect(() => {
6
- if (!shouldDisableScroll)
7
- return;
8
- backgroundElement ??= document.body;
9
- backgroundElement.classList.add(className);
10
- return () => {
11
- backgroundElement?.classList.remove(className);
12
- };
13
- }, [shouldDisableScroll, backgroundElement]);
14
- };
15
- /** @deprecated Prefer `useDisableBackgroundScroll` instead */
16
- export const useDisableBodyScroll = useDisableBackgroundScroll;
1
+ "use strict";import{useEffect as t}from"react";import{useId as e}from"./useId";export const useDisableBackgroundScroll=(o,s)=>{const r=e("disable-scroll");t(()=>{if(o)return s??=document.body,s.classList.add(r),()=>{s?.classList.remove(r)}},[o,s])},useDisableBodyScroll=useDisableBackgroundScroll;
@@ -1,36 +1 @@
1
- import { useState, useCallback, useEffect } from 'react';
2
- export const useHoverState = (disabled = false) => {
3
- const [isHovered, setIsHovered] = useState(false);
4
- const [isActive, setIsActive] = useState(false);
5
- const onMouseOver = useCallback(() => {
6
- setIsHovered(true);
7
- }, []);
8
- const onMouseOut = useCallback(() => {
9
- setIsHovered(false);
10
- }, []);
11
- const onMouseDown = useCallback(() => {
12
- setIsActive(true);
13
- }, []);
14
- const onMouseUp = useCallback(() => {
15
- setIsActive(false);
16
- }, []);
17
- useEffect(() => {
18
- const event = () => {
19
- if (isActive) {
20
- onMouseUp();
21
- }
22
- };
23
- document.addEventListener('mouseup', event);
24
- return () => {
25
- document.removeEventListener('mouseup', event);
26
- };
27
- }, [isActive, onMouseUp]);
28
- const hoverState = disabled
29
- ? 'disabled'
30
- : isActive
31
- ? 'active'
32
- : isHovered
33
- ? 'hover'
34
- : 'default';
35
- return { hoverState, onMouseOver, onMouseOut, onMouseDown, onMouseUp };
36
- };
1
+ "use strict";import{useState as r,useCallback as e,useEffect as d}from"react";export const useHoverState=(c=!1)=>{const[a,o]=r(!1),[t,n]=r(!1),v=e(()=>{o(!0)},[]),f=e(()=>{o(!1)},[]),i=e(()=>{n(!0)},[]),s=e(()=>{n(!1)},[]);return d(()=>{const u=()=>{t&&s()};return document.addEventListener("mouseup",u),()=>{document.removeEventListener("mouseup",u)}},[t,s]),{hoverState:c?"disabled":t?"active":a?"hover":"default",onMouseOver:v,onMouseOut:f,onMouseDown:i,onMouseUp:s}};
@@ -1,7 +1 @@
1
- // import { useId as useReachId } from '@reach/auto-id';
2
- import { useId as useReactId } from 'react';
3
- const PREFIX = 'tech-abl-ui';
4
- export const useId = (prefix, id) => {
5
- const randId = `${PREFIX}-${prefix}-${useReactId()}`;
6
- return id ?? randId;
7
- };
1
+ "use strict";import{useId as o}from"react";const r="tech-abl-ui";export const useId=(t,e)=>{const s=`${r}-${t}-${o()}`;return e??s};
@@ -1,11 +1 @@
1
- import { useEffect, useState } from 'react';
2
- // sometimes components cannot be rendered on the server.
3
- // so using `useEffect` ensures that the code is only rendered on the client side
4
- // use this hook to avoid hydration errors
5
- export const useIsBrowser = () => {
6
- const [isBrowser, setIsBrowser] = useState(false);
7
- useEffect(() => {
8
- setIsBrowser(true);
9
- }, []);
10
- return isBrowser;
11
- };
1
+ "use strict";import{useEffect as r,useState as t}from"react";export const useIsBrowser=()=>{const[e,s]=t(!1);return r(()=>{s(!0)},[]),e};
@@ -1,16 +1 @@
1
- import { useEffect, useState } from 'react';
2
- export const useMediaQuery = (query) => {
3
- if (typeof window === 'undefined')
4
- return false;
5
- const [matches, setMatches] = useState(false);
6
- useEffect(() => {
7
- const media = window.matchMedia(query);
8
- if (media.matches !== matches) {
9
- setMatches(media.matches);
10
- }
11
- const listener = () => setMatches(media.matches);
12
- window.addEventListener('resize', listener);
13
- return () => window.removeEventListener('resize', listener);
14
- }, [matches, query]);
15
- return matches;
16
- };
1
+ "use strict";import{useEffect as r,useState as a}from"react";export const useMediaQuery=s=>{if(typeof window>"u")return!1;const[e,n]=a(!1);return r(()=>{const t=window.matchMedia(s);t.matches!==e&&n(t.matches);const i=()=>n(t.matches);return window.addEventListener("resize",i),()=>window.removeEventListener("resize",i)},[e,s]),e};
@@ -1,22 +1 @@
1
- import { useState } from 'react';
2
- import { useSafeLayoutEffect } from './useSafeLayoutEffect';
3
- export const useOverflow = (ref) => {
4
- const [isOverflow, setIsOverflow] = useState(false);
5
- useSafeLayoutEffect(() => {
6
- const { current } = ref;
7
- const trigger = () => {
8
- if (!current)
9
- return;
10
- const hasOverflow = current.scrollHeight > current.clientHeight;
11
- setIsOverflow(hasOverflow);
12
- };
13
- let observer;
14
- if (current) {
15
- observer = new ResizeObserver(trigger);
16
- observer.observe(current);
17
- trigger();
18
- }
19
- return () => observer?.disconnect();
20
- });
21
- return isOverflow;
22
- };
1
+ "use strict";import{useState as c}from"react";import{useSafeLayoutEffect as i}from"./useSafeLayoutEffect";export const useOverflow=o=>{const[s,n]=c(!1);return i(()=>{const{current:e}=o,t=()=>{if(!e)return;const f=e.scrollHeight>e.clientHeight;n(f)};let r;return e&&(r=new ResizeObserver(t),r.observe(e),t()),()=>r?.disconnect()}),s};
@@ -1,5 +1 @@
1
- import React from 'react';
2
- /**
3
- * Version of useLayoutEffect that doesn't throw errors in SSR.
4
- */
5
- export const useSafeLayoutEffect = typeof window !== 'undefined' ? React.useLayoutEffect : React.useEffect;
1
+ "use strict";import e from"react";export const useSafeLayoutEffect=typeof window<"u"?e.useLayoutEffect:e.useEffect;
@@ -1,18 +1 @@
1
- import { useEffect, useRef, useState } from 'react';
2
- export const useScrollingUp = (initialState = false) => {
3
- if (typeof window === 'undefined')
4
- return initialState;
5
- const [scrollingUp, setScrollingUp] = useState(initialState);
6
- const prevScroll = useRef(window.scrollY);
7
- useEffect(() => {
8
- const handleScroll = () => {
9
- const currScroll = window.pageYOffset;
10
- const isScrolled = prevScroll.current > currScroll;
11
- setScrollingUp(isScrolled);
12
- prevScroll.current = currScroll;
13
- };
14
- window.addEventListener('scroll', handleScroll, { passive: true });
15
- return () => window.removeEventListener('scroll', handleScroll);
16
- }, []);
17
- return scrollingUp;
18
- };
1
+ "use strict";import{useEffect as c,useRef as i,useState as u}from"react";export const useScrollingUp=(e=!1)=>{if(typeof window>"u")return e;const[s,l]=u(e),r=i(window.scrollY);return c(()=>{const o=()=>{const n=window.pageYOffset,t=r.current>n;l(t),r.current=n};return window.addEventListener("scroll",o,{passive:!0}),()=>window.removeEventListener("scroll",o)},[]),s};
@@ -1,30 +1 @@
1
- import { useEffect } from 'react';
2
- export const keyDownHandler = (firstElement, lastElement, e) => {
3
- if (e.key !== 'Tab')
4
- return;
5
- if (!e.shiftKey && document.activeElement === lastElement) {
6
- firstElement.focus();
7
- e.preventDefault();
8
- }
9
- if (e.shiftKey && document.activeElement === firstElement) {
10
- lastElement.focus();
11
- e.preventDefault();
12
- }
13
- };
14
- const selectors = [
15
- 'a[href]',
16
- 'button:not([disabled])',
17
- 'textarea',
18
- 'input',
19
- 'select',
20
- ];
21
- export const useTrapFocus = (ref) => {
22
- useEffect(() => {
23
- const focusableElements = ref?.current?.querySelectorAll(selectors.join(', '));
24
- const firstElement = focusableElements?.[0];
25
- const lastElement = focusableElements?.[focusableElements.length - 1];
26
- const boundKeydownHandler = keyDownHandler.bind(null, firstElement, lastElement);
27
- ref?.current?.addEventListener('keydown', boundKeydownHandler);
28
- return () => ref?.current?.removeEventListener('keydown', boundKeydownHandler);
29
- }, [ref?.current]);
30
- };
1
+ "use strict";import{useEffect as c}from"react";export const keyDownHandler=(e,n,t)=>{t.key==="Tab"&&(!t.shiftKey&&document.activeElement===n&&(e.focus(),t.preventDefault()),t.shiftKey&&document.activeElement===e&&(n.focus(),t.preventDefault()))};const s=["a[href]","button:not([disabled])","textarea","input","select"];export const useTrapFocus=e=>{c(()=>{const n=e?.current?.querySelectorAll(s.join(", ")),t=n?.[0],r=n?.[n.length-1],o=keyDownHandler.bind(null,t,r);return e?.current?.addEventListener("keydown",o),()=>e?.current?.removeEventListener("keydown",o)},[e?.current])};
@@ -1,23 +1 @@
1
- import { useState, useEffect } from 'react';
2
- function getWindowDimensions() {
3
- const { innerWidth: width, innerHeight: height } = window;
4
- return {
5
- width,
6
- height,
7
- };
8
- }
9
- export function useWindowDimensions() {
10
- const [windowDimensions, setWindowDimensions] = useState({
11
- width: 0,
12
- height: 0,
13
- });
14
- useEffect(() => {
15
- setWindowDimensions(getWindowDimensions());
16
- function handleResize() {
17
- setWindowDimensions(getWindowDimensions());
18
- }
19
- window.addEventListener('resize', handleResize);
20
- return () => window.removeEventListener('resize', handleResize);
21
- }, []);
22
- return windowDimensions;
23
- }
1
+ "use strict";import{useState as o,useEffect as s}from"react";function t(){const{innerWidth:n,innerHeight:e}=window;return{width:n,height:e}}export function useWindowDimensions(){const[n,e]=o({width:0,height:0});return s(()=>{e(t());function i(){e(t())}return window.addEventListener("resize",i),()=>window.removeEventListener("resize",i)},[]),n}
@@ -1,9 +1 @@
1
- export * from './utility.util';
2
- export * from './context';
3
- export * from './helpers';
4
- export * from './hooks';
5
- export * from './stories';
6
- export * from './styling';
7
- export * from './testing';
8
- export * from './abstracts';
9
- export { tokens } from './designTokens';
1
+ "use strict";export*from"./utility.util";export*from"./context";export*from"./helpers";export*from"./hooks";export*from"./stories";export*from"./styling";export*from"./testing";export*from"./abstracts";export{tokens}from"./designTokens";
@@ -1,47 +1,32 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import { styled } from 'styled-components';
3
- export const Wrappers = {
4
- Default: styled.div `
1
+ "use strict";import{jsx as r}from"react/jsx-runtime";import{styled as e}from"styled-components";export const Wrappers={Default:e.div`
5
2
  display: flex;
6
3
  justify-content: flex-start;
7
4
  padding: 2rem;
8
- `,
9
- Dashed: styled.div `
5
+ `,Dashed:e.div`
10
6
  margin: auto;
11
- ${({ $width }) => $width && `width: ${$width};`}
7
+ ${({$width:i})=>i&&`width: ${i};`}
12
8
  border: 2px dashed var(--aui-primary);
13
9
  border-radius: 8px;
14
10
  padding: 8px;
15
- `,
16
- TextInput: styled.div `
11
+ `,TextInput:e.div`
17
12
  width: 250px;
18
13
  display: flex;
19
14
  flex-direction: column;
20
15
  gap: 1rem;
21
16
  margin: auto;
22
- `,
23
- Modal: styled.div `
17
+ `,Modal:e.div`
24
18
  height: 100%;
25
19
  margin: -1rem;
26
- `,
27
- Row: styled.div `
20
+ `,Row:e.div`
28
21
  max-width: 100%;
29
22
  flex-wrap: wrap;
30
23
  display: flex;
31
24
  gap: 10px;
32
25
  align-items: center;
33
26
  justify-content: center;
34
- `,
35
- Test: styled.div `
27
+ `,Test:e.div`
36
28
  display: flex;
37
29
  flex-direction: column;
38
30
  gap: 1rem;
39
31
  width: min(100%, 600px);
40
- `,
41
- };
42
- export const Decorators = Object.entries(Wrappers).reduce((acc, [title, Wrapper]) => ({
43
- ...acc,
44
- [title]: (Story) => (_jsx(Wrapper, { children: _jsx(Story, {}) })),
45
- }), {}
46
- // eslint-disable-next-line @typescript-eslint/no-unused-vars
47
- );
32
+ `},Decorators=Object.entries(Wrappers).reduce((i,[t,a])=>({...i,[t]:d=>r(a,{children:r(d,{})})}),{});
@@ -1,5 +1 @@
1
- export function cleanProps(object) {
2
- return Object.entries(object)
3
- .filter(([, val]) => val !== undefined)
4
- .reduce((acc, [key, val]) => ({ ...acc, [key]: val }), {});
5
- }
1
+ "use strict";export function cleanProps(n){return Object.entries(n).filter(([,e])=>e!==void 0).reduce((e,[r,t])=>({...e,[r]:t}),{})}
@@ -1,4 +1 @@
1
- export * from './view-ports';
2
- export * from './cleanProps';
3
- export * from './sleep';
4
- export * from './Wrappers';
1
+ "use strict";export*from"./view-ports";export*from"./cleanProps";export*from"./sleep";export*from"./Wrappers";
@@ -1,4 +1 @@
1
- // https://stackoverflow.com/a/39914235
2
- export async function sleep(ms) {
3
- return new Promise((resolve) => setTimeout(resolve, ms));
4
- }
1
+ "use strict";export async function sleep(e){return new Promise(n=>setTimeout(n,e))}
@@ -1,50 +1 @@
1
- export const VIEWPORTS = {
2
- sm: {
3
- name: 'SM',
4
- styles: {
5
- height: '100%',
6
- width: '375px',
7
- },
8
- type: 'mobile',
9
- },
10
- md: {
11
- name: 'MD',
12
- styles: {
13
- height: '100%',
14
- width: '768px',
15
- },
16
- type: 'mobile',
17
- },
18
- md2: {
19
- name: 'MD2',
20
- styles: {
21
- height: '100%',
22
- width: '1024px',
23
- },
24
- type: 'mobile',
25
- },
26
- lg: {
27
- name: 'LG',
28
- styles: {
29
- height: '100%',
30
- width: '1280px',
31
- },
32
- type: 'mobile',
33
- },
34
- xl: {
35
- name: 'XL',
36
- styles: {
37
- height: '100%',
38
- width: '1440px',
39
- },
40
- type: 'mobile',
41
- },
42
- xxl: {
43
- name: 'XXL',
44
- styles: {
45
- height: '100%',
46
- width: '1920px',
47
- },
48
- type: 'mobile',
49
- },
50
- };
1
+ "use strict";export const VIEWPORTS={sm:{name:"SM",styles:{height:"100%",width:"375px"},type:"mobile"},md:{name:"MD",styles:{height:"100%",width:"768px"},type:"mobile"},md2:{name:"MD2",styles:{height:"100%",width:"1024px"},type:"mobile"},lg:{name:"LG",styles:{height:"100%",width:"1280px"},type:"mobile"},xl:{name:"XL",styles:{height:"100%",width:"1440px"},type:"mobile"},xxl:{name:"XXL",styles:{height:"100%",width:"1920px"},type:"mobile"}};
@@ -1,5 +1 @@
1
- export const calcWidthOfColumns = ({ columns, totalColumns, margin, gutter, maxWidth = '100%', }) => {
2
- const internalGutters = (columns - 1) * gutter;
3
- const guttersAndMargin = 2 * margin + (totalColumns - 1) * gutter;
4
- return `calc(${internalGutters}px + ${columns} * (${maxWidth} - ${guttersAndMargin}px) / ${totalColumns})`;
5
- };
1
+ "use strict";export const calcWidthOfColumns=({columns:n,totalColumns:t,margin:r,gutter:c,maxWidth:$="100%"})=>{const e=(n-1)*c,s=2*r+(t-1)*c;return`calc(${e}px + ${n} * (${$} - ${s}px) / ${t})`};
@@ -1,15 +1,9 @@
1
- export const createGridContainer = (
2
- /* Gap between columns, also known as "gutter" */
3
- gridLayoutGap,
4
- /* Max number of columns in a row */
5
- gridColumnCount,
6
- /* Min width of grid items before they wrap to a new row */
7
- gridItemMinWidth) => `
8
- --gap-count: calc(${gridColumnCount} - 1);
9
- --total-gap-width: calc(var(--gap-count) * ${gridLayoutGap});
10
- --grid-item--max-width: calc((100% - var(--total-gap-width)) / ${gridColumnCount});
1
+ "use strict";export const createGridContainer=(a,t,i)=>`
2
+ --gap-count: calc(${t} - 1);
3
+ --total-gap-width: calc(var(--gap-count) * ${a});
4
+ --grid-item--max-width: calc((100% - var(--total-gap-width)) / ${t});
11
5
 
12
6
  display: grid;
13
- grid-template-columns: repeat(auto-fill, minmax(max(${gridItemMinWidth}, var(--grid-item--max-width)), 1fr));
14
- grid-gap: ${gridLayoutGap};
7
+ grid-template-columns: repeat(auto-fill, minmax(max(${i}, var(--grid-item--max-width)), 1fr));
8
+ grid-gap: ${a};
15
9
  `;