@festo-ui/react 9.0.1-dev.781 → 9.0.1-dev.783

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 (203) hide show
  1. package/package.json +14 -18
  2. package/dist/components/accordion/Accordion.css +0 -4
  3. package/dist/components/accordion/Accordion.d.ts +0 -10
  4. package/dist/components/accordion/Accordion.js +0 -41
  5. package/dist/components/accordion/AccordionContext.d.ts +0 -11
  6. package/dist/components/accordion/AccordionContext.js +0 -3
  7. package/dist/components/accordion/accordion-header/AccordionHeader.css +0 -11
  8. package/dist/components/accordion/accordion-header/AccordionHeader.d.ts +0 -2
  9. package/dist/components/accordion/accordion-header/AccordionHeader.js +0 -11
  10. package/dist/components/accordion/accordion-item/AccordionItem.css +0 -64
  11. package/dist/components/accordion/accordion-item/AccordionItem.d.ts +0 -8
  12. package/dist/components/accordion/accordion-item/AccordionItem.js +0 -60
  13. package/dist/components/accordion/accordion-item/AccordionItemContext.d.ts +0 -7
  14. package/dist/components/accordion/accordion-item/AccordionItemContext.js +0 -3
  15. package/dist/components/accordion/accordion-item/accordion-item-body/AccordionItemBody.css +0 -76
  16. package/dist/components/accordion/accordion-item/accordion-item-body/AccordionItemBody.d.ts +0 -2
  17. package/dist/components/accordion/accordion-item/accordion-item-body/AccordionItemBody.js +0 -61
  18. package/dist/components/accordion/accordion-item/accordion-item-header/AccordionItemHeader.css +0 -11
  19. package/dist/components/accordion/accordion-item/accordion-item-header/AccordionItemHeader.d.ts +0 -2
  20. package/dist/components/accordion/accordion-item/accordion-item-header/AccordionItemHeader.js +0 -20
  21. package/dist/components/bottom-sheet/BottomSheet.css +0 -18
  22. package/dist/components/bottom-sheet/BottomSheet.d.ts +0 -11
  23. package/dist/components/bottom-sheet/BottomSheet.js +0 -101
  24. package/dist/components/breadcrumb/Breadcrumb.d.ts +0 -14
  25. package/dist/components/breadcrumb/Breadcrumb.js +0 -87
  26. package/dist/components/button/Button.d.ts +0 -11
  27. package/dist/components/button/Button.js +0 -36
  28. package/dist/components/card/Card.d.ts +0 -4
  29. package/dist/components/card/Card.js +0 -9
  30. package/dist/components/card/CardBody.d.ts +0 -5
  31. package/dist/components/card/CardBody.js +0 -15
  32. package/dist/components/card/CardHeader.d.ts +0 -8
  33. package/dist/components/card/CardHeader.js +0 -31
  34. package/dist/components/card/CardHeader.stories.helper.js +0 -7
  35. package/dist/components/card/CardNotification.d.ts +0 -6
  36. package/dist/components/card/CardNotification.js +0 -26
  37. package/dist/components/chips/chip/Chip.d.ts +0 -17
  38. package/dist/components/chips/chip/Chip.js +0 -38
  39. package/dist/components/chips/chip-container/ChipContainer.d.ts +0 -5
  40. package/dist/components/chips/chip-container/ChipContainer.js +0 -12
  41. package/dist/components/icon-wrapper/IconWrapper.d.ts +0 -6
  42. package/dist/components/icon-wrapper/IconWrapper.js +0 -13
  43. package/dist/components/loading-indicator/LoadingIndicator.d.ts +0 -5
  44. package/dist/components/loading-indicator/LoadingIndicator.js +0 -41
  45. package/dist/components/mobile-flyout/MobileFlyout.d.ts +0 -11
  46. package/dist/components/mobile-flyout/MobileFlyout.js +0 -88
  47. package/dist/components/mobile-flyout/MobileFlyoutContext.d.ts +0 -8
  48. package/dist/components/mobile-flyout/MobileFlyoutContext.js +0 -3
  49. package/dist/components/mobile-flyout/mobile-flyout-item/MobileFlyoutItem.d.ts +0 -17
  50. package/dist/components/mobile-flyout/mobile-flyout-item/MobileFlyoutItem.js +0 -36
  51. package/dist/components/mobile-flyout/mobile-flyout-page/MobileFlyoutPage.css +0 -5
  52. package/dist/components/mobile-flyout/mobile-flyout-page/MobileFlyoutPage.d.ts +0 -8
  53. package/dist/components/mobile-flyout/mobile-flyout-page/MobileFlyoutPage.js +0 -35
  54. package/dist/components/modals/AlertModal.d.ts +0 -12
  55. package/dist/components/modals/AlertModal.js +0 -53
  56. package/dist/components/modals/ConfirmModal.d.ts +0 -11
  57. package/dist/components/modals/ConfirmModal.js +0 -46
  58. package/dist/components/modals/CustomModal.d.ts +0 -8
  59. package/dist/components/modals/CustomModal.js +0 -38
  60. package/dist/components/modals/Modal.css +0 -39
  61. package/dist/components/modals/Modal.d.ts +0 -8
  62. package/dist/components/modals/Modal.js +0 -31
  63. package/dist/components/modals/ModalBase.d.ts +0 -9
  64. package/dist/components/modals/ModalBase.js +0 -124
  65. package/dist/components/modals/ModalFooter.d.ts +0 -2
  66. package/dist/components/modals/ModalFooter.js +0 -12
  67. package/dist/components/modals/Prompt.d.ts +0 -15
  68. package/dist/components/modals/Prompt.js +0 -58
  69. package/dist/components/modals/image-gallery/ImageGallery.css +0 -815
  70. package/dist/components/modals/image-gallery/ImageGallery.d.ts +0 -21
  71. package/dist/components/modals/image-gallery/ImageGallery.helper.d.ts +0 -2
  72. package/dist/components/modals/image-gallery/ImageGallery.helper.js +0 -13
  73. package/dist/components/modals/image-gallery/ImageGallery.js +0 -103
  74. package/dist/components/modals/image-gallery/ImageGallery.stories.helper.js +0 -112
  75. package/dist/components/modals/image-gallery/ImageGalleryContent.d.ts +0 -8
  76. package/dist/components/modals/image-gallery/ImageGalleryContent.js +0 -15
  77. package/dist/components/modals/image-gallery/ImageGalleryScale.d.ts +0 -6
  78. package/dist/components/modals/image-gallery/ImageGalleryScale.js +0 -15
  79. package/dist/components/modals/image-gallery/ImageGallerySwiper.d.ts +0 -12
  80. package/dist/components/modals/image-gallery/ImageGallerySwiper.js +0 -40
  81. package/dist/components/modals/image-gallery/ImageGalleryThumbsSwiper.d.ts +0 -7
  82. package/dist/components/modals/image-gallery/ImageGalleryThumbsSwiper.js +0 -27
  83. package/dist/components/modals/image-gallery/internal/CloseButton.d.ts +0 -6
  84. package/dist/components/modals/image-gallery/internal/CloseButton.js +0 -14
  85. package/dist/components/modals/image-gallery/internal/ImageGalleryContainer.d.ts +0 -5
  86. package/dist/components/modals/image-gallery/internal/ImageGalleryContainer.js +0 -8
  87. package/dist/components/modals/image-gallery/internal/ImageGalleryPagination.d.ts +0 -5
  88. package/dist/components/modals/image-gallery/internal/ImageGalleryPagination.js +0 -29
  89. package/dist/components/pagination/Pagination.css +0 -10
  90. package/dist/components/pagination/Pagination.d.ts +0 -15
  91. package/dist/components/pagination/Pagination.js +0 -100
  92. package/dist/components/popovers/legend/Legend.d.ts +0 -9
  93. package/dist/components/popovers/legend/Legend.js +0 -21
  94. package/dist/components/popovers/popover/Popover.css +0 -56
  95. package/dist/components/popovers/popover/Popover.d.ts +0 -21
  96. package/dist/components/popovers/popover/Popover.js +0 -106
  97. package/dist/components/popovers/popover-menu/PopoverMenu.d.ts +0 -7
  98. package/dist/components/popovers/popover-menu/PopoverMenu.js +0 -37
  99. package/dist/components/popovers/popover-menu/PopoverMenuContext.d.ts +0 -3
  100. package/dist/components/popovers/popover-menu/PopoverMenuContext.js +0 -5
  101. package/dist/components/popovers/popover-menu-item/PopoverMenuItem.d.ts +0 -9
  102. package/dist/components/popovers/popover-menu-item/PopoverMenuItem.js +0 -28
  103. package/dist/components/popovers/tooltip/Tooltip.d.ts +0 -5
  104. package/dist/components/popovers/tooltip/Tooltip.js +0 -12
  105. package/dist/components/progress/Progress.d.ts +0 -7
  106. package/dist/components/progress/Progress.js +0 -26
  107. package/dist/components/search-input/ClearButton.d.ts +0 -2
  108. package/dist/components/search-input/ClearButton.js +0 -10
  109. package/dist/components/search-input/SearchInput.css +0 -13
  110. package/dist/components/search-input/SearchInput.d.ts +0 -14
  111. package/dist/components/search-input/SearchInput.js +0 -61
  112. package/dist/components/search-input/SearchSuggestion.d.ts +0 -17
  113. package/dist/components/search-input/SearchSuggestion.js +0 -21
  114. package/dist/components/search-input/useSearchInput.d.ts +0 -13
  115. package/dist/components/search-input/useSearchInput.js +0 -85
  116. package/dist/components/snackbar/Snackbar.css +0 -55
  117. package/dist/components/snackbar/Snackbar.d.ts +0 -21
  118. package/dist/components/snackbar/Snackbar.js +0 -78
  119. package/dist/components/snackbar/SnackbarContext.d.ts +0 -7
  120. package/dist/components/snackbar/SnackbarContext.js +0 -3
  121. package/dist/components/snackbar/SnackbarProvider.d.ts +0 -7
  122. package/dist/components/snackbar/SnackbarProvider.js +0 -66
  123. package/dist/components/snackbar/useSnackbar.d.ts +0 -2
  124. package/dist/components/snackbar/useSnackbar.js +0 -4
  125. package/dist/components/stepper-horizontal/StepperHorizontal.css +0 -6
  126. package/dist/components/stepper-horizontal/StepperHorizontal.d.ts +0 -7
  127. package/dist/components/stepper-horizontal/StepperHorizontal.js +0 -48
  128. package/dist/components/stepper-horizontal/step-horizontal/StepHorizontal.css +0 -24
  129. package/dist/components/stepper-horizontal/step-horizontal/StepHorizontal.d.ts +0 -6
  130. package/dist/components/stepper-horizontal/step-horizontal/StepHorizontal.js +0 -16
  131. package/dist/components/stepper-vertical/StepperVertical.d.ts +0 -6
  132. package/dist/components/stepper-vertical/StepperVertical.js +0 -26
  133. package/dist/components/stepper-vertical/step-vertical/StepVertical.css +0 -10
  134. package/dist/components/stepper-vertical/step-vertical/StepVertical.d.ts +0 -11
  135. package/dist/components/stepper-vertical/step-vertical/StepVertical.js +0 -58
  136. package/dist/components/tab/Tabs.css +0 -285
  137. package/dist/components/tab/Tabs.d.ts +0 -22
  138. package/dist/components/tab/Tabs.js +0 -194
  139. package/dist/components/tab/interfaces.d.ts +0 -5
  140. package/dist/components/tab/interfaces.js +0 -0
  141. package/dist/components/tab/tab-pane/TabPane.css +0 -8
  142. package/dist/components/tab/tab-pane/TabPane.d.ts +0 -9
  143. package/dist/components/tab/tab-pane/TabPane.js +0 -18
  144. package/dist/components/tab/useTabScroll.d.ts +0 -25
  145. package/dist/components/tab/useTabScroll.js +0 -151
  146. package/dist/components/table-header-cell/TableHeaderCell.d.ts +0 -5
  147. package/dist/components/table-header-cell/TableHeaderCell.js +0 -21
  148. package/dist/forms/checkbox/Checkbox.css +0 -134
  149. package/dist/forms/checkbox/Checkbox.d.ts +0 -15
  150. package/dist/forms/checkbox/Checkbox.js +0 -80
  151. package/dist/forms/combobox/ComboBox.css +0 -124
  152. package/dist/forms/combobox/ComboBox.d.ts +0 -28
  153. package/dist/forms/combobox/ComboBox.js +0 -175
  154. package/dist/forms/multi-select/MultiSelect.d.ts +0 -20
  155. package/dist/forms/multi-select/MultiSelect.js +0 -191
  156. package/dist/forms/multi-select/MultiSelect.module.js +0 -8
  157. package/dist/forms/multi-select/MultiSelect_module.css +0 -13
  158. package/dist/forms/radio/RadioButton.d.ts +0 -14
  159. package/dist/forms/radio/RadioButton.js +0 -61
  160. package/dist/forms/radio/RadioGroup.d.ts +0 -12
  161. package/dist/forms/radio/RadioGroup.js +0 -50
  162. package/dist/forms/radio/RadioGroupContext.d.ts +0 -12
  163. package/dist/forms/radio/RadioGroupContext.js +0 -3
  164. package/dist/forms/segment/Segment.d.ts +0 -13
  165. package/dist/forms/segment/Segment.js +0 -59
  166. package/dist/forms/segment/segment-control/SegmentControl.d.ts +0 -14
  167. package/dist/forms/segment/segment-control/SegmentControl.js +0 -57
  168. package/dist/forms/select/Select.d.ts +0 -25
  169. package/dist/forms/select/Select.js +0 -92
  170. package/dist/forms/slider/Slider.css +0 -50
  171. package/dist/forms/slider/Slider.d.ts +0 -17
  172. package/dist/forms/slider/Slider.js +0 -93
  173. package/dist/forms/switch/Switch.d.ts +0 -12
  174. package/dist/forms/switch/Switch.js +0 -42
  175. package/dist/forms/text-area/TextArea.css +0 -14
  176. package/dist/forms/text-area/TextArea.d.ts +0 -22
  177. package/dist/forms/text-area/TextArea.js +0 -99
  178. package/dist/forms/text-input/TextInput.d.ts +0 -24
  179. package/dist/forms/text-input/TextInput.js +0 -74
  180. package/dist/forms/time-picker/TimePicker.css +0 -10
  181. package/dist/forms/time-picker/TimePicker.d.ts +0 -24
  182. package/dist/forms/time-picker/TimePicker.js +0 -140
  183. package/dist/forms/time-picker/time-picker-dropdown/TimePickerDropdown.css +0 -4
  184. package/dist/forms/time-picker/time-picker-dropdown/TimePickerDropdown.d.ts +0 -19
  185. package/dist/forms/time-picker/time-picker-dropdown/TimePickerDropdown.js +0 -208
  186. package/dist/forms/time-picker/time-picker-dropdown/TimePickerInput.d.ts +0 -9
  187. package/dist/forms/time-picker/time-picker-dropdown/TimePickerInput.js +0 -14
  188. package/dist/index.d.ts +0 -59
  189. package/dist/index.js +0 -60
  190. package/dist/utils/index.d.ts +0 -1
  191. package/dist/utils/index.js +0 -7
  192. package/dist/utils/setRef.d.ts +0 -1
  193. package/dist/utils/setRef.js +0 -5
  194. package/dist/utils/types.d.ts +0 -36
  195. package/dist/utils/types.js +0 -0
  196. package/dist/utils/useControlled.d.ts +0 -7
  197. package/dist/utils/useControlled.js +0 -20
  198. package/dist/utils/useForkRef.d.ts +0 -2
  199. package/dist/utils/useForkRef.js +0 -15
  200. package/dist/utils/useId.d.ts +0 -1
  201. package/dist/utils/useId.js +0 -20
  202. package/dist/utils/useOnClickOutside.d.ts +0 -2
  203. package/dist/utils/useOnClickOutside.js +0 -20
@@ -1,78 +0,0 @@
1
- import { jsx, jsxs } from "react/jsx-runtime";
2
- import "./Snackbar.css";
3
- import classnames from "classnames";
4
- import { useEffect, useRef, useState } from "react";
5
- import { CSSTransition } from "react-transition-group";
6
- function Snackbar(props) {
7
- const { data, onAction, onClose, first = false } = props;
8
- const [show, setShow] = useState(true);
9
- const nodeRef = useRef(null);
10
- useEffect(()=>{
11
- let disappearAfter = 5000;
12
- if (data?.disappearAfter !== null) {
13
- if (data?.disappearAfter && data?.disappearAfter > 0) disappearAfter = data?.disappearAfter;
14
- const timer = setTimeout(()=>setShow(false), disappearAfter);
15
- return ()=>{
16
- clearTimeout(timer);
17
- };
18
- }
19
- }, [
20
- data
21
- ]);
22
- function handleClose() {
23
- setShow(false);
24
- }
25
- const classes = first ? 'fr-snackbar-wrapper--first' : 'fr-snackbar-wrapper';
26
- return /*#__PURE__*/ jsx(CSSTransition, {
27
- nodeRef: nodeRef,
28
- onExited: ()=>onClose ? onClose() : void 0,
29
- unmountOnExit: true,
30
- timeout: {
31
- exit: 600
32
- },
33
- in: show,
34
- classNames: classes,
35
- appear: true,
36
- children: /*#__PURE__*/ jsx("div", {
37
- ref: nodeRef,
38
- className: classes,
39
- children: /*#__PURE__*/ jsxs("div", {
40
- className: classnames({
41
- 'fwe-snackbar': true,
42
- 'fwe-snackbar-b': data?.variant === 'b',
43
- 'fwe-snackbar-c': data?.variant === 'c',
44
- 'fwe-snackbar-info': data?.type === 'info',
45
- 'fwe-snackbar-warning': data?.type === 'warning',
46
- 'fwe-snackbar-error': data?.type === 'error',
47
- 'fwe-snackbar-shadow': data?.darkBackground
48
- }, data?.className),
49
- children: [
50
- /*#__PURE__*/ jsx("span", {
51
- children: data?.text
52
- }),
53
- data?.action && /*#__PURE__*/ jsx("button", {
54
- "aria-label": "UserAction",
55
- type: "button",
56
- className: "fwe-snackbar-link-btn",
57
- onClick: ()=>onAction ? onAction() : void 0,
58
- children: data?.action
59
- }),
60
- data?.action && data?.showClose && /*#__PURE__*/ jsx("div", {
61
- className: "fwe-snackbar-separator"
62
- }),
63
- data?.showClose && /*#__PURE__*/ jsx("button", {
64
- "aria-label": "Close",
65
- type: "button",
66
- className: "fwe-snackbar-close-btn",
67
- onClick: handleClose,
68
- children: /*#__PURE__*/ jsx("span", {
69
- className: "fwe-sr-only",
70
- children: "Close"
71
- })
72
- })
73
- ]
74
- })
75
- })
76
- });
77
- }
78
- export { Snackbar };
@@ -1,7 +0,0 @@
1
- import React from 'react';
2
- import type { SnackbarData } from './Snackbar';
3
- export interface ProviderContext {
4
- addSnackbar: (data: SnackbarData, onAction?: () => void, onClose?: () => void) => void;
5
- closeSnackbar: (key: number | string) => void;
6
- }
7
- export declare const SnackbarContext: React.Context<ProviderContext>;
@@ -1,3 +0,0 @@
1
- import react from "react";
2
- const SnackbarContext = react.createContext(null);
3
- export { SnackbarContext };
@@ -1,7 +0,0 @@
1
- import type { ClassNamePropsWithChildren } from '../../utils/types';
2
- import { type SnackbarConfig, type SnackbarData } from './Snackbar';
3
- export interface SnackbarProviderProps extends ClassNamePropsWithChildren {
4
- readonly config?: SnackbarConfig;
5
- }
6
- export declare function SnackbarProvider(props: SnackbarProviderProps): import("react/jsx-runtime").JSX.Element;
7
- export declare const addSnackbar: (snackData: SnackbarData, onAction?: () => void, onClose?: () => void) => string | number;
@@ -1,66 +0,0 @@
1
- import { jsx, jsxs } from "react/jsx-runtime";
2
- import classnames from "classnames";
3
- import { useCallback, useMemo, useState } from "react";
4
- import { Snackbar } from "./Snackbar.js";
5
- import { SnackbarContext } from "./SnackbarContext.js";
6
- let addSnackbarFunction;
7
- function SnackbarProvider(props) {
8
- const { config = {
9
- darkBackground: true
10
- }, children, className } = props;
11
- const [snacks, setSnacks] = useState([]);
12
- const addSnackbar = useCallback((snackData, onAction, onClose)=>{
13
- const key = snackData.key ?? Date.now() + Math.random();
14
- setSnacks((prevSnacks)=>[
15
- {
16
- data: {
17
- ...config,
18
- ...snackData
19
- },
20
- onAction,
21
- onClose,
22
- key,
23
- first: 0 === prevSnacks.length
24
- },
25
- ...prevSnacks
26
- ]);
27
- return key;
28
- }, [
29
- config
30
- ]);
31
- addSnackbarFunction = addSnackbar;
32
- const closeSnackbar = useCallback((key)=>{
33
- if (void 0 !== key) setSnacks((prevSnacks)=>prevSnacks.filter((snack)=>snack.key !== key));
34
- }, []);
35
- function handleClose(snack) {
36
- closeSnackbar(snack.key);
37
- if (snack.onClose) snack.onClose();
38
- }
39
- const contextValue = useMemo(()=>({
40
- addSnackbar,
41
- closeSnackbar
42
- }), [
43
- addSnackbar,
44
- closeSnackbar
45
- ]);
46
- return /*#__PURE__*/ jsxs(SnackbarContext.Provider, {
47
- value: contextValue,
48
- children: [
49
- children,
50
- /*#__PURE__*/ jsx("div", {
51
- className: classnames('fwe-snackbar-container', className),
52
- children: snacks.map((snack)=>/*#__PURE__*/ jsx(Snackbar, {
53
- data: snack.data,
54
- onAction: ()=>snack.onAction ? snack.onAction() : void 0,
55
- onClose: ()=>handleClose(snack),
56
- first: snack.first
57
- }, snack.key))
58
- })
59
- ]
60
- });
61
- }
62
- const SnackbarProvider_addSnackbar = (snackData, onAction, onClose)=>{
63
- if (!addSnackbarFunction) throw new Error('SnackbarProvider is not mounted.');
64
- return addSnackbarFunction(snackData, onAction, onClose);
65
- };
66
- export { SnackbarProvider, SnackbarProvider_addSnackbar as addSnackbar };
@@ -1,2 +0,0 @@
1
- import { type ProviderContext } from './SnackbarContext';
2
- export declare const useSnackbar: () => ProviderContext;
@@ -1,4 +0,0 @@
1
- import { useContext } from "react";
2
- import { SnackbarContext } from "./SnackbarContext.js";
3
- const useSnackbar = ()=>useContext(SnackbarContext);
4
- export { useSnackbar };
@@ -1,6 +0,0 @@
1
- .fr-step-container {
2
- background: none;
3
- border: none;
4
- padding: 0;
5
- }
6
-
@@ -1,7 +0,0 @@
1
- import './StepperHorizontal.scss';
2
- import React, { type ComponentPropsWithoutRef } from 'react';
3
- export interface StepperHorizontalProps extends Omit<ComponentPropsWithoutRef<'button'>, 'onChange'> {
4
- stepIndex?: number;
5
- onChange?: (stepIndex: number) => void;
6
- }
7
- export declare const StepperHorizontal: (props: StepperHorizontalProps & React.RefAttributes<HTMLButtonElement>) => React.ReactElement | null;
@@ -1,48 +0,0 @@
1
- import { Fragment, jsx, jsxs } from "react/jsx-runtime";
2
- import "./StepperHorizontal.css";
3
- import classnames from "classnames";
4
- import react, { forwardRef } from "react";
5
- const StepperHorizontal = /*#__PURE__*/ forwardRef(({ children, className, stepIndex = 0, onChange, ...props }, ref)=>{
6
- const stepComponents = react.Children.map(children, (child, i)=>/*#__PURE__*/ react.isValidElement(child) ? /*#__PURE__*/ react.cloneElement(child, {
7
- ...child.props,
8
- isActive: i === stepIndex
9
- }) : null);
10
- function handleStepClick(index) {
11
- if (stepIndex > index && onChange) onChange(index);
12
- }
13
- return /*#__PURE__*/ jsxs(Fragment, {
14
- children: [
15
- /*#__PURE__*/ jsx("div", {
16
- className: classnames('fwe-stepper-horizontal', className),
17
- children: stepComponents?.map((step, i)=>/*#__PURE__*/ jsx("button", {
18
- type: "button",
19
- ref: ref,
20
- className: classnames('fwe-step-container fr-step-container', {
21
- 'fwe-step-done': stepIndex > i,
22
- 'fwe-step-active': i === stepIndex
23
- }),
24
- onClick: ()=>handleStepClick(i),
25
- disabled: stepIndex <= i,
26
- "aria-label": `Step ${i + 1}: ${step.props.title}`,
27
- "aria-current": i === stepIndex ? 'step' : void 0,
28
- ...props,
29
- children: /*#__PURE__*/ jsxs("div", {
30
- className: "fwe-step",
31
- children: [
32
- /*#__PURE__*/ jsx("div", {
33
- className: "fwe-step-no",
34
- children: i + 1
35
- }),
36
- /*#__PURE__*/ jsx("div", {
37
- className: "fwe-step-name",
38
- children: step.props.title
39
- })
40
- ]
41
- })
42
- }, step.props.title))
43
- }),
44
- stepComponents
45
- ]
46
- });
47
- });
48
- export { StepperHorizontal };
@@ -1,24 +0,0 @@
1
- .overflow-hidden {
2
- overflow: hidden;
3
- }
4
-
5
- @keyframes stepperAnimation {
6
- from {
7
- transform: translateX(100%);
8
- }
9
-
10
- to {
11
- transform: translateX(0%);
12
- }
13
- }
14
-
15
- .fr-moving-container {
16
- animation-name: stepperAnimation;
17
- animation-duration: .3s;
18
- animation-timing-function: ease;
19
- }
20
-
21
- .hidden {
22
- display: none;
23
- }
24
-
@@ -1,6 +0,0 @@
1
- import './StepHorizontal.scss';
2
- import { type ComponentPropsWithoutRef } from 'react';
3
- export interface StepHorizontalProps extends ComponentPropsWithoutRef<'div'> {
4
- readonly isActive?: boolean;
5
- }
6
- export declare const StepHorizontal: (props: StepHorizontalProps & import("react").RefAttributes<HTMLDivElement>) => React.ReactElement | null;
@@ -1,16 +0,0 @@
1
- import { jsx } from "react/jsx-runtime";
2
- import "./StepHorizontal.css";
3
- import classnames from "classnames";
4
- import { forwardRef } from "react";
5
- const StepHorizontal = /*#__PURE__*/ forwardRef(({ children, className, isActive, ...props }, ref)=>/*#__PURE__*/ jsx("div", {
6
- ref: ref,
7
- className: classnames('overflow-hidden', {
8
- hidden: !isActive
9
- }),
10
- ...props,
11
- children: /*#__PURE__*/ jsx("div", {
12
- className: "fr-moving-container",
13
- children: children
14
- })
15
- }));
16
- export { StepHorizontal };
@@ -1,6 +0,0 @@
1
- import React, { type ComponentPropsWithoutRef } from 'react';
2
- export interface StepperVerticalProps extends Omit<ComponentPropsWithoutRef<'div'>, 'onChange'> {
3
- readonly stepIndex?: number;
4
- readonly onChange?: (stepIndex: number) => void;
5
- }
6
- export declare const StepperVertical: (props: StepperVerticalProps & React.RefAttributes<HTMLDivElement>) => React.ReactElement | null;
@@ -1,26 +0,0 @@
1
- import { jsx } from "react/jsx-runtime";
2
- import classnames from "classnames";
3
- import react, { forwardRef } from "react";
4
- const StepperVertical = /*#__PURE__*/ forwardRef(({ children, className, stepIndex = 0, onChange, ...props }, ref)=>{
5
- function handleStepClick(index) {
6
- if (stepIndex > index && onChange) onChange(index);
7
- }
8
- const stepComponents = react.Children.map(children, (child, i)=>{
9
- if (/*#__PURE__*/ react.isValidElement(child)) return /*#__PURE__*/ react.cloneElement(child, {
10
- ...child.props,
11
- isActive: i === stepIndex,
12
- index: i,
13
- isDone: i < stepIndex,
14
- isLastElement: i === react.Children.count(children) - 1,
15
- onStepClick: ()=>handleStepClick(i)
16
- });
17
- return null;
18
- });
19
- return /*#__PURE__*/ jsx("div", {
20
- ref: ref,
21
- className: classnames('fwe-stepper-vertical', className),
22
- ...props,
23
- children: stepComponents
24
- });
25
- });
26
- export { StepperVertical };
@@ -1,10 +0,0 @@
1
- .fwe-stepper-vertical .fwe-step-container.fwe-step-active .fwe-step-content-container {
2
- height: 20px;
3
- }
4
-
5
- .fr-stepper-vertical-step {
6
- background: none;
7
- border: none;
8
- padding: 0;
9
- }
10
-
@@ -1,11 +0,0 @@
1
- import './StepVertical.scss';
2
- import { type ComponentPropsWithoutRef } from 'react';
3
- export interface StepVerticalProps extends ComponentPropsWithoutRef<'div'> {
4
- readonly isActive?: boolean;
5
- readonly isLastElement?: boolean;
6
- readonly isDone?: boolean;
7
- readonly index?: number;
8
- readonly title?: string;
9
- readonly onStepClick?: () => void;
10
- }
11
- export declare const StepVertical: (props: StepVerticalProps & import("react").RefAttributes<HTMLDivElement>) => React.ReactElement | null;
@@ -1,58 +0,0 @@
1
- import { jsx, jsxs } from "react/jsx-runtime";
2
- import "./StepVertical.css";
3
- import classnames from "classnames";
4
- import { forwardRef, useEffect, useRef } from "react";
5
- const StepVertical = /*#__PURE__*/ forwardRef(({ children, className, isActive, isLastElement, isDone, index, title, onStepClick, ...props }, ref)=>{
6
- const containerRef = useRef(null);
7
- const contentRef = useRef(null);
8
- useEffect(()=>{
9
- if (containerRef.current) if (isActive) {
10
- const itemHeight = contentRef.current?.offsetHeight;
11
- containerRef.current.style.height = `${itemHeight}px`;
12
- } else containerRef.current.style.height = '20px';
13
- }, [
14
- isActive
15
- ]);
16
- function handleClick() {
17
- if (onStepClick) onStepClick();
18
- }
19
- return /*#__PURE__*/ jsxs("div", {
20
- ref: ref,
21
- className: classnames('fwe-step-container', {
22
- 'fwe-last-element': isLastElement,
23
- 'fwe-step-active': isActive,
24
- 'fwe-step-done': isDone
25
- }),
26
- ...props,
27
- children: [
28
- /*#__PURE__*/ jsxs("button", {
29
- type: "button",
30
- className: "fwe-step fr-stepper-vertical-step",
31
- onClick: handleClick,
32
- "aria-label": `Step ${(index ?? 0) + 1}: ${title}`,
33
- "aria-current": isActive ? 'step' : void 0,
34
- disabled: !isDone && !isActive,
35
- children: [
36
- void 0 !== index && /*#__PURE__*/ jsx("div", {
37
- className: "fwe-step-no",
38
- children: index + 1
39
- }),
40
- /*#__PURE__*/ jsx("div", {
41
- className: "fwe-step-name",
42
- children: title
43
- })
44
- ]
45
- }),
46
- /*#__PURE__*/ jsx("div", {
47
- ref: containerRef,
48
- className: "fwe-step-content-container",
49
- children: /*#__PURE__*/ jsx("div", {
50
- ref: contentRef,
51
- className: "fwe-step-content",
52
- children: children
53
- })
54
- })
55
- ]
56
- });
57
- });
58
- export { StepVertical };