react-restyle-components 0.4.46 → 0.4.47

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 (231) 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 -451
  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 -159
  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 -1489
  105. package/lib/src/core-components/src/components/Table/columnReorder.js +36 -332
  106. package/lib/src/core-components/src/components/Table/columnResize.js +21 -284
  107. package/lib/src/core-components/src/components/Table/elements.js +173 -277
  108. package/lib/src/core-components/src/components/Table/filters.js +30 -555
  109. package/lib/src/core-components/src/components/Table/hooks.js +2 -536
  110. package/lib/src/core-components/src/components/Table/index.js +1 -6
  111. package/lib/src/core-components/src/components/Table/types.js +1 -1
  112. package/lib/src/core-components/src/components/Tabs/tabs.component.js +1 -22
  113. package/lib/src/core-components/src/components/Tags1/Tags.component.js +1 -118
  114. package/lib/src/core-components/src/components/Tags1/types.js +1 -20
  115. package/lib/src/core-components/src/components/Timer1/timer.component.js +1 -76
  116. package/lib/src/core-components/src/components/Toast/Toast.js +1 -50
  117. package/lib/src/core-components/src/components/Toast/elements.js +41 -122
  118. package/lib/src/core-components/src/components/Toast/index.js +1 -2
  119. package/lib/src/core-components/src/components/Toast/types.js +1 -9
  120. package/lib/src/core-components/src/components/Tooltip/Tooltip.js +1 -200
  121. package/lib/src/core-components/src/components/Tooltip/elements.js +55 -117
  122. package/lib/src/core-components/src/components/Tooltip/index.js +1 -2
  123. package/lib/src/core-components/src/components/Tooltip/types.js +1 -17
  124. package/lib/src/core-components/src/components/Tooltip/utils.js +1 -140
  125. package/lib/src/core-components/src/components/TreeSelect/TreeSelect.js +1 -303
  126. package/lib/src/core-components/src/components/TreeSelect/elements.js +117 -216
  127. package/lib/src/core-components/src/components/TreeSelect/hooks.js +1 -252
  128. package/lib/src/core-components/src/components/TreeSelect/index.js +1 -3
  129. package/lib/src/core-components/src/components/TreeSelect/types.js +1 -1
  130. package/lib/src/core-components/src/components/ag-grid/AgGrid.js +1 -1057
  131. package/lib/src/core-components/src/components/ag-grid/elements.js +396 -790
  132. package/lib/src/core-components/src/components/ag-grid/hooks.js +4 -1220
  133. package/lib/src/core-components/src/components/ag-grid/index.js +1 -15
  134. package/lib/src/core-components/src/components/ag-grid/types.js +1 -6
  135. package/lib/src/core-components/src/components/index.js +1 -31
  136. package/lib/src/core-components/src/components/pdf/pdf-images.components.js +1 -7
  137. package/lib/src/core-components/src/components/pdf/pdf-table.components.js +5 -48
  138. package/lib/src/core-components/src/components/pdf/pdf-typography.components.js +1 -70
  139. package/lib/src/core-components/src/components/pdf/pdf-wrapped-view.components.js +1 -50
  140. package/lib/src/core-components/src/core-components/Avatar.js +4 -33
  141. package/lib/src/core-components/src/core-components/CoreButton/CoreButton.js +1 -10
  142. package/lib/src/core-components/src/core-components/CoreButton/elements.js +67 -176
  143. package/lib/src/core-components/src/core-components/CoreButton/index.js +1 -3
  144. package/lib/src/core-components/src/core-components/CoreButton/types.js +1 -6
  145. package/lib/src/core-components/src/core-components/CoreButton/utils.js +1 -12
  146. package/lib/src/core-components/src/core-components/Divider/Divider.js +4 -19
  147. package/lib/src/core-components/src/core-components/Divider/index.js +1 -1
  148. package/lib/src/core-components/src/core-components/SelectionCardStrip/index.js +1 -1
  149. package/lib/src/core-components/src/core-components/SelectionCardStrip/selectionCardStrip.js +10 -33
  150. package/lib/src/core-components/src/core-components/StateLayer.js +3 -5
  151. package/lib/src/core-components/src/core-components/ToggleCore/elements.js +25 -50
  152. package/lib/src/core-components/src/core-components/ToggleCore/index.js +1 -2
  153. package/lib/src/core-components/src/core-components/ToggleCore/toggleCore.js +1 -14
  154. package/lib/src/core-components/src/core-components/atoms/Input/Input.js +1 -22
  155. package/lib/src/core-components/src/core-components/atoms/Label/Label.js +1 -21
  156. package/lib/src/core-components/src/core-components/atoms/Textarea/Textarea.js +1 -19
  157. package/lib/src/core-components/src/core-components/index.js +1 -3
  158. package/lib/src/core-components/src/helpers/constants.js +1 -11
  159. package/lib/src/core-components/src/hooks/index.js +1 -1
  160. package/lib/src/core-components/src/hooks/outside.hook.js +1 -28
  161. package/lib/src/core-components/src/index.js +1 -12
  162. package/lib/src/core-components/src/tc.global.css +1 -0
  163. package/lib/src/core-components/src/utils/abstracts/breakpoints/index.js +1 -28
  164. package/lib/src/core-components/src/utils/abstracts/colors/index.js +1 -49
  165. package/lib/src/core-components/src/utils/abstracts/index.js +1 -5
  166. package/lib/src/core-components/src/utils/abstracts/space/index.js +1 -26
  167. package/lib/src/core-components/src/utils/abstracts/theme/ThemeBoundary.js +1 -8
  168. package/lib/src/core-components/src/utils/abstracts/theme/default-themes.js +1 -30
  169. package/lib/src/core-components/src/utils/abstracts/theme/index.js +1 -3
  170. package/lib/src/core-components/src/utils/abstracts/theme/theme.js +1 -30
  171. package/lib/src/core-components/src/utils/abstracts/theme/types.js +1 -1
  172. package/lib/src/core-components/src/utils/abstracts/theme/useTheme.js +1 -17
  173. package/lib/src/core-components/src/utils/abstracts/typography/index.js +1 -25
  174. package/lib/src/core-components/src/utils/context/DefaultsProvider.js +1 -8
  175. package/lib/src/core-components/src/utils/context/InternalProvider.js +1 -24
  176. package/lib/src/core-components/src/utils/context/index.js +1 -2
  177. package/lib/src/core-components/src/utils/designTokens.js +1 -128
  178. package/lib/src/core-components/src/utils/helpers/attachSubComponents.js +1 -23
  179. package/lib/src/core-components/src/utils/helpers/flattenChildren.js +1 -11
  180. package/lib/src/core-components/src/utils/helpers/getChildByType.js +1 -3
  181. package/lib/src/core-components/src/utils/helpers/index.js +1 -5
  182. package/lib/src/core-components/src/utils/helpers/isComponentType.js +1 -16
  183. package/lib/src/core-components/src/utils/helpers/separateChildrenByType.js +1 -12
  184. package/lib/src/core-components/src/utils/hooks/index.js +1 -18
  185. package/lib/src/core-components/src/utils/hooks/useClickOutside.js +1 -18
  186. package/lib/src/core-components/src/utils/hooks/useCombinedRefs.js +1 -17
  187. package/lib/src/core-components/src/utils/hooks/useDebouncedCallback.js +1 -12
  188. package/lib/src/core-components/src/utils/hooks/useDebouncedValue.js +1 -20
  189. package/lib/src/core-components/src/utils/hooks/useDeprecation.js +1 -40
  190. package/lib/src/core-components/src/utils/hooks/useDeviceDetect.js +1 -10
  191. package/lib/src/core-components/src/utils/hooks/useDeviceForm.js +1 -24
  192. package/lib/src/core-components/src/utils/hooks/useDisableBodyScroll.js +1 -16
  193. package/lib/src/core-components/src/utils/hooks/useHoverState.js +1 -36
  194. package/lib/src/core-components/src/utils/hooks/useId.js +1 -7
  195. package/lib/src/core-components/src/utils/hooks/useIsBrowser.js +1 -11
  196. package/lib/src/core-components/src/utils/hooks/useMediaQuery.js +1 -16
  197. package/lib/src/core-components/src/utils/hooks/useOverflow.js +1 -22
  198. package/lib/src/core-components/src/utils/hooks/useSafeLayoutEffect.js +1 -5
  199. package/lib/src/core-components/src/utils/hooks/useScrollingUp.js +1 -18
  200. package/lib/src/core-components/src/utils/hooks/useTrapFocus.js +1 -30
  201. package/lib/src/core-components/src/utils/hooks/useWindowDimensions.js +1 -23
  202. package/lib/src/core-components/src/utils/index.js +1 -9
  203. package/lib/src/core-components/src/utils/stories/Wrappers.js +8 -23
  204. package/lib/src/core-components/src/utils/stories/cleanProps.js +1 -5
  205. package/lib/src/core-components/src/utils/stories/index.js +1 -4
  206. package/lib/src/core-components/src/utils/stories/sleep.js +1 -4
  207. package/lib/src/core-components/src/utils/stories/view-ports.js +1 -50
  208. package/lib/src/core-components/src/utils/styling/calcWidthOfColumns.js +1 -5
  209. package/lib/src/core-components/src/utils/styling/createGridContainer.js +6 -12
  210. package/lib/src/core-components/src/utils/styling/createTransition.js +2 -7
  211. package/lib/src/core-components/src/utils/styling/forwardProps.js +1 -10
  212. package/lib/src/core-components/src/utils/styling/index.js +1 -5
  213. package/lib/src/core-components/src/utils/styling/pxToRem.js +1 -6
  214. package/lib/src/core-components/src/utils/testing/getComputedStyle.js +1 -3
  215. package/lib/src/core-components/src/utils/testing/index.js +1 -1
  216. package/lib/src/core-components/src/utils/utility.util.js +1 -14
  217. package/lib/src/core-components/tailwind.config.js +1 -233
  218. package/lib/src/core-hooks/index.js +1 -3
  219. package/lib/src/core-hooks/src/useClickOutside/useClickOutside.hook.js +1 -46
  220. package/lib/src/core-hooks/src/useDebounce/useDebounce.hook.js +1 -30
  221. package/lib/src/core-hooks/src/usePreventEKey/usePreventEKey.hook.js +1 -8
  222. package/lib/src/core-utils/index.js +1 -7
  223. package/lib/src/core-utils/src/calculation/calculation.util.js +1 -89
  224. package/lib/src/core-utils/src/colors/color.util.js +1 -15
  225. package/lib/src/core-utils/src/convert/numberToWords/numToWords.util.js +1 -145
  226. package/lib/src/core-utils/src/convert/typography/camelCaseToTitleCase.util.js +1 -5
  227. package/lib/src/core-utils/src/form-helper/form-helper.util.js +1 -82
  228. package/lib/src/core-utils/src/index.js +1 -7
  229. package/lib/src/core-utils/src/utility/utility.util.js +1 -12
  230. package/lib/src/core-utils/src/uuid/uuid.util.js +1 -8
  231. package/package.json +1 -1
