@x15ventures/x15-ui-library 3.16.1 → 3.18.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/autoGenerated/libraryThemes.js +12 -12
- package/dist/cjs/autoGenerated/libraryThemes.js.map +1 -1
- package/dist/cjs/autoGenerated/libraryThemes.json +12 -12
- package/dist/cjs/components/design/accordion/Accordion.js +7 -23
- package/dist/cjs/components/design/accordion/Accordion.js.map +1 -1
- package/dist/cjs/components/design/banners/pageBanner/PageBanner.js +2 -4
- package/dist/cjs/components/design/banners/pageBanner/PageBanner.js.map +1 -1
- package/dist/cjs/components/design/card/cardContent/CardContentLine.js +2 -2
- package/dist/cjs/components/design/card/cardContent/CardContentLine.js.map +1 -1
- package/dist/cjs/components/design/card/cardHeader/CardHeaderItem.js +2 -2
- package/dist/cjs/components/design/card/cardHeader/CardHeaderItem.js.map +1 -1
- package/dist/cjs/components/design/dialog/Dialog.js +3 -1
- package/dist/cjs/components/design/dialog/Dialog.js.map +1 -1
- package/dist/cjs/components/design/dialog/dialog.css +5 -0
- package/dist/cjs/components/design/headerBar/HeaderBar.js +3 -3
- package/dist/cjs/components/design/headerBar/HeaderBar.js.map +1 -1
- package/dist/cjs/components/design/icons/notificationIcon/NotificationIcon.js +4 -5
- package/dist/cjs/components/design/icons/notificationIcon/NotificationIcon.js.map +1 -1
- package/dist/cjs/components/design/paginators/Paginator.js +4 -12
- package/dist/cjs/components/design/paginators/Paginator.js.map +1 -1
- package/dist/cjs/components/design/progressIndicators/circularProgressIndicator/CircularProgressIndicator.js +89 -0
- package/dist/cjs/components/design/progressIndicators/circularProgressIndicator/CircularProgressIndicator.js.map +1 -0
- package/dist/cjs/components/design/progressIndicators/circularProgressIndicator/circularProgressIndicator.css +301 -0
- package/dist/cjs/components/design/revealMore/RevealMoreBelow.js +1 -3
- package/dist/cjs/components/design/revealMore/RevealMoreBelow.js.map +1 -1
- package/dist/cjs/components/design/revealMore/RevealMoreInline.js +3 -5
- package/dist/cjs/components/design/revealMore/RevealMoreInline.js.map +1 -1
- package/dist/cjs/components/design/revealMore/types/revealMoreTypes.js.map +1 -1
- package/dist/cjs/components/design/sidePanel/SidePanel.js +3 -5
- package/dist/cjs/components/design/sidePanel/SidePanel.js.map +1 -1
- package/dist/cjs/components/design/statusIndicators/statusIconLabel/StatusIconLabel.js +6 -11
- package/dist/cjs/components/design/statusIndicators/statusIconLabel/StatusIconLabel.js.map +1 -1
- package/dist/cjs/components/design/tabs/Tabs.js +2 -2
- package/dist/cjs/components/design/tabs/Tabs.js.map +1 -1
- package/dist/cjs/components/design/themeLoader/ThemeLoader.js +2 -2
- package/dist/cjs/components/design/themeLoader/ThemeLoader.js.map +1 -1
- package/dist/cjs/components/design/tooltip/Tooltip.js +43 -13
- package/dist/cjs/components/design/tooltip/Tooltip.js.map +1 -1
- package/dist/cjs/components/design/tooltip/index.js +6 -0
- package/dist/cjs/components/design/tooltip/index.js.map +1 -1
- package/dist/cjs/components/design/tooltip/tooltip.css +18 -7
- package/dist/cjs/components/form/buttons/SimpleButton.js +3 -3
- package/dist/cjs/components/form/buttons/SimpleButton.js.map +1 -1
- package/dist/cjs/components/form/buttons/button.interface.js.map +1 -1
- package/dist/cjs/components/form/formFields/formFieldWrapper/formFieldProps.js.map +1 -1
- package/dist/cjs/components/form/formFields/subComponents/inputs/checkbox/InputCheckbox.js +5 -5
- package/dist/cjs/components/form/formFields/subComponents/inputs/checkbox/InputCheckbox.js.map +1 -1
- package/dist/cjs/components/form/formFields/subComponents/inputs/checkbox/checkboxSwitch/CheckboxSwitch.js +176 -0
- package/dist/cjs/components/form/formFields/subComponents/inputs/checkbox/checkboxSwitch/CheckboxSwitch.js.map +1 -0
- package/dist/cjs/components/form/formFields/subComponents/inputs/checkbox/checkboxSwitch/_checkboxSwitchVariables.css +0 -0
- package/dist/cjs/components/form/formFields/subComponents/inputs/checkbox/checkboxSwitch/checkboxSwitch.css +306 -0
- package/dist/cjs/components/form/formFields/subComponents/inputs/checkbox/checkboxSwitch/checkboxSwitchProps.js +6 -0
- package/dist/cjs/components/form/formFields/subComponents/inputs/checkbox/checkboxSwitch/checkboxSwitchProps.js.map +1 -0
- package/dist/cjs/components/form/formFields/subComponents/inputs/checkbox/inputCheckboxProps.js.map +1 -1
- package/dist/cjs/components/form/formFields/subComponents/inputs/file/dragAndDrop/DragAndDropFileUpload.js +3 -5
- package/dist/cjs/components/form/formFields/subComponents/inputs/file/dragAndDrop/DragAndDropFileUpload.js.map +1 -1
- package/dist/cjs/components/form/formFields/subComponents/inputs/file/fileAttachmentList/FileAttachmentsList.js +12 -22
- package/dist/cjs/components/form/formFields/subComponents/inputs/file/fileAttachmentList/FileAttachmentsList.js.map +1 -1
- package/dist/cjs/components/form/formFields/subComponents/inputs/file/fileInputProps.js.map +1 -1
- package/dist/cjs/components/index.js +14 -0
- package/dist/cjs/components/index.js.map +1 -1
- package/dist/cjs/components/navigation/menu/Menu.interfaces.js.map +1 -1
- package/dist/cjs/components/navigation/menu/menuItemContent/MenuItemIcon.js +19 -31
- package/dist/cjs/components/navigation/menu/menuItemContent/MenuItemIcon.js.map +1 -1
- package/dist/cjs/helpers/iconHelpers.js +83 -0
- package/dist/cjs/helpers/iconHelpers.js.map +1 -0
- package/dist/cjs/helpers/index.js +43 -0
- package/dist/cjs/helpers/index.js.map +1 -1
- package/dist/cjs/helpers/objectHelpers.js +9 -2
- package/dist/cjs/helpers/objectHelpers.js.map +1 -1
- package/dist/cjs/hooks/InteractiveHostFocus.js +62 -0
- package/dist/cjs/hooks/InteractiveHostFocus.js.map +1 -0
- package/dist/cjs/hooks/index.js +7 -0
- package/dist/cjs/hooks/index.js.map +1 -1
- package/dist/cjs/index.js +79 -0
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/interfaces/headerText.interface.js.map +1 -1
- package/dist/cjs/package.json +16 -28
- package/dist/cjs/styles/index.css +61 -0
- package/dist/cjs/styles/storybook/storybook.css +7 -0
- package/dist/cjs/styles/variables/cssVars/_darkModeVariables.css +21 -0
- package/dist/cjs/styles/variables/cssVars/_formVariables.css +40 -0
- package/dist/cjs/widgets/index.js +14 -0
- package/dist/cjs/widgets/index.js.map +1 -0
- package/dist/cjs/widgets/processLauncher/ProcessLauncher.js +272 -0
- package/dist/cjs/widgets/processLauncher/ProcessLauncher.js.map +1 -0
- package/dist/cjs/widgets/processLauncher/index.js +13 -0
- package/dist/cjs/widgets/processLauncher/index.js.map +1 -0
- package/dist/cjs/widgets/processLauncher/processLauncher.interfaces.js +6 -0
- package/dist/cjs/widgets/processLauncher/processLauncher.interfaces.js.map +1 -0
- package/dist/components/design/accordion/Accordion.d.ts +3 -2
- package/dist/components/design/accordion/Accordion.d.ts.map +1 -1
- package/dist/components/design/banners/pageBanner/PageBanner.d.ts +2 -1
- package/dist/components/design/banners/pageBanner/PageBanner.d.ts.map +1 -1
- package/dist/components/design/card/cardContent/CardContentLine.d.ts +2 -2
- package/dist/components/design/card/cardContent/CardContentLine.d.ts.map +1 -1
- package/dist/components/design/card/cardHeader/CardHeaderItem.d.ts +2 -2
- package/dist/components/design/card/cardHeader/CardHeaderItem.d.ts.map +1 -1
- package/dist/components/design/dialog/Dialog.d.ts.map +1 -1
- package/dist/components/design/headerBar/HeaderBar.d.ts.map +1 -1
- package/dist/components/design/icons/notificationIcon/NotificationIcon.d.ts +2 -2
- package/dist/components/design/icons/notificationIcon/NotificationIcon.d.ts.map +1 -1
- package/dist/components/design/paginators/Paginator.d.ts +3 -2
- package/dist/components/design/paginators/Paginator.d.ts.map +1 -1
- package/dist/components/design/progressIndicators/circularProgressIndicator/CircularProgressIndicator.d.ts +18 -0
- package/dist/components/design/progressIndicators/circularProgressIndicator/CircularProgressIndicator.d.ts.map +1 -0
- package/dist/components/design/progressIndicators/circularProgressIndicator/CircularProgressIndicator.test.d.ts +5 -0
- package/dist/components/design/progressIndicators/circularProgressIndicator/CircularProgressIndicator.test.d.ts.map +1 -0
- package/dist/components/design/revealMore/RevealMoreBelow.d.ts.map +1 -1
- package/dist/components/design/revealMore/RevealMoreInline.d.ts.map +1 -1
- package/dist/components/design/revealMore/types/revealMoreTypes.d.ts +3 -2
- package/dist/components/design/revealMore/types/revealMoreTypes.d.ts.map +1 -1
- package/dist/components/design/sidePanel/SidePanel.d.ts +3 -2
- package/dist/components/design/sidePanel/SidePanel.d.ts.map +1 -1
- package/dist/components/design/statusIndicators/statusIconLabel/StatusIconLabel.d.ts +2 -2
- package/dist/components/design/statusIndicators/statusIconLabel/StatusIconLabel.d.ts.map +1 -1
- package/dist/components/design/tabs/Tabs.d.ts +3 -3
- package/dist/components/design/tabs/Tabs.d.ts.map +1 -1
- package/dist/components/design/tooltip/Tooltip.d.ts +17 -3
- package/dist/components/design/tooltip/Tooltip.d.ts.map +1 -1
- package/dist/components/design/tooltip/Tooltip.test.d.ts +1 -1
- package/dist/components/design/tooltip/Tooltip.test.d.ts.map +1 -1
- package/dist/components/design/tooltip/index.d.ts +1 -1
- package/dist/components/design/tooltip/index.d.ts.map +1 -1
- package/dist/components/form/buttons/SimpleButton.test.d.ts +5 -0
- package/dist/components/form/buttons/SimpleButton.test.d.ts.map +1 -0
- package/dist/components/form/buttons/button.interface.d.ts +3 -3
- package/dist/components/form/buttons/button.interface.d.ts.map +1 -1
- package/dist/components/form/formFields/formFieldWrapper/formFieldProps.d.ts +2 -1
- package/dist/components/form/formFields/formFieldWrapper/formFieldProps.d.ts.map +1 -1
- package/dist/components/form/formFields/subComponents/inputs/checkbox/checkboxSwitch/CheckboxSwitch.d.ts +29 -0
- package/dist/components/form/formFields/subComponents/inputs/checkbox/checkboxSwitch/CheckboxSwitch.d.ts.map +1 -0
- package/dist/components/form/formFields/subComponents/inputs/checkbox/checkboxSwitch/CheckboxSwitch.test.d.ts +5 -0
- package/dist/components/form/formFields/subComponents/inputs/checkbox/checkboxSwitch/CheckboxSwitch.test.d.ts.map +1 -0
- package/dist/components/form/formFields/subComponents/inputs/checkbox/checkboxSwitch/checkboxSwitchProps.d.ts +52 -0
- package/dist/components/form/formFields/subComponents/inputs/checkbox/checkboxSwitch/checkboxSwitchProps.d.ts.map +1 -0
- package/dist/components/form/formFields/subComponents/inputs/checkbox/inputCheckboxProps.d.ts +3 -3
- package/dist/components/form/formFields/subComponents/inputs/checkbox/inputCheckboxProps.d.ts.map +1 -1
- package/dist/components/form/formFields/subComponents/inputs/file/fileAttachmentList/FileAttachmentsList.d.ts.map +1 -1
- package/dist/components/form/formFields/subComponents/inputs/file/fileInputProps.d.ts +4 -3
- package/dist/components/form/formFields/subComponents/inputs/file/fileInputProps.d.ts.map +1 -1
- package/dist/components/index.d.ts +4 -0
- package/dist/components/index.d.ts.map +1 -1
- package/dist/components/navigation/menu/Menu.interfaces.d.ts +4 -3
- package/dist/components/navigation/menu/Menu.interfaces.d.ts.map +1 -1
- package/dist/components/navigation/menu/menuItemContent/MenuItemIcon.d.ts +2 -1
- package/dist/components/navigation/menu/menuItemContent/MenuItemIcon.d.ts.map +1 -1
- package/dist/components/navigation/menu/menuItemContent/MenuItemIcon.test.d.ts +5 -0
- package/dist/components/navigation/menu/menuItemContent/MenuItemIcon.test.d.ts.map +1 -0
- package/dist/esm/autoGenerated/libraryThemes.js +12 -12
- package/dist/esm/autoGenerated/libraryThemes.js.map +1 -1
- package/dist/esm/autoGenerated/libraryThemes.json +12 -12
- package/dist/esm/components/design/accordion/Accordion.js +7 -23
- package/dist/esm/components/design/accordion/Accordion.js.map +1 -1
- package/dist/esm/components/design/banners/pageBanner/PageBanner.js +2 -4
- package/dist/esm/components/design/banners/pageBanner/PageBanner.js.map +1 -1
- package/dist/esm/components/design/card/cardContent/CardContentLine.js +2 -2
- package/dist/esm/components/design/card/cardContent/CardContentLine.js.map +1 -1
- package/dist/esm/components/design/card/cardHeader/CardHeaderItem.js +2 -2
- package/dist/esm/components/design/card/cardHeader/CardHeaderItem.js.map +1 -1
- package/dist/esm/components/design/dialog/Dialog.js +3 -1
- package/dist/esm/components/design/dialog/Dialog.js.map +1 -1
- package/dist/esm/components/design/dialog/dialog.css +5 -0
- package/dist/esm/components/design/headerBar/HeaderBar.js +3 -3
- package/dist/esm/components/design/headerBar/HeaderBar.js.map +1 -1
- package/dist/esm/components/design/icons/notificationIcon/NotificationIcon.js +4 -5
- package/dist/esm/components/design/icons/notificationIcon/NotificationIcon.js.map +1 -1
- package/dist/esm/components/design/paginators/Paginator.js +4 -12
- package/dist/esm/components/design/paginators/Paginator.js.map +1 -1
- package/dist/esm/components/design/progressIndicators/circularProgressIndicator/CircularProgressIndicator.js +82 -0
- package/dist/esm/components/design/progressIndicators/circularProgressIndicator/CircularProgressIndicator.js.map +1 -0
- package/dist/esm/components/design/progressIndicators/circularProgressIndicator/circularProgressIndicator.css +301 -0
- package/dist/esm/components/design/revealMore/RevealMoreBelow.js +1 -3
- package/dist/esm/components/design/revealMore/RevealMoreBelow.js.map +1 -1
- package/dist/esm/components/design/revealMore/RevealMoreInline.js +2 -4
- package/dist/esm/components/design/revealMore/RevealMoreInline.js.map +1 -1
- package/dist/esm/components/design/revealMore/types/revealMoreTypes.js.map +1 -1
- package/dist/esm/components/design/sidePanel/SidePanel.js +3 -5
- package/dist/esm/components/design/sidePanel/SidePanel.js.map +1 -1
- package/dist/esm/components/design/statusIndicators/statusIconLabel/StatusIconLabel.js +6 -11
- package/dist/esm/components/design/statusIndicators/statusIconLabel/StatusIconLabel.js.map +1 -1
- package/dist/esm/components/design/tabs/Tabs.js +2 -2
- package/dist/esm/components/design/tabs/Tabs.js.map +1 -1
- package/dist/esm/components/design/themeLoader/ThemeLoader.js +1 -1
- package/dist/esm/components/design/themeLoader/ThemeLoader.js.map +1 -1
- package/dist/esm/components/design/tooltip/Tooltip.js +41 -12
- package/dist/esm/components/design/tooltip/Tooltip.js.map +1 -1
- package/dist/esm/components/design/tooltip/index.js +1 -1
- package/dist/esm/components/design/tooltip/index.js.map +1 -1
- package/dist/esm/components/design/tooltip/tooltip.css +18 -7
- package/dist/esm/components/form/buttons/SimpleButton.js +3 -3
- package/dist/esm/components/form/buttons/SimpleButton.js.map +1 -1
- package/dist/esm/components/form/buttons/button.interface.js.map +1 -1
- package/dist/esm/components/form/formFields/formFieldWrapper/formFieldProps.js.map +1 -1
- package/dist/esm/components/form/formFields/subComponents/inputs/checkbox/InputCheckbox.js +5 -5
- package/dist/esm/components/form/formFields/subComponents/inputs/checkbox/InputCheckbox.js.map +1 -1
- package/dist/esm/components/form/formFields/subComponents/inputs/checkbox/checkboxSwitch/CheckboxSwitch.js +167 -0
- package/dist/esm/components/form/formFields/subComponents/inputs/checkbox/checkboxSwitch/CheckboxSwitch.js.map +1 -0
- package/dist/esm/components/form/formFields/subComponents/inputs/checkbox/checkboxSwitch/_checkboxSwitchVariables.css +0 -0
- package/dist/esm/components/form/formFields/subComponents/inputs/checkbox/checkboxSwitch/checkboxSwitch.css +306 -0
- package/dist/esm/components/form/formFields/subComponents/inputs/checkbox/checkboxSwitch/checkboxSwitchProps.js +2 -0
- package/dist/esm/components/form/formFields/subComponents/inputs/checkbox/checkboxSwitch/checkboxSwitchProps.js.map +1 -0
- package/dist/esm/components/form/formFields/subComponents/inputs/checkbox/inputCheckboxProps.js.map +1 -1
- package/dist/esm/components/form/formFields/subComponents/inputs/file/dragAndDrop/DragAndDropFileUpload.js +3 -5
- package/dist/esm/components/form/formFields/subComponents/inputs/file/dragAndDrop/DragAndDropFileUpload.js.map +1 -1
- package/dist/esm/components/form/formFields/subComponents/inputs/file/fileAttachmentList/FileAttachmentsList.js +12 -22
- package/dist/esm/components/form/formFields/subComponents/inputs/file/fileAttachmentList/FileAttachmentsList.js.map +1 -1
- package/dist/esm/components/form/formFields/subComponents/inputs/file/fileInputProps.js.map +1 -1
- package/dist/esm/components/index.js +2 -0
- package/dist/esm/components/index.js.map +1 -1
- package/dist/esm/components/navigation/menu/Menu.interfaces.js.map +1 -1
- package/dist/esm/components/navigation/menu/menuItemContent/MenuItemIcon.js +17 -30
- package/dist/esm/components/navigation/menu/menuItemContent/MenuItemIcon.js.map +1 -1
- package/dist/esm/helpers/iconHelpers.js +73 -0
- package/dist/esm/helpers/iconHelpers.js.map +1 -0
- package/dist/esm/helpers/index.js +2 -1
- package/dist/esm/helpers/index.js.map +1 -1
- package/dist/esm/helpers/objectHelpers.js +7 -3
- package/dist/esm/helpers/objectHelpers.js.map +1 -1
- package/dist/esm/hooks/InteractiveHostFocus.js +56 -0
- package/dist/esm/hooks/InteractiveHostFocus.js.map +1 -0
- package/dist/esm/hooks/index.js +1 -0
- package/dist/esm/hooks/index.js.map +1 -1
- package/dist/esm/index.js +5 -4
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/interfaces/headerText.interface.js.map +1 -1
- package/dist/esm/package.json +16 -28
- package/dist/esm/styles/index.css +61 -0
- package/dist/esm/styles/storybook/storybook.css +7 -0
- package/dist/esm/styles/variables/cssVars/_darkModeVariables.css +21 -0
- package/dist/esm/styles/variables/cssVars/_formVariables.css +40 -0
- package/dist/esm/widgets/index.js +4 -0
- package/dist/esm/widgets/index.js.map +1 -0
- package/dist/esm/widgets/processLauncher/ProcessLauncher.js +263 -0
- package/dist/esm/widgets/processLauncher/ProcessLauncher.js.map +1 -0
- package/dist/esm/widgets/processLauncher/index.js +2 -0
- package/dist/esm/widgets/processLauncher/index.js.map +1 -0
- package/dist/esm/widgets/processLauncher/processLauncher.interfaces.js +2 -0
- package/dist/esm/widgets/processLauncher/processLauncher.interfaces.js.map +1 -0
- package/dist/helpers/iconHelpers.d.ts +30 -0
- package/dist/helpers/iconHelpers.d.ts.map +1 -0
- package/dist/helpers/iconHelpers.test.d.ts +5 -0
- package/dist/helpers/iconHelpers.test.d.ts.map +1 -0
- package/dist/helpers/index.d.ts +4 -1
- package/dist/helpers/index.d.ts.map +1 -1
- package/dist/helpers/objectHelpers.d.ts +10 -3
- package/dist/helpers/objectHelpers.d.ts.map +1 -1
- package/dist/hooks/InteractiveHostFocus.d.ts +12 -0
- package/dist/hooks/InteractiveHostFocus.d.ts.map +1 -0
- package/dist/hooks/InteractiveHostFocus.test.d.ts +5 -0
- package/dist/hooks/InteractiveHostFocus.test.d.ts.map +1 -0
- package/dist/hooks/index.d.ts +1 -0
- package/dist/hooks/index.d.ts.map +1 -1
- package/dist/index.d.ts +9 -4
- package/dist/index.d.ts.map +1 -1
- package/dist/interfaces/headerText.interface.d.ts +3 -3
- package/dist/interfaces/headerText.interface.d.ts.map +1 -1
- package/dist/package.json +16 -28
- package/dist/widgets/index.d.ts +3 -0
- package/dist/widgets/index.d.ts.map +1 -0
- package/dist/widgets/processLauncher/ProcessLauncher.d.ts +21 -0
- package/dist/widgets/processLauncher/ProcessLauncher.d.ts.map +1 -0
- package/dist/widgets/processLauncher/ProcessLauncher.test.d.ts +5 -0
- package/dist/widgets/processLauncher/ProcessLauncher.test.d.ts.map +1 -0
- package/dist/widgets/processLauncher/index.d.ts +4 -0
- package/dist/widgets/processLauncher/index.d.ts.map +1 -0
- package/dist/widgets/processLauncher/processLauncher.interfaces.d.ts +45 -0
- package/dist/widgets/processLauncher/processLauncher.interfaces.d.ts.map +1 -0
- package/package.json +16 -28
- package/readme.md +0 -36
|
@@ -17,8 +17,8 @@ const libraryThemes = exports.libraryThemes = {
|
|
|
17
17
|
"map": "index.min.css.map"
|
|
18
18
|
},
|
|
19
19
|
"versioned": {
|
|
20
|
-
"css": "index.min.3.
|
|
21
|
-
"map": "index.min.3.
|
|
20
|
+
"css": "index.min.3.18.0.css",
|
|
21
|
+
"map": "index.min.3.18.0.css.map"
|
|
22
22
|
}
|
|
23
23
|
},
|
|
24
24
|
"cba": {
|
|
@@ -32,8 +32,8 @@ const libraryThemes = exports.libraryThemes = {
|
|
|
32
32
|
"map": "cba.min.css.map"
|
|
33
33
|
},
|
|
34
34
|
"versioned": {
|
|
35
|
-
"css": "cba.min.3.
|
|
36
|
-
"map": "cba.min.3.
|
|
35
|
+
"css": "cba.min.3.18.0.css",
|
|
36
|
+
"map": "cba.min.3.18.0.css.map"
|
|
37
37
|
}
|
|
38
38
|
},
|
|
39
39
|
"creditSavvy": {
|
|
@@ -47,8 +47,8 @@ const libraryThemes = exports.libraryThemes = {
|
|
|
47
47
|
"map": "creditSavvy.min.css.map"
|
|
48
48
|
},
|
|
49
49
|
"versioned": {
|
|
50
|
-
"css": "creditSavvy.min.3.
|
|
51
|
-
"map": "creditSavvy.min.3.
|
|
50
|
+
"css": "creditSavvy.min.3.18.0.css",
|
|
51
|
+
"map": "creditSavvy.min.3.18.0.css.map"
|
|
52
52
|
}
|
|
53
53
|
},
|
|
54
54
|
"doshii": {
|
|
@@ -62,8 +62,8 @@ const libraryThemes = exports.libraryThemes = {
|
|
|
62
62
|
"map": "doshii.min.css.map"
|
|
63
63
|
},
|
|
64
64
|
"versioned": {
|
|
65
|
-
"css": "doshii.min.3.
|
|
66
|
-
"map": "doshii.min.3.
|
|
65
|
+
"css": "doshii.min.3.18.0.css",
|
|
66
|
+
"map": "doshii.min.3.18.0.css.map"
|
|
67
67
|
}
|
|
68
68
|
},
|
|
69
69
|
"homeIn": {
|
|
@@ -77,8 +77,8 @@ const libraryThemes = exports.libraryThemes = {
|
|
|
77
77
|
"map": "homeIn.min.css.map"
|
|
78
78
|
},
|
|
79
79
|
"versioned": {
|
|
80
|
-
"css": "homeIn.min.3.
|
|
81
|
-
"map": "homeIn.min.3.
|
|
80
|
+
"css": "homeIn.min.3.18.0.css",
|
|
81
|
+
"map": "homeIn.min.3.18.0.css.map"
|
|
82
82
|
}
|
|
83
83
|
},
|
|
84
84
|
"x15Core": {
|
|
@@ -92,8 +92,8 @@ const libraryThemes = exports.libraryThemes = {
|
|
|
92
92
|
"map": "x15Core.min.css.map"
|
|
93
93
|
},
|
|
94
94
|
"versioned": {
|
|
95
|
-
"css": "x15Core.min.3.
|
|
96
|
-
"map": "x15Core.min.3.
|
|
95
|
+
"css": "x15Core.min.3.18.0.css",
|
|
96
|
+
"map": "x15Core.min.3.18.0.css.map"
|
|
97
97
|
}
|
|
98
98
|
}
|
|
99
99
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"libraryThemes.js","names":["libraryThemes","exports","_default","default"],"sources":["../../../src/autoGenerated/libraryThemes.ts"],"sourcesContent":["/* eslint-disable */\nexport const libraryThemes = {\n \"base\": {\n \"buildPath\": \"styles\",\n \"dev\": {\n \"css\": \"index.css\",\n \"map\": \"index.css.map\"\n },\n \"min\": {\n \"css\": \"index.min.css\",\n \"map\": \"index.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"index.min.3.
|
|
1
|
+
{"version":3,"file":"libraryThemes.js","names":["libraryThemes","exports","_default","default"],"sources":["../../../src/autoGenerated/libraryThemes.ts"],"sourcesContent":["/* eslint-disable */\nexport const libraryThemes = {\n \"base\": {\n \"buildPath\": \"styles\",\n \"dev\": {\n \"css\": \"index.css\",\n \"map\": \"index.css.map\"\n },\n \"min\": {\n \"css\": \"index.min.css\",\n \"map\": \"index.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"index.min.3.18.0.css\",\n \"map\": \"index.min.3.18.0.css.map\"\n }\n },\n \"cba\": {\n \"buildPath\": \"styles/themes/cba\",\n \"dev\": {\n \"css\": \"cba.css\",\n \"map\": \"cba.css.map\"\n },\n \"min\": {\n \"css\": \"cba.min.css\",\n \"map\": \"cba.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"cba.min.3.18.0.css\",\n \"map\": \"cba.min.3.18.0.css.map\"\n }\n },\n \"creditSavvy\": {\n \"buildPath\": \"styles/themes/creditSavvy\",\n \"dev\": {\n \"css\": \"creditSavvy.css\",\n \"map\": \"creditSavvy.css.map\"\n },\n \"min\": {\n \"css\": \"creditSavvy.min.css\",\n \"map\": \"creditSavvy.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"creditSavvy.min.3.18.0.css\",\n \"map\": \"creditSavvy.min.3.18.0.css.map\"\n }\n },\n \"doshii\": {\n \"buildPath\": \"styles/themes/doshii\",\n \"dev\": {\n \"css\": \"doshii.css\",\n \"map\": \"doshii.css.map\"\n },\n \"min\": {\n \"css\": \"doshii.min.css\",\n \"map\": \"doshii.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"doshii.min.3.18.0.css\",\n \"map\": \"doshii.min.3.18.0.css.map\"\n }\n },\n \"homeIn\": {\n \"buildPath\": \"styles/themes/homeIn\",\n \"dev\": {\n \"css\": \"homeIn.css\",\n \"map\": \"homeIn.css.map\"\n },\n \"min\": {\n \"css\": \"homeIn.min.css\",\n \"map\": \"homeIn.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"homeIn.min.3.18.0.css\",\n \"map\": \"homeIn.min.3.18.0.css.map\"\n }\n },\n \"x15Core\": {\n \"buildPath\": \"styles/themes/x15Core\",\n \"dev\": {\n \"css\": \"x15Core.css\",\n \"map\": \"x15Core.css.map\"\n },\n \"min\": {\n \"css\": \"x15Core.min.css\",\n \"map\": \"x15Core.min.css.map\"\n },\n \"versioned\": {\n \"css\": \"x15Core.min.3.18.0.css\",\n \"map\": \"x15Core.min.3.18.0.css.map\"\n }\n }\n}; export default libraryThemes;"],"mappings":";;;;;;AAAA;AACO,MAAMA,aAAa,GAAAC,OAAA,CAAAD,aAAA,GAAG;EAC3B,MAAM,EAAE;IACN,WAAW,EAAE,QAAQ;IACrB,KAAK,EAAE;MACL,KAAK,EAAE,WAAW;MAClB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,eAAe;MACtB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,sBAAsB;MAC7B,KAAK,EAAE;IACT;EACF,CAAC;EACD,KAAK,EAAE;IACL,WAAW,EAAE,mBAAmB;IAChC,KAAK,EAAE;MACL,KAAK,EAAE,SAAS;MAChB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,aAAa;MACpB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,oBAAoB;MAC3B,KAAK,EAAE;IACT;EACF,CAAC;EACD,aAAa,EAAE;IACb,WAAW,EAAE,2BAA2B;IACxC,KAAK,EAAE;MACL,KAAK,EAAE,iBAAiB;MACxB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,qBAAqB;MAC5B,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,4BAA4B;MACnC,KAAK,EAAE;IACT;EACF,CAAC;EACD,QAAQ,EAAE;IACR,WAAW,EAAE,sBAAsB;IACnC,KAAK,EAAE;MACL,KAAK,EAAE,YAAY;MACnB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,gBAAgB;MACvB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,uBAAuB;MAC9B,KAAK,EAAE;IACT;EACF,CAAC;EACD,QAAQ,EAAE;IACR,WAAW,EAAE,sBAAsB;IACnC,KAAK,EAAE;MACL,KAAK,EAAE,YAAY;MACnB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,gBAAgB;MACvB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,uBAAuB;MAC9B,KAAK,EAAE;IACT;EACF,CAAC;EACD,SAAS,EAAE;IACT,WAAW,EAAE,uBAAuB;IACpC,KAAK,EAAE;MACL,KAAK,EAAE,aAAa;MACpB,KAAK,EAAE;IACT,CAAC;IACD,KAAK,EAAE;MACL,KAAK,EAAE,iBAAiB;MACxB,KAAK,EAAE;IACT,CAAC;IACD,WAAW,EAAE;MACX,KAAK,EAAE,wBAAwB;MAC/B,KAAK,EAAE;IACT;EACF;AACF,CAAC;AAAC,IAAAE,QAAA,GAAAD,OAAA,CAAAE,OAAA,GAAgBH,aAAa","ignoreList":[]}
|
|
@@ -10,8 +10,8 @@
|
|
|
10
10
|
"map": "index.min.css.map"
|
|
11
11
|
},
|
|
12
12
|
"versioned": {
|
|
13
|
-
"css": "base.min.3.
|
|
14
|
-
"map": "base.min.3.
|
|
13
|
+
"css": "base.min.3.18.0.css",
|
|
14
|
+
"map": "base.min.3.18.0.css.map"
|
|
15
15
|
}
|
|
16
16
|
},
|
|
17
17
|
"cba": {
|
|
@@ -25,8 +25,8 @@
|
|
|
25
25
|
"map": "cba.min.css.map"
|
|
26
26
|
},
|
|
27
27
|
"versioned": {
|
|
28
|
-
"css": "cba.min.3.
|
|
29
|
-
"map": "cba.min.3.
|
|
28
|
+
"css": "cba.min.3.18.0.css",
|
|
29
|
+
"map": "cba.min.3.18.0.css.map"
|
|
30
30
|
}
|
|
31
31
|
},
|
|
32
32
|
"creditSavvy": {
|
|
@@ -40,8 +40,8 @@
|
|
|
40
40
|
"map": "creditSavvy.min.css.map"
|
|
41
41
|
},
|
|
42
42
|
"versioned": {
|
|
43
|
-
"css": "creditSavvy.min.3.
|
|
44
|
-
"map": "creditSavvy.min.3.
|
|
43
|
+
"css": "creditSavvy.min.3.18.0.css",
|
|
44
|
+
"map": "creditSavvy.min.3.18.0.css.map"
|
|
45
45
|
}
|
|
46
46
|
},
|
|
47
47
|
"doshii": {
|
|
@@ -55,8 +55,8 @@
|
|
|
55
55
|
"map": "doshii.min.css.map"
|
|
56
56
|
},
|
|
57
57
|
"versioned": {
|
|
58
|
-
"css": "doshii.min.3.
|
|
59
|
-
"map": "doshii.min.3.
|
|
58
|
+
"css": "doshii.min.3.18.0.css",
|
|
59
|
+
"map": "doshii.min.3.18.0.css.map"
|
|
60
60
|
}
|
|
61
61
|
},
|
|
62
62
|
"homeIn": {
|
|
@@ -70,8 +70,8 @@
|
|
|
70
70
|
"map": "homeIn.min.css.map"
|
|
71
71
|
},
|
|
72
72
|
"versioned": {
|
|
73
|
-
"css": "homeIn.min.3.
|
|
74
|
-
"map": "homeIn.min.3.
|
|
73
|
+
"css": "homeIn.min.3.18.0.css",
|
|
74
|
+
"map": "homeIn.min.3.18.0.css.map"
|
|
75
75
|
}
|
|
76
76
|
},
|
|
77
77
|
"x15Core": {
|
|
@@ -85,8 +85,8 @@
|
|
|
85
85
|
"map": "x15Core.min.css.map"
|
|
86
86
|
},
|
|
87
87
|
"versioned": {
|
|
88
|
-
"css": "x15Core.min.3.
|
|
89
|
-
"map": "x15Core.min.3.
|
|
88
|
+
"css": "x15Core.min.3.18.0.css",
|
|
89
|
+
"map": "x15Core.min.3.18.0.css.map"
|
|
90
90
|
}
|
|
91
91
|
}
|
|
92
92
|
}
|
|
@@ -9,9 +9,8 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
9
9
|
exports.default = exports.Accordion = void 0;
|
|
10
10
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
11
11
|
var _react = _interopRequireWildcard(require("react"));
|
|
12
|
-
var _SvgIcon = require("@x15ventures/x15-ui-library-icons/svgIcon/SvgIcon");
|
|
13
12
|
var _iconDefinitions = require("@x15ventures/x15-ui-library-icons/iconDefinitions");
|
|
14
|
-
var
|
|
13
|
+
var _iconHelpers = require("../../../helpers/iconHelpers");
|
|
15
14
|
var _InertAttribute = require("../../../hooks/InertAttribute");
|
|
16
15
|
require("./accordion.css");
|
|
17
16
|
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
@@ -82,26 +81,11 @@ const Accordion = ({
|
|
|
82
81
|
const headerCssClass = `accordionHeader ${customSectionHeader || isFixed ? 'accordionHeader_custom' : ''} ${innerBorders ? 'accordionHeader_innerBorders' : ''}`;
|
|
83
82
|
const controlCssClass = `accordionControl ${customCssClass ? `${customCssClass}_accordionControl` : ''} ${headerButtonCssClass || ''}`;
|
|
84
83
|
const contentCssClass = `accordionContent ${customCssClass ? `${customCssClass}_accordionContent` : ''}`;
|
|
85
|
-
const
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
}
|
|
91
|
-
return /*#__PURE__*/_react.default.createElement(_SvgIcon.SvgIcon, {
|
|
92
|
-
svgDefinition: _iconDefinitions.chevronUp
|
|
93
|
-
});
|
|
94
|
-
};
|
|
95
|
-
const CloseIcon = () => {
|
|
96
|
-
if (closeIcon) {
|
|
97
|
-
return /*#__PURE__*/_react.default.createElement(_Icon.Icon, {
|
|
98
|
-
icon: closeIcon
|
|
99
|
-
});
|
|
100
|
-
}
|
|
101
|
-
return /*#__PURE__*/_react.default.createElement(_SvgIcon.SvgIcon, {
|
|
102
|
-
svgDefinition: _iconDefinitions.chevronDown
|
|
103
|
-
});
|
|
104
|
-
};
|
|
84
|
+
const toggleIcon = panelIsOpen ? (0, _iconHelpers.renderIcon)(openIcon, {
|
|
85
|
+
fallback: _iconDefinitions.chevronUp
|
|
86
|
+
}) : (0, _iconHelpers.renderIcon)(closeIcon, {
|
|
87
|
+
fallback: _iconDefinitions.chevronDown
|
|
88
|
+
});
|
|
105
89
|
return /*#__PURE__*/_react.default.createElement("section", {
|
|
106
90
|
className: wrapperCssClass,
|
|
107
91
|
style: alignmentStyle
|
|
@@ -122,7 +106,7 @@ const Accordion = ({
|
|
|
122
106
|
className: "sr-only"
|
|
123
107
|
}, "Open and close accordion"), headerButtonCustomLabel || /*#__PURE__*/_react.default.createElement("span", {
|
|
124
108
|
className: "labelText"
|
|
125
|
-
}, heading),
|
|
109
|
+
}, heading), toggleIcon))), /*#__PURE__*/_react.default.createElement("section", (0, _extends2.default)({
|
|
126
110
|
ref: accordionContentSection,
|
|
127
111
|
className: contentCssClass,
|
|
128
112
|
id: contentId,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Accordion.js","names":["_interopRequireDefault","require","Object","defineProperty","exports","value","default","Accordion","_extends2","_react","_interopRequireWildcard","_SvgIcon","_iconDefinitions","_Icon","_InertAttribute","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","has","get","set","hasOwnProperty","call","getOwnPropertyDescriptor","id","heading","children","footer","openIcon","closeIcon","isOpen","isAnimated","isFixed","innerBorders","outerBorders","hasShadow","onChange","customCssClass","restrictHeight","headerButtonCustomLabel","headerButtonCssClass","paddingStyle","horizontalAlignments","panelIsOpen","setPanelIsOpen","useState","accordionControl","useRef","accordionContentSection","useInertAttribute","panelId","Date","now","contentId","controlId","customSectionHeader","TogglePanelOpenState","newState","heightCssClass","justifyContentMap","left","center","right","alignmentStyle","header","content","wrapperCssClass","headerCssClass","controlCssClass","contentCssClass","OpenIcon","createElement","Icon","icon","SvgIcon","svgDefinition","chevronUp","CloseIcon","chevronDown","className","style","tabIndex","ref","onClick","type","undefined","_default"],"sources":["../../../../../src/components/design/accordion/Accordion.tsx"],"sourcesContent":["'use client';\n\n/* eslint-disable jsxA11y/no-noninteractive-tabindex, no-unused-vars */\n\nimport React, { ReactNode, useRef, useState } from 'react';\nimport { SvgIcon } from '@x15ventures/x15-ui-library-icons/svgIcon/SvgIcon';\nimport { chevronUp, chevronDown } from '@x15ventures/x15-ui-library-icons/iconDefinitions';\n\nimport { Icon } from '../icons/basicIcon/Icon';\nimport { useInertAttribute } from '../../../hooks/InertAttribute';\n\nimport './accordion.scss';\n\nexport interface AccordionProps {\n id: string;\n isOpen?: boolean;\n isAnimated?: boolean;\n isFixed?: boolean;\n innerBorders?: boolean;\n outerBorders?: boolean;\n hasShadow?: boolean;\n onChange?: (args: boolean) => void;\n openIcon?: ReactNode;\n closeIcon?: ReactNode;\n heading: ReactNode;\n footer?: ReactNode;\n customCssClass?: string;\n restrictHeight?: 'xs' | 's' | 'm' | 'l' | 'xl' | 'auto';\n headerButtonCustomLabel?: ReactNode;\n headerButtonCssClass?: string;\n paddingStyle?: 'compact' | 'regular' | 'spacious';\n children?: ReactNode;\n horizontalAlignments?: {\n header?: 'left' | 'center' | 'right';\n content?: 'left' | 'center' | 'right';\n footer?: 'left' | 'center' | 'right';\n };\n}\n\nexport const Accordion: React.FC<AccordionProps> = (\n {\n id,\n heading,\n children,\n footer,\n openIcon = null,\n closeIcon = null,\n isOpen = true,\n isAnimated = true,\n isFixed = false,\n innerBorders = true,\n outerBorders = true,\n hasShadow = false,\n onChange,\n customCssClass,\n restrictHeight,\n headerButtonCustomLabel,\n headerButtonCssClass,\n paddingStyle = 'regular',\n horizontalAlignments,\n }\n) => {\n const [panelIsOpen, setPanelIsOpen] = useState(isOpen || isFixed);\n const accordionControl = useRef(null);\n const accordionContentSection = useRef<HTMLElement>(null);\n\n useInertAttribute(accordionContentSection, !panelIsOpen && !isFixed);\n\n const panelId = id || `accordion_${ Date.now() }`;\n const contentId = `${ panelId }_content`;\n const controlId = `${ panelId }_control`;\n\n const customSectionHeader = typeof heading !== 'string' && !headerButtonCustomLabel;\n\n const TogglePanelOpenState = () => {\n const newState = !panelIsOpen;\n setPanelIsOpen(newState);\n if (onChange) {\n onChange(newState);\n }\n };\n\n const heightCssClass = restrictHeight ? `accordion_${ restrictHeight }` : '';\n\n // map horizontal alignment props to justify-content values for fixed accordions\n const justifyContentMap = {\n left: 'flex-start',\n center: 'center',\n right: 'flex-end',\n };\n\n const alignmentStyle = {\n ...(isFixed && horizontalAlignments?.header\n ? { '--header-align-h': justifyContentMap[horizontalAlignments.header] }\n : { '--header-align-h': horizontalAlignments?.header || 'left' }),\n '--content-align-h': horizontalAlignments?.content || 'left',\n '--footer-align-h': horizontalAlignments?.footer || 'left',\n };\n\n const wrapperCssClass = `\n accordion\n ${ customCssClass || '' }\n ${ heightCssClass }\n ${ panelIsOpen || isFixed ? 'open' : 'closed' }\n ${ isFixed ? 'fixed' : '' }\n ${ isAnimated ? 'animated' : '' }\n ${ outerBorders ? 'outerBorders' : '' }\n ${ paddingStyle ? `padding_${ paddingStyle }` : '' }\n ${ hasShadow ? 'hasShadow' : '' }\n `;\n\n const headerCssClass = `accordionHeader ${ customSectionHeader || isFixed ? 'accordionHeader_custom' : '' } ${ innerBorders ? 'accordionHeader_innerBorders' : '' }`;\n\n const controlCssClass = `accordionControl ${ customCssClass ? `${ customCssClass }_accordionControl` : '' } ${ headerButtonCssClass || '' }`;\n\n const contentCssClass = `accordionContent ${ customCssClass ? `${ customCssClass }_accordionContent` : '' }`;\n\n const OpenIcon = () => {\n if (openIcon) {\n return <Icon icon={ openIcon } />;\n }\n return <SvgIcon svgDefinition={ chevronUp } />;\n };\n\n const CloseIcon = () => {\n if (closeIcon) {\n return <Icon icon={ closeIcon } />;\n }\n return <SvgIcon svgDefinition={ chevronDown } />;\n };\n\n return (\n <section className={ wrapperCssClass } style={ alignmentStyle as React.CSSProperties }>\n <header className={ headerCssClass }>\n {\n customSectionHeader\n ? <div tabIndex={ 0 } className=\"accordionCustomHeading\">{ heading }</div>\n : (\n <h3>\n { isFixed\n ? heading\n : (\n <button\n ref={ accordionControl }\n aria-controls={ contentId }\n aria-expanded={ panelIsOpen }\n id={ controlId }\n onClick={ TogglePanelOpenState }\n type=\"button\"\n className={ controlCssClass }\n >\n <span className=\"sr-only\">Open and close accordion</span>\n {\n headerButtonCustomLabel || <span className=\"labelText\">{ heading }</span>\n }\n {\n panelIsOpen\n ? <OpenIcon />\n : <CloseIcon />\n }\n </button>\n ) }\n </h3>\n )\n }\n </header>\n\n <section\n ref={ accordionContentSection }\n className={ contentCssClass }\n id={ contentId }\n aria-labelledby={ controlId }\n { ...(!panelIsOpen && !isFixed ? {\n 'aria-hidden': true\n } : {}) }\n tabIndex={ restrictHeight && (panelIsOpen || isFixed) ? 0 : undefined }\n >\n <span className=\"sr-only\">Start of accordion content</span>\n { children }\n\n { footer\n && (\n <footer>\n { footer }\n </footer>\n ) }\n </section>\n </section>\n );\n};\n\nexport default Accordion;\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"Accordion.js","names":["_interopRequireDefault","require","Object","defineProperty","exports","value","default","Accordion","_extends2","_react","_interopRequireWildcard","_iconDefinitions","_iconHelpers","_InertAttribute","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","has","get","set","hasOwnProperty","call","getOwnPropertyDescriptor","id","heading","children","footer","openIcon","closeIcon","isOpen","isAnimated","isFixed","innerBorders","outerBorders","hasShadow","onChange","customCssClass","restrictHeight","headerButtonCustomLabel","headerButtonCssClass","paddingStyle","horizontalAlignments","panelIsOpen","setPanelIsOpen","useState","accordionControl","useRef","accordionContentSection","useInertAttribute","panelId","Date","now","contentId","controlId","customSectionHeader","TogglePanelOpenState","newState","heightCssClass","justifyContentMap","left","center","right","alignmentStyle","header","content","wrapperCssClass","headerCssClass","controlCssClass","contentCssClass","toggleIcon","renderIcon","fallback","chevronUp","chevronDown","createElement","className","style","tabIndex","ref","onClick","type","undefined","_default"],"sources":["../../../../../src/components/design/accordion/Accordion.tsx"],"sourcesContent":["'use client';\n\n/* eslint-disable jsxA11y/no-noninteractive-tabindex, no-unused-vars */\n\nimport React, { ReactNode, useRef, useState } from 'react';\nimport { chevronUp, chevronDown } from '@x15ventures/x15-ui-library-icons/iconDefinitions';\n\nimport { IconSource, renderIcon } from '../../../helpers/iconHelpers';\nimport { useInertAttribute } from '../../../hooks/InertAttribute';\n\nimport './accordion.scss';\n\nexport interface AccordionProps {\n id: string;\n isOpen?: boolean;\n isAnimated?: boolean;\n isFixed?: boolean;\n innerBorders?: boolean;\n outerBorders?: boolean;\n hasShadow?: boolean;\n onChange?: (args: boolean) => void;\n openIcon?: IconSource;\n closeIcon?: IconSource;\n heading: ReactNode;\n footer?: ReactNode;\n customCssClass?: string;\n restrictHeight?: 'xs' | 's' | 'm' | 'l' | 'xl' | 'auto';\n headerButtonCustomLabel?: ReactNode;\n headerButtonCssClass?: string;\n paddingStyle?: 'compact' | 'regular' | 'spacious';\n children?: ReactNode;\n horizontalAlignments?: {\n header?: 'left' | 'center' | 'right';\n content?: 'left' | 'center' | 'right';\n footer?: 'left' | 'center' | 'right';\n };\n}\n\nexport const Accordion: React.FC<AccordionProps> = (\n {\n id,\n heading,\n children,\n footer,\n openIcon = null,\n closeIcon = null,\n isOpen = true,\n isAnimated = true,\n isFixed = false,\n innerBorders = true,\n outerBorders = true,\n hasShadow = false,\n onChange,\n customCssClass,\n restrictHeight,\n headerButtonCustomLabel,\n headerButtonCssClass,\n paddingStyle = 'regular',\n horizontalAlignments,\n }\n) => {\n const [panelIsOpen, setPanelIsOpen] = useState(isOpen || isFixed);\n const accordionControl = useRef(null);\n const accordionContentSection = useRef<HTMLElement>(null);\n\n useInertAttribute(accordionContentSection, !panelIsOpen && !isFixed);\n\n const panelId = id || `accordion_${ Date.now() }`;\n const contentId = `${ panelId }_content`;\n const controlId = `${ panelId }_control`;\n\n const customSectionHeader = typeof heading !== 'string' && !headerButtonCustomLabel;\n\n const TogglePanelOpenState = () => {\n const newState = !panelIsOpen;\n setPanelIsOpen(newState);\n if (onChange) {\n onChange(newState);\n }\n };\n\n const heightCssClass = restrictHeight ? `accordion_${ restrictHeight }` : '';\n\n // map horizontal alignment props to justify-content values for fixed accordions\n const justifyContentMap = {\n left: 'flex-start',\n center: 'center',\n right: 'flex-end',\n };\n\n const alignmentStyle = {\n ...(isFixed && horizontalAlignments?.header\n ? { '--header-align-h': justifyContentMap[horizontalAlignments.header] }\n : { '--header-align-h': horizontalAlignments?.header || 'left' }),\n '--content-align-h': horizontalAlignments?.content || 'left',\n '--footer-align-h': horizontalAlignments?.footer || 'left',\n };\n\n const wrapperCssClass = `\n accordion\n ${ customCssClass || '' }\n ${ heightCssClass }\n ${ panelIsOpen || isFixed ? 'open' : 'closed' }\n ${ isFixed ? 'fixed' : '' }\n ${ isAnimated ? 'animated' : '' }\n ${ outerBorders ? 'outerBorders' : '' }\n ${ paddingStyle ? `padding_${ paddingStyle }` : '' }\n ${ hasShadow ? 'hasShadow' : '' }\n `;\n\n const headerCssClass = `accordionHeader ${ customSectionHeader || isFixed ? 'accordionHeader_custom' : '' } ${ innerBorders ? 'accordionHeader_innerBorders' : '' }`;\n\n const controlCssClass = `accordionControl ${ customCssClass ? `${ customCssClass }_accordionControl` : '' } ${ headerButtonCssClass || '' }`;\n\n const contentCssClass = `accordionContent ${ customCssClass ? `${ customCssClass }_accordionContent` : '' }`;\n\n const toggleIcon = panelIsOpen\n ? renderIcon(openIcon, { fallback: chevronUp })\n : renderIcon(closeIcon, { fallback: chevronDown });\n\n return (\n <section className={ wrapperCssClass } style={ alignmentStyle as React.CSSProperties }>\n <header className={ headerCssClass }>\n {\n customSectionHeader\n ? <div tabIndex={ 0 } className=\"accordionCustomHeading\">{ heading }</div>\n : (\n <h3>\n { isFixed\n ? heading\n : (\n <button\n ref={ accordionControl }\n aria-controls={ contentId }\n aria-expanded={ panelIsOpen }\n id={ controlId }\n onClick={ TogglePanelOpenState }\n type=\"button\"\n className={ controlCssClass }\n >\n <span className=\"sr-only\">Open and close accordion</span>\n {\n headerButtonCustomLabel || <span className=\"labelText\">{ heading }</span>\n }\n { toggleIcon }\n </button>\n ) }\n </h3>\n )\n }\n </header>\n\n <section\n ref={ accordionContentSection }\n className={ contentCssClass }\n id={ contentId }\n aria-labelledby={ controlId }\n { ...(!panelIsOpen && !isFixed ? {\n 'aria-hidden': true\n } : {}) }\n tabIndex={ restrictHeight && (panelIsOpen || isFixed) ? 0 : undefined }\n >\n <span className=\"sr-only\">Start of accordion content</span>\n { children }\n\n { footer\n && (\n <footer>\n { footer }\n </footer>\n ) }\n </section>\n </section>\n );\n};\n\nexport default Accordion;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
});
|
|
7
7
|
exports.default = exports.PageBanner = exports.Banner = exports.Alert = void 0;
|
|
8
8
|
var _react = _interopRequireWildcard(require("react"));
|
|
9
|
-
var
|
|
9
|
+
var _iconHelpers = require("../../../../helpers/iconHelpers");
|
|
10
10
|
var _SimpleButton = require("../../../form/buttons/SimpleButton");
|
|
11
11
|
require("./pageBanners.css");
|
|
12
12
|
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
|
|
@@ -67,9 +67,7 @@ const PageBanner = ({
|
|
|
67
67
|
}
|
|
68
68
|
}), /*#__PURE__*/_react.default.createElement("div", {
|
|
69
69
|
className: "pageBannerMainIcon"
|
|
70
|
-
}, /*#__PURE__*/_react.default.createElement(
|
|
71
|
-
icon: icon
|
|
72
|
-
})), /*#__PURE__*/_react.default.createElement("div", {
|
|
70
|
+
}, (0, _iconHelpers.renderIcon)(icon)), /*#__PURE__*/_react.default.createElement("div", {
|
|
73
71
|
className: "pageBannerContent"
|
|
74
72
|
}, children));
|
|
75
73
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PageBanner.js","names":["Object","defineProperty","exports","value","default","PageBanner","Banner","Alert","_react","_interopRequireWildcard","require","
|
|
1
|
+
{"version":3,"file":"PageBanner.js","names":["Object","defineProperty","exports","value","default","PageBanner","Banner","Alert","_react","_interopRequireWildcard","require","_iconHelpers","_SimpleButton","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","has","get","set","hasOwnProperty","call","getOwnPropertyDescriptor","animation","reDisplayOnClose","autoHide","autoHideDelay","children","displayMode","icon","id","position","type","disableClose","widthVariant","backgroundFill","StorageKey","StorageValue","setStorageValue","useState","useEffect","localStorage","getItem","UserPreferences","JSON","parse","shouldDisplay","isVisible","setVisibility","autoHideCssClass","cssClass","handleBannerClose","setItem","stringify","createElement","className","SimpleButton","label","onClickHandler","hideLabel","leftIcon","renderIcon","_default"],"sources":["../../../../../../src/components/design/banners/pageBanner/PageBanner.tsx"],"sourcesContent":["'use client';\n\nimport React, { useState, ReactNode, ReactElement, useEffect } from 'react';\nimport { IconSource, renderIcon } from '../../../../helpers/iconHelpers';\nimport { SimpleButton } from '../../../form/buttons/SimpleButton';\n\nimport './pageBanners.scss';\n\nexport interface PageBannerProps {\n id: string;\n children: ReactNode | ReactElement;\n animation?: 'slideInLeft' | 'slideInRight' | 'growOnHover' | 'none';\n reDisplayOnClose?: boolean;\n autoHide?: boolean;\n autoHideDelay?: 1 | 3 | 5 | 10;\n displayMode?: 'fixed' | 'inline';\n icon?: IconSource;\n position?: 'topRight' | 'topCentre' | 'bottomRight' | 'bottomLeft'; // Only applicable with fixed display\n type?: 'alert' | 'info' | 'warn' | 'error' | 'success';\n disableClose?: boolean;\n widthVariant?: 'sm' | 'md' | 'lg';\n backgroundFill?: 'primary' | 'secondary';\n}\n\nexport const PageBanner: React.FC<PageBannerProps> = ({\n animation = 'none',\n reDisplayOnClose = false,\n autoHide = false,\n autoHideDelay = 10,\n children,\n displayMode = 'fixed',\n icon = 'info',\n id = 'pageBanner',\n position = 'topCentre', \n type = 'info',\n disableClose = false,\n widthVariant = 'lg',\n backgroundFill = 'primary',\n}) => {\n const StorageKey = `pageBanner_${ id }`;\n\n const [StorageValue, setStorageValue] = useState<string | null>(null);\n\n useEffect(() => {\n setStorageValue(localStorage.getItem(StorageKey));\n }, [StorageKey]);\n\n const UserPreferences = StorageValue && JSON.parse(StorageValue);\n\n const { shouldDisplay } = UserPreferences || { shouldDisplay: true };\n\n const [isVisible, setVisibility] = useState<boolean>(shouldDisplay);\n\n const autoHideCssClass = autoHide ? `autoHide_${ autoHideDelay }` : 'noAutoHide';\n\n const cssClass = `\n pageBanner \n ${ type } \n ${ position } \n ${ displayMode } \n ${ autoHideCssClass }_${ animation }\n width_${ widthVariant }\n backgroundFill_${ backgroundFill }\n `;\n\n const handleBannerClose = () => {\n setVisibility(false);\n localStorage.setItem(StorageKey, JSON.stringify({ shouldDisplay: reDisplayOnClose }));\n };\n\n if (isVisible) {\n return (\n <aside className={ cssClass }>\n { !disableClose && (\n <SimpleButton\n cssClass=\"closeBannerButton\"\n label=\"Close page banner\"\n id={ `${ id }_CloseBannerButton` }\n onClickHandler={ handleBannerClose }\n hideLabel\n leftIcon={ { icon: 'close' } }\n />\n ) }\n\n <div className=\"pageBannerMainIcon\">\n { renderIcon(icon) }\n </div>\n\n <div className=\"pageBannerContent\">\n { children }\n </div>\n </aside>\n );\n }\n\n return null;\n};\n\nexport default PageBanner;\n\nexport { PageBanner as Banner };\nexport { PageBanner as Alert };"],"mappings":";AAAA,YAAY;;AAACA,MAAA,CAAAC,cAAA,CAAAC,OAAA;EAAAC,KAAA;AAAA;AAAAD,OAAA,CAAAE,OAAA,GAAAF,OAAA,CAAAG,UAAA,GAAAH,OAAA,CAAAI,MAAA,GAAAJ,OAAA,CAAAK,KAAA;AAEb,IAAAC,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AACA,IAAAE,aAAA,GAAAF,OAAA;AAEAA,OAAA;AAA4B,SAAAD,wBAAAI,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAN,uBAAA,YAAAA,CAAAI,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAlB,OAAA,EAAAS,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAI,GAAA,CAAAV,CAAA,UAAAM,CAAA,CAAAK,GAAA,CAAAX,CAAA,GAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAY,cAAA,CAAAC,IAAA,CAAAd,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAnB,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAA4B,wBAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAI,GAAA,IAAAJ,CAAA,CAAAK,GAAA,IAAAN,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAkBrB,MAAMT,UAAqC,GAAGA,CAAC;EACpDwB,SAAS,GAAG,MAAM;EAClBC,gBAAgB,GAAG,KAAK;EACxBC,QAAQ,GAAG,KAAK;EAChBC,aAAa,GAAG,EAAE;EAClBC,QAAQ;EACRC,WAAW,GAAG,OAAO;EACrBC,IAAI,GAAG,MAAM;EACbC,EAAE,GAAG,YAAY;EACjBC,QAAQ,GAAG,WAAW;EACtBC,IAAI,GAAG,MAAM;EACbC,YAAY,GAAG,KAAK;EACpBC,YAAY,GAAG,IAAI;EACnBC,cAAc,GAAG;AACnB,CAAC,KAAK;EACJ,MAAMC,UAAU,GAAG,cAAeN,EAAE,EAAG;EAEvC,MAAM,CAACO,YAAY,EAAEC,eAAe,CAAC,GAAG,IAAAC,eAAQ,EAAgB,IAAI,CAAC;EAErE,IAAAC,gBAAS,EAAC,MAAM;IACdF,eAAe,CAACG,YAAY,CAACC,OAAO,CAACN,UAAU,CAAC,CAAC;EACnD,CAAC,EAAE,CAACA,UAAU,CAAC,CAAC;EAEhB,MAAMO,eAAe,GAAGN,YAAY,IAAIO,IAAI,CAACC,KAAK,CAACR,YAAY,CAAC;EAEhE,MAAM;IAAES;EAAc,CAAC,GAAGH,eAAe,IAAI;IAAEG,aAAa,EAAE;EAAK,CAAC;EAEpE,MAAM,CAACC,SAAS,EAAEC,aAAa,CAAC,GAAG,IAAAT,eAAQ,EAAUO,aAAa,CAAC;EAEnE,MAAMG,gBAAgB,GAAGxB,QAAQ,GAAG,YAAaC,aAAa,EAAG,GAAG,YAAY;EAEhF,MAAMwB,QAAQ,GAAG;AACnB;AACA,MAAOlB,IAAI;AACX,MAAOD,QAAQ;AACf,MAAOH,WAAW;AAClB,MAAOqB,gBAAgB,IAAM1B,SAAS;AACtC,YAAaW,YAAY;AACzB,qBAAsBC,cAAc;AACpC,GAAG;EAED,MAAMgB,iBAAiB,GAAGA,CAAA,KAAM;IAC9BH,aAAa,CAAC,KAAK,CAAC;IACpBP,YAAY,CAACW,OAAO,CAAChB,UAAU,EAAEQ,IAAI,CAACS,SAAS,CAAC;MAAEP,aAAa,EAAEtB;IAAiB,CAAC,CAAC,CAAC;EACvF,CAAC;EAED,IAAIuB,SAAS,EAAE;IACb,oBACE7C,MAAA,CAAAJ,OAAA,CAAAwD,aAAA;MAAOC,SAAS,EAAGL;IAAU,GACzB,CAACjB,YAAY,iBACb/B,MAAA,CAAAJ,OAAA,CAAAwD,aAAA,CAAChD,aAAA,CAAAkD,YAAY;MACXN,QAAQ,EAAC,mBAAmB;MAC5BO,KAAK,EAAC,mBAAmB;MACzB3B,EAAE,EAAG,GAAIA,EAAE,oBAAuB;MAClC4B,cAAc,EAAGP,iBAAmB;MACpCQ,SAAS;MACTC,QAAQ,EAAG;QAAE/B,IAAI,EAAE;MAAQ;IAAG,CAC/B,CACF,eAED3B,MAAA,CAAAJ,OAAA,CAAAwD,aAAA;MAAKC,SAAS,EAAC;IAAoB,GAC/B,IAAAM,uBAAU,EAAChC,IAAI,CACd,CAAC,eAEN3B,MAAA,CAAAJ,OAAA,CAAAwD,aAAA;MAAKC,SAAS,EAAC;IAAmB,GAC9B5B,QACC,CACA,CAAC;EAEZ;EAEA,OAAO,IAAI;AACb,CAAC;AAAC/B,OAAA,CAAAK,KAAA,GAAAL,OAAA,CAAAI,MAAA,GAAAJ,OAAA,CAAAG,UAAA,GAAAA,UAAA;AAAA,IAAA+D,QAAA,GAAAlE,OAAA,CAAAE,OAAA,GAEaC,UAAU","ignoreList":[]}
|
|
@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
});
|
|
8
8
|
exports.CardContentLine = void 0;
|
|
9
9
|
var _react = _interopRequireDefault(require("react"));
|
|
10
|
-
var
|
|
10
|
+
var _iconHelpers = require("../../../../helpers/iconHelpers");
|
|
11
11
|
var _LogoLink = require("../../logos/LogoLink");
|
|
12
12
|
var _OwnerDetailsPopup = require("../../ownerDetailsPopup/OwnerDetailsPopup");
|
|
13
13
|
var _StatusLightsBar = require("../../statusIndicators/statusLightsBar/StatusLightsBar");
|
|
@@ -35,7 +35,7 @@ const CardContentLine = ({
|
|
|
35
35
|
type: "button",
|
|
36
36
|
className: "cardContentLineButton",
|
|
37
37
|
onClick: handleLineClick
|
|
38
|
-
},
|
|
38
|
+
}, (0, _iconHelpers.renderIcon)(icon), logo && /*#__PURE__*/_react.default.createElement(_LogoLink.LogoLink, logo), graphic && /*#__PURE__*/_react.default.createElement("img", {
|
|
39
39
|
src: graphic.imageUrl,
|
|
40
40
|
className: "logoImage",
|
|
41
41
|
alt: `${graphic.label}`
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CardContentLine.js","names":["_interopRequireDefault","require","Object","defineProperty","exports","value","CardContentLine","_react","
|
|
1
|
+
{"version":3,"file":"CardContentLine.js","names":["_interopRequireDefault","require","Object","defineProperty","exports","value","CardContentLine","_react","_iconHelpers","_LogoLink","_OwnerDetailsPopup","_StatusLightsBar","id","icon","logo","graphic","owner","title","hideTitle","onLineClick","children","statuses","handleLineClick","default","createElement","className","type","onClick","renderIcon","LogoLink","src","imageUrl","alt","label","StatusLightsBar","OwnerDetailsPopup"],"sources":["../../../../../../src/components/design/card/cardContent/CardContentLine.tsx"],"sourcesContent":["'use client';\n\nimport React, {\n ReactElement,\n ReactNode\n} from 'react';\nimport { IconSource, renderIcon } from '../../../../helpers/iconHelpers';\nimport { LogoLink, LogoLinkProps } from '../../logos/LogoLink';\nimport { OwnerDetailsPopup } from '../../ownerDetailsPopup/OwnerDetailsPopup';\nimport { GenericFunction } from '../../../../interfaces';\nimport { StatusIndicatorsInterface } from '../../statusIndicators/statusIndicators.interface';\nimport { StatusLightsBar } from '../../statusIndicators/statusLightsBar/StatusLightsBar';\n\nimport './cardContentLine.scss';\n\nexport interface CardContentLineProps {\n id: string;\n icon?: IconSource;\n logo?: LogoLinkProps;\n graphic?: {\n imageUrl: string;\n label: string;\n },\n owner?: {\n name: string;\n email: string;\n phone: string;\n },\n title: string;\n hideTitle?: boolean;\n onLineClick: GenericFunction;\n children: ReactNode | ReactElement;\n statuses?: StatusIndicatorsInterface;\n}\n\nexport const CardContentLine: React.FC<CardContentLineProps> = (\n {\n id,\n icon,\n logo,\n graphic,\n owner,\n title,\n hideTitle = false,\n onLineClick = () => {},\n children,\n statuses\n }\n) => {\n const handleLineClick = () => {\n onLineClick(id);\n };\n\n return (\n <div id={ id } className=\"cardContentLine\" title={ title }>\n <button type=\"button\" className=\"cardContentLineButton\" onClick={ handleLineClick }>\n { renderIcon(icon) }\n\n { logo && <LogoLink { ...logo } /> }\n\n { graphic && <img src={ graphic.imageUrl } className=\"logoImage\" alt={ `${ graphic.label }` } /> }\n\n <span className={ hideTitle ? 'sr-only' : 'cardContentLineTitle' }>{ title }</span>\n </button>\n\n <div className=\"cardContentLineContent\">\n {\n children\n }\n </div>\n\n {\n statuses && <StatusLightsBar { ...statuses } />\n }\n\n {\n owner && <OwnerDetailsPopup owner={ owner } />\n }\n </div>\n );\n};\n"],"mappings":";AAAA,YAAY;;AAAC,IAAAA,sBAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,cAAA,CAAAC,OAAA;EAAAC,KAAA;AAAA;AAAAD,OAAA,CAAAE,eAAA;AAEb,IAAAC,MAAA,GAAAP,sBAAA,CAAAC,OAAA;AAIA,IAAAO,YAAA,GAAAP,OAAA;AACA,IAAAQ,SAAA,GAAAR,OAAA;AACA,IAAAS,kBAAA,GAAAT,OAAA;AAGA,IAAAU,gBAAA,GAAAV,OAAA;AAEAA,OAAA;AAsBO,MAAMK,eAA+C,GAAGA,CAC7D;EACEM,EAAE;EACFC,IAAI;EACJC,IAAI;EACJC,OAAO;EACPC,KAAK;EACLC,KAAK;EACLC,SAAS,GAAG,KAAK;EACjBC,WAAW,GAAGA,CAAA,KAAM,CAAC,CAAC;EACtBC,QAAQ;EACRC;AACF,CAAC,KACE;EACH,MAAMC,eAAe,GAAGA,CAAA,KAAM;IAC5BH,WAAW,CAACP,EAAE,CAAC;EACjB,CAAC;EAED,oBACEL,MAAA,CAAAgB,OAAA,CAAAC,aAAA;IAAKZ,EAAE,EAAGA,EAAI;IAACa,SAAS,EAAC,iBAAiB;IAACR,KAAK,EAAGA;EAAO,gBACxDV,MAAA,CAAAgB,OAAA,CAAAC,aAAA;IAAQE,IAAI,EAAC,QAAQ;IAACD,SAAS,EAAC,uBAAuB;IAACE,OAAO,EAAGL;EAAiB,GAC/E,IAAAM,uBAAU,EAACf,IAAI,CAAC,EAEhBC,IAAI,iBAAIP,MAAA,CAAAgB,OAAA,CAAAC,aAAA,CAACf,SAAA,CAAAoB,QAAQ,EAAMf,IAAQ,CAAC,EAEhCC,OAAO,iBAAIR,MAAA,CAAAgB,OAAA,CAAAC,aAAA;IAAKM,GAAG,EAAGf,OAAO,CAACgB,QAAU;IAACN,SAAS,EAAC,WAAW;IAACO,GAAG,EAAG,GAAIjB,OAAO,CAACkB,KAAK;EAAK,CAAE,CAAC,eAEhG1B,MAAA,CAAAgB,OAAA,CAAAC,aAAA;IAAMC,SAAS,EAAGP,SAAS,GAAG,SAAS,GAAG;EAAwB,GAAGD,KAAa,CAC5E,CAAC,eAETV,MAAA,CAAAgB,OAAA,CAAAC,aAAA;IAAKC,SAAS,EAAC;EAAwB,GAEnCL,QAEC,CAAC,EAGJC,QAAQ,iBAAId,MAAA,CAAAgB,OAAA,CAAAC,aAAA,CAACb,gBAAA,CAAAuB,eAAe,EAAMb,QAAY,CAAC,EAI/CL,KAAK,iBAAIT,MAAA,CAAAgB,OAAA,CAAAC,aAAA,CAACd,kBAAA,CAAAyB,iBAAiB;IAACnB,KAAK,EAAGA;EAAO,CAAE,CAE5C,CAAC;AAEV,CAAC;AAACZ,OAAA,CAAAE,eAAA,GAAAA,eAAA","ignoreList":[]}
|
|
@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
7
7
|
});
|
|
8
8
|
exports.CardHeaderItem = void 0;
|
|
9
9
|
var _react = _interopRequireDefault(require("react"));
|
|
10
|
-
var
|
|
10
|
+
var _iconHelpers = require("../../../../helpers/iconHelpers");
|
|
11
11
|
var _LogoLink = require("../../logos/LogoLink");
|
|
12
12
|
var _OwnerDetailsPopup = require("../../ownerDetailsPopup/OwnerDetailsPopup");
|
|
13
13
|
var _SimpleButton = require("../../../form/buttons/SimpleButton");
|
|
@@ -27,7 +27,7 @@ const CardHeaderItem = ({
|
|
|
27
27
|
}, url ? /*#__PURE__*/_react.default.createElement("a", {
|
|
28
28
|
className: "cardHeaderItemLink",
|
|
29
29
|
href: url
|
|
30
|
-
},
|
|
30
|
+
}, (0, _iconHelpers.renderIcon)(icon), logo && /*#__PURE__*/_react.default.createElement(_LogoLink.LogoLink, logo), graphic && /*#__PURE__*/_react.default.createElement("img", {
|
|
31
31
|
src: graphic.imageUrl,
|
|
32
32
|
className: "logoImage",
|
|
33
33
|
alt: `${graphic.label}`
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CardHeaderItem.js","names":["_interopRequireDefault","require","Object","defineProperty","exports","value","CardHeaderItem","_react","
|
|
1
|
+
{"version":3,"file":"CardHeaderItem.js","names":["_interopRequireDefault","require","Object","defineProperty","exports","value","CardHeaderItem","_react","_iconHelpers","_LogoLink","_OwnerDetailsPopup","_SimpleButton","icon","logo","graphic","owner","title","content","hideTitle","url","actionButton","default","createElement","className","href","renderIcon","LogoLink","src","imageUrl","alt","label","OwnerDetailsPopup","SimpleButton"],"sources":["../../../../../../src/components/design/card/cardHeader/CardHeaderItem.tsx"],"sourcesContent":["'use client';\n\nimport React, { ReactElement, ReactNode } from 'react';\nimport { IconSource, renderIcon } from '../../../../helpers/iconHelpers';\nimport { LogoLink, LogoLinkProps } from '../../logos/LogoLink';\nimport { OwnerDetailsPopup } from '../../ownerDetailsPopup/OwnerDetailsPopup';\nimport { ButtonProps } from '../../../form/buttons/button.interface';\nimport { SimpleButton } from '../../../form/buttons/SimpleButton';\n\nexport interface CardHeaderItemProps {\n icon?: IconSource;\n logo?: LogoLinkProps;\n graphic?: {\n imageUrl: string;\n label: string;\n },\n owner?: {\n name: string;\n email?: string;\n phone?: string;\n },\n title?: string;\n content?: ReactNode | ReactElement;\n hideTitle?: boolean;\n url?: string;\n actionButton?: ButtonProps;\n}\n\nexport const CardHeaderItem: React.FC<CardHeaderItemProps> = (\n {\n icon,\n logo,\n graphic,\n owner,\n title,\n content,\n hideTitle = false,\n url,\n actionButton\n }\n) => (\n <div className=\"cardHeaderItem\" title={ title }>\n {\n url\n ? (\n <a className=\"cardHeaderItemLink\" href={ url }>\n { renderIcon(icon) }\n\n { logo && <LogoLink { ...logo } /> }\n\n { graphic && <img src={ graphic.imageUrl } className=\"logoImage\" alt={ `${ graphic.label }` } /> }\n\n <span className={ hideTitle ? 'sr-only' : 'cardHeaderItemTitle' }>{ content || title }</span>\n </a>\n )\n : content\n }\n\n {\n owner && <OwnerDetailsPopup owner={ owner } />\n }\n\n {\n actionButton && <SimpleButton { ...actionButton } />\n }\n </div>\n);\n"],"mappings":";AAAA,YAAY;;AAAC,IAAAA,sBAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,cAAA,CAAAC,OAAA;EAAAC,KAAA;AAAA;AAAAD,OAAA,CAAAE,cAAA;AAEb,IAAAC,MAAA,GAAAP,sBAAA,CAAAC,OAAA;AACA,IAAAO,YAAA,GAAAP,OAAA;AACA,IAAAQ,SAAA,GAAAR,OAAA;AACA,IAAAS,kBAAA,GAAAT,OAAA;AAEA,IAAAU,aAAA,GAAAV,OAAA;AAqBO,MAAMK,cAA6C,GAAGA,CAC3D;EACEM,IAAI;EACJC,IAAI;EACJC,OAAO;EACPC,KAAK;EACLC,KAAK;EACLC,OAAO;EACPC,SAAS,GAAG,KAAK;EACjBC,GAAG;EACHC;AACF,CAAC,kBAEDb,MAAA,CAAAc,OAAA,CAAAC,aAAA;EAAKC,SAAS,EAAC,gBAAgB;EAACP,KAAK,EAAGA;AAAO,GAE3CG,GAAG,gBAECZ,MAAA,CAAAc,OAAA,CAAAC,aAAA;EAAGC,SAAS,EAAC,oBAAoB;EAACC,IAAI,EAAGL;AAAK,GAC1C,IAAAM,uBAAU,EAACb,IAAI,CAAC,EAEhBC,IAAI,iBAAIN,MAAA,CAAAc,OAAA,CAAAC,aAAA,CAACb,SAAA,CAAAiB,QAAQ,EAAMb,IAAQ,CAAC,EAEhCC,OAAO,iBAAIP,MAAA,CAAAc,OAAA,CAAAC,aAAA;EAAKK,GAAG,EAAGb,OAAO,CAACc,QAAU;EAACL,SAAS,EAAC,WAAW;EAACM,GAAG,EAAG,GAAIf,OAAO,CAACgB,KAAK;AAAK,CAAE,CAAC,eAEhGvB,MAAA,CAAAc,OAAA,CAAAC,aAAA;EAAMC,SAAS,EAAGL,SAAS,GAAG,SAAS,GAAG;AAAuB,GAAGD,OAAO,IAAID,KAAa,CAC3F,CAAC,GAEJC,OAAO,EAIXF,KAAK,iBAAIR,MAAA,CAAAc,OAAA,CAAAC,aAAA,CAACZ,kBAAA,CAAAqB,iBAAiB;EAAChB,KAAK,EAAGA;AAAO,CAAE,CAAC,EAI9CK,YAAY,iBAAIb,MAAA,CAAAc,OAAA,CAAAC,aAAA,CAACX,aAAA,CAAAqB,YAAY,EAAMZ,YAAgB,CAElD,CACN;AAAChB,OAAA,CAAAE,cAAA,GAAAA,cAAA","ignoreList":[]}
|
|
@@ -70,7 +70,9 @@ const Dialog = ({
|
|
|
70
70
|
} else {
|
|
71
71
|
HandleClose();
|
|
72
72
|
}
|
|
73
|
-
|
|
73
|
+
// customCssClasses is intentionally excluded: it isn't read here, and including it (as a
|
|
74
|
+
// fresh object reference on every parent render) re-ran this effect and stole focus on each keystroke.
|
|
75
|
+
}, [createOverlay, open, isOpen, HandleOpen, HandleClose, dialogHeaderElement]);
|
|
74
76
|
const DialogCloseButton = () => /*#__PURE__*/_react.default.createElement("button", {
|
|
75
77
|
ref: dialogCloseButton,
|
|
76
78
|
className: "dialogClose",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Dialog.js","names":["Object","defineProperty","exports","value","Dialog","_react","_interopRequireWildcard","require","_index","_SvgIcon","_tooltip","_DialogOverlay","_FocusTrap","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","getOwnPropertyDescriptor","id","size","position","animation","scrollBehaviour","onClose","open","overlay","header","footer","children","screenReaderInstruction","customCssClasses","showFocusOutline","isOpen","setIsOpen","useState","dialogElement","useRef","dialogHeaderElement","TOGGLE_TEXT","dialogCloseButton","createOverlay","removeOverlay","useDialogOverlay","useFocusTrap","HandleClose","dialogCssClass","useMemo","dialog","useCallback","HandleOpen","dialogOverlay","showOverlay","useEffect","current","focus","DialogCloseButton","createElement","ref","className","title","type","onClick","SvgIcon","svgDefinition","xmarkLarge","role","tabIndex","EllipsisTooltip","lineClamp","tooltipProps","customCssClass","content"],"sources":["../../../../../src/components/design/dialog/Dialog.tsx"],"sourcesContent":["/* eslint-disable jsxA11y/no-noninteractive-tabindex */\n'use client';\n\nimport React, { ReactNode, useCallback, useEffect, useRef, useState, useMemo } from 'react';\nimport { xmarkLarge } from '@x15ventures/x15-ui-library-icons/iconDefinitions/index';\nimport { SvgIcon } from '@x15ventures/x15-ui-library-icons/svgIcon/SvgIcon';\nimport { EllipsisTooltip } from '../tooltip';\nimport { GenericFunction } from '../../../interfaces';\nimport { useDialogOverlay } from '../../../hooks/DialogOverlay';\nimport { useFocusTrap } from '../../../hooks/FocusTrap';\n\nimport './dialog.scss';\n\nexport interface DialogInterface {\n id: string;\n size?: 'xs' | 's' | 'm' | 'l' | 'xl' | 'dynamic';\n position?: 'left' | 'right' | 'top' | 'bottom' | 'center' | 'topleft' | 'topright' | 'bottomleft' | 'bottomright';\n animation?: 'none' | 'grow' | 'reveal';\n scrollBehaviour?: 'contentOnly' | 'contentAndFooter' | 'all';\n onClose: GenericFunction;\n open?: boolean;\n overlay?: {\n parentNode?: HTMLElement;\n customCssClass?: string;\n };\n header: string | ReactNode;\n footer?: string | ReactNode;\n children: ReactNode;\n screenReaderInstruction?: string;\n showFocusOutline?: boolean;\n customCssClasses?: {\n dialog?: string;\n content?: string;\n header?: string;\n footer?: string;\n };\n}\n\nexport const Dialog: React.FC<DialogInterface> = ({\n id,\n size = 'm',\n position = 'center',\n animation = 'none',\n scrollBehaviour = 'contentOnly',\n onClose = () => {},\n open = false,\n overlay,\n header,\n footer,\n children,\n screenReaderInstruction = `The following content is in a dialog. \n You can press the Tab key to navigate through the elements, and press Escape to close the dialog.`,\n customCssClasses,\n showFocusOutline = false,\n}) => {\n const [isOpen, setIsOpen] = useState<boolean>(open);\n const dialogElement = useRef<HTMLDivElement>(null);\n const dialogHeaderElement = useRef<HTMLDivElement>(null);\n\n const TOGGLE_TEXT = 'Open and close dialog';\n const dialogCloseButton = useRef(null);\n\n const { createOverlay, removeOverlay } = useDialogOverlay(overlay || {});\n useFocusTrap(dialogElement, () => HandleClose());\n\n const dialogCssClass = useMemo(() => {\n return `dialog \n ${ isOpen || open ? 'isOpen' : '' }\n dialogSize_${ size }\n dialogPosition_${ position }\n dialogAnimation_${ animation }\n dialogScrollBehaviour_${ scrollBehaviour }\n ${ size === 'dynamic' ? 'dialogSize_dynamic' : '' }\n ${ customCssClasses?.dialog || '' }\n ${ showFocusOutline ? 'showFocusOutline' : '' }`;\n }, [open, isOpen, size, position, animation, scrollBehaviour, customCssClasses, showFocusOutline]);\n\n const HandleClose = useCallback(() => {\n setIsOpen(false);\n removeOverlay();\n onClose();\n }, [onClose, removeOverlay]);\n\n const HandleOpen = useCallback(() => {\n const dialogOverlay = createOverlay();\n dialogOverlay.showOverlay();\n }, [createOverlay]);\n\n useEffect(() => {\n if (open || isOpen) {\n if (dialogHeaderElement.current) {\n dialogHeaderElement.current.focus();\n }\n HandleOpen();\n } else {\n HandleClose();\n }\n }, [customCssClasses, createOverlay, open, isOpen, HandleOpen, HandleClose, dialogHeaderElement]);\n\n const DialogCloseButton: React.FC = () => (\n <button\n ref={ dialogCloseButton }\n className=\"dialogClose\"\n title={ TOGGLE_TEXT }\n type=\"button\"\n onClick={ () => HandleClose() }\n >\n <SvgIcon svgDefinition={ xmarkLarge } />\n <span className=\"sr-only\">Close dialog</span>\n </button>\n );\n\n return (\n <div\n className={ dialogCssClass }\n role=\"dialog\"\n aria-labelledby={ `dialogHeader_${ id }` }\n tabIndex={ 0 }\n aria-describedby={ `dialogSRInstruction_${ id }` }\n aria-modal=\"true\"\n ref={ dialogElement }\n >\n <div className=\"dialogFullScroller\">\n <div\n ref={ dialogHeaderElement }\n id={ `dialogHeader_${ id }` }\n className={ `dialogHeader ${ customCssClasses?.header || '' }` }\n tabIndex={ 0 }\n >\n <span id={ `dialogSRInstruction_${ id }` } className=\"sr-only\">\n { screenReaderInstruction }\n </span>\n <div className=\"dialogHeaderTextWrapper\">\n <EllipsisTooltip \n lineClamp={ 2 } \n tooltipProps={ { \n customCssClass: 'shiftDown large dialogEllipsisTooltip'\n } }\n >\n { typeof header === 'string' ? <span className=\"dialogHeaderText\">{ header }</span> : header }\n </EllipsisTooltip>\n </div>\n <DialogCloseButton />\n </div>\n\n <div className=\"dialogContentAndFooterScroller\">\n <section className={ `dialogContent ${ customCssClasses?.content || '' }` } tabIndex={ 0 }>\n { children }\n </section>\n\n {\n footer && (\n <div className={ `dialogFooter ${ customCssClasses?.footer || '' }` } tabIndex={ 0 }>\n { typeof footer === 'string' ? <span className=\"dialogFooterText\">{ footer }</span> : footer }\n </div>\n )\n }\n </div>\n </div>\n </div>\n );\n};\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"Dialog.js","names":["Object","defineProperty","exports","value","Dialog","_react","_interopRequireWildcard","require","_index","_SvgIcon","_tooltip","_DialogOverlay","_FocusTrap","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","getOwnPropertyDescriptor","id","size","position","animation","scrollBehaviour","onClose","open","overlay","header","footer","children","screenReaderInstruction","customCssClasses","showFocusOutline","isOpen","setIsOpen","useState","dialogElement","useRef","dialogHeaderElement","TOGGLE_TEXT","dialogCloseButton","createOverlay","removeOverlay","useDialogOverlay","useFocusTrap","HandleClose","dialogCssClass","useMemo","dialog","useCallback","HandleOpen","dialogOverlay","showOverlay","useEffect","current","focus","DialogCloseButton","createElement","ref","className","title","type","onClick","SvgIcon","svgDefinition","xmarkLarge","role","tabIndex","EllipsisTooltip","lineClamp","tooltipProps","customCssClass","content"],"sources":["../../../../../src/components/design/dialog/Dialog.tsx"],"sourcesContent":["/* eslint-disable jsxA11y/no-noninteractive-tabindex */\n'use client';\n\nimport React, { ReactNode, useCallback, useEffect, useRef, useState, useMemo } from 'react';\nimport { xmarkLarge } from '@x15ventures/x15-ui-library-icons/iconDefinitions/index';\nimport { SvgIcon } from '@x15ventures/x15-ui-library-icons/svgIcon/SvgIcon';\nimport { EllipsisTooltip } from '../tooltip';\nimport { GenericFunction } from '../../../interfaces';\nimport { useDialogOverlay } from '../../../hooks/DialogOverlay';\nimport { useFocusTrap } from '../../../hooks/FocusTrap';\n\nimport './dialog.scss';\n\nexport interface DialogInterface {\n id: string;\n size?: 'xs' | 's' | 'm' | 'l' | 'xl' | 'dynamic';\n position?: 'left' | 'right' | 'top' | 'bottom' | 'center' | 'topleft' | 'topright' | 'bottomleft' | 'bottomright';\n animation?: 'none' | 'grow' | 'reveal';\n scrollBehaviour?: 'contentOnly' | 'contentAndFooter' | 'all';\n onClose: GenericFunction;\n open?: boolean;\n overlay?: {\n parentNode?: HTMLElement;\n customCssClass?: string;\n };\n header: string | ReactNode;\n footer?: string | ReactNode;\n children: ReactNode;\n screenReaderInstruction?: string;\n showFocusOutline?: boolean;\n customCssClasses?: {\n dialog?: string;\n content?: string;\n header?: string;\n footer?: string;\n };\n}\n\nexport const Dialog: React.FC<DialogInterface> = ({\n id,\n size = 'm',\n position = 'center',\n animation = 'none',\n scrollBehaviour = 'contentOnly',\n onClose = () => {},\n open = false,\n overlay,\n header,\n footer,\n children,\n screenReaderInstruction = `The following content is in a dialog. \n You can press the Tab key to navigate through the elements, and press Escape to close the dialog.`,\n customCssClasses,\n showFocusOutline = false,\n}) => {\n const [isOpen, setIsOpen] = useState<boolean>(open);\n const dialogElement = useRef<HTMLDivElement>(null);\n const dialogHeaderElement = useRef<HTMLDivElement>(null);\n\n const TOGGLE_TEXT = 'Open and close dialog';\n const dialogCloseButton = useRef(null);\n\n const { createOverlay, removeOverlay } = useDialogOverlay(overlay || {});\n useFocusTrap(dialogElement, () => HandleClose());\n\n const dialogCssClass = useMemo(() => {\n return `dialog \n ${ isOpen || open ? 'isOpen' : '' }\n dialogSize_${ size }\n dialogPosition_${ position }\n dialogAnimation_${ animation }\n dialogScrollBehaviour_${ scrollBehaviour }\n ${ size === 'dynamic' ? 'dialogSize_dynamic' : '' }\n ${ customCssClasses?.dialog || '' }\n ${ showFocusOutline ? 'showFocusOutline' : '' }`;\n }, [open, isOpen, size, position, animation, scrollBehaviour, customCssClasses, showFocusOutline]);\n\n const HandleClose = useCallback(() => {\n setIsOpen(false);\n removeOverlay();\n onClose();\n }, [onClose, removeOverlay]);\n\n const HandleOpen = useCallback(() => {\n const dialogOverlay = createOverlay();\n dialogOverlay.showOverlay();\n }, [createOverlay]);\n\n useEffect(() => {\n if (open || isOpen) {\n if (dialogHeaderElement.current) {\n dialogHeaderElement.current.focus();\n }\n HandleOpen();\n } else {\n HandleClose();\n }\n // customCssClasses is intentionally excluded: it isn't read here, and including it (as a\n // fresh object reference on every parent render) re-ran this effect and stole focus on each keystroke.\n }, [createOverlay, open, isOpen, HandleOpen, HandleClose, dialogHeaderElement]);\n\n const DialogCloseButton: React.FC = () => (\n <button\n ref={ dialogCloseButton }\n className=\"dialogClose\"\n title={ TOGGLE_TEXT }\n type=\"button\"\n onClick={ () => HandleClose() }\n >\n <SvgIcon svgDefinition={ xmarkLarge } />\n <span className=\"sr-only\">Close dialog</span>\n </button>\n );\n\n return (\n <div\n className={ dialogCssClass }\n role=\"dialog\"\n aria-labelledby={ `dialogHeader_${ id }` }\n tabIndex={ 0 }\n aria-describedby={ `dialogSRInstruction_${ id }` }\n aria-modal=\"true\"\n ref={ dialogElement }\n >\n <div className=\"dialogFullScroller\">\n <div\n ref={ dialogHeaderElement }\n id={ `dialogHeader_${ id }` }\n className={ `dialogHeader ${ customCssClasses?.header || '' }` }\n tabIndex={ 0 }\n >\n <span id={ `dialogSRInstruction_${ id }` } className=\"sr-only\">\n { screenReaderInstruction }\n </span>\n <div className=\"dialogHeaderTextWrapper\">\n <EllipsisTooltip \n lineClamp={ 2 } \n tooltipProps={ { \n customCssClass: 'shiftDown large dialogEllipsisTooltip'\n } }\n >\n { typeof header === 'string' ? <span className=\"dialogHeaderText\">{ header }</span> : header }\n </EllipsisTooltip>\n </div>\n <DialogCloseButton />\n </div>\n\n <div className=\"dialogContentAndFooterScroller\">\n <section className={ `dialogContent ${ customCssClasses?.content || '' }` } tabIndex={ 0 }>\n { children }\n </section>\n\n {\n footer && (\n <div className={ `dialogFooter ${ customCssClasses?.footer || '' }` } tabIndex={ 0 }>\n { typeof footer === 'string' ? <span className=\"dialogFooterText\">{ footer }</span> : footer }\n </div>\n )\n }\n </div>\n </div>\n </div>\n );\n};\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -129,6 +129,11 @@
|
|
|
129
129
|
justify-content: flex-start;
|
|
130
130
|
min-height: var(--dialogFooterHeight, 50px);
|
|
131
131
|
}
|
|
132
|
+
.dialog .dialogFooter .actionButtons {
|
|
133
|
+
display: flex;
|
|
134
|
+
width: 100%;
|
|
135
|
+
justify-content: space-between;
|
|
136
|
+
}
|
|
132
137
|
.dialog .dialogFullScroller {
|
|
133
138
|
flex: 1;
|
|
134
139
|
box-sizing: border-box;
|
|
@@ -8,7 +8,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
8
8
|
exports.HeaderBar = void 0;
|
|
9
9
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
10
10
|
var _react = _interopRequireDefault(require("react"));
|
|
11
|
-
var
|
|
11
|
+
var _iconHelpers = require("../../../helpers/iconHelpers");
|
|
12
12
|
var _NotificationIcon = require("../icons/notificationIcon/NotificationIcon");
|
|
13
13
|
var _SimpleButton = require("../../form/buttons/SimpleButton");
|
|
14
14
|
var _NotificationsButton = require("../../form/buttons/notificationsButton/NotificationsButton");
|
|
@@ -30,7 +30,7 @@ const HeaderBar = ({
|
|
|
30
30
|
const Heading = `h${headingLevel}`;
|
|
31
31
|
return /*#__PURE__*/_react.default.createElement("header", {
|
|
32
32
|
className: headerCssClass
|
|
33
|
-
},
|
|
33
|
+
}, (0, _iconHelpers.renderIcon)(leftIcon), text && /*#__PURE__*/_react.default.createElement(Heading, null, text), children, buttons && /*#__PURE__*/_react.default.createElement("div", {
|
|
34
34
|
className: "headerButtons"
|
|
35
35
|
}, buttons.map(button => {
|
|
36
36
|
if (button.kind === 'notifications') {
|
|
@@ -41,7 +41,7 @@ const HeaderBar = ({
|
|
|
41
41
|
return /*#__PURE__*/_react.default.createElement(_SimpleButton.SimpleButton, (0, _extends2.default)({
|
|
42
42
|
key: button.id
|
|
43
43
|
}, button));
|
|
44
|
-
})),
|
|
44
|
+
})), (0, _iconHelpers.renderIcon)(rightIcon), notificationIcon && /*#__PURE__*/_react.default.createElement(_NotificationIcon.NotificationIcon, notificationIcon));
|
|
45
45
|
};
|
|
46
46
|
exports.HeaderBar = HeaderBar;
|
|
47
47
|
//# sourceMappingURL=HeaderBar.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HeaderBar.js","names":["_interopRequireDefault","require","Object","defineProperty","exports","value","HeaderBar","_extends2","_react","
|
|
1
|
+
{"version":3,"file":"HeaderBar.js","names":["_interopRequireDefault","require","Object","defineProperty","exports","value","HeaderBar","_extends2","_react","_iconHelpers","_NotificationIcon","_SimpleButton","_NotificationsButton","text","leftIcon","rightIcon","buttons","notificationIcon","headingLevel","children","headerCssClass","Heading","default","createElement","className","renderIcon","map","button","kind","NotificationsButton","key","id","SimpleButton","NotificationIcon"],"sources":["../../../../../src/components/design/headerBar/HeaderBar.tsx"],"sourcesContent":["'use client';\n\nimport React from 'react';\nimport { HeaderTextInterface } from '../../../interfaces/headerText.interface';\nimport { renderIcon } from '../../../helpers/iconHelpers';\nimport { NotificationIcon } from '../icons/notificationIcon/NotificationIcon';\nimport { SimpleButton } from '../../form/buttons/SimpleButton';\nimport { NotificationsButton } from '../../form/buttons/notificationsButton/NotificationsButton';\nimport { ButtonProps } from '../../form/buttons/button.interface';\n\nimport './headerBar.scss';\n\ntype HeadingLevel = NonNullable<HeaderTextInterface['headingLevel']>;\ntype HeadingTag = `h${ HeadingLevel }`;\n\nexport const HeaderBar: React.FC<HeaderTextInterface> = (\n {\n text,\n leftIcon,\n rightIcon,\n buttons,\n notificationIcon,\n headingLevel = 2,\n children\n }\n) => {\n const headerCssClass = `headerBar \n ${ leftIcon ? 'withLeftIcon' : '' }\n ${ rightIcon ? 'withRightIcon' : '' }\n ${ notificationIcon ? 'withNotification' : '' }\n `;\n const Heading: HeadingTag = `h${ headingLevel }`;\n\n return (\n <header className={ headerCssClass }>\n { renderIcon(leftIcon) }\n\n {\n text && <Heading>{ text }</Heading>\n }\n\n { children }\n\n {\n buttons\n && (\n <div className=\"headerButtons\">\n {\n buttons.map((button) => {\n if (button.kind === 'notifications') {\n return <NotificationsButton key={ button.id } { ...button } />;\n }\n return <SimpleButton key={ button.id } { ...(button as ButtonProps) } />;\n })\n }\n </div>\n )\n }\n\n { renderIcon(rightIcon) }\n\n {\n notificationIcon && <NotificationIcon { ...notificationIcon } />\n }\n </header>\n );\n};\n"],"mappings":";AAAA,YAAY;;AAAC,IAAAA,sBAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,cAAA,CAAAC,OAAA;EAAAC,KAAA;AAAA;AAAAD,OAAA,CAAAE,SAAA;AAAA,IAAAC,SAAA,GAAAP,sBAAA,CAAAC,OAAA;AAEb,IAAAO,MAAA,GAAAR,sBAAA,CAAAC,OAAA;AAEA,IAAAQ,YAAA,GAAAR,OAAA;AACA,IAAAS,iBAAA,GAAAT,OAAA;AACA,IAAAU,aAAA,GAAAV,OAAA;AACA,IAAAW,oBAAA,GAAAX,OAAA;AAGAA,OAAA;AAKO,MAAMK,SAAwC,GAAGA,CACtD;EACEO,IAAI;EACJC,QAAQ;EACRC,SAAS;EACTC,OAAO;EACPC,gBAAgB;EAChBC,YAAY,GAAG,CAAC;EAChBC;AACF,CAAC,KACE;EACH,MAAMC,cAAc,GAAG;AACzB,MAAON,QAAQ,GAAG,cAAc,GAAG,EAAE;AACrC,MAAOC,SAAS,GAAG,eAAe,GAAG,EAAE;AACvC,MAAOE,gBAAgB,GAAG,kBAAkB,GAAG,EAAE;AACjD,KAAK;EACH,MAAMI,OAAmB,GAAG,IAAKH,YAAY,EAAG;EAEhD,oBACEV,MAAA,CAAAc,OAAA,CAAAC,aAAA;IAAQC,SAAS,EAAGJ;EAAgB,GAChC,IAAAK,uBAAU,EAACX,QAAQ,CAAC,EAGpBD,IAAI,iBAAIL,MAAA,CAAAc,OAAA,CAAAC,aAAA,CAACF,OAAO,QAAGR,IAAe,CAAC,EAGnCM,QAAQ,EAGRH,OAAO,iBAELR,MAAA,CAAAc,OAAA,CAAAC,aAAA;IAAKC,SAAS,EAAC;EAAe,GAE1BR,OAAO,CAACU,GAAG,CAAEC,MAAM,IAAK;IACtB,IAAIA,MAAM,CAACC,IAAI,KAAK,eAAe,EAAE;MACnC,oBAAOpB,MAAA,CAAAc,OAAA,CAAAC,aAAA,CAACX,oBAAA,CAAAiB,mBAAmB,MAAAtB,SAAA,CAAAe,OAAA;QAACQ,GAAG,EAAGH,MAAM,CAACI;MAAI,GAAMJ,MAAM,CAAI,CAAC;IAChE;IACA,oBAAOnB,MAAA,CAAAc,OAAA,CAAAC,aAAA,CAACZ,aAAA,CAAAqB,YAAY,MAAAzB,SAAA,CAAAe,OAAA;MAACQ,GAAG,EAAGH,MAAM,CAACI;IAAI,GAAOJ,MAAM,CAAoB,CAAC;EAC1E,CAAC,CAEA,CACN,EAGD,IAAAF,uBAAU,EAACV,SAAS,CAAC,EAGrBE,gBAAgB,iBAAIT,MAAA,CAAAc,OAAA,CAAAC,aAAA,CAACb,iBAAA,CAAAuB,gBAAgB,EAAMhB,gBAAoB,CAE3D,CAAC;AAEb,CAAC;AAACb,OAAA,CAAAE,SAAA,GAAAA,SAAA","ignoreList":[]}
|
|
@@ -6,9 +6,8 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
value: true
|
|
7
7
|
});
|
|
8
8
|
exports.default = exports.NotificationIcon = void 0;
|
|
9
|
-
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
10
9
|
var _react = _interopRequireDefault(require("react"));
|
|
11
|
-
var
|
|
10
|
+
var _iconHelpers = require("../../../../helpers/iconHelpers");
|
|
12
11
|
require("./notificationIcon.css");
|
|
13
12
|
const NotificationIcon = ({
|
|
14
13
|
icon,
|
|
@@ -19,9 +18,9 @@ const NotificationIcon = ({
|
|
|
19
18
|
return /*#__PURE__*/_react.default.createElement("span", {
|
|
20
19
|
title: hoverText,
|
|
21
20
|
className: `notificationIcon ${customCssClass || ''}`
|
|
22
|
-
},
|
|
23
|
-
customCssClass
|
|
24
|
-
})
|
|
21
|
+
}, (0, _iconHelpers.renderIcon)(icon, {
|
|
22
|
+
customCssClass
|
|
23
|
+
}), text);
|
|
25
24
|
};
|
|
26
25
|
exports.NotificationIcon = NotificationIcon;
|
|
27
26
|
var _default = exports.default = NotificationIcon;
|