@@ -1,36 +1 @@
1
- import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
2
- import React, { useState, useEffect } from 'react';
3
- import classNames from 'classnames';
4
- import { Label } from '../../../core-components/atoms/Label/Label';
5
- import s from '../../../tc.module.css';
6
- import { cn } from '../../../utils';
7
- import '../toggle.css';
8
- export const ToggleInput = React.forwardRef(({ id, label, error, required, value, onChange, disabled, isToggleLabel = true, className, labelProps, ...props }, ref) => {
9
- const [toggleValue, setToggleValue] = useState(value ?? false);
10
- useEffect(() => {
11
- if (value !== undefined) {
12
- setToggleValue(value);
13
- }
14
- }, [value]);
15
- const handleToggleClick = () => {
16
- if (disabled)
17
- return;
18
- const newValue = !toggleValue;
19
- setToggleValue(newValue);
20
- if (onChange) {
21
- onChange(newValue);
22
- }
23
- };
24
- const toggleClasses = classNames('wrg-toggle', {
25
- 'wrg-toggle--checked': toggleValue,
26
- 'wrg-toggle--disabled': disabled,
27
- }, className);
28
- return (_jsxs("div", { className: cn(s['w-full'], className), children: [label && (_jsx(Label, { id: id, required: required, label: label, ...labelProps })), _jsxs("div", { onClick: handleToggleClick, className: toggleClasses, children: [_jsx("div", { className: cn('wrg-toggle-container', {
29
- [s['bg-green-700']]: toggleValue,
30
- [s['bg-black']]: !toggleValue,
31
- }), children: isToggleLabel && (_jsxs(_Fragment, { children: [_jsx("div", { className: cn('wrg-toggle-check'), children: _jsx("span", { className: cn(s['text-white'], s['ml-1']), children: "Yes" }) }), _jsx("div", { className: cn('wrg-toggle-uncheck'), children: _jsx("span", { className: cn(s['dark:text-black']), children: "No" }) })] })) }), _jsx("div", { className: cn('wrg-toggle-circle', s['dark:bg-black'], {
32
- 'ml-1': toggleValue,
33
- 'mr-1': !toggleValue,
34
- }) }), _jsx("input", { ref: ref, type: "checkbox", "aria-label": "Toggle Button", className: cn('wrg-toggle-input'), checked: toggleValue, readOnly: true, ...props })] }), error && (_jsx("p", { className: cn(s['mt-1'], s['text-sm'], s['text-red-600'], s['dark:text-red-400']), children: error }))] }));
35
- });
36
- ToggleInput.displayName = 'ToggleInput';
1
+ "use strict";import{jsx as t,Fragment as b,jsxs as a}from"react/jsx-runtime";import T,{useState as j,useEffect as v}from"react";import y from"classnames";import{Label as V}from"../../../core-components/atoms/Label/Label";import e from"../../../tc.module.css";import{cn as l}from"../../../utils";import"../toggle.css";export const ToggleInput=T.forwardRef(({id:f,label:c,error:g,required:p,value:s,onChange:o,disabled:i,isToggleLabel:h=!0,className:n,labelProps:u,...k},w)=>{const[r,m]=j(s??!1);v(()=>{s!==void 0&&m(s)},[s]);const N=()=>{if(i)return;const d=!r;m(d),o&&o(d)},x=y("wrg-toggle",{"wrg-toggle--checked":r,"wrg-toggle--disabled":i},n);return a("div",{className:l(e["w-full"],n),children:[c&&t(V,{id:f,required:p,label:c,...u}),a("div",{onClick:N,className:x,children:[t("div",{className:l("wrg-toggle-container",{[e["bg-green-700"]]:r,[e["bg-black"]]:!r}),children:h&&a(b,{children:[t("div",{className:l("wrg-toggle-check"),children:t("span",{className:l(e["text-white"],e["ml-1"]),children:"Yes"})}),t("div",{className:l("wrg-toggle-uncheck"),children:t("span",{className:l(e["dark:text-black"]),children:"No"})})]})}),t("div",{className:l("wrg-toggle-circle",e["dark:bg-black"],{"ml-1":r,"mr-1":!r})}),t("input",{ref:w,type:"checkbox","aria-label":"Toggle Button",className:l("wrg-toggle-input"),checked:r,readOnly:!0,...k})]}),g&&t("p",{className:l(e["mt-1"],e["text-sm"],e["text-red-600"],e["dark:text-red-400"]),children:g})]})});ToggleInput.displayName="ToggleInput";
@@ -1,11 +1 @@
1
- export { PasswordInput } from './PasswordInput';
2
- export { ToggleInput } from './ToggleInput';
3
- export { RadioInput } from './RadioInput';
4
- export { CheckboxInput } from './CheckboxInput';
5
- export { CheckboxGroupInput } from './CheckboxGroupInput';
6
- export { DatePickerInput } from './DatePickerInput';
7
- export { DropdownInput } from './DropdownInput';
8
- export { TextDropdownInput } from './TextDropdownInput';
9
- export { PinInput } from './PinInput';
10
- export { OtpInput } from './OtpInput';
11
- export { CssMultilineInput } from './CssMultilineInput';
1
+ "use strict";export{PasswordInput}from"./PasswordInput";export{ToggleInput}from"./ToggleInput";export{RadioInput}from"./RadioInput";export{CheckboxInput}from"./CheckboxInput";export{CheckboxGroupInput}from"./CheckboxGroupInput";export{DatePickerInput}from"./DatePickerInput";export{DropdownInput}from"./DropdownInput";export{TextDropdownInput}from"./TextDropdownInput";export{PinInput}from"./PinInput";export{OtpInput}from"./OtpInput";export{CssMultilineInput}from"./CssMultilineInput";
@@ -1,161 +1 @@
1
- /* eslint-disable no-sparse-arrays */
2
- export const properties = [
3
- {
4
- alignContent: [
5
- 'flex-start',
6
- 'flex-end',
7
- 'center',
8
- 'stretch',
9
- 'space-between',
10
- 'space-around',
11
- ],
12
- },
13
- { alignItems: ['flex-start', 'flex-end', 'center', 'stretch', 'baseline'] },
14
- {
15
- alignSelf: [
16
- 'auto',
17
- 'flex-start',
18
- 'flex-end',
19
- 'center',
20
- 'baseline',
21
- 'stretch',
22
- ],
23
- },
24
- { flex: ['number'] },
25
- { flexDirection: ['row', 'row-reverse', 'column', 'column-reverse'] },
26
- { flexWrap: ['nowrap', 'wrap', 'wrap-reverse'] },
27
- { flexFlow: ['number'] },
28
- { flexGrow: ['number'] },
29
- { flexShrink: ['number'] },
30
- { flexBasis: ['number'] },
31
- {
32
- justifyContent: [
33
- ,
34
- 'flex-start',
35
- 'flex-end',
36
- 'center',
37
- 'space-around',
38
- 'space-between',
39
- 'space-evenly',
40
- ],
41
- },
42
- { gap: ['number'] },
43
- { rowGap: ['number'] },
44
- { columnGap: ['number'] },
45
- // Layout
46
- { aspectRatio: ['number'] },
47
- { bottom: ['number'] },
48
- { display: ['flex', 'none'] },
49
- { left: ['number'] },
50
- { position: ['absolute', 'relative'] },
51
- { right: ['number'] },
52
- { top: ['number'] },
53
- { overflow: ['hidden'] },
54
- { zIndex: ['number'] },
55
- // Dimension
56
- { height: ['number'] },
57
- { maxHeight: ['number'] },
58
- { maxWidth: ['number'] },
59
- { minHeight: ['number'] },
60
- { minWidth: ['number'] },
61
- { width: ['number'] },
62
- // Color
63
- { backgroundColor: ['string'] },
64
- { color: ['string'] },
65
- { opacity: ['number'] },
66
- // Text
67
- { fontSize: ['number'] },
68
- { fontFamily: ['string'] },
69
- { fontStyle: ['string', 'normal'] },
70
- {
71
- fontWeight: [
72
- ,
73
- 'number',
74
- 'thin',
75
- 'hairline',
76
- 'ultralight',
77
- 'extralight',
78
- 'light',
79
- 'normal',
80
- 'medium',
81
- 'semibold',
82
- 'demibold',
83
- 'bold',
84
- 'ultrabold',
85
- 'extrabold',
86
- 'heavy',
87
- 'black',
88
- ],
89
- },
90
- { letterSpacing: ['number'] },
91
- { lineHeight: ['number'] },
92
- { maxLines: ['number'] },
93
- { textAlign: ['left', 'right', 'center', 'justify'] },
94
- {
95
- textDecoration: [
96
- ,
97
- 'line-through',
98
- 'underline',
99
- 'none',
100
- 'line-through underline',
101
- 'underline line-through',
102
- ],
103
- },
104
- { textDecorationColor: ['string'] },
105
- { textDecorationStyle: ['dashed', 'dotted', 'solid', 'string'] },
106
- { textIndent: ['any'] },
107
- { textOverflow: ['ellipsis'] },
108
- { textTransform: ['capitalize', 'lowercase', 'uppercase'] },
109
- { verticalAlign: ['sub', 'super'] },
110
- // Sizing/positioning
111
- { objectFit: ['string'] },
112
- { objectPosition: ['number'] },
113
- { objectPositionX: ['number'] },
114
- { objectPositionY: ['number'] },
115
- // Margin/padding
116
- { margin: ['number'] },
117
- { marginHorizontal: ['number'] },
118
- { marginVertical: ['number'] },
119
- { marginTop: ['number'] },
120
- { marginRight: ['number'] },
121
- { marginBottom: ['number'] },
122
- { marginLeft: ['number'] },
123
- { padding: ['number'] },
124
- { paddingHorizontal: ['number'] },
125
- { paddingVertical: ['number'] },
126
- { paddingTop: ['number'] },
127
- { paddingRight: ['number'] },
128
- { paddingBottom: ['number'] },
129
- { paddingLeft: ['number'] },
130
- // Transformations
131
- { transform: ['string'] },
132
- { transformOrigin: ['number'] },
133
- { transformOriginX: ['number'] },
134
- { transformOriginY: ['number'] },
135
- // Borders
136
- { border: ['number'] },
137
- { borderWidth: ['number'] },
138
- { borderColor: ['string'] },
139
- { borderStyle: ['dashed', 'dotted', 'solid'] },
140
- { borderTop: ['number'] },
141
- { borderTopColor: ['string'] },
142
- { borderTopStyle: ['dashed', 'dotted', 'solid'] },
143
- { borderTopWidth: ['number'] },
144
- { borderRight: ['number'] },
145
- { borderRightColor: ['string'] },
146
- { borderRightStyle: ['dashed', 'dotted', 'solid'] },
147
- { borderRightWidth: ['number'] },
148
- { borderBottom: ['number'] },
149
- { borderBottomColor: ['string'] },
150
- { borderBottomStyle: ['dashed', 'dotted', 'solid'] },
151
- { borderBottomWidth: ['number'] },
152
- { borderLeft: ['number'] },
153
- { borderLeftColor: ['string'] },
154
- { borderLeftStyle: ['dashed', 'dotted', 'solid'] },
155
- { borderLeftWidth: ['number'] },
156
- { borderTopLeftRadius: ['number'] },
157
- { borderTopRightRadius: ['number'] },
158
- { borderBottomRightRadius: ['number'] },
159
- { borderBottomLeftRadius: ['number'] },
160
- { borderRadius: ['number'] },
161
- ];
1
+ "use strict";export const properties=[{alignContent:["flex-start","flex-end","center","stretch","space-between","space-around"]},{alignItems:["flex-start","flex-end","center","stretch","baseline"]},{alignSelf:["auto","flex-start","flex-end","center","baseline","stretch"]},{flex:["number"]},{flexDirection:["row","row-reverse","column","column-reverse"]},{flexWrap:["nowrap","wrap","wrap-reverse"]},{flexFlow:["number"]},{flexGrow:["number"]},{flexShrink:["number"]},{flexBasis:["number"]},{justifyContent:[,"flex-start","flex-end","center","space-around","space-between","space-evenly"]},{gap:["number"]},{rowGap:["number"]},{columnGap:["number"]},{aspectRatio:["number"]},{bottom:["number"]},{display:["flex","none"]},{left:["number"]},{position:["absolute","relative"]},{right:["number"]},{top:["number"]},{overflow:["hidden"]},{zIndex:["number"]},{height:["number"]},{maxHeight:["number"]},{maxWidth:["number"]},{minHeight:["number"]},{minWidth:["number"]},{width:["number"]},{backgroundColor:["string"]},{color:["string"]},{opacity:["number"]},{fontSize:["number"]},{fontFamily:["string"]},{fontStyle:["string","normal"]},{fontWeight:[,"number","thin","hairline","ultralight","extralight","light","normal","medium","semibold","demibold","bold","ultrabold","extrabold","heavy","black"]},{letterSpacing:["number"]},{lineHeight:["number"]},{maxLines:["number"]},{textAlign:["left","right","center","justify"]},{textDecoration:[,"line-through","underline","none","line-through underline","underline line-through"]},{textDecorationColor:["string"]},{textDecorationStyle:["dashed","dotted","solid","string"]},{textIndent:["any"]},{textOverflow:["ellipsis"]},{textTransform:["capitalize","lowercase","uppercase"]},{verticalAlign:["sub","super"]},{objectFit:["string"]},{objectPosition:["number"]},{objectPositionX:["number"]},{objectPositionY:["number"]},{margin:["number"]},{marginHorizontal:["number"]},{marginVertical:["number"]},{marginTop:["number"]},{marginRight:["number"]},{marginBottom:["number"]},{marginLeft:["number"]},{padding:["number"]},{paddingHorizontal:["number"]},{paddingVertical:["number"]},{paddingTop:["number"]},{paddingRight:["number"]},{paddingBottom:["number"]},{paddingLeft:["number"]},{transform:["string"]},{transformOrigin:["number"]},{transformOriginX:["number"]},{transformOriginY:["number"]},{border:["number"]},{borderWidth:["number"]},{borderColor:["string"]},{borderStyle:["dashed","dotted","solid"]},{borderTop:["number"]},{borderTopColor:["string"]},{borderTopStyle:["dashed","dotted","solid"]},{borderTopWidth:["number"]},{borderRight:["number"]},{borderRightColor:["string"]},{borderRightStyle:["dashed","dotted","solid"]},{borderRightWidth:["number"]},{borderBottom:["number"]},{borderBottomColor:["string"]},{borderBottomStyle:["dashed","dotted","solid"]},{borderBottomWidth:["number"]},{borderLeft:["number"]},{borderLeftColor:["string"]},{borderLeftStyle:["dashed","dotted","solid"]},{borderLeftWidth:["number"]},{borderTopLeftRadius:["number"]},{borderTopRightRadius:["number"]},{borderBottomRightRadius:["number"]},{borderBottomLeftRadius:["number"]},{borderRadius:["number"]}];
@@ -1,2 +1 @@
1
- export * from './FormField';
2
- export * from './components';
1
+ "use strict";export*from"./FormField";export*from"./components";
@@ -1,159 +1 @@
1
- import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
2
- import { Suspense } from 'react';
3
- import _ from 'lodash';
4
- import { Tooltip } from '../Tooltip';
5
- import loadable from '@loadable/component';
6
- import { IconContext as Context } from 'react-icons';
7
- import s from '../../tc.module.css';
8
- import { cn } from '../../utils';
9
- // Static imports for better reliability
10
- import * as IconRi from 'react-icons/ri';
11
- import * as IconIm from 'react-icons/im';
12
- import * as IconFa from 'react-icons/fa';
13
- import * as IconFc from 'react-icons/fc';
14
- import * as IconGi from 'react-icons/gi';
15
- import * as IconCg from 'react-icons/cg';
16
- import * as IconGr from 'react-icons/gr';
17
- import * as IconBs from 'react-icons/bs';
18
- import * as IconFi from 'react-icons/fi';
19
- import * as Iconmd from 'react-icons/md';
20
- import * as Iconio from 'react-icons/io';
21
- import * as Iconio5 from 'react-icons/io5';
22
- import * as Iconsi from 'react-icons/si';
23
- import * as Iconai from 'react-icons/ai';
24
- import * as Iconvsc from 'react-icons/vsc';
25
- import * as Iconhi from 'react-icons/hi';
26
- import * as IconBi from 'react-icons/bi';
27
- import * as IconTb from 'react-icons/tb';
28
- import * as IconsCi from 'react-icons/ci';
29
- import * as IconAi from 'react-icons/ai';
30
- const CompatIcon = ({ src, className, style, ...props }) => {
31
- if (typeof src === 'string') {
32
- return (_jsx("img", { src: src, className: cn(s.icon, className), style: style, ...props, alt: "" }));
33
- }
34
- return (_jsx("div", { className: cn(s.icon, className), style: style, ...props, children: src }));
35
- };
36
- const SSRIcon = ({ nameIcon, classNames = {}, styles = {}, ...props }) => {
37
- return (_jsx("span", { className: cn(s.icon, props.className, classNames.icon), style: styles.icon, "aria-hidden": "true", children: "\u26AB" }));
38
- };
39
- export const Icon = ({ nameIcon, propsIcon, className, tooltip = '', isDisable = false, classNames = {}, styles = {}, onClick, }) => {
40
- try {
41
- const iconProps = {
42
- ...propsIcon,
43
- color: isDisable ? '#808080' : propsIcon?.color || 'rgb(36 48 63)',
44
- };
45
- // Try to use static imports first for better reliability
46
- const getStaticIcon = () => {
47
- const lib = nameIcon.startsWith('IoIo')
48
- ? 'io'
49
- : nameIcon.startsWith('Io')
50
- ? 'io5'
51
- : nameIcon
52
- .replace(/([a-z0-9])([A-Z])/g, '$1 $2')
53
- .split(' ')[0]
54
- .toLowerCase();
55
- // Map to static imports
56
- const iconMap = {
57
- ai: IconAi || Iconai,
58
- ri: IconRi,
59
- im: IconIm,
60
- fa: IconFa,
61
- fc: IconFc,
62
- gi: IconGi,
63
- cg: IconCg,
64
- gr: IconGr,
65
- bs: IconBs,
66
- fi: IconFi,
67
- md: Iconmd,
68
- io: Iconio,
69
- io5: Iconio5,
70
- si: Iconsi,
71
- vsc: Iconvsc,
72
- hi: Iconhi,
73
- bi: IconBi,
74
- tb: IconTb,
75
- ci: IconsCi,
76
- };
77
- const iconLib = iconMap[lib];
78
- if (iconLib && iconLib[nameIcon]) {
79
- return iconLib[nameIcon];
80
- }
81
- return null;
82
- };
83
- const StaticIcon = getStaticIcon();
84
- if (StaticIcon) {
85
- // Use static import
86
- const IconComponent = StaticIcon;
87
- return (_jsx("div", { className: cn(s.iconContainer, className, classNames.container), style: styles.container, onClick: () => {
88
- if (!isDisable)
89
- onClick && onClick();
90
- }, children: !_.isEmpty(tooltip) ? (_jsx(Tooltip, { content: tooltip, children: _jsx(IconComponent, { ...iconProps, className: cn(s.icon, classNames.icon), style: styles.icon }) })) : (_jsx(IconComponent, { ...iconProps, className: cn(s.icon, classNames.icon), style: styles.icon })) }));
91
- }
92
- // Fallback to dynamic import
93
- const lib = nameIcon.startsWith('IoIo')
94
- ? 'io'
95
- : nameIcon.startsWith('Io')
96
- ? 'io5'
97
- : nameIcon
98
- .replace(/([a-z0-9])([A-Z])/g, '$1 $2')
99
- .split(' ')[0]
100
- .toLowerCase();
101
- const iconLibraries = {
102
- fa: () => import('react-icons/fa'),
103
- md: () => import('react-icons/md'),
104
- io: () => import('react-icons/io'),
105
- fi: () => import('react-icons/fi'),
106
- bs: () => import('react-icons/bs'),
107
- hi: () => import('react-icons/hi'),
108
- go: () => import('react-icons/go'),
109
- si: () => import('react-icons/si'),
110
- ti: () => import('react-icons/ti'),
111
- wi: () => import('react-icons/wi'),
112
- di: () => import('react-icons/di'),
113
- ri: () => import('react-icons/ri'),
114
- fc: () => import('react-icons/fc'),
115
- gr: () => import('react-icons/gr'),
116
- lu: () => import('react-icons/lu'),
117
- gi: () => import('react-icons/gi'),
118
- tb: () => import('react-icons/tb'),
119
- rx: () => import('react-icons/rx'),
120
- im: () => import('react-icons/im'),
121
- cg: () => import('react-icons/cg'),
122
- io5: () => import('react-icons/io5'),
123
- ai: () => import('react-icons/ai'),
124
- vsc: () => import('react-icons/vsc'),
125
- bi: () => import('react-icons/bi'),
126
- fa2: () => import('react-icons/fa'),
127
- ci: () => import('react-icons/ci'),
128
- lib: () => import('react-icons/lib'),
129
- lia: () => import('react-icons/lia'),
130
- pi: () => import('react-icons/pi'),
131
- tfi: () => import('react-icons/tfi'),
132
- fa6: () => import('react-icons/fa6'),
133
- };
134
- const loadLibrary = iconLibraries[lib] || (() => import('react-icons/md'));
135
- const ElementIcon = loadable(loadLibrary, {
136
- resolveComponent: (el) => el[nameIcon] != null ? el[nameIcon] : el[Object.keys(el.default)[0]],
137
- });
138
- return (_jsx("div", { className: cn(s.iconContainer, className, classNames.container), style: styles.container, onClick: () => {
139
- if (!isDisable)
140
- onClick && onClick();
141
- }, children: !_.isEmpty(tooltip) ? (_jsx(Tooltip, { content: tooltip, children: _jsx(ElementIcon, { ...iconProps, className: cn(s.icon, classNames.icon), style: styles.icon }) })) : (_jsx(Suspense, { fallback: _jsx("div", { children: "Loading..." }), children: _jsx(ElementIcon, { ...iconProps, className: cn(s.icon, classNames.icon), style: styles.icon }) })) }));
142
- }
143
- catch (error) {
144
- return _jsx(_Fragment, {});
145
- }
146
- };
147
- export const IconContext = (props) => {
148
- return (_jsx(Context.Provider, { value: {
149
- color: props?.isDisable ? '#808080' : props?.color || '#ffffff',
150
- size: props?.size || '20',
151
- }, children: _jsx("div", { onClick: () => {
152
- if (props?.isDisable)
153
- return;
154
- props.onClick && props.onClick();
155
- }, style: props?.style, children: props?.children }) }));
156
- };
157
- // Attach sub-components
158
- Icon.SSR = SSRIcon;
159
- Icon.Compat = CompatIcon;
1
+ "use strict";import{jsx as i,Fragment as v}from"react/jsx-runtime";import{Suspense as y}from"react";import b from"lodash";import{Tooltip as g}from"../Tooltip";import x from"@loadable/component";import{IconContext as S}from"react-icons";import n from"../../tc.module.css";import{cn as c}from"../../utils";import*as L from"react-icons/ri";import*as F from"react-icons/im";import*as k from"react-icons/fa";import*as z from"react-icons/fc";import*as A from"react-icons/gi";import*as W from"react-icons/cg";import*as $ from"react-icons/gr";import*as j from"react-icons/bs";import*as w from"react-icons/fi";import*as B from"react-icons/md";import*as E from"react-icons/io";import*as N from"react-icons/io5";import*as R from"react-icons/si";import*as _ from"react-icons/ai";import*as G from"react-icons/vsc";import*as M from"react-icons/hi";import*as P from"react-icons/bi";import*as T from"react-icons/tb";import*as Z from"react-icons/ci";import*as O from"react-icons/ai";const q=({src:o,className:m,style:a,...r})=>typeof o=="string"?i("img",{src:o,className:c(n.icon,m),style:a,...r,alt:""}):i("div",{className:c(n.icon,m),style:a,...r,children:o}),D=({nameIcon:o,classNames:m={},styles:a={},...r})=>i("span",{className:c(n.icon,r.className,m.icon),style:a.icon,"aria-hidden":"true",children:"\u26AB"});export const Icon=({nameIcon:o,propsIcon:m,className:a,tooltip:r="",isDisable:l=!1,classNames:s={},styles:e={},onClick:f})=>{try{const p={...m,color:l?"#808080":m?.color||"rgb(36 48 63)"},d=(()=>{const t=o.startsWith("IoIo")?"io":o.startsWith("Io")?"io5":o.replace(/([a-z0-9])([A-Z])/g,"$1 $2").split(" ")[0].toLowerCase(),I={ai:O||_,ri:L,im:F,fa:k,fc:z,gi:A,cg:W,gr:$,bs:j,fi:w,md:B,io:E,io5:N,si:R,vsc:G,hi:M,bi:P,tb:T,ci:Z}[t];return I&&I[o]?I[o]:null})();if(d){const t=d;return i("div",{className:c(n.iconContainer,a,s.container),style:e.container,onClick:()=>{l||f&&f()},children:b.isEmpty(r)?i(t,{...p,className:c(n.icon,s.icon),style:e.icon}):i(g,{content:r,children:i(t,{...p,className:c(n.icon,s.icon),style:e.icon})})})}const u=o.startsWith("IoIo")?"io":o.startsWith("Io")?"io5":o.replace(/([a-z0-9])([A-Z])/g,"$1 $2").split(" ")[0].toLowerCase(),C={fa:()=>import("react-icons/fa"),md:()=>import("react-icons/md"),io:()=>import("react-icons/io"),fi:()=>import("react-icons/fi"),bs:()=>import("react-icons/bs"),hi:()=>import("react-icons/hi"),go:()=>import("react-icons/go"),si:()=>import("react-icons/si"),ti:()=>import("react-icons/ti"),wi:()=>import("react-icons/wi"),di:()=>import("react-icons/di"),ri:()=>import("react-icons/ri"),fc:()=>import("react-icons/fc"),gr:()=>import("react-icons/gr"),lu:()=>import("react-icons/lu"),gi:()=>import("react-icons/gi"),tb:()=>import("react-icons/tb"),rx:()=>import("react-icons/rx"),im:()=>import("react-icons/im"),cg:()=>import("react-icons/cg"),io5:()=>import("react-icons/io5"),ai:()=>import("react-icons/ai"),vsc:()=>import("react-icons/vsc"),bi:()=>import("react-icons/bi"),fa2:()=>import("react-icons/fa"),ci:()=>import("react-icons/ci"),lib:()=>import("react-icons/lib"),lia:()=>import("react-icons/lia"),pi:()=>import("react-icons/pi"),tfi:()=>import("react-icons/tfi"),fa6:()=>import("react-icons/fa6")}[u]||(()=>import("react-icons/md")),h=x(C,{resolveComponent:t=>t[o]!=null?t[o]:t[Object.keys(t.default)[0]]});return i("div",{className:c(n.iconContainer,a,s.container),style:e.container,onClick:()=>{l||f&&f()},children:b.isEmpty(r)?i(y,{fallback:i("div",{children:"Loading..."}),children:i(h,{...p,className:c(n.icon,s.icon),style:e.icon})}):i(g,{content:r,children:i(h,{...p,className:c(n.icon,s.icon),style:e.icon})})})}catch{return i(v,{})}},IconContext=o=>i(S.Provider,{value:{color:o?.isDisable?"#808080":o?.color||"#ffffff",size:o?.size||"20"},children:i("div",{onClick:()=>{o?.isDisable||o.onClick&&o.onClick()},style:o?.style,children:o?.children})});Icon.SSR=D,Icon.Compat=q;
@@ -1,2 +1 @@
1
- export * from './Icon';
2
- export * from './types';
1
+ "use strict";export*from"./Icon";export*from"./types";
@@ -1,9 +1 @@
1
- export const ICON_SIZES = [
2
- 'xsmall',
3
- 'small',
4
- 'normal',
5
- 'medium',
6
- 'large',
7
- 'xlarge',
8
- 'xxlarge',
9
- ];
1
+ "use strict";export const ICON_SIZES=["xsmall","small","normal","medium","large","xlarge","xxlarge"];
@@ -1,216 +1,4 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import s from '../../tc.module.css';
3
- import { cn } from '../../utils';
4
- const sizeClasses = {
5
- sm: {
6
- wrapper: cn(s['w-4'], s['h-4']),
7
- spinner: cn(s['w-4'], s['h-4']),
8
- dots: cn(s['w-1'], s['h-1']),
9
- bars: cn(s['w-1'], s['h-6']),
10
- pulse: cn(s['w-4'], s['h-4']),
11
- },
12
- md: {
13
- wrapper: cn(s['w-8'], s['h-8']),
14
- spinner: cn(s['w-8'], s['h-8']),
15
- dots: cn(s['w-2'], s['h-2']),
16
- bars: cn(s['w-1'], s['h-8']),
17
- pulse: cn(s['w-8'], s['h-8']),
18
- },
19
- lg: {
20
- wrapper: cn(s['w-10'], s['h-10']),
21
- spinner: cn(s['w-10'], s['h-10']),
22
- dots: cn(s['w-3'], s['h-3']),
23
- bars: cn(s['w-2'], s['h-10']),
24
- pulse: cn(s['w-10'], s['h-10']),
25
- },
26
- };
27
- const getColorValue = (color) => {
28
- const colors = {
29
- blue: 'rgb(59 130 246)',
30
- green: 'rgb(34 197 94)',
31
- gray: 'rgb(156 163 175)',
32
- primary: 'rgb(59 130 246)',
33
- white: 'rgb(255 255 255)',
34
- black: 'rgb(0 0 0)',
35
- };
36
- // If it's a predefined color, return the mapped value
37
- if (colors[color]) {
38
- return colors[color];
39
- }
40
- // If it's already a valid CSS color (hex, rgb, rgba, hsl, named color, etc.), return it as-is
41
- // Check if it looks like a CSS color value (starts with #, rgb, rgba, hsl, hsla, or is a valid CSS color name)
42
- if (color.startsWith('#') ||
43
- color.startsWith('rgb') ||
44
- color.startsWith('hsl') ||
45
- color.startsWith('rgba') ||
46
- color.startsWith('hsla') ||
47
- /^[a-z]+$/i.test(color) // Named colors like 'coral', 'tomato', etc.
48
- ) {
49
- return color;
50
- }
51
- // Default fallback
52
- return colors.blue;
53
- };
54
- // Helper function to extract RGB values from any color format for opacity borders
55
- const extractRgbForOpacity = (colorValue) => {
56
- // Handle rgb/rgba format: rgb(59 130 246) or rgba(59, 130, 246, 0.5)
57
- const rgbMatch = colorValue.match(/rgba?\((\d+)[,\s]+(\d+)[,\s]+(\d+)/);
58
- if (rgbMatch) {
59
- return [
60
- parseInt(rgbMatch[1]),
61
- parseInt(rgbMatch[2]),
62
- parseInt(rgbMatch[3]),
63
- ];
64
- }
65
- // Handle hex format: #3b82f6 or #3bf
66
- if (colorValue.startsWith('#')) {
67
- const hex = colorValue.slice(1);
68
- if (hex.length === 3) {
69
- // Short hex: #3bf -> #33bbff
70
- const r = parseInt(hex[0] + hex[0], 16);
71
- const g = parseInt(hex[1] + hex[1], 16);
72
- const b = parseInt(hex[2] + hex[2], 16);
73
- return [r, g, b];
74
- }
75
- else if (hex.length === 6) {
76
- // Full hex: #3b82f6
77
- const r = parseInt(hex.slice(0, 2), 16);
78
- const g = parseInt(hex.slice(2, 4), 16);
79
- const b = parseInt(hex.slice(4, 6), 16);
80
- return [r, g, b];
81
- }
82
- }
83
- // For named colors or other formats, create a temporary element to get computed color
84
- // This is a fallback for named CSS colors like 'coral', 'tomato', etc.
85
- if (typeof document !== 'undefined') {
86
- try {
87
- const tempEl = document.createElement('div');
88
- tempEl.style.color = colorValue;
89
- document.body.appendChild(tempEl);
90
- const computedColor = window.getComputedStyle(tempEl).color;
91
- document.body.removeChild(tempEl);
92
- const computedRgb = computedColor.match(/\d+/g);
93
- if (computedRgb && computedRgb.length >= 3) {
94
- return [
95
- parseInt(computedRgb[0]),
96
- parseInt(computedRgb[1]),
97
- parseInt(computedRgb[2]),
98
- ];
99
- }
100
- }
101
- catch (e) {
102
- // Fallback if DOM manipulation fails
103
- }
104
- }
105
- // Default fallback to white
106
- return [255, 255, 255];
107
- };
108
- // Helper to calculate proportional border width based on spinner size
109
- // Default ratio: 10px border for 4rem (64px) spinner = ~15.6%
110
- const calculateBorderWidth = (sizeValue, explicitBorderWidth) => {
111
- // If explicit borderWidth is provided, use it
112
- if (explicitBorderWidth) {
113
- return explicitBorderWidth;
114
- }
115
- // Default border width if no size specified
116
- if (!sizeValue) {
117
- return '10px';
118
- }
119
- // Parse the size value to pixels
120
- let sizeInPx;
121
- if (sizeValue.endsWith('rem')) {
122
- sizeInPx = parseFloat(sizeValue) * 16;
123
- }
124
- else if (sizeValue.endsWith('px')) {
125
- sizeInPx = parseFloat(sizeValue);
126
- }
127
- else if (sizeValue.endsWith('em')) {
128
- sizeInPx = parseFloat(sizeValue) * 16;
129
- }
130
- else {
131
- // Fallback for unknown units
132
- return '10px';
133
- }
134
- // Calculate proportional border (about 15.6% of size, min 2px, max 16px)
135
- const borderPx = Math.max(2, Math.min(16, Math.round(sizeInPx * 0.156)));
136
- return `${borderPx}px`;
137
- };
138
- export const LoadingAnimateSpin = ({ classWarper = '', className = '', variant = 'spinner', size = 'md', color = 'blue', borderWidth, width, height, textFontSize = '1.125rem', loadingText, classNames = {}, styles = {}, 'aria-label': ariaLabel = 'Loading', }) => {
139
- const sizeConfig = sizeClasses[size];
140
- const renderSpinner = () => {
141
- const colorValue = getColorValue(color);
142
- // Extract RGB values for opacity border - making it more subtle
143
- const [r, g, b] = extractRgbForOpacity(colorValue);
144
- const baseBorderColor = `rgba(${r}, ${g}, ${b}, 0.15)`;
145
- // Calculate spinner dimensions
146
- const spinnerWidth = width || '4rem';
147
- const spinnerHeight = height || '4rem';
148
- // Calculate proportional border width based on spinner size
149
- const calculatedBorderWidth = calculateBorderWidth(spinnerWidth, borderWidth);
150
- return (_jsxs("div", { className: cn(s['flex'], s['flex-col'], s['items-center'], s['justify-center'], className, classNames.container), style: styles.container, "aria-label": ariaLabel, role: "status", children: [_jsx("div", { className: cn(sizeConfig.spinner, s['rounded-full'], s['animate-spin'], classNames.spinner), style: {
151
- width: spinnerWidth,
152
- height: spinnerHeight,
153
- borderWidth: calculatedBorderWidth,
154
- borderStyle: 'solid',
155
- borderTopColor: colorValue,
156
- borderRightColor: colorValue,
157
- borderBottomColor: baseBorderColor,
158
- borderLeftColor: baseBorderColor,
159
- animation: 'spin 1s linear infinite',
160
- ...styles.spinner,
161
- } }), loadingText && (_jsx("p", { className: cn(s['mt-4'], s['text-white'], s['text-lg'], s['font-semibold'], s['animate-pulse'], classNames.text), style: {
162
- marginTop: '1rem',
163
- color: colorValue,
164
- fontSize: textFontSize,
165
- fontWeight: 600,
166
- animation: 'pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite',
167
- ...styles.text,
168
- }, children: loadingText }))] }));
169
- };
170
- const renderDots = () => {
171
- const colorValue = getColorValue(color);
172
- return (_jsx("div", { className: cn(s['flex'], s['gap-2'], s['items-center'], className, classNames.container), style: styles.container, "aria-label": ariaLabel, role: "status", children: [0, 1, 2].map((i) => (_jsx("div", { className: cn(sizeConfig.dots, s['rounded-full'], classNames.dot), style: {
173
- backgroundColor: colorValue,
174
- animation: `bounce 1.4s cubic-bezier(0.68, -0.55, 0.265, 1.55) infinite`,
175
- animationDelay: `${i * 0.16}s`,
176
- animationFillMode: 'both',
177
- ...styles.dot,
178
- } }, i))) }));
179
- };
180
- const renderBars = () => {
181
- const colorValue = getColorValue(color);
182
- return (_jsx("div", { className: cn(s['flex'], s['gap-1'], s['items-center'], className, classNames.container), style: styles.container, "aria-label": ariaLabel, role: "status", children: [0, 1, 2].map((i) => (_jsx("div", { className: cn(sizeConfig.bars, s.rounded, classNames.bar), style: {
183
- backgroundColor: colorValue,
184
- borderRadius: '0.125rem',
185
- animation: `pulse 1.2s ease-in-out infinite`,
186
- animationDelay: `${i * 0.15}s`,
187
- animationFillMode: 'both',
188
- ...styles.bar,
189
- } }, i))) }));
190
- };
191
- const renderPulse = () => {
192
- const colorValue = getColorValue(color);
193
- return (_jsx("div", { className: cn(sizeConfig.pulse, s['rounded-full'], className, classNames.pulse), style: {
194
- backgroundColor: colorValue,
195
- animation: `pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite`,
196
- animationFillMode: 'both',
197
- ...styles.pulse,
198
- }, "aria-label": ariaLabel, role: "status" }));
199
- };
200
- const renderLoader = () => {
201
- switch (variant) {
202
- case 'dots':
203
- return renderDots();
204
- case 'bars':
205
- return renderBars();
206
- case 'pulse':
207
- return renderPulse();
208
- case 'spinner':
209
- default:
210
- return renderSpinner();
211
- }
212
- };
213
- return (_jsxs("div", { className: cn(s['flex'], s['justify-center'], s['items-center'], classWarper, classNames.wrapper), style: styles.wrapper, children: [_jsx("style", { children: `
1
+ "use strict";import{jsx as d,jsxs as y}from"react/jsx-runtime";import e from"../../tc.module.css";import{cn as n}from"../../utils";const P={sm:{wrapper:n(e["w-4"],e["h-4"]),spinner:n(e["w-4"],e["h-4"]),dots:n(e["w-1"],e["h-1"]),bars:n(e["w-1"],e["h-6"]),pulse:n(e["w-4"],e["h-4"])},md:{wrapper:n(e["w-8"],e["h-8"]),spinner:n(e["w-8"],e["h-8"]),dots:n(e["w-2"],e["h-2"]),bars:n(e["w-1"],e["h-8"]),pulse:n(e["w-8"],e["h-8"])},lg:{wrapper:n(e["w-10"],e["h-10"]),spinner:n(e["w-10"],e["h-10"]),dots:n(e["w-3"],e["h-3"]),bars:n(e["w-2"],e["h-10"]),pulse:n(e["w-10"],e["h-10"])}},b=t=>{const s={blue:"rgb(59 130 246)",green:"rgb(34 197 94)",gray:"rgb(156 163 175)",primary:"rgb(59 130 246)",white:"rgb(255 255 255)",black:"rgb(0 0 0)"};return s[t]?s[t]:t.startsWith("#")||t.startsWith("rgb")||t.startsWith("hsl")||t.startsWith("rgba")||t.startsWith("hsla")||/^[a-z]+$/i.test(t)?t:s.blue},R=t=>{const s=t.match(/rgba?\((\d+)[,\s]+(\d+)[,\s]+(\d+)/);if(s)return[parseInt(s[1]),parseInt(s[2]),parseInt(s[3])];if(t.startsWith("#")){const r=t.slice(1);if(r.length===3){const c=parseInt(r[0]+r[0],16),o=parseInt(r[1]+r[1],16),u=parseInt(r[2]+r[2],16);return[c,o,u]}else if(r.length===6){const c=parseInt(r.slice(0,2),16),o=parseInt(r.slice(2,4),16),u=parseInt(r.slice(4,6),16);return[c,o,u]}}if(typeof document<"u")try{const r=document.createElement("div");r.style.color=t,document.body.appendChild(r);const c=window.getComputedStyle(r).color;document.body.removeChild(r);const o=c.match(/\d+/g);if(o&&o.length>=3)return[parseInt(o[0]),parseInt(o[1]),parseInt(o[2])]}catch{}return[255,255,255]},D=(t,s)=>{if(s)return s;if(!t)return"10px";let r;if(t.endsWith("rem"))r=parseFloat(t)*16;else if(t.endsWith("px"))r=parseFloat(t);else if(t.endsWith("em"))r=parseFloat(t)*16;else return"10px";return`${Math.max(2,Math.min(16,Math.round(r*.156)))}px`};export const LoadingAnimateSpin=({classWarper:t="",className:s="",variant:r="spinner",size:c="md",color:o="blue",borderWidth:u,width:x,height:C,textFontSize:I="1.125rem",loadingText:f,classNames:a={},styles:l={},"aria-label":m="Loading"})=>{const h=P[c],W=()=>{const i=b(o),[p,$,j]=R(i),g=`rgba(${p}, ${$}, ${j}, 0.15)`,w=x||"4rem",S=C||"4rem",B=D(w,u);return y("div",{className:n(e.flex,e["flex-col"],e["items-center"],e["justify-center"],s,a.container),style:l.container,"aria-label":m,role:"status",children:[d("div",{className:n(h.spinner,e["rounded-full"],e["animate-spin"],a.spinner),style:{width:w,height:S,borderWidth:B,borderStyle:"solid",borderTopColor:i,borderRightColor:i,borderBottomColor:g,borderLeftColor:g,animation:"spin 1s linear infinite",...l.spinner}}),f&&d("p",{className:n(e["mt-4"],e["text-white"],e["text-lg"],e["font-semibold"],e["animate-pulse"],a.text),style:{marginTop:"1rem",color:i,fontSize:I,fontWeight:600,animation:"pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite",...l.text},children:f})]})},v=()=>{const i=b(o);return d("div",{className:n(e.flex,e["gap-2"],e["items-center"],s,a.container),style:l.container,"aria-label":m,role:"status",children:[0,1,2].map(p=>d("div",{className:n(h.dots,e["rounded-full"],a.dot),style:{backgroundColor:i,animation:"bounce 1.4s cubic-bezier(0.68, -0.55, 0.265, 1.55) infinite",animationDelay:`${p*.16}s`,animationFillMode:"both",...l.dot}},p))})},k=()=>{const i=b(o);return d("div",{className:n(e.flex,e["gap-1"],e["items-center"],s,a.container),style:l.container,"aria-label":m,role:"status",children:[0,1,2].map(p=>d("div",{className:n(h.bars,e.rounded,a.bar),style:{backgroundColor:i,borderRadius:"0.125rem",animation:"pulse 1.2s ease-in-out infinite",animationDelay:`${p*.15}s`,animationFillMode:"both",...l.bar}},p))})},F=()=>{const i=b(o);return d("div",{className:n(h.pulse,e["rounded-full"],s,a.pulse),style:{backgroundColor:i,animation:"pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite",animationFillMode:"both",...l.pulse},"aria-label":m,role:"status"})},M=()=>{switch(r){case"dots":return v();case"bars":return k();case"pulse":return F();default:return W()}};return y("div",{className:n(e.flex,e["justify-center"],e["items-center"],t,a.wrapper),style:l.wrapper,children:[d("style",{children:`
214
2
  @keyframes spin {
215
3
  from {
216
4
  transform: rotate(0deg);
@@ -243,5 +31,4 @@ export const LoadingAnimateSpin = ({ classWarper = '', className = '', variant =
243
31
  opacity: 0.8;
244
32
  }
245
33
  }
246
- ` }), renderLoader()] }));
247
- };
34
+ `}),M()]})};