@protonradio/proton-ui 0.11.16 → 0.11.18-beta.1
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/assets/svg/icons.svg.cjs.js.map +1 -1
- package/dist/assets/svg/icons.svg.es.js.map +1 -1
- package/dist/components/ActionMenu/ActionMenu.cjs.js.map +1 -1
- package/dist/components/ActionMenu/ActionMenu.es.js.map +1 -1
- package/dist/components/Badge/Badge.cjs.js.map +1 -1
- package/dist/components/Badge/Badge.es.js.map +1 -1
- package/dist/components/Banner/Banner.cjs.js.map +1 -1
- package/dist/components/Banner/Banner.es.js.map +1 -1
- package/dist/components/Button/Button.cjs.js.map +1 -1
- package/dist/components/Button/Button.es.js.map +1 -1
- package/dist/components/ButtonGroup/ButtonGroup.cjs.js.map +1 -1
- package/dist/components/ButtonGroup/ButtonGroup.es.js.map +1 -1
- package/dist/components/ButtonWithSelect/ButtonWithSelect.cjs.js +1 -1
- package/dist/components/ButtonWithSelect/ButtonWithSelect.cjs.js.map +1 -1
- package/dist/components/ButtonWithSelect/ButtonWithSelect.es.js +26 -26
- package/dist/components/ButtonWithSelect/ButtonWithSelect.es.js.map +1 -1
- package/dist/components/DataTable/DataTable.cjs.js.map +1 -1
- package/dist/components/DataTable/DataTable.es.js.map +1 -1
- package/dist/components/Dialog/Dialog.cjs.js.map +1 -1
- package/dist/components/Dialog/Dialog.es.js.map +1 -1
- package/dist/components/Elevation/Elevation.cjs.js.map +1 -1
- package/dist/components/Elevation/Elevation.es.js.map +1 -1
- package/dist/components/Icon/Icon.cjs.js.map +1 -1
- package/dist/components/Icon/Icon.es.js.map +1 -1
- package/dist/components/ImageBackground/ImageBackground.cjs.js.map +1 -1
- package/dist/components/ImageBackground/ImageBackground.es.js.map +1 -1
- package/dist/components/Input/BaseInput/Input.cjs.js.map +1 -1
- package/dist/components/Input/BaseInput/Input.es.js.map +1 -1
- package/dist/components/Input/CopyInput/CopyInput.cjs.js +1 -1
- package/dist/components/Input/CopyInput/CopyInput.cjs.js.map +1 -1
- package/dist/components/Input/CopyInput/CopyInput.es.js +9 -9
- package/dist/components/Input/CopyInput/CopyInput.es.js.map +1 -1
- package/dist/components/Input/SearchInput/SearchInput.cjs.js.map +1 -1
- package/dist/components/Input/SearchInput/SearchInput.es.js.map +1 -1
- package/dist/components/Menu/MenuTrigger.cjs.js.map +1 -1
- package/dist/components/Menu/MenuTrigger.es.js.map +1 -1
- package/dist/components/Menu/PopoverMenu.cjs.js +1 -1
- package/dist/components/Menu/PopoverMenu.cjs.js.map +1 -1
- package/dist/components/Menu/PopoverMenu.es.js +32 -28
- package/dist/components/Menu/PopoverMenu.es.js.map +1 -1
- package/dist/components/Modal/Modal.cjs.js.map +1 -1
- package/dist/components/Modal/Modal.es.js.map +1 -1
- package/dist/components/Popover/Popover.cjs.js.map +1 -1
- package/dist/components/Popover/Popover.es.js.map +1 -1
- package/dist/components/ScreenOverlay/ScreenOverlay.cjs.js.map +1 -1
- package/dist/components/ScreenOverlay/ScreenOverlay.es.js.map +1 -1
- package/dist/components/Select/Select.cjs.js.map +1 -1
- package/dist/components/Select/Select.es.js +3 -3
- package/dist/components/Select/Select.es.js.map +1 -1
- package/dist/components/Switch/Switch.cjs.js.map +1 -1
- package/dist/components/Switch/Switch.es.js.map +1 -1
- package/dist/components/Table/Collection/collectionParser.cjs.js.map +1 -1
- package/dist/components/Table/Collection/collectionParser.es.js.map +1 -1
- package/dist/components/Table/Collection/useTableCollection.cjs.js.map +1 -1
- package/dist/components/Table/Collection/useTableCollection.es.js.map +1 -1
- package/dist/components/Table/Table.cjs.js.map +1 -1
- package/dist/components/Table/Table.es.js +5 -5
- package/dist/components/Table/Table.es.js.map +1 -1
- package/dist/components/Text/TextEllipsis/TextEllipsis.cjs.js.map +1 -1
- package/dist/components/Text/TextEllipsis/TextEllipsis.es.js.map +1 -1
- package/dist/components/Text/TextEmphasis/TextEmphasis.cjs.js.map +1 -1
- package/dist/components/Text/TextEmphasis/TextEmphasis.es.js.map +1 -1
- package/dist/components/ThemeProvider.cjs.js.map +1 -1
- package/dist/components/ThemeProvider.es.js +4 -4
- package/dist/components/ThemeProvider.es.js.map +1 -1
- package/dist/components/Tombstone/Tombstone.cjs.js.map +1 -1
- package/dist/components/Tombstone/Tombstone.es.js.map +1 -1
- package/dist/components/Tooltip/Tooltip.cjs.js.map +1 -1
- package/dist/components/Tooltip/Tooltip.es.js.map +1 -1
- package/dist/components/Waveform/Waveform.cjs.js.map +1 -1
- package/dist/components/Waveform/Waveform.es.js.map +1 -1
- package/dist/components/Waveform/WaveformBar.cjs.js.map +1 -1
- package/dist/components/Waveform/WaveformBar.es.js.map +1 -1
- package/dist/design/darkTheme/colors.cjs.js.map +1 -1
- package/dist/design/darkTheme/colors.es.js +3 -3
- package/dist/design/darkTheme/stylesheet.cjs.js.map +1 -1
- package/dist/design/darkTheme/stylesheet.es.js +12 -12
- package/dist/design/darkTheme/stylesheet.es.js.map +1 -1
- package/dist/design/generateStylesheet.cjs.js.map +1 -1
- package/dist/design/generateStylesheet.es.js.map +1 -1
- package/dist/design/lightTheme/colors.cjs.js.map +1 -1
- package/dist/design/lightTheme/colors.es.js +3 -3
- package/dist/design/lightTheme/stylesheet.cjs.js.map +1 -1
- package/dist/design/lightTheme/stylesheet.es.js +12 -12
- package/dist/design/lightTheme/stylesheet.es.js.map +1 -1
- package/dist/hooks/useBreakpoint.cjs.js.map +1 -1
- package/dist/hooks/useBreakpoint.es.js.map +1 -1
- package/dist/hooks/useIsClosing.cjs.js.map +1 -1
- package/dist/hooks/useIsClosing.es.js.map +1 -1
- package/dist/hooks/useLockBodyScroll.cjs.js.map +1 -1
- package/dist/hooks/useLockBodyScroll.es.js.map +1 -1
- package/dist/hooks/usePalette.cjs.js.map +1 -1
- package/dist/hooks/usePalette.es.js.map +1 -1
- package/dist/index.d.ts +38 -38
- package/dist/node_modules/@react-aria/button/dist/useButton.cjs.js +1 -1
- package/dist/node_modules/@react-aria/button/dist/useButton.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/button/dist/useButton.es.js +12 -13
- package/dist/node_modules/@react-aria/button/dist/useButton.es.js.map +1 -1
- package/dist/node_modules/@react-aria/dialog/dist/useDialog.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/dialog/dist/useDialog.es.js.map +1 -1
- package/dist/node_modules/@react-aria/focus/dist/FocusScope.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/focus/dist/FocusScope.es.js +3 -3
- package/dist/node_modules/@react-aria/focus/dist/FocusScope.es.js.map +1 -1
- package/dist/node_modules/@react-aria/form/dist/useFormValidation.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/form/dist/useFormValidation.es.js.map +1 -1
- package/dist/node_modules/@react-aria/i18n/dist/context.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/i18n/dist/context.es.js.map +1 -1
- package/dist/node_modules/@react-aria/i18n/dist/useDefaultLocale.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/i18n/dist/useDefaultLocale.es.js.map +1 -1
- package/dist/node_modules/@react-aria/i18n/dist/utils.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/i18n/dist/utils.es.js.map +1 -1
- package/dist/node_modules/@react-aria/interactions/dist/context.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/interactions/dist/context.es.js.map +1 -1
- package/dist/node_modules/@react-aria/interactions/dist/createEventHandler.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/interactions/dist/createEventHandler.es.js.map +1 -1
- package/dist/node_modules/@react-aria/interactions/dist/focusSafely.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/interactions/dist/focusSafely.es.js.map +1 -1
- package/dist/node_modules/@react-aria/interactions/dist/textSelection.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/interactions/dist/textSelection.es.js.map +1 -1
- package/dist/node_modules/@react-aria/interactions/dist/useFocus.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/interactions/dist/useFocus.es.js.map +1 -1
- package/dist/node_modules/@react-aria/interactions/dist/useFocusVisible.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/interactions/dist/useFocusVisible.es.js.map +1 -1
- package/dist/node_modules/@react-aria/interactions/dist/useFocusWithin.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/interactions/dist/useFocusWithin.es.js.map +1 -1
- package/dist/node_modules/@react-aria/interactions/dist/useFocusable.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/interactions/dist/useFocusable.es.js.map +1 -1
- package/dist/node_modules/@react-aria/interactions/dist/useInteractOutside.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/interactions/dist/useInteractOutside.es.js.map +1 -1
- package/dist/node_modules/@react-aria/interactions/dist/useKeyboard.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/interactions/dist/useKeyboard.es.js.map +1 -1
- package/dist/node_modules/@react-aria/interactions/dist/usePress.cjs.js +2 -2
- package/dist/node_modules/@react-aria/interactions/dist/usePress.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/interactions/dist/usePress.es.js +23 -23
- package/dist/node_modules/@react-aria/interactions/dist/usePress.es.js.map +1 -1
- package/dist/node_modules/@react-aria/interactions/dist/utils.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/interactions/dist/utils.es.js.map +1 -1
- package/dist/node_modules/@react-aria/label/dist/useField.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/label/dist/useField.es.js.map +1 -1
- package/dist/node_modules/@react-aria/label/dist/useLabel.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/label/dist/useLabel.es.js.map +1 -1
- package/dist/node_modules/@react-aria/overlays/dist/Overlay.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/overlays/dist/Overlay.es.js.map +1 -1
- package/dist/node_modules/@react-aria/overlays/dist/ariaHideOutside.cjs.js +1 -1
- package/dist/node_modules/@react-aria/overlays/dist/ariaHideOutside.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/overlays/dist/ariaHideOutside.es.js +18 -18
- package/dist/node_modules/@react-aria/overlays/dist/ariaHideOutside.es.js.map +1 -1
- package/dist/node_modules/@react-aria/overlays/dist/useModalOverlay.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/overlays/dist/useModalOverlay.es.js.map +1 -1
- package/dist/node_modules/@react-aria/overlays/dist/useOverlay.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/overlays/dist/useOverlay.es.js.map +1 -1
- package/dist/node_modules/@react-aria/overlays/dist/usePreventScroll.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/overlays/dist/usePreventScroll.es.js.map +1 -1
- package/dist/node_modules/@react-aria/radio/dist/useRadio.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/radio/dist/useRadio.es.js.map +1 -1
- package/dist/node_modules/@react-aria/radio/dist/useRadioGroup.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/radio/dist/useRadioGroup.es.js.map +1 -1
- package/dist/node_modules/@react-aria/ssr/dist/SSRProvider.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/ssr/dist/SSRProvider.es.js.map +1 -1
- package/dist/node_modules/@react-aria/switch/dist/useSwitch.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/switch/dist/useSwitch.es.js.map +1 -1
- package/dist/node_modules/@react-aria/toggle/dist/useToggle.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/toggle/dist/useToggle.es.js.map +1 -1
- package/dist/node_modules/@react-aria/visually-hidden/dist/VisuallyHidden.cjs.js.map +1 -1
- package/dist/node_modules/@react-aria/visually-hidden/dist/VisuallyHidden.es.js.map +1 -1
- package/dist/node_modules/@react-stately/form/dist/useFormValidationState.cjs.js.map +1 -1
- package/dist/node_modules/@react-stately/form/dist/useFormValidationState.es.js +3 -3
- package/dist/node_modules/@react-stately/form/dist/useFormValidationState.es.js.map +1 -1
- package/dist/node_modules/@react-stately/overlays/dist/useOverlayTriggerState.cjs.js.map +1 -1
- package/dist/node_modules/@react-stately/overlays/dist/useOverlayTriggerState.es.js.map +1 -1
- package/dist/node_modules/@react-stately/radio/dist/useRadioGroupState.cjs.js.map +1 -1
- package/dist/node_modules/@react-stately/radio/dist/useRadioGroupState.es.js.map +1 -1
- package/dist/node_modules/@react-stately/toggle/dist/useToggleState.cjs.js.map +1 -1
- package/dist/node_modules/@react-stately/toggle/dist/useToggleState.es.js.map +1 -1
- package/dist/node_modules/@react-stately/utils/dist/useControlledState.cjs.js.map +1 -1
- package/dist/node_modules/@react-stately/utils/dist/useControlledState.es.js.map +1 -1
- package/dist/node_modules/@swc/helpers/esm/_check_private_redeclaration.cjs.js +1 -1
- package/dist/node_modules/@swc/helpers/esm/_check_private_redeclaration.cjs.js.map +1 -1
- package/dist/node_modules/@swc/helpers/esm/_check_private_redeclaration.es.js +2 -1
- package/dist/node_modules/@swc/helpers/esm/_check_private_redeclaration.es.js.map +1 -1
- package/dist/node_modules/@swc/helpers/esm/_class_apply_descriptor_get.cjs.js +1 -1
- package/dist/node_modules/@swc/helpers/esm/_class_apply_descriptor_get.cjs.js.map +1 -1
- package/dist/node_modules/@swc/helpers/esm/_class_apply_descriptor_get.es.js +2 -1
- package/dist/node_modules/@swc/helpers/esm/_class_apply_descriptor_get.es.js.map +1 -1
- package/dist/node_modules/@swc/helpers/esm/_class_apply_descriptor_set.cjs.js +1 -1
- package/dist/node_modules/@swc/helpers/esm/_class_apply_descriptor_set.cjs.js.map +1 -1
- package/dist/node_modules/@swc/helpers/esm/_class_apply_descriptor_set.es.js +2 -1
- package/dist/node_modules/@swc/helpers/esm/_class_apply_descriptor_set.es.js.map +1 -1
- package/dist/node_modules/@swc/helpers/esm/_class_extract_field_descriptor.cjs.js +1 -1
- package/dist/node_modules/@swc/helpers/esm/_class_extract_field_descriptor.cjs.js.map +1 -1
- package/dist/node_modules/@swc/helpers/esm/_class_extract_field_descriptor.es.js +2 -1
- package/dist/node_modules/@swc/helpers/esm/_class_extract_field_descriptor.es.js.map +1 -1
- package/dist/node_modules/@swc/helpers/esm/_class_private_field_get.cjs.js +1 -1
- package/dist/node_modules/@swc/helpers/esm/_class_private_field_get.cjs.js.map +1 -1
- package/dist/node_modules/@swc/helpers/esm/_class_private_field_get.es.js +7 -6
- package/dist/node_modules/@swc/helpers/esm/_class_private_field_get.es.js.map +1 -1
- package/dist/node_modules/@swc/helpers/esm/_class_private_field_init.cjs.js +1 -1
- package/dist/node_modules/@swc/helpers/esm/_class_private_field_init.cjs.js.map +1 -1
- package/dist/node_modules/@swc/helpers/esm/_class_private_field_init.es.js +4 -3
- package/dist/node_modules/@swc/helpers/esm/_class_private_field_init.es.js.map +1 -1
- package/dist/node_modules/@swc/helpers/esm/_class_private_field_set.cjs.js +1 -1
- package/dist/node_modules/@swc/helpers/esm/_class_private_field_set.cjs.js.map +1 -1
- package/dist/node_modules/@swc/helpers/esm/_class_private_field_set.es.js +7 -6
- package/dist/node_modules/@swc/helpers/esm/_class_private_field_set.es.js.map +1 -1
- package/dist/node_modules/color2k/dist/index.exports.import.es.cjs.js.map +1 -1
- package/dist/node_modules/color2k/dist/index.exports.import.es.es.js.map +1 -1
- package/dist/node_modules/react/cjs/react-jsx-runtime.development.cjs.js +7 -7
- package/dist/node_modules/react/cjs/react-jsx-runtime.development.cjs.js.map +1 -1
- package/dist/node_modules/react/cjs/react-jsx-runtime.development.es.js +174 -167
- package/dist/node_modules/react/cjs/react-jsx-runtime.development.es.js.map +1 -1
- package/dist/node_modules/react/cjs/react-jsx-runtime.production.min.cjs.js +1 -1
- package/dist/node_modules/react/cjs/react-jsx-runtime.production.min.cjs.js.map +1 -1
- package/dist/node_modules/react/cjs/react-jsx-runtime.production.min.es.js +3 -3
- package/dist/node_modules/react/cjs/react-jsx-runtime.production.min.es.js.map +1 -1
- package/dist/node_modules/react/jsx-runtime.cjs.js.map +1 -1
- package/dist/node_modules/react/jsx-runtime.es.js.map +1 -1
- package/dist/utils/color2k.cjs.js.map +1 -1
- package/dist/utils/color2k.es.js.map +1 -1
- package/dist/utils/copy.cjs.js +1 -1
- package/dist/utils/copy.cjs.js.map +1 -1
- package/dist/utils/copy.es.js +20 -19
- package/dist/utils/copy.es.js.map +1 -1
- package/dist/utils/image.cjs.js.map +1 -1
- package/dist/utils/image.es.js.map +1 -1
- package/dist/utils/navigation.cjs.js.map +1 -1
- package/dist/utils/navigation.es.js.map +1 -1
- package/dist/utils/palette.cjs.js.map +1 -1
- package/dist/utils/palette.es.js +1 -1
- package/dist/utils/palette.es.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"stylesheet.cjs.js","sources":["../../../src/design/darkTheme/stylesheet.ts"],"sourcesContent":["import { transparentize } from \"../../utils/color2k\";\nimport { BORDER, DARK_GRAYSCALE, ELEVATION } from \"./colors\";\nimport { DANGER, WARNING, SUCCESS, BRAND } from \"../colors\";\nimport type { ProtonStyleSheet } from \"../types\";\n\nexport const DARK_STYLESHEET: ProtonStyleSheet = {\n // Control/component colors\n \"--proton-control__background-color\": DARK_GRAYSCALE.DARK,\n \"--proton-control__background-color-light\": ELEVATION,\n \"--proton-control__text-color\": DARK_GRAYSCALE.WHITE,\n \"--proton-control__title-color\": \"#FFFFFF\",\n \"--proton-control__border-color\": BORDER,\n \"--proton-control__hover-color\": DARK_GRAYSCALE.MEDIUM,\n \"--proton-control__shadow-color\": transparentize(\n DARK_GRAYSCALE.LIGHTEST,\n 0.5\n ),\n \"--proton-control__border-radius\": \"4px\",\n \"--proton-control__interactive-color\": BRAND.PRIMARY_LIGHT,\n\n // Brand colors\n \"--proton-color__primary\": BRAND.PRIMARY,\n \"--proton-color__primary-light\": BRAND.PRIMARY_LIGHT,\n \"--proton-color__primary-super-light\": BRAND.PRIMARY_SUPER_LIGHT,\n \"--proton-color__secondary\": BRAND.SECONDARY,\n \"--proton-color__secondary-light\": BRAND.SECONDARY_LIGHT,\n \"--proton-color__secondary-super-light\": BRAND.SECONDARY_SUPER_LIGHT,\n\n // Semantic colors\n \"--proton-color__danger-super-dark\": DANGER.SUPER_DARK,\n \"--proton-color__danger-dark\": DANGER.DARK,\n \"--proton-color__danger-medium\": DANGER.MEDIUM,\n \"--proton-color__danger-light\": DANGER.LIGHT,\n \"--proton-color__danger-super-light\": DANGER.SUPER_LIGHT,\n \"--proton-color__warning-dark\": WARNING.DARK,\n \"--proton-color__warning-medium\": WARNING.MEDIUM,\n \"--proton-color__warning-light\": WARNING.LIGHT,\n \"--proton-color__warning-super-light\": WARNING.SUPER_LIGHT,\n \"--proton-color__success-dark\": SUCCESS.DARK,\n \"--proton-color__success-medium\": SUCCESS.MEDIUM,\n \"--proton-color__success-light\": SUCCESS.LIGHT,\n \"--proton-color__success-super-light\": SUCCESS.SUPER_LIGHT,\n\n // Grayscale colors\n \"--proton-color__gray-super-dark\": DARK_GRAYSCALE.SUPER_DARK,\n \"--proton-color__gray-dark\": DARK_GRAYSCALE.DARK,\n \"--proton-color__gray-medium\": DARK_GRAYSCALE.MEDIUM,\n \"--proton-color__gray-medium-light\": DARK_GRAYSCALE.MEDIUM_LIGHT,\n \"--proton-color__gray-light\": DARK_GRAYSCALE.LIGHT,\n \"--proton-color__gray-lightest\": DARK_GRAYSCALE.LIGHTEST,\n \"--proton-color__gray-super-light\": DARK_GRAYSCALE.SUPER_LIGHT,\n \"--proton-color__white\": DARK_GRAYSCALE.WHITE,\n};\n"],"names":["DARK_STYLESHEET","DARK_GRAYSCALE","ELEVATION","BORDER","transparentize","BRAND","DANGER","WARNING","SUCCESS"],"mappings":"yLAKaA,EAAoC,CAE/C,qCAAsCC,
|
|
1
|
+
{"version":3,"file":"stylesheet.cjs.js","sources":["../../../src/design/darkTheme/stylesheet.ts"],"sourcesContent":["import { transparentize } from \"../../utils/color2k\";\nimport { BORDER, DARK_GRAYSCALE, ELEVATION } from \"./colors\";\nimport { DANGER, WARNING, SUCCESS, BRAND } from \"../colors\";\nimport type { ProtonStyleSheet } from \"../types\";\n\nexport const DARK_STYLESHEET: ProtonStyleSheet = {\n // Control/component colors\n \"--proton-control__background-color\": DARK_GRAYSCALE.DARK,\n \"--proton-control__background-color-light\": ELEVATION,\n \"--proton-control__text-color\": DARK_GRAYSCALE.WHITE,\n \"--proton-control__title-color\": \"#FFFFFF\",\n \"--proton-control__border-color\": BORDER,\n \"--proton-control__hover-color\": DARK_GRAYSCALE.MEDIUM,\n \"--proton-control__shadow-color\": transparentize(\n DARK_GRAYSCALE.LIGHTEST,\n 0.5\n ),\n \"--proton-control__border-radius\": \"4px\",\n \"--proton-control__interactive-color\": BRAND.PRIMARY_LIGHT,\n\n // Brand colors\n \"--proton-color__primary\": BRAND.PRIMARY,\n \"--proton-color__primary-light\": BRAND.PRIMARY_LIGHT,\n \"--proton-color__primary-super-light\": BRAND.PRIMARY_SUPER_LIGHT,\n \"--proton-color__secondary\": BRAND.SECONDARY,\n \"--proton-color__secondary-light\": BRAND.SECONDARY_LIGHT,\n \"--proton-color__secondary-super-light\": BRAND.SECONDARY_SUPER_LIGHT,\n\n // Semantic colors\n \"--proton-color__danger-super-dark\": DANGER.SUPER_DARK,\n \"--proton-color__danger-dark\": DANGER.DARK,\n \"--proton-color__danger-medium\": DANGER.MEDIUM,\n \"--proton-color__danger-light\": DANGER.LIGHT,\n \"--proton-color__danger-super-light\": DANGER.SUPER_LIGHT,\n \"--proton-color__warning-dark\": WARNING.DARK,\n \"--proton-color__warning-medium\": WARNING.MEDIUM,\n \"--proton-color__warning-light\": WARNING.LIGHT,\n \"--proton-color__warning-super-light\": WARNING.SUPER_LIGHT,\n \"--proton-color__success-dark\": SUCCESS.DARK,\n \"--proton-color__success-medium\": SUCCESS.MEDIUM,\n \"--proton-color__success-light\": SUCCESS.LIGHT,\n \"--proton-color__success-super-light\": SUCCESS.SUPER_LIGHT,\n\n // Grayscale colors\n \"--proton-color__gray-super-dark\": DARK_GRAYSCALE.SUPER_DARK,\n \"--proton-color__gray-dark\": DARK_GRAYSCALE.DARK,\n \"--proton-color__gray-medium\": DARK_GRAYSCALE.MEDIUM,\n \"--proton-color__gray-medium-light\": DARK_GRAYSCALE.MEDIUM_LIGHT,\n \"--proton-color__gray-light\": DARK_GRAYSCALE.LIGHT,\n \"--proton-color__gray-lightest\": DARK_GRAYSCALE.LIGHTEST,\n \"--proton-color__gray-super-light\": DARK_GRAYSCALE.SUPER_LIGHT,\n \"--proton-color__white\": DARK_GRAYSCALE.WHITE,\n};\n"],"names":["DARK_STYLESHEET","DARK_GRAYSCALE","ELEVATION","BORDER","transparentize","BRAND","DANGER","WARNING","SUCCESS"],"mappings":"yLAKaA,EAAoC,CAE/C,qCAAsCC,EAAe,eAAA,KACrD,2CAA4CC,EAAA,UAC5C,+BAAgCD,EAAe,eAAA,MAC/C,gCAAiC,UACjC,iCAAkCE,EAAA,OAClC,gCAAiCF,EAAe,eAAA,OAChD,iCAAkCG,EAAA,eAChCH,EAAAA,eAAe,SACf,EACF,EACA,kCAAmC,MACnC,sCAAuCI,EAAM,MAAA,cAG7C,0BAA2BA,EAAM,MAAA,QACjC,gCAAiCA,EAAM,MAAA,cACvC,sCAAuCA,EAAM,MAAA,oBAC7C,4BAA6BA,EAAM,MAAA,UACnC,kCAAmCA,EAAM,MAAA,gBACzC,wCAAyCA,EAAM,MAAA,sBAG/C,oCAAqCC,EAAO,OAAA,WAC5C,8BAA+BA,EAAO,OAAA,KACtC,gCAAiCA,EAAO,OAAA,OACxC,+BAAgCA,EAAO,OAAA,MACvC,qCAAsCA,EAAO,OAAA,YAC7C,+BAAgCC,EAAQ,QAAA,KACxC,iCAAkCA,EAAQ,QAAA,OAC1C,gCAAiCA,EAAQ,QAAA,MACzC,sCAAuCA,EAAQ,QAAA,YAC/C,+BAAgCC,EAAQ,QAAA,KACxC,iCAAkCA,EAAQ,QAAA,OAC1C,gCAAiCA,EAAQ,QAAA,MACzC,sCAAuCA,EAAQ,QAAA,YAG/C,kCAAmCP,EAAe,eAAA,WAClD,4BAA6BA,EAAe,eAAA,KAC5C,8BAA+BA,EAAe,eAAA,OAC9C,oCAAqCA,EAAe,eAAA,aACpD,6BAA8BA,EAAe,eAAA,MAC7C,gCAAiCA,EAAe,eAAA,SAChD,mCAAoCA,EAAe,eAAA,YACnD,wBAAyBA,EAAe,eAAA,KAC1C"}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { transparentize as l } from "../../utils/color2k.es.js";
|
|
2
|
-
import { DARK_GRAYSCALE as o,
|
|
3
|
-
import {
|
|
2
|
+
import { DARK_GRAYSCALE as o, ELEVATION as c, BORDER as p } from "./colors.es.js";
|
|
3
|
+
import { BRAND as r, DANGER as _, WARNING as t, SUCCESS as n } from "../colors.es.js";
|
|
4
4
|
const R = {
|
|
5
5
|
// Control/component colors
|
|
6
6
|
"--proton-control__background-color": o.DARK,
|
|
7
|
-
"--proton-control__background-color-light":
|
|
7
|
+
"--proton-control__background-color-light": c,
|
|
8
8
|
"--proton-control__text-color": o.WHITE,
|
|
9
9
|
"--proton-control__title-color": "#FFFFFF",
|
|
10
|
-
"--proton-control__border-color":
|
|
10
|
+
"--proton-control__border-color": p,
|
|
11
11
|
"--proton-control__hover-color": o.MEDIUM,
|
|
12
12
|
"--proton-control__shadow-color": l(
|
|
13
13
|
o.LIGHTEST,
|
|
@@ -28,14 +28,14 @@ const R = {
|
|
|
28
28
|
"--proton-color__danger-medium": _.MEDIUM,
|
|
29
29
|
"--proton-color__danger-light": _.LIGHT,
|
|
30
30
|
"--proton-color__danger-super-light": _.SUPER_LIGHT,
|
|
31
|
-
"--proton-color__warning-dark":
|
|
32
|
-
"--proton-color__warning-medium":
|
|
33
|
-
"--proton-color__warning-light":
|
|
34
|
-
"--proton-color__warning-super-light":
|
|
35
|
-
"--proton-color__success-dark":
|
|
36
|
-
"--proton-color__success-medium":
|
|
37
|
-
"--proton-color__success-light":
|
|
38
|
-
"--proton-color__success-super-light":
|
|
31
|
+
"--proton-color__warning-dark": t.DARK,
|
|
32
|
+
"--proton-color__warning-medium": t.MEDIUM,
|
|
33
|
+
"--proton-color__warning-light": t.LIGHT,
|
|
34
|
+
"--proton-color__warning-super-light": t.SUPER_LIGHT,
|
|
35
|
+
"--proton-color__success-dark": n.DARK,
|
|
36
|
+
"--proton-color__success-medium": n.MEDIUM,
|
|
37
|
+
"--proton-color__success-light": n.LIGHT,
|
|
38
|
+
"--proton-color__success-super-light": n.SUPER_LIGHT,
|
|
39
39
|
// Grayscale colors
|
|
40
40
|
"--proton-color__gray-super-dark": o.SUPER_DARK,
|
|
41
41
|
"--proton-color__gray-dark": o.DARK,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"stylesheet.es.js","sources":["../../../src/design/darkTheme/stylesheet.ts"],"sourcesContent":["import { transparentize } from \"../../utils/color2k\";\nimport { BORDER, DARK_GRAYSCALE, ELEVATION } from \"./colors\";\nimport { DANGER, WARNING, SUCCESS, BRAND } from \"../colors\";\nimport type { ProtonStyleSheet } from \"../types\";\n\nexport const DARK_STYLESHEET: ProtonStyleSheet = {\n // Control/component colors\n \"--proton-control__background-color\": DARK_GRAYSCALE.DARK,\n \"--proton-control__background-color-light\": ELEVATION,\n \"--proton-control__text-color\": DARK_GRAYSCALE.WHITE,\n \"--proton-control__title-color\": \"#FFFFFF\",\n \"--proton-control__border-color\": BORDER,\n \"--proton-control__hover-color\": DARK_GRAYSCALE.MEDIUM,\n \"--proton-control__shadow-color\": transparentize(\n DARK_GRAYSCALE.LIGHTEST,\n 0.5\n ),\n \"--proton-control__border-radius\": \"4px\",\n \"--proton-control__interactive-color\": BRAND.PRIMARY_LIGHT,\n\n // Brand colors\n \"--proton-color__primary\": BRAND.PRIMARY,\n \"--proton-color__primary-light\": BRAND.PRIMARY_LIGHT,\n \"--proton-color__primary-super-light\": BRAND.PRIMARY_SUPER_LIGHT,\n \"--proton-color__secondary\": BRAND.SECONDARY,\n \"--proton-color__secondary-light\": BRAND.SECONDARY_LIGHT,\n \"--proton-color__secondary-super-light\": BRAND.SECONDARY_SUPER_LIGHT,\n\n // Semantic colors\n \"--proton-color__danger-super-dark\": DANGER.SUPER_DARK,\n \"--proton-color__danger-dark\": DANGER.DARK,\n \"--proton-color__danger-medium\": DANGER.MEDIUM,\n \"--proton-color__danger-light\": DANGER.LIGHT,\n \"--proton-color__danger-super-light\": DANGER.SUPER_LIGHT,\n \"--proton-color__warning-dark\": WARNING.DARK,\n \"--proton-color__warning-medium\": WARNING.MEDIUM,\n \"--proton-color__warning-light\": WARNING.LIGHT,\n \"--proton-color__warning-super-light\": WARNING.SUPER_LIGHT,\n \"--proton-color__success-dark\": SUCCESS.DARK,\n \"--proton-color__success-medium\": SUCCESS.MEDIUM,\n \"--proton-color__success-light\": SUCCESS.LIGHT,\n \"--proton-color__success-super-light\": SUCCESS.SUPER_LIGHT,\n\n // Grayscale colors\n \"--proton-color__gray-super-dark\": DARK_GRAYSCALE.SUPER_DARK,\n \"--proton-color__gray-dark\": DARK_GRAYSCALE.DARK,\n \"--proton-color__gray-medium\": DARK_GRAYSCALE.MEDIUM,\n \"--proton-color__gray-medium-light\": DARK_GRAYSCALE.MEDIUM_LIGHT,\n \"--proton-color__gray-light\": DARK_GRAYSCALE.LIGHT,\n \"--proton-color__gray-lightest\": DARK_GRAYSCALE.LIGHTEST,\n \"--proton-color__gray-super-light\": DARK_GRAYSCALE.SUPER_LIGHT,\n \"--proton-color__white\": DARK_GRAYSCALE.WHITE,\n};\n"],"names":["DARK_STYLESHEET","DARK_GRAYSCALE","ELEVATION","BORDER","transparentize","BRAND","DANGER","WARNING","SUCCESS"],"mappings":";;;AAKO,MAAMA,IAAoC;AAAA;AAAA,EAE/C,sCAAsCC,EAAe;AAAA,EACrD,4CAA4CC;AAAA,EAC5C,gCAAgCD,EAAe;AAAA,EAC/C,iCAAiC;AAAA,EACjC,kCAAkCE;AAAA,EAClC,iCAAiCF,EAAe;AAAA,EAChD,kCAAkCG;AAAA,IAChCH,EAAe;AAAA,IACf;AAAA,
|
|
1
|
+
{"version":3,"file":"stylesheet.es.js","sources":["../../../src/design/darkTheme/stylesheet.ts"],"sourcesContent":["import { transparentize } from \"../../utils/color2k\";\nimport { BORDER, DARK_GRAYSCALE, ELEVATION } from \"./colors\";\nimport { DANGER, WARNING, SUCCESS, BRAND } from \"../colors\";\nimport type { ProtonStyleSheet } from \"../types\";\n\nexport const DARK_STYLESHEET: ProtonStyleSheet = {\n // Control/component colors\n \"--proton-control__background-color\": DARK_GRAYSCALE.DARK,\n \"--proton-control__background-color-light\": ELEVATION,\n \"--proton-control__text-color\": DARK_GRAYSCALE.WHITE,\n \"--proton-control__title-color\": \"#FFFFFF\",\n \"--proton-control__border-color\": BORDER,\n \"--proton-control__hover-color\": DARK_GRAYSCALE.MEDIUM,\n \"--proton-control__shadow-color\": transparentize(\n DARK_GRAYSCALE.LIGHTEST,\n 0.5\n ),\n \"--proton-control__border-radius\": \"4px\",\n \"--proton-control__interactive-color\": BRAND.PRIMARY_LIGHT,\n\n // Brand colors\n \"--proton-color__primary\": BRAND.PRIMARY,\n \"--proton-color__primary-light\": BRAND.PRIMARY_LIGHT,\n \"--proton-color__primary-super-light\": BRAND.PRIMARY_SUPER_LIGHT,\n \"--proton-color__secondary\": BRAND.SECONDARY,\n \"--proton-color__secondary-light\": BRAND.SECONDARY_LIGHT,\n \"--proton-color__secondary-super-light\": BRAND.SECONDARY_SUPER_LIGHT,\n\n // Semantic colors\n \"--proton-color__danger-super-dark\": DANGER.SUPER_DARK,\n \"--proton-color__danger-dark\": DANGER.DARK,\n \"--proton-color__danger-medium\": DANGER.MEDIUM,\n \"--proton-color__danger-light\": DANGER.LIGHT,\n \"--proton-color__danger-super-light\": DANGER.SUPER_LIGHT,\n \"--proton-color__warning-dark\": WARNING.DARK,\n \"--proton-color__warning-medium\": WARNING.MEDIUM,\n \"--proton-color__warning-light\": WARNING.LIGHT,\n \"--proton-color__warning-super-light\": WARNING.SUPER_LIGHT,\n \"--proton-color__success-dark\": SUCCESS.DARK,\n \"--proton-color__success-medium\": SUCCESS.MEDIUM,\n \"--proton-color__success-light\": SUCCESS.LIGHT,\n \"--proton-color__success-super-light\": SUCCESS.SUPER_LIGHT,\n\n // Grayscale colors\n \"--proton-color__gray-super-dark\": DARK_GRAYSCALE.SUPER_DARK,\n \"--proton-color__gray-dark\": DARK_GRAYSCALE.DARK,\n \"--proton-color__gray-medium\": DARK_GRAYSCALE.MEDIUM,\n \"--proton-color__gray-medium-light\": DARK_GRAYSCALE.MEDIUM_LIGHT,\n \"--proton-color__gray-light\": DARK_GRAYSCALE.LIGHT,\n \"--proton-color__gray-lightest\": DARK_GRAYSCALE.LIGHTEST,\n \"--proton-color__gray-super-light\": DARK_GRAYSCALE.SUPER_LIGHT,\n \"--proton-color__white\": DARK_GRAYSCALE.WHITE,\n};\n"],"names":["DARK_STYLESHEET","DARK_GRAYSCALE","ELEVATION","BORDER","transparentize","BRAND","DANGER","WARNING","SUCCESS"],"mappings":";;;AAKO,MAAMA,IAAoC;AAAA;AAAA,EAE/C,sCAAsCC,EAAe;AAAA,EACrD,4CAA4CC;AAAA,EAC5C,gCAAgCD,EAAe;AAAA,EAC/C,iCAAiC;AAAA,EACjC,kCAAkCE;AAAA,EAClC,iCAAiCF,EAAe;AAAA,EAChD,kCAAkCG;AAAA,IAChCH,EAAe;AAAA,IACf;AAAA,EACF;AAAA,EACA,mCAAmC;AAAA,EACnC,uCAAuCI,EAAM;AAAA;AAAA,EAG7C,2BAA2BA,EAAM;AAAA,EACjC,iCAAiCA,EAAM;AAAA,EACvC,uCAAuCA,EAAM;AAAA,EAC7C,6BAA6BA,EAAM;AAAA,EACnC,mCAAmCA,EAAM;AAAA,EACzC,yCAAyCA,EAAM;AAAA;AAAA,EAG/C,qCAAqCC,EAAO;AAAA,EAC5C,+BAA+BA,EAAO;AAAA,EACtC,iCAAiCA,EAAO;AAAA,EACxC,gCAAgCA,EAAO;AAAA,EACvC,sCAAsCA,EAAO;AAAA,EAC7C,gCAAgCC,EAAQ;AAAA,EACxC,kCAAkCA,EAAQ;AAAA,EAC1C,iCAAiCA,EAAQ;AAAA,EACzC,uCAAuCA,EAAQ;AAAA,EAC/C,gCAAgCC,EAAQ;AAAA,EACxC,kCAAkCA,EAAQ;AAAA,EAC1C,iCAAiCA,EAAQ;AAAA,EACzC,uCAAuCA,EAAQ;AAAA;AAAA,EAG/C,mCAAmCP,EAAe;AAAA,EAClD,6BAA6BA,EAAe;AAAA,EAC5C,+BAA+BA,EAAe;AAAA,EAC9C,qCAAqCA,EAAe;AAAA,EACpD,8BAA8BA,EAAe;AAAA,EAC7C,iCAAiCA,EAAe;AAAA,EAChD,oCAAoCA,EAAe;AAAA,EACnD,yBAAyBA,EAAe;AAC1C;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"generateStylesheet.cjs.js","sources":["../../src/design/generateStylesheet.ts"],"sourcesContent":["import { THEMES } from \"./theme\";\nimport { ProtonPalette } from \"./types\";\nimport { LIGHT_STYLESHEET } from \"./lightTheme/stylesheet\";\nimport { DARK_STYLESHEET } from \"./darkTheme/stylesheet\";\nimport { ProtonStyleSheet } from \"./types\";\n\nexport const generateStylesheet = (\n palette: ProtonPalette,\n theme: string\n): ProtonStyleSheet => {\n const themeVariables =\n theme === THEMES.DARK ? DARK_STYLESHEET : LIGHT_STYLESHEET;\n\n if (palette) {\n const customVars = generateCustomStylesheet(palette);\n return {\n ...themeVariables,\n ...customVars,\n };\n }\n\n return themeVariables;\n};\n\n//overrride theme colors in stylesheet\nconst generateCustomStylesheet = (\n palette: ProtonPalette\n): Partial<ProtonStyleSheet> => {\n return {\n \"--proton-color__primary\": palette.BRAND.PRIMARY,\n \"--proton-color__primary-light\": palette.BRAND.PRIMARY_LIGHT,\n \"--proton-color__primary-super-light\": palette.BRAND.PRIMARY_SUPER_LIGHT,\n \"--proton-color__secondary\": palette.BRAND.SECONDARY,\n \"--proton-color__secondary-light\": palette.BRAND.SECONDARY_LIGHT,\n \"--proton-color__secondary-super-light\":\n palette.BRAND.SECONDARY_SUPER_LIGHT,\n\n //TODO: add newly generated grayscale color scale\n };\n};\n"],"names":["generateStylesheet","palette","theme","themeVariables","THEMES","DARK_STYLESHEET","LIGHT_STYLESHEET","customVars","generateCustomStylesheet"],"mappings":"yMAMaA,EAAqB,CAChCC,EACAC,IACqB,CACrB,MAAMC,EACJD,IAAUE,EAAAA,OAAO,KAAOC,EAAAA,gBAAkBC,EAAAA,iBAE5C,GAAIL,EAAS,
|
|
1
|
+
{"version":3,"file":"generateStylesheet.cjs.js","sources":["../../src/design/generateStylesheet.ts"],"sourcesContent":["import { THEMES } from \"./theme\";\nimport { ProtonPalette } from \"./types\";\nimport { LIGHT_STYLESHEET } from \"./lightTheme/stylesheet\";\nimport { DARK_STYLESHEET } from \"./darkTheme/stylesheet\";\nimport { ProtonStyleSheet } from \"./types\";\n\nexport const generateStylesheet = (\n palette: ProtonPalette,\n theme: string\n): ProtonStyleSheet => {\n const themeVariables =\n theme === THEMES.DARK ? DARK_STYLESHEET : LIGHT_STYLESHEET;\n\n if (palette) {\n const customVars = generateCustomStylesheet(palette);\n return {\n ...themeVariables,\n ...customVars,\n };\n }\n\n return themeVariables;\n};\n\n//overrride theme colors in stylesheet\nconst generateCustomStylesheet = (\n palette: ProtonPalette\n): Partial<ProtonStyleSheet> => {\n return {\n \"--proton-color__primary\": palette.BRAND.PRIMARY,\n \"--proton-color__primary-light\": palette.BRAND.PRIMARY_LIGHT,\n \"--proton-color__primary-super-light\": palette.BRAND.PRIMARY_SUPER_LIGHT,\n \"--proton-color__secondary\": palette.BRAND.SECONDARY,\n \"--proton-color__secondary-light\": palette.BRAND.SECONDARY_LIGHT,\n \"--proton-color__secondary-super-light\":\n palette.BRAND.SECONDARY_SUPER_LIGHT,\n\n //TODO: add newly generated grayscale color scale\n };\n};\n"],"names":["generateStylesheet","palette","theme","themeVariables","THEMES","DARK_STYLESHEET","LIGHT_STYLESHEET","customVars","generateCustomStylesheet"],"mappings":"yMAMaA,EAAqB,CAChCC,EACAC,IACqB,CACrB,MAAMC,EACJD,IAAUE,EAAAA,OAAO,KAAOC,EAAAA,gBAAkBC,EAAAA,iBAE5C,GAAIL,EAAS,CACL,MAAAM,EAAaC,EAAyBP,CAAO,EAC5C,MAAA,CACL,GAAGE,EACH,GAAGI,CAAA,CAEP,CAEO,OAAAJ,CACT,EAGMK,EACJP,IAEO,CACL,0BAA2BA,EAAQ,MAAM,QACzC,gCAAiCA,EAAQ,MAAM,cAC/C,sCAAuCA,EAAQ,MAAM,oBACrD,4BAA6BA,EAAQ,MAAM,UAC3C,kCAAmCA,EAAQ,MAAM,gBACjD,wCACEA,EAAQ,MAAM,qBAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"generateStylesheet.es.js","sources":["../../src/design/generateStylesheet.ts"],"sourcesContent":["import { THEMES } from \"./theme\";\nimport { ProtonPalette } from \"./types\";\nimport { LIGHT_STYLESHEET } from \"./lightTheme/stylesheet\";\nimport { DARK_STYLESHEET } from \"./darkTheme/stylesheet\";\nimport { ProtonStyleSheet } from \"./types\";\n\nexport const generateStylesheet = (\n palette: ProtonPalette,\n theme: string\n): ProtonStyleSheet => {\n const themeVariables =\n theme === THEMES.DARK ? DARK_STYLESHEET : LIGHT_STYLESHEET;\n\n if (palette) {\n const customVars = generateCustomStylesheet(palette);\n return {\n ...themeVariables,\n ...customVars,\n };\n }\n\n return themeVariables;\n};\n\n//overrride theme colors in stylesheet\nconst generateCustomStylesheet = (\n palette: ProtonPalette\n): Partial<ProtonStyleSheet> => {\n return {\n \"--proton-color__primary\": palette.BRAND.PRIMARY,\n \"--proton-color__primary-light\": palette.BRAND.PRIMARY_LIGHT,\n \"--proton-color__primary-super-light\": palette.BRAND.PRIMARY_SUPER_LIGHT,\n \"--proton-color__secondary\": palette.BRAND.SECONDARY,\n \"--proton-color__secondary-light\": palette.BRAND.SECONDARY_LIGHT,\n \"--proton-color__secondary-super-light\":\n palette.BRAND.SECONDARY_SUPER_LIGHT,\n\n //TODO: add newly generated grayscale color scale\n };\n};\n"],"names":["generateStylesheet","palette","theme","themeVariables","THEMES","DARK_STYLESHEET","LIGHT_STYLESHEET","customVars","generateCustomStylesheet"],"mappings":";;;
|
|
1
|
+
{"version":3,"file":"generateStylesheet.es.js","sources":["../../src/design/generateStylesheet.ts"],"sourcesContent":["import { THEMES } from \"./theme\";\nimport { ProtonPalette } from \"./types\";\nimport { LIGHT_STYLESHEET } from \"./lightTheme/stylesheet\";\nimport { DARK_STYLESHEET } from \"./darkTheme/stylesheet\";\nimport { ProtonStyleSheet } from \"./types\";\n\nexport const generateStylesheet = (\n palette: ProtonPalette,\n theme: string\n): ProtonStyleSheet => {\n const themeVariables =\n theme === THEMES.DARK ? DARK_STYLESHEET : LIGHT_STYLESHEET;\n\n if (palette) {\n const customVars = generateCustomStylesheet(palette);\n return {\n ...themeVariables,\n ...customVars,\n };\n }\n\n return themeVariables;\n};\n\n//overrride theme colors in stylesheet\nconst generateCustomStylesheet = (\n palette: ProtonPalette\n): Partial<ProtonStyleSheet> => {\n return {\n \"--proton-color__primary\": palette.BRAND.PRIMARY,\n \"--proton-color__primary-light\": palette.BRAND.PRIMARY_LIGHT,\n \"--proton-color__primary-super-light\": palette.BRAND.PRIMARY_SUPER_LIGHT,\n \"--proton-color__secondary\": palette.BRAND.SECONDARY,\n \"--proton-color__secondary-light\": palette.BRAND.SECONDARY_LIGHT,\n \"--proton-color__secondary-super-light\":\n palette.BRAND.SECONDARY_SUPER_LIGHT,\n\n //TODO: add newly generated grayscale color scale\n };\n};\n"],"names":["generateStylesheet","palette","theme","themeVariables","THEMES","DARK_STYLESHEET","LIGHT_STYLESHEET","customVars","generateCustomStylesheet"],"mappings":";;;AAMa,MAAAA,IAAqB,CAChCC,GACAC,MACqB;AACrB,QAAMC,IACJD,MAAUE,EAAO,OAAOC,IAAkBC;AAE5C,MAAIL,GAAS;AACL,UAAAM,IAAaC,EAAyBP,CAAO;AAC5C,WAAA;AAAA,MACL,GAAGE;AAAA,MACH,GAAGI;AAAA,IAAA;AAAA,EAEP;AAEO,SAAAJ;AACT,GAGMK,IAA2B,CAC/BP,OAEO;AAAA,EACL,2BAA2BA,EAAQ,MAAM;AAAA,EACzC,iCAAiCA,EAAQ,MAAM;AAAA,EAC/C,uCAAuCA,EAAQ,MAAM;AAAA,EACrD,6BAA6BA,EAAQ,MAAM;AAAA,EAC3C,mCAAmCA,EAAQ,MAAM;AAAA,EACjD,yCACEA,EAAQ,MAAM;AAAA;AAAA;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"colors.cjs.js","sources":["../../../src/design/lightTheme/colors.ts"],"sourcesContent":["import {\n BACKGROUNDS,\n BRAND,\n BRAND_PRIMARY_SCALE,\n} from \"../colors\";\nimport { ProtonColorScale, ProtonPalette } from \"../types\";\n\nconst LIGHT_GRAY = \"#DDDDDD\";\nexport const BORDER = LIGHT_GRAY;\nexport const ELEVATION = \"#F7F8F9\";\nexport const LIGHT_GRAYSCALE: ProtonColorScale = {\n SUPER_DARK: \"#141211\",\n DARK: \"#4D4D4D\",\n MEDIUM: \"#7D7D7D\",\n MEDIUM_LIGHT: \"#B1B1B1\",\n LIGHT: LIGHT_GRAY,\n LIGHTEST: \"#F0F1F2\",\n SUPER_LIGHT: ELEVATION,\n WHITE: \"#FFFFFF\",\n};\n\nexport const LIGHT_SECONDARY_SCALE: ProtonColorScale = {\n SUPER_DARK: \"#032026\",\n DARK: \"#084657\",\n MEDIUM: \"#2085BA\",\n MEDIUM_LIGHT: \"#44A8EB\",\n LIGHT: \"#70B9F6\",\n LIGHTEST: \"#9DCBFC\",\n SUPER_LIGHT: \"#C8DFFF\",\n WHITE: \"#f5f9ff\",\n};\n\nexport const LIGHT_PALETTE: ProtonPalette = {\n BASE_COLOR: BACKGROUNDS.WHITE,\n BRAND,\n GRAYSCALE: LIGHT_GRAYSCALE,\n PRIMARY: BRAND_PRIMARY_SCALE,\n SECONDARY: LIGHT_SECONDARY_SCALE,\n};\n"],"names":["LIGHT_GRAY","BORDER","ELEVATION","LIGHT_GRAYSCALE","LIGHT_SECONDARY_SCALE","LIGHT_PALETTE","BACKGROUNDS","BRAND","BRAND_PRIMARY_SCALE"],"mappings":"oHAOMA,EAAa,UACNC,EAASD,EACTE,EAAY,UACZC,EAAoC,CAC/C,WAAY,UACZ,KAAM,UACN,OAAQ,UACR,aAAc,UACd,MAAOH,EACP,SAAU,UACV,YAAaE,EACb,MAAO,SACT,EAEaE,EAA0C,CACrD,WAAY,UACZ,KAAM,UACN,OAAQ,UACR,aAAc,UACd,MAAO,UACP,SAAU,UACV,YAAa,UACb,MAAO,SACT,EAEaC,EAA+B,CAC1C,WAAYC,
|
|
1
|
+
{"version":3,"file":"colors.cjs.js","sources":["../../../src/design/lightTheme/colors.ts"],"sourcesContent":["import {\n BACKGROUNDS,\n BRAND,\n BRAND_PRIMARY_SCALE,\n} from \"../colors\";\nimport { ProtonColorScale, ProtonPalette } from \"../types\";\n\nconst LIGHT_GRAY = \"#DDDDDD\";\nexport const BORDER = LIGHT_GRAY;\nexport const ELEVATION = \"#F7F8F9\";\nexport const LIGHT_GRAYSCALE: ProtonColorScale = {\n SUPER_DARK: \"#141211\",\n DARK: \"#4D4D4D\",\n MEDIUM: \"#7D7D7D\",\n MEDIUM_LIGHT: \"#B1B1B1\",\n LIGHT: LIGHT_GRAY,\n LIGHTEST: \"#F0F1F2\",\n SUPER_LIGHT: ELEVATION,\n WHITE: \"#FFFFFF\",\n};\n\nexport const LIGHT_SECONDARY_SCALE: ProtonColorScale = {\n SUPER_DARK: \"#032026\",\n DARK: \"#084657\",\n MEDIUM: \"#2085BA\",\n MEDIUM_LIGHT: \"#44A8EB\",\n LIGHT: \"#70B9F6\",\n LIGHTEST: \"#9DCBFC\",\n SUPER_LIGHT: \"#C8DFFF\",\n WHITE: \"#f5f9ff\",\n};\n\nexport const LIGHT_PALETTE: ProtonPalette = {\n BASE_COLOR: BACKGROUNDS.WHITE,\n BRAND,\n GRAYSCALE: LIGHT_GRAYSCALE,\n PRIMARY: BRAND_PRIMARY_SCALE,\n SECONDARY: LIGHT_SECONDARY_SCALE,\n};\n"],"names":["LIGHT_GRAY","BORDER","ELEVATION","LIGHT_GRAYSCALE","LIGHT_SECONDARY_SCALE","LIGHT_PALETTE","BACKGROUNDS","BRAND","BRAND_PRIMARY_SCALE"],"mappings":"oHAOMA,EAAa,UACNC,EAASD,EACTE,EAAY,UACZC,EAAoC,CAC/C,WAAY,UACZ,KAAM,UACN,OAAQ,UACR,aAAc,UACd,MAAOH,EACP,SAAU,UACV,YAAaE,EACb,MAAO,SACT,EAEaE,EAA0C,CACrD,WAAY,UACZ,KAAM,UACN,OAAQ,UACR,aAAc,UACd,MAAO,UACP,SAAU,UACV,YAAa,UACb,MAAO,SACT,EAEaC,EAA+B,CAC1C,WAAYC,EAAY,YAAA,MAAA,MACxBC,EAAA,MACA,UAAWJ,EACX,QAASK,EAAA,oBACT,UAAWJ,CACb"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { BACKGROUNDS as E, BRAND as A, BRAND_PRIMARY_SCALE as R } from "../colors.es.js";
|
|
2
2
|
const D = "#DDDDDD", G = D, I = "#F7F8F9", T = {
|
|
3
3
|
SUPER_DARK: "#141211",
|
|
4
4
|
DARK: "#4D4D4D",
|
|
@@ -18,10 +18,10 @@ const D = "#DDDDDD", G = D, I = "#F7F8F9", T = {
|
|
|
18
18
|
SUPER_LIGHT: "#C8DFFF",
|
|
19
19
|
WHITE: "#f5f9ff"
|
|
20
20
|
}, H = {
|
|
21
|
-
BASE_COLOR:
|
|
21
|
+
BASE_COLOR: E.WHITE,
|
|
22
22
|
BRAND: A,
|
|
23
23
|
GRAYSCALE: T,
|
|
24
|
-
PRIMARY:
|
|
24
|
+
PRIMARY: R,
|
|
25
25
|
SECONDARY: L
|
|
26
26
|
};
|
|
27
27
|
export {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"stylesheet.cjs.js","sources":["../../../src/design/lightTheme/stylesheet.ts"],"sourcesContent":["import { transparentize } from \"../../utils/color2k\";\nimport { BACKGROUNDS, BRAND, DANGER, WARNING, SUCCESS } from \"../colors\";\nimport { ELEVATION, LIGHT_GRAYSCALE } from \"./colors\";\nimport { BORDER } from \"./colors\";\nimport type { ProtonStyleSheet } from \"../types\";\n\nexport const LIGHT_STYLESHEET: ProtonStyleSheet = {\n // Control/component colors\n \"--proton-control__background-color\": BACKGROUNDS.WHITE,\n \"--proton-control__background-color-light\": ELEVATION,\n \"--proton-control__text-color\": LIGHT_GRAYSCALE.DARK,\n \"--proton-control__title-color\": LIGHT_GRAYSCALE.SUPER_DARK,\n \"--proton-control__border-color\": BORDER,\n \"--proton-control__hover-color\": LIGHT_GRAYSCALE.SUPER_LIGHT,\n \"--proton-control__shadow-color\": transparentize(\n LIGHT_GRAYSCALE.SUPER_DARK,\n 0.9\n ),\n \"--proton-control__border-radius\": \"4px\",\n \"--proton-control__interactive-color\": BRAND.PRIMARY_LIGHT,\n\n // Brand colors\n \"--proton-color__primary\": BRAND.PRIMARY,\n \"--proton-color__primary-light\": BRAND.PRIMARY_LIGHT,\n \"--proton-color__primary-super-light\": BRAND.PRIMARY_SUPER_LIGHT,\n \"--proton-color__secondary\": BRAND.SECONDARY,\n \"--proton-color__secondary-light\": BRAND.SECONDARY_LIGHT,\n \"--proton-color__secondary-super-light\": BRAND.SECONDARY_SUPER_LIGHT,\n\n // Semantic colors\n \"--proton-color__danger-super-dark\": DANGER.SUPER_DARK,\n \"--proton-color__danger-dark\": DANGER.DARK,\n \"--proton-color__danger-medium\": DANGER.MEDIUM,\n \"--proton-color__danger-light\": DANGER.LIGHT,\n \"--proton-color__danger-super-light\": DANGER.SUPER_LIGHT,\n \"--proton-color__warning-dark\": WARNING.DARK,\n \"--proton-color__warning-medium\": WARNING.MEDIUM,\n \"--proton-color__warning-light\": WARNING.LIGHT,\n \"--proton-color__warning-super-light\": WARNING.SUPER_LIGHT,\n \"--proton-color__success-dark\": SUCCESS.DARK,\n \"--proton-color__success-medium\": SUCCESS.MEDIUM,\n \"--proton-color__success-light\": SUCCESS.LIGHT,\n \"--proton-color__success-super-light\": SUCCESS.SUPER_LIGHT,\n\n // Grayscale colors\n \"--proton-color__gray-super-dark\": LIGHT_GRAYSCALE.SUPER_DARK,\n \"--proton-color__gray-dark\": LIGHT_GRAYSCALE.DARK,\n \"--proton-color__gray-medium\": LIGHT_GRAYSCALE.MEDIUM,\n \"--proton-color__gray-medium-light\": LIGHT_GRAYSCALE.MEDIUM_LIGHT,\n \"--proton-color__gray-light\": LIGHT_GRAYSCALE.LIGHT,\n \"--proton-color__gray-lightest\": LIGHT_GRAYSCALE.LIGHTEST,\n \"--proton-color__gray-super-light\": LIGHT_GRAYSCALE.SUPER_LIGHT,\n \"--proton-color__white\": LIGHT_GRAYSCALE.WHITE,\n};\n"],"names":["LIGHT_STYLESHEET","BACKGROUNDS","ELEVATION","LIGHT_GRAYSCALE","BORDER","transparentize","BRAND","DANGER","WARNING","SUCCESS"],"mappings":"yLAMaA,EAAqC,CAEhD,qCAAsCC,
|
|
1
|
+
{"version":3,"file":"stylesheet.cjs.js","sources":["../../../src/design/lightTheme/stylesheet.ts"],"sourcesContent":["import { transparentize } from \"../../utils/color2k\";\nimport { BACKGROUNDS, BRAND, DANGER, WARNING, SUCCESS } from \"../colors\";\nimport { ELEVATION, LIGHT_GRAYSCALE } from \"./colors\";\nimport { BORDER } from \"./colors\";\nimport type { ProtonStyleSheet } from \"../types\";\n\nexport const LIGHT_STYLESHEET: ProtonStyleSheet = {\n // Control/component colors\n \"--proton-control__background-color\": BACKGROUNDS.WHITE,\n \"--proton-control__background-color-light\": ELEVATION,\n \"--proton-control__text-color\": LIGHT_GRAYSCALE.DARK,\n \"--proton-control__title-color\": LIGHT_GRAYSCALE.SUPER_DARK,\n \"--proton-control__border-color\": BORDER,\n \"--proton-control__hover-color\": LIGHT_GRAYSCALE.SUPER_LIGHT,\n \"--proton-control__shadow-color\": transparentize(\n LIGHT_GRAYSCALE.SUPER_DARK,\n 0.9\n ),\n \"--proton-control__border-radius\": \"4px\",\n \"--proton-control__interactive-color\": BRAND.PRIMARY_LIGHT,\n\n // Brand colors\n \"--proton-color__primary\": BRAND.PRIMARY,\n \"--proton-color__primary-light\": BRAND.PRIMARY_LIGHT,\n \"--proton-color__primary-super-light\": BRAND.PRIMARY_SUPER_LIGHT,\n \"--proton-color__secondary\": BRAND.SECONDARY,\n \"--proton-color__secondary-light\": BRAND.SECONDARY_LIGHT,\n \"--proton-color__secondary-super-light\": BRAND.SECONDARY_SUPER_LIGHT,\n\n // Semantic colors\n \"--proton-color__danger-super-dark\": DANGER.SUPER_DARK,\n \"--proton-color__danger-dark\": DANGER.DARK,\n \"--proton-color__danger-medium\": DANGER.MEDIUM,\n \"--proton-color__danger-light\": DANGER.LIGHT,\n \"--proton-color__danger-super-light\": DANGER.SUPER_LIGHT,\n \"--proton-color__warning-dark\": WARNING.DARK,\n \"--proton-color__warning-medium\": WARNING.MEDIUM,\n \"--proton-color__warning-light\": WARNING.LIGHT,\n \"--proton-color__warning-super-light\": WARNING.SUPER_LIGHT,\n \"--proton-color__success-dark\": SUCCESS.DARK,\n \"--proton-color__success-medium\": SUCCESS.MEDIUM,\n \"--proton-color__success-light\": SUCCESS.LIGHT,\n \"--proton-color__success-super-light\": SUCCESS.SUPER_LIGHT,\n\n // Grayscale colors\n \"--proton-color__gray-super-dark\": LIGHT_GRAYSCALE.SUPER_DARK,\n \"--proton-color__gray-dark\": LIGHT_GRAYSCALE.DARK,\n \"--proton-color__gray-medium\": LIGHT_GRAYSCALE.MEDIUM,\n \"--proton-color__gray-medium-light\": LIGHT_GRAYSCALE.MEDIUM_LIGHT,\n \"--proton-color__gray-light\": LIGHT_GRAYSCALE.LIGHT,\n \"--proton-color__gray-lightest\": LIGHT_GRAYSCALE.LIGHTEST,\n \"--proton-color__gray-super-light\": LIGHT_GRAYSCALE.SUPER_LIGHT,\n \"--proton-color__white\": LIGHT_GRAYSCALE.WHITE,\n};\n"],"names":["LIGHT_STYLESHEET","BACKGROUNDS","ELEVATION","LIGHT_GRAYSCALE","BORDER","transparentize","BRAND","DANGER","WARNING","SUCCESS"],"mappings":"yLAMaA,EAAqC,CAEhD,qCAAsCC,EAAY,YAAA,MAClD,2CAA4CC,EAAA,UAC5C,+BAAgCC,EAAgB,gBAAA,KAChD,gCAAiCA,EAAgB,gBAAA,WACjD,iCAAkCC,EAAA,OAClC,gCAAiCD,EAAgB,gBAAA,YACjD,iCAAkCE,EAAA,eAChCF,EAAAA,gBAAgB,WAChB,EACF,EACA,kCAAmC,MACnC,sCAAuCG,EAAM,MAAA,cAG7C,0BAA2BA,EAAM,MAAA,QACjC,gCAAiCA,EAAM,MAAA,cACvC,sCAAuCA,EAAM,MAAA,oBAC7C,4BAA6BA,EAAM,MAAA,UACnC,kCAAmCA,EAAM,MAAA,gBACzC,wCAAyCA,EAAM,MAAA,sBAG/C,oCAAqCC,EAAO,OAAA,WAC5C,8BAA+BA,EAAO,OAAA,KACtC,gCAAiCA,EAAO,OAAA,OACxC,+BAAgCA,EAAO,OAAA,MACvC,qCAAsCA,EAAO,OAAA,YAC7C,+BAAgCC,EAAQ,QAAA,KACxC,iCAAkCA,EAAQ,QAAA,OAC1C,gCAAiCA,EAAQ,QAAA,MACzC,sCAAuCA,EAAQ,QAAA,YAC/C,+BAAgCC,EAAQ,QAAA,KACxC,iCAAkCA,EAAQ,QAAA,OAC1C,gCAAiCA,EAAQ,QAAA,MACzC,sCAAuCA,EAAQ,QAAA,YAG/C,kCAAmCN,EAAgB,gBAAA,WACnD,4BAA6BA,EAAgB,gBAAA,KAC7C,8BAA+BA,EAAgB,gBAAA,OAC/C,oCAAqCA,EAAgB,gBAAA,aACrD,6BAA8BA,EAAgB,gBAAA,MAC9C,gCAAiCA,EAAgB,gBAAA,SACjD,mCAAoCA,EAAgB,gBAAA,YACpD,wBAAyBA,EAAgB,gBAAA,KAC3C"}
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import { transparentize as l } from "../../utils/color2k.es.js";
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
2
|
+
import { BACKGROUNDS as c, BRAND as r, DANGER as _, WARNING as t, SUCCESS as n } from "../colors.es.js";
|
|
3
|
+
import { ELEVATION as p, LIGHT_GRAYSCALE as o, BORDER as R } from "./colors.es.js";
|
|
4
4
|
const g = {
|
|
5
5
|
// Control/component colors
|
|
6
6
|
"--proton-control__background-color": c.WHITE,
|
|
7
|
-
"--proton-control__background-color-light":
|
|
7
|
+
"--proton-control__background-color-light": p,
|
|
8
8
|
"--proton-control__text-color": o.DARK,
|
|
9
9
|
"--proton-control__title-color": o.SUPER_DARK,
|
|
10
|
-
"--proton-control__border-color":
|
|
10
|
+
"--proton-control__border-color": R,
|
|
11
11
|
"--proton-control__hover-color": o.SUPER_LIGHT,
|
|
12
12
|
"--proton-control__shadow-color": l(
|
|
13
13
|
o.SUPER_DARK,
|
|
@@ -28,14 +28,14 @@ const g = {
|
|
|
28
28
|
"--proton-color__danger-medium": _.MEDIUM,
|
|
29
29
|
"--proton-color__danger-light": _.LIGHT,
|
|
30
30
|
"--proton-color__danger-super-light": _.SUPER_LIGHT,
|
|
31
|
-
"--proton-color__warning-dark":
|
|
32
|
-
"--proton-color__warning-medium":
|
|
33
|
-
"--proton-color__warning-light":
|
|
34
|
-
"--proton-color__warning-super-light":
|
|
35
|
-
"--proton-color__success-dark":
|
|
36
|
-
"--proton-color__success-medium":
|
|
37
|
-
"--proton-color__success-light":
|
|
38
|
-
"--proton-color__success-super-light":
|
|
31
|
+
"--proton-color__warning-dark": t.DARK,
|
|
32
|
+
"--proton-color__warning-medium": t.MEDIUM,
|
|
33
|
+
"--proton-color__warning-light": t.LIGHT,
|
|
34
|
+
"--proton-color__warning-super-light": t.SUPER_LIGHT,
|
|
35
|
+
"--proton-color__success-dark": n.DARK,
|
|
36
|
+
"--proton-color__success-medium": n.MEDIUM,
|
|
37
|
+
"--proton-color__success-light": n.LIGHT,
|
|
38
|
+
"--proton-color__success-super-light": n.SUPER_LIGHT,
|
|
39
39
|
// Grayscale colors
|
|
40
40
|
"--proton-color__gray-super-dark": o.SUPER_DARK,
|
|
41
41
|
"--proton-color__gray-dark": o.DARK,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"stylesheet.es.js","sources":["../../../src/design/lightTheme/stylesheet.ts"],"sourcesContent":["import { transparentize } from \"../../utils/color2k\";\nimport { BACKGROUNDS, BRAND, DANGER, WARNING, SUCCESS } from \"../colors\";\nimport { ELEVATION, LIGHT_GRAYSCALE } from \"./colors\";\nimport { BORDER } from \"./colors\";\nimport type { ProtonStyleSheet } from \"../types\";\n\nexport const LIGHT_STYLESHEET: ProtonStyleSheet = {\n // Control/component colors\n \"--proton-control__background-color\": BACKGROUNDS.WHITE,\n \"--proton-control__background-color-light\": ELEVATION,\n \"--proton-control__text-color\": LIGHT_GRAYSCALE.DARK,\n \"--proton-control__title-color\": LIGHT_GRAYSCALE.SUPER_DARK,\n \"--proton-control__border-color\": BORDER,\n \"--proton-control__hover-color\": LIGHT_GRAYSCALE.SUPER_LIGHT,\n \"--proton-control__shadow-color\": transparentize(\n LIGHT_GRAYSCALE.SUPER_DARK,\n 0.9\n ),\n \"--proton-control__border-radius\": \"4px\",\n \"--proton-control__interactive-color\": BRAND.PRIMARY_LIGHT,\n\n // Brand colors\n \"--proton-color__primary\": BRAND.PRIMARY,\n \"--proton-color__primary-light\": BRAND.PRIMARY_LIGHT,\n \"--proton-color__primary-super-light\": BRAND.PRIMARY_SUPER_LIGHT,\n \"--proton-color__secondary\": BRAND.SECONDARY,\n \"--proton-color__secondary-light\": BRAND.SECONDARY_LIGHT,\n \"--proton-color__secondary-super-light\": BRAND.SECONDARY_SUPER_LIGHT,\n\n // Semantic colors\n \"--proton-color__danger-super-dark\": DANGER.SUPER_DARK,\n \"--proton-color__danger-dark\": DANGER.DARK,\n \"--proton-color__danger-medium\": DANGER.MEDIUM,\n \"--proton-color__danger-light\": DANGER.LIGHT,\n \"--proton-color__danger-super-light\": DANGER.SUPER_LIGHT,\n \"--proton-color__warning-dark\": WARNING.DARK,\n \"--proton-color__warning-medium\": WARNING.MEDIUM,\n \"--proton-color__warning-light\": WARNING.LIGHT,\n \"--proton-color__warning-super-light\": WARNING.SUPER_LIGHT,\n \"--proton-color__success-dark\": SUCCESS.DARK,\n \"--proton-color__success-medium\": SUCCESS.MEDIUM,\n \"--proton-color__success-light\": SUCCESS.LIGHT,\n \"--proton-color__success-super-light\": SUCCESS.SUPER_LIGHT,\n\n // Grayscale colors\n \"--proton-color__gray-super-dark\": LIGHT_GRAYSCALE.SUPER_DARK,\n \"--proton-color__gray-dark\": LIGHT_GRAYSCALE.DARK,\n \"--proton-color__gray-medium\": LIGHT_GRAYSCALE.MEDIUM,\n \"--proton-color__gray-medium-light\": LIGHT_GRAYSCALE.MEDIUM_LIGHT,\n \"--proton-color__gray-light\": LIGHT_GRAYSCALE.LIGHT,\n \"--proton-color__gray-lightest\": LIGHT_GRAYSCALE.LIGHTEST,\n \"--proton-color__gray-super-light\": LIGHT_GRAYSCALE.SUPER_LIGHT,\n \"--proton-color__white\": LIGHT_GRAYSCALE.WHITE,\n};\n"],"names":["LIGHT_STYLESHEET","BACKGROUNDS","ELEVATION","LIGHT_GRAYSCALE","BORDER","transparentize","BRAND","DANGER","WARNING","SUCCESS"],"mappings":";;;AAMO,MAAMA,IAAqC;AAAA;AAAA,EAEhD,sCAAsCC,EAAY;AAAA,EAClD,4CAA4CC;AAAA,EAC5C,gCAAgCC,EAAgB;AAAA,EAChD,iCAAiCA,EAAgB;AAAA,EACjD,kCAAkCC;AAAA,EAClC,iCAAiCD,EAAgB;AAAA,EACjD,kCAAkCE;AAAA,IAChCF,EAAgB;AAAA,IAChB;AAAA,
|
|
1
|
+
{"version":3,"file":"stylesheet.es.js","sources":["../../../src/design/lightTheme/stylesheet.ts"],"sourcesContent":["import { transparentize } from \"../../utils/color2k\";\nimport { BACKGROUNDS, BRAND, DANGER, WARNING, SUCCESS } from \"../colors\";\nimport { ELEVATION, LIGHT_GRAYSCALE } from \"./colors\";\nimport { BORDER } from \"./colors\";\nimport type { ProtonStyleSheet } from \"../types\";\n\nexport const LIGHT_STYLESHEET: ProtonStyleSheet = {\n // Control/component colors\n \"--proton-control__background-color\": BACKGROUNDS.WHITE,\n \"--proton-control__background-color-light\": ELEVATION,\n \"--proton-control__text-color\": LIGHT_GRAYSCALE.DARK,\n \"--proton-control__title-color\": LIGHT_GRAYSCALE.SUPER_DARK,\n \"--proton-control__border-color\": BORDER,\n \"--proton-control__hover-color\": LIGHT_GRAYSCALE.SUPER_LIGHT,\n \"--proton-control__shadow-color\": transparentize(\n LIGHT_GRAYSCALE.SUPER_DARK,\n 0.9\n ),\n \"--proton-control__border-radius\": \"4px\",\n \"--proton-control__interactive-color\": BRAND.PRIMARY_LIGHT,\n\n // Brand colors\n \"--proton-color__primary\": BRAND.PRIMARY,\n \"--proton-color__primary-light\": BRAND.PRIMARY_LIGHT,\n \"--proton-color__primary-super-light\": BRAND.PRIMARY_SUPER_LIGHT,\n \"--proton-color__secondary\": BRAND.SECONDARY,\n \"--proton-color__secondary-light\": BRAND.SECONDARY_LIGHT,\n \"--proton-color__secondary-super-light\": BRAND.SECONDARY_SUPER_LIGHT,\n\n // Semantic colors\n \"--proton-color__danger-super-dark\": DANGER.SUPER_DARK,\n \"--proton-color__danger-dark\": DANGER.DARK,\n \"--proton-color__danger-medium\": DANGER.MEDIUM,\n \"--proton-color__danger-light\": DANGER.LIGHT,\n \"--proton-color__danger-super-light\": DANGER.SUPER_LIGHT,\n \"--proton-color__warning-dark\": WARNING.DARK,\n \"--proton-color__warning-medium\": WARNING.MEDIUM,\n \"--proton-color__warning-light\": WARNING.LIGHT,\n \"--proton-color__warning-super-light\": WARNING.SUPER_LIGHT,\n \"--proton-color__success-dark\": SUCCESS.DARK,\n \"--proton-color__success-medium\": SUCCESS.MEDIUM,\n \"--proton-color__success-light\": SUCCESS.LIGHT,\n \"--proton-color__success-super-light\": SUCCESS.SUPER_LIGHT,\n\n // Grayscale colors\n \"--proton-color__gray-super-dark\": LIGHT_GRAYSCALE.SUPER_DARK,\n \"--proton-color__gray-dark\": LIGHT_GRAYSCALE.DARK,\n \"--proton-color__gray-medium\": LIGHT_GRAYSCALE.MEDIUM,\n \"--proton-color__gray-medium-light\": LIGHT_GRAYSCALE.MEDIUM_LIGHT,\n \"--proton-color__gray-light\": LIGHT_GRAYSCALE.LIGHT,\n \"--proton-color__gray-lightest\": LIGHT_GRAYSCALE.LIGHTEST,\n \"--proton-color__gray-super-light\": LIGHT_GRAYSCALE.SUPER_LIGHT,\n \"--proton-color__white\": LIGHT_GRAYSCALE.WHITE,\n};\n"],"names":["LIGHT_STYLESHEET","BACKGROUNDS","ELEVATION","LIGHT_GRAYSCALE","BORDER","transparentize","BRAND","DANGER","WARNING","SUCCESS"],"mappings":";;;AAMO,MAAMA,IAAqC;AAAA;AAAA,EAEhD,sCAAsCC,EAAY;AAAA,EAClD,4CAA4CC;AAAA,EAC5C,gCAAgCC,EAAgB;AAAA,EAChD,iCAAiCA,EAAgB;AAAA,EACjD,kCAAkCC;AAAA,EAClC,iCAAiCD,EAAgB;AAAA,EACjD,kCAAkCE;AAAA,IAChCF,EAAgB;AAAA,IAChB;AAAA,EACF;AAAA,EACA,mCAAmC;AAAA,EACnC,uCAAuCG,EAAM;AAAA;AAAA,EAG7C,2BAA2BA,EAAM;AAAA,EACjC,iCAAiCA,EAAM;AAAA,EACvC,uCAAuCA,EAAM;AAAA,EAC7C,6BAA6BA,EAAM;AAAA,EACnC,mCAAmCA,EAAM;AAAA,EACzC,yCAAyCA,EAAM;AAAA;AAAA,EAG/C,qCAAqCC,EAAO;AAAA,EAC5C,+BAA+BA,EAAO;AAAA,EACtC,iCAAiCA,EAAO;AAAA,EACxC,gCAAgCA,EAAO;AAAA,EACvC,sCAAsCA,EAAO;AAAA,EAC7C,gCAAgCC,EAAQ;AAAA,EACxC,kCAAkCA,EAAQ;AAAA,EAC1C,iCAAiCA,EAAQ;AAAA,EACzC,uCAAuCA,EAAQ;AAAA,EAC/C,gCAAgCC,EAAQ;AAAA,EACxC,kCAAkCA,EAAQ;AAAA,EAC1C,iCAAiCA,EAAQ;AAAA,EACzC,uCAAuCA,EAAQ;AAAA;AAAA,EAG/C,mCAAmCN,EAAgB;AAAA,EACnD,6BAA6BA,EAAgB;AAAA,EAC7C,+BAA+BA,EAAgB;AAAA,EAC/C,qCAAqCA,EAAgB;AAAA,EACrD,8BAA8BA,EAAgB;AAAA,EAC9C,iCAAiCA,EAAgB;AAAA,EACjD,oCAAoCA,EAAgB;AAAA,EACpD,yBAAyBA,EAAgB;AAC3C;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useBreakpoint.cjs.js","sources":["../../src/hooks/useBreakpoint.tsx"],"sourcesContent":["import { useState } from \"react\";\n\nimport { useEffect } from \"react\";\nimport { Breakpoint } from \"../constants\";\n\ntype BreakpointDirection = \"up\" | \"down\";\n\nexport function useBreakpoint(\n breakpoint: Breakpoint,\n direction: BreakpointDirection = \"down\"\n) {\n const query =\n direction === \"down\"\n ? `(max-width: ${breakpoint}px)`\n : `(min-width: ${breakpoint}px)`;\n\n const [matches, setMatches] = useState(() =>\n typeof window !== \"undefined\" ? window.matchMedia(query).matches : false\n );\n\n useEffect(() => {\n if (typeof window === \"undefined\") return;\n\n const mediaQuery = window.matchMedia(query);\n const handler = (event: MediaQueryListEvent) => {\n setMatches(event.matches);\n };\n\n mediaQuery.addEventListener(\"change\", handler);\n return () => mediaQuery.removeEventListener(\"change\", handler);\n }, [query]);\n\n return matches;\n}\n"],"names":["useBreakpoint","breakpoint","direction","query","matches","setMatches","useState","useEffect","mediaQuery","handler","event"],"mappings":"
|
|
1
|
+
{"version":3,"file":"useBreakpoint.cjs.js","sources":["../../src/hooks/useBreakpoint.tsx"],"sourcesContent":["import { useState } from \"react\";\n\nimport { useEffect } from \"react\";\nimport { Breakpoint } from \"../constants\";\n\ntype BreakpointDirection = \"up\" | \"down\";\n\nexport function useBreakpoint(\n breakpoint: Breakpoint,\n direction: BreakpointDirection = \"down\"\n) {\n const query =\n direction === \"down\"\n ? `(max-width: ${breakpoint}px)`\n : `(min-width: ${breakpoint}px)`;\n\n const [matches, setMatches] = useState(() =>\n typeof window !== \"undefined\" ? window.matchMedia(query).matches : false\n );\n\n useEffect(() => {\n if (typeof window === \"undefined\") return;\n\n const mediaQuery = window.matchMedia(query);\n const handler = (event: MediaQueryListEvent) => {\n setMatches(event.matches);\n };\n\n mediaQuery.addEventListener(\"change\", handler);\n return () => mediaQuery.removeEventListener(\"change\", handler);\n }, [query]);\n\n return matches;\n}\n"],"names":["useBreakpoint","breakpoint","direction","query","matches","setMatches","useState","useEffect","mediaQuery","handler","event"],"mappings":"yGAOgB,SAAAA,EACdC,EACAC,EAAiC,OACjC,CACA,MAAMC,EACJD,IAAc,OACV,eAAeD,CAAU,MACzB,eAAeA,CAAU,MAEzB,CAACG,EAASC,CAAU,EAAIC,EAAA,SAAS,IACrC,OAAO,OAAW,IAAc,OAAO,WAAWH,CAAK,EAAE,QAAU,EAAA,EAGrEI,OAAAA,EAAAA,UAAU,IAAM,CACV,GAAA,OAAO,OAAW,IAAa,OAE7B,MAAAC,EAAa,OAAO,WAAWL,CAAK,EACpCM,EAAWC,GAA+B,CAC9CL,EAAWK,EAAM,OAAO,CAAA,EAGf,OAAAF,EAAA,iBAAiB,SAAUC,CAAO,EACtC,IAAMD,EAAW,oBAAoB,SAAUC,CAAO,CAAA,EAC5D,CAACN,CAAK,CAAC,EAEHC,CACT"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useBreakpoint.es.js","sources":["../../src/hooks/useBreakpoint.tsx"],"sourcesContent":["import { useState } from \"react\";\n\nimport { useEffect } from \"react\";\nimport { Breakpoint } from \"../constants\";\n\ntype BreakpointDirection = \"up\" | \"down\";\n\nexport function useBreakpoint(\n breakpoint: Breakpoint,\n direction: BreakpointDirection = \"down\"\n) {\n const query =\n direction === \"down\"\n ? `(max-width: ${breakpoint}px)`\n : `(min-width: ${breakpoint}px)`;\n\n const [matches, setMatches] = useState(() =>\n typeof window !== \"undefined\" ? window.matchMedia(query).matches : false\n );\n\n useEffect(() => {\n if (typeof window === \"undefined\") return;\n\n const mediaQuery = window.matchMedia(query);\n const handler = (event: MediaQueryListEvent) => {\n setMatches(event.matches);\n };\n\n mediaQuery.addEventListener(\"change\", handler);\n return () => mediaQuery.removeEventListener(\"change\", handler);\n }, [query]);\n\n return matches;\n}\n"],"names":["useBreakpoint","breakpoint","direction","query","matches","setMatches","useState","useEffect","mediaQuery","handler","event"],"mappings":";
|
|
1
|
+
{"version":3,"file":"useBreakpoint.es.js","sources":["../../src/hooks/useBreakpoint.tsx"],"sourcesContent":["import { useState } from \"react\";\n\nimport { useEffect } from \"react\";\nimport { Breakpoint } from \"../constants\";\n\ntype BreakpointDirection = \"up\" | \"down\";\n\nexport function useBreakpoint(\n breakpoint: Breakpoint,\n direction: BreakpointDirection = \"down\"\n) {\n const query =\n direction === \"down\"\n ? `(max-width: ${breakpoint}px)`\n : `(min-width: ${breakpoint}px)`;\n\n const [matches, setMatches] = useState(() =>\n typeof window !== \"undefined\" ? window.matchMedia(query).matches : false\n );\n\n useEffect(() => {\n if (typeof window === \"undefined\") return;\n\n const mediaQuery = window.matchMedia(query);\n const handler = (event: MediaQueryListEvent) => {\n setMatches(event.matches);\n };\n\n mediaQuery.addEventListener(\"change\", handler);\n return () => mediaQuery.removeEventListener(\"change\", handler);\n }, [query]);\n\n return matches;\n}\n"],"names":["useBreakpoint","breakpoint","direction","query","matches","setMatches","useState","useEffect","mediaQuery","handler","event"],"mappings":";AAOgB,SAAAA,EACdC,GACAC,IAAiC,QACjC;AACA,QAAMC,IACJD,MAAc,SACV,eAAeD,CAAU,QACzB,eAAeA,CAAU,OAEzB,CAACG,GAASC,CAAU,IAAIC;AAAA,IAAS,MACrC,OAAO,SAAW,MAAc,OAAO,WAAWH,CAAK,EAAE,UAAU;AAAA,EAAA;AAGrE,SAAAI,EAAU,MAAM;AACV,QAAA,OAAO,SAAW,IAAa;AAE7B,UAAAC,IAAa,OAAO,WAAWL,CAAK,GACpCM,IAAU,CAACC,MAA+B;AAC9C,MAAAL,EAAWK,EAAM,OAAO;AAAA,IAAA;AAGf,WAAAF,EAAA,iBAAiB,UAAUC,CAAO,GACtC,MAAMD,EAAW,oBAAoB,UAAUC,CAAO;AAAA,EAAA,GAC5D,CAACN,CAAK,CAAC,GAEHC;AACT;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useIsClosing.cjs.js","sources":["../../src/hooks/useIsClosing.tsx"],"sourcesContent":["import { useState, useCallback, RefObject, useEffect } from \"react\";\n\ninterface UseIsClosingOptions {\n /**\n * Duration of the closing animation in milliseconds\n * @default 200\n */\n duration?: number;\n /**\n * Callback to run after the closing animation completes\n */\n onClose?: () => void;\n /**\n * When passed, the fade-out class will be added to @ScreenOverlay on close\n */\n overlayRef?: RefObject<HTMLElement>;\n}\n\n/**\n * Hook to manage the closing animation state of a component\n * @interface UseIsClosingOptions\n * @returns Object containing isClosing state and handleClose function\n */\nexport function useIsClosing({\n duration = 200,\n onClose,\n overlayRef,\n}: UseIsClosingOptions) {\n const [isClosing, setIsClosing] = useState(false);\n const [timeoutId, setTimeoutId] = useState<number>();\n\n const handleClose = useCallback(() => {\n if (duration <= 0) {\n console.warn(\n \"useIsClosing: Duration must be positive. Executing onClose immediately.\"\n );\n onClose?.();\n return;\n }\n\n setIsClosing(true);\n\n if (overlayRef?.current) {\n overlayRef.current.classList.add(\"proton-ScreenOverlay__fade-out\");\n }\n\n const id = setTimeout(() => {\n onClose?.();\n setIsClosing(false);\n }, duration);\n\n setTimeoutId(id);\n }, [duration, onClose, overlayRef]);\n\n useEffect(() => {\n return () => {\n if (timeoutId) {\n clearTimeout(timeoutId);\n }\n };\n }, [timeoutId]);\n\n return {\n isClosing,\n handleClose,\n };\n}\n"],"names":["useIsClosing","duration","onClose","overlayRef","isClosing","setIsClosing","useState","timeoutId","setTimeoutId","handleClose","useCallback","id","useEffect"],"mappings":"yGAuBO,SAASA,EAAa,CAC3B,SAAAC,EAAW,IACX,QAAAC,EACA,WAAAC,CACF,EAAwB,CACtB,KAAM,CAACC,EAAWC,CAAY,EAAIC,
|
|
1
|
+
{"version":3,"file":"useIsClosing.cjs.js","sources":["../../src/hooks/useIsClosing.tsx"],"sourcesContent":["import { useState, useCallback, RefObject, useEffect } from \"react\";\n\ninterface UseIsClosingOptions {\n /**\n * Duration of the closing animation in milliseconds\n * @default 200\n */\n duration?: number;\n /**\n * Callback to run after the closing animation completes\n */\n onClose?: () => void;\n /**\n * When passed, the fade-out class will be added to @ScreenOverlay on close\n */\n overlayRef?: RefObject<HTMLElement>;\n}\n\n/**\n * Hook to manage the closing animation state of a component\n * @interface UseIsClosingOptions\n * @returns Object containing isClosing state and handleClose function\n */\nexport function useIsClosing({\n duration = 200,\n onClose,\n overlayRef,\n}: UseIsClosingOptions) {\n const [isClosing, setIsClosing] = useState(false);\n const [timeoutId, setTimeoutId] = useState<number>();\n\n const handleClose = useCallback(() => {\n if (duration <= 0) {\n console.warn(\n \"useIsClosing: Duration must be positive. Executing onClose immediately.\"\n );\n onClose?.();\n return;\n }\n\n setIsClosing(true);\n\n if (overlayRef?.current) {\n overlayRef.current.classList.add(\"proton-ScreenOverlay__fade-out\");\n }\n\n const id = setTimeout(() => {\n onClose?.();\n setIsClosing(false);\n }, duration);\n\n setTimeoutId(id);\n }, [duration, onClose, overlayRef]);\n\n useEffect(() => {\n return () => {\n if (timeoutId) {\n clearTimeout(timeoutId);\n }\n };\n }, [timeoutId]);\n\n return {\n isClosing,\n handleClose,\n };\n}\n"],"names":["useIsClosing","duration","onClose","overlayRef","isClosing","setIsClosing","useState","timeoutId","setTimeoutId","handleClose","useCallback","id","useEffect"],"mappings":"yGAuBO,SAASA,EAAa,CAC3B,SAAAC,EAAW,IACX,QAAAC,EACA,WAAAC,CACF,EAAwB,CACtB,KAAM,CAACC,EAAWC,CAAY,EAAIC,WAAS,EAAK,EAC1C,CAACC,EAAWC,CAAY,EAAIF,EAAiB,SAAA,EAE7CG,EAAcC,EAAAA,YAAY,IAAM,CACpC,GAAIT,GAAY,EAAG,CACT,QAAA,KACN,yEAAA,EAEQC,GAAA,MAAAA,IACV,MACF,CAEAG,EAAa,EAAI,EAEbF,GAAA,MAAAA,EAAY,SACHA,EAAA,QAAQ,UAAU,IAAI,gCAAgC,EAG7D,MAAAQ,EAAK,WAAW,IAAM,CAChBT,GAAA,MAAAA,IACVG,EAAa,EAAK,GACjBJ,CAAQ,EAEXO,EAAaG,CAAE,CACd,EAAA,CAACV,EAAUC,EAASC,CAAU,CAAC,EAElCS,OAAAA,EAAAA,UAAU,IACD,IAAM,CACPL,GACF,aAAaA,CAAS,CACxB,EAED,CAACA,CAAS,CAAC,EAEP,CACL,UAAAH,EACA,YAAAK,CAAA,CAEJ"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useIsClosing.es.js","sources":["../../src/hooks/useIsClosing.tsx"],"sourcesContent":["import { useState, useCallback, RefObject, useEffect } from \"react\";\n\ninterface UseIsClosingOptions {\n /**\n * Duration of the closing animation in milliseconds\n * @default 200\n */\n duration?: number;\n /**\n * Callback to run after the closing animation completes\n */\n onClose?: () => void;\n /**\n * When passed, the fade-out class will be added to @ScreenOverlay on close\n */\n overlayRef?: RefObject<HTMLElement>;\n}\n\n/**\n * Hook to manage the closing animation state of a component\n * @interface UseIsClosingOptions\n * @returns Object containing isClosing state and handleClose function\n */\nexport function useIsClosing({\n duration = 200,\n onClose,\n overlayRef,\n}: UseIsClosingOptions) {\n const [isClosing, setIsClosing] = useState(false);\n const [timeoutId, setTimeoutId] = useState<number>();\n\n const handleClose = useCallback(() => {\n if (duration <= 0) {\n console.warn(\n \"useIsClosing: Duration must be positive. Executing onClose immediately.\"\n );\n onClose?.();\n return;\n }\n\n setIsClosing(true);\n\n if (overlayRef?.current) {\n overlayRef.current.classList.add(\"proton-ScreenOverlay__fade-out\");\n }\n\n const id = setTimeout(() => {\n onClose?.();\n setIsClosing(false);\n }, duration);\n\n setTimeoutId(id);\n }, [duration, onClose, overlayRef]);\n\n useEffect(() => {\n return () => {\n if (timeoutId) {\n clearTimeout(timeoutId);\n }\n };\n }, [timeoutId]);\n\n return {\n isClosing,\n handleClose,\n };\n}\n"],"names":["useIsClosing","duration","onClose","overlayRef","isClosing","setIsClosing","useState","timeoutId","setTimeoutId","handleClose","useCallback","id","useEffect"],"mappings":";AAuBO,SAASA,EAAa;AAAA,EAC3B,UAAAC,IAAW;AAAA,EACX,SAAAC;AAAA,EACA,YAAAC;AACF,GAAwB;AACtB,QAAM,CAACC,GAAWC,CAAY,IAAIC,EAAS,EAAK,GAC1C,CAACC,GAAWC,CAAY,IAAIF,
|
|
1
|
+
{"version":3,"file":"useIsClosing.es.js","sources":["../../src/hooks/useIsClosing.tsx"],"sourcesContent":["import { useState, useCallback, RefObject, useEffect } from \"react\";\n\ninterface UseIsClosingOptions {\n /**\n * Duration of the closing animation in milliseconds\n * @default 200\n */\n duration?: number;\n /**\n * Callback to run after the closing animation completes\n */\n onClose?: () => void;\n /**\n * When passed, the fade-out class will be added to @ScreenOverlay on close\n */\n overlayRef?: RefObject<HTMLElement>;\n}\n\n/**\n * Hook to manage the closing animation state of a component\n * @interface UseIsClosingOptions\n * @returns Object containing isClosing state and handleClose function\n */\nexport function useIsClosing({\n duration = 200,\n onClose,\n overlayRef,\n}: UseIsClosingOptions) {\n const [isClosing, setIsClosing] = useState(false);\n const [timeoutId, setTimeoutId] = useState<number>();\n\n const handleClose = useCallback(() => {\n if (duration <= 0) {\n console.warn(\n \"useIsClosing: Duration must be positive. Executing onClose immediately.\"\n );\n onClose?.();\n return;\n }\n\n setIsClosing(true);\n\n if (overlayRef?.current) {\n overlayRef.current.classList.add(\"proton-ScreenOverlay__fade-out\");\n }\n\n const id = setTimeout(() => {\n onClose?.();\n setIsClosing(false);\n }, duration);\n\n setTimeoutId(id);\n }, [duration, onClose, overlayRef]);\n\n useEffect(() => {\n return () => {\n if (timeoutId) {\n clearTimeout(timeoutId);\n }\n };\n }, [timeoutId]);\n\n return {\n isClosing,\n handleClose,\n };\n}\n"],"names":["useIsClosing","duration","onClose","overlayRef","isClosing","setIsClosing","useState","timeoutId","setTimeoutId","handleClose","useCallback","id","useEffect"],"mappings":";AAuBO,SAASA,EAAa;AAAA,EAC3B,UAAAC,IAAW;AAAA,EACX,SAAAC;AAAA,EACA,YAAAC;AACF,GAAwB;AACtB,QAAM,CAACC,GAAWC,CAAY,IAAIC,EAAS,EAAK,GAC1C,CAACC,GAAWC,CAAY,IAAIF,EAAiB,GAE7CG,IAAcC,EAAY,MAAM;AACpC,QAAIT,KAAY,GAAG;AACT,cAAA;AAAA,QACN;AAAA,MAAA,GAEQC,KAAA,QAAAA;AACV;AAAA,IACF;AAEA,IAAAG,EAAa,EAAI,GAEbF,KAAA,QAAAA,EAAY,WACHA,EAAA,QAAQ,UAAU,IAAI,gCAAgC;AAG7D,UAAAQ,IAAK,WAAW,MAAM;AAChB,MAAAT,KAAA,QAAAA,KACVG,EAAa,EAAK;AAAA,OACjBJ,CAAQ;AAEX,IAAAO,EAAaG,CAAE;AAAA,EACd,GAAA,CAACV,GAAUC,GAASC,CAAU,CAAC;AAElC,SAAAS,EAAU,MACD,MAAM;AACX,IAAIL,KACF,aAAaA,CAAS;AAAA,EACxB,GAED,CAACA,CAAS,CAAC,GAEP;AAAA,IACL,WAAAH;AAAA,IACA,aAAAK;AAAA,EAAA;AAEJ;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useLockBodyScroll.cjs.js","sources":["../../src/hooks/useLockBodyScroll.tsx"],"sourcesContent":["import { useLayoutEffect } from \"react\";\n\n/**\n * A React hook that prevents body scrolling while a component is mounted.\n * Useful for modals, overlays, and other components that should prevent background scrolling.\n */\nexport function useLockBodyScroll(isActive: boolean = true) {\n useLayoutEffect(() => {\n if (!isActive) return;\n\n // Get original body overflow\n const originalStyle = window.getComputedStyle(document.body).overflow;\n // Prevent scrolling on mount\n document.body.style.overflow = \"hidden\";\n // Re-enable scrolling when component unmounts\n return () => {\n document.body.style.overflow = originalStyle;\n };\n }, [isActive]); // Empty array ensures effect is only run on mount and unmount\n}\n"],"names":["useLockBodyScroll","isActive","useLayoutEffect","originalStyle"],"mappings":"
|
|
1
|
+
{"version":3,"file":"useLockBodyScroll.cjs.js","sources":["../../src/hooks/useLockBodyScroll.tsx"],"sourcesContent":["import { useLayoutEffect } from \"react\";\n\n/**\n * A React hook that prevents body scrolling while a component is mounted.\n * Useful for modals, overlays, and other components that should prevent background scrolling.\n */\nexport function useLockBodyScroll(isActive: boolean = true) {\n useLayoutEffect(() => {\n if (!isActive) return;\n\n // Get original body overflow\n const originalStyle = window.getComputedStyle(document.body).overflow;\n // Prevent scrolling on mount\n document.body.style.overflow = \"hidden\";\n // Re-enable scrolling when component unmounts\n return () => {\n document.body.style.overflow = originalStyle;\n };\n }, [isActive]); // Empty array ensures effect is only run on mount and unmount\n}\n"],"names":["useLockBodyScroll","isActive","useLayoutEffect","originalStyle"],"mappings":"yGAMgB,SAAAA,EAAkBC,EAAoB,GAAM,CAC1DC,EAAAA,gBAAgB,IAAM,CACpB,GAAI,CAACD,EAAU,OAGf,MAAME,EAAgB,OAAO,iBAAiB,SAAS,IAAI,EAAE,SAEpD,gBAAA,KAAK,MAAM,SAAW,SAExB,IAAM,CACF,SAAA,KAAK,MAAM,SAAWA,CAAA,CACjC,EACC,CAACF,CAAQ,CAAC,CACf"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useLockBodyScroll.es.js","sources":["../../src/hooks/useLockBodyScroll.tsx"],"sourcesContent":["import { useLayoutEffect } from \"react\";\n\n/**\n * A React hook that prevents body scrolling while a component is mounted.\n * Useful for modals, overlays, and other components that should prevent background scrolling.\n */\nexport function useLockBodyScroll(isActive: boolean = true) {\n useLayoutEffect(() => {\n if (!isActive) return;\n\n // Get original body overflow\n const originalStyle = window.getComputedStyle(document.body).overflow;\n // Prevent scrolling on mount\n document.body.style.overflow = \"hidden\";\n // Re-enable scrolling when component unmounts\n return () => {\n document.body.style.overflow = originalStyle;\n };\n }, [isActive]); // Empty array ensures effect is only run on mount and unmount\n}\n"],"names":["useLockBodyScroll","isActive","useLayoutEffect","originalStyle"],"mappings":";
|
|
1
|
+
{"version":3,"file":"useLockBodyScroll.es.js","sources":["../../src/hooks/useLockBodyScroll.tsx"],"sourcesContent":["import { useLayoutEffect } from \"react\";\n\n/**\n * A React hook that prevents body scrolling while a component is mounted.\n * Useful for modals, overlays, and other components that should prevent background scrolling.\n */\nexport function useLockBodyScroll(isActive: boolean = true) {\n useLayoutEffect(() => {\n if (!isActive) return;\n\n // Get original body overflow\n const originalStyle = window.getComputedStyle(document.body).overflow;\n // Prevent scrolling on mount\n document.body.style.overflow = \"hidden\";\n // Re-enable scrolling when component unmounts\n return () => {\n document.body.style.overflow = originalStyle;\n };\n }, [isActive]); // Empty array ensures effect is only run on mount and unmount\n}\n"],"names":["useLockBodyScroll","isActive","useLayoutEffect","originalStyle"],"mappings":";AAMgB,SAAAA,EAAkBC,IAAoB,IAAM;AAC1D,EAAAC,EAAgB,MAAM;AACpB,QAAI,CAACD,EAAU;AAGf,UAAME,IAAgB,OAAO,iBAAiB,SAAS,IAAI,EAAE;AAEpD,oBAAA,KAAK,MAAM,WAAW,UAExB,MAAM;AACF,eAAA,KAAK,MAAM,WAAWA;AAAA,IAAA;AAAA,EACjC,GACC,CAACF,CAAQ,CAAC;AACf;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"usePalette.cjs.js","sources":["../../src/hooks/usePalette.tsx"],"sourcesContent":["import { THEMES } from \"../design\";\nimport { DARK_PALETTE } from \"../design/darkTheme/colors\";\nimport { LIGHT_PALETTE } from \"../design/lightTheme/colors\";\nimport { generatePalette, getDominantColor } from \"../utils\";\nimport { ProtonPalette } from \"../design/types\";\nimport { useEffect, useState, useCallback, useMemo } from \"react\";\n\n/**\n * Generates a palette based on a background image or theme.\n * @param backgroundImage - The URL of the background image to generate a palette from.\n * @param theme - The theme to generate a palette for.\n * @returns A Palette object containing the generated palette.\n */\nexport const usePalette = (\n backgroundImage: HTMLImageElement | string | null,\n theme: string\n): ProtonPalette => {\n const [palette, setPalette] = useState<ProtonPalette>(LIGHT_PALETTE);\n\n const getPalette = useCallback(async () => {\n if (!backgroundImage) return LIGHT_PALETTE;\n\n try {\n const baseColor = await getDominantColor(\n backgroundImage as HTMLImageElement & string\n );\n const newPalette = generatePalette(baseColor);\n\n return newPalette;\n } catch (error) {\n console.error(\"Failed to generate palette:\", error);\n return LIGHT_PALETTE;\n }\n }, [backgroundImage]);\n\n useEffect(() => {\n const fetchPalette = async () => {\n if (backgroundImage) {\n const newPalette = await getPalette();\n setPalette(newPalette);\n return;\n }\n\n if (theme === THEMES.DARK) {\n setPalette(DARK_PALETTE);\n return;\n }\n\n setPalette(LIGHT_PALETTE);\n };\n\n fetchPalette();\n }, [backgroundImage, theme, getPalette]);\n\n return useMemo(() => palette, [palette]);\n};\n"],"names":["usePalette","backgroundImage","theme","palette","setPalette","useState","LIGHT_PALETTE","getPalette","useCallback","baseColor","getDominantColor","generatePalette","error","useEffect","newPalette","THEMES","DARK_PALETTE","useMemo"],"mappings":"oTAaaA,EAAa,CACxBC,EACAC,IACkB,CAClB,KAAM,CAACC,EAASC,CAAU,EAAIC,
|
|
1
|
+
{"version":3,"file":"usePalette.cjs.js","sources":["../../src/hooks/usePalette.tsx"],"sourcesContent":["import { THEMES } from \"../design\";\nimport { DARK_PALETTE } from \"../design/darkTheme/colors\";\nimport { LIGHT_PALETTE } from \"../design/lightTheme/colors\";\nimport { generatePalette, getDominantColor } from \"../utils\";\nimport { ProtonPalette } from \"../design/types\";\nimport { useEffect, useState, useCallback, useMemo } from \"react\";\n\n/**\n * Generates a palette based on a background image or theme.\n * @param backgroundImage - The URL of the background image to generate a palette from.\n * @param theme - The theme to generate a palette for.\n * @returns A Palette object containing the generated palette.\n */\nexport const usePalette = (\n backgroundImage: HTMLImageElement | string | null,\n theme: string\n): ProtonPalette => {\n const [palette, setPalette] = useState<ProtonPalette>(LIGHT_PALETTE);\n\n const getPalette = useCallback(async () => {\n if (!backgroundImage) return LIGHT_PALETTE;\n\n try {\n const baseColor = await getDominantColor(\n backgroundImage as HTMLImageElement & string\n );\n const newPalette = generatePalette(baseColor);\n\n return newPalette;\n } catch (error) {\n console.error(\"Failed to generate palette:\", error);\n return LIGHT_PALETTE;\n }\n }, [backgroundImage]);\n\n useEffect(() => {\n const fetchPalette = async () => {\n if (backgroundImage) {\n const newPalette = await getPalette();\n setPalette(newPalette);\n return;\n }\n\n if (theme === THEMES.DARK) {\n setPalette(DARK_PALETTE);\n return;\n }\n\n setPalette(LIGHT_PALETTE);\n };\n\n fetchPalette();\n }, [backgroundImage, theme, getPalette]);\n\n return useMemo(() => palette, [palette]);\n};\n"],"names":["usePalette","backgroundImage","theme","palette","setPalette","useState","LIGHT_PALETTE","getPalette","useCallback","baseColor","getDominantColor","generatePalette","error","useEffect","newPalette","THEMES","DARK_PALETTE","useMemo"],"mappings":"oTAaaA,EAAa,CACxBC,EACAC,IACkB,CAClB,KAAM,CAACC,EAASC,CAAU,EAAIC,WAAwBC,EAAa,aAAA,EAE7DC,EAAaC,EAAAA,YAAY,SAAY,CACrC,GAAA,CAACP,EAAwB,OAAAK,gBAEzB,GAAA,CACF,MAAMG,EAAY,MAAMC,EAAA,iBACtBT,CAAA,EAIK,OAFYU,kBAAgBF,CAAS,QAGrCG,EAAO,CACN,eAAA,MAAM,8BAA+BA,CAAK,EAC3CN,eACT,CAAA,EACC,CAACL,CAAe,CAAC,EAEpBY,OAAAA,EAAAA,UAAU,IAAM,EACO,SAAY,CAC/B,GAAIZ,EAAiB,CACb,MAAAa,EAAa,MAAMP,IACzBH,EAAWU,CAAU,EACrB,MACF,CAEI,GAAAZ,IAAUa,SAAO,KAAM,CACzBX,EAAWY,EAAY,YAAA,EACvB,MACF,CAEAZ,EAAWE,EAAa,aAAA,CAAA,IAIzB,EAAA,CAACL,EAAiBC,EAAOK,CAAU,CAAC,EAEhCU,EAAQ,QAAA,IAAMd,EAAS,CAACA,CAAO,CAAC,CACzC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"usePalette.es.js","sources":["../../src/hooks/usePalette.tsx"],"sourcesContent":["import { THEMES } from \"../design\";\nimport { DARK_PALETTE } from \"../design/darkTheme/colors\";\nimport { LIGHT_PALETTE } from \"../design/lightTheme/colors\";\nimport { generatePalette, getDominantColor } from \"../utils\";\nimport { ProtonPalette } from \"../design/types\";\nimport { useEffect, useState, useCallback, useMemo } from \"react\";\n\n/**\n * Generates a palette based on a background image or theme.\n * @param backgroundImage - The URL of the background image to generate a palette from.\n * @param theme - The theme to generate a palette for.\n * @returns A Palette object containing the generated palette.\n */\nexport const usePalette = (\n backgroundImage: HTMLImageElement | string | null,\n theme: string\n): ProtonPalette => {\n const [palette, setPalette] = useState<ProtonPalette>(LIGHT_PALETTE);\n\n const getPalette = useCallback(async () => {\n if (!backgroundImage) return LIGHT_PALETTE;\n\n try {\n const baseColor = await getDominantColor(\n backgroundImage as HTMLImageElement & string\n );\n const newPalette = generatePalette(baseColor);\n\n return newPalette;\n } catch (error) {\n console.error(\"Failed to generate palette:\", error);\n return LIGHT_PALETTE;\n }\n }, [backgroundImage]);\n\n useEffect(() => {\n const fetchPalette = async () => {\n if (backgroundImage) {\n const newPalette = await getPalette();\n setPalette(newPalette);\n return;\n }\n\n if (theme === THEMES.DARK) {\n setPalette(DARK_PALETTE);\n return;\n }\n\n setPalette(LIGHT_PALETTE);\n };\n\n fetchPalette();\n }, [backgroundImage, theme, getPalette]);\n\n return useMemo(() => palette, [palette]);\n};\n"],"names":["usePalette","backgroundImage","theme","palette","setPalette","useState","LIGHT_PALETTE","getPalette","useCallback","baseColor","getDominantColor","generatePalette","error","useEffect","newPalette","THEMES","DARK_PALETTE","useMemo"],"mappings":";;;;;;
|
|
1
|
+
{"version":3,"file":"usePalette.es.js","sources":["../../src/hooks/usePalette.tsx"],"sourcesContent":["import { THEMES } from \"../design\";\nimport { DARK_PALETTE } from \"../design/darkTheme/colors\";\nimport { LIGHT_PALETTE } from \"../design/lightTheme/colors\";\nimport { generatePalette, getDominantColor } from \"../utils\";\nimport { ProtonPalette } from \"../design/types\";\nimport { useEffect, useState, useCallback, useMemo } from \"react\";\n\n/**\n * Generates a palette based on a background image or theme.\n * @param backgroundImage - The URL of the background image to generate a palette from.\n * @param theme - The theme to generate a palette for.\n * @returns A Palette object containing the generated palette.\n */\nexport const usePalette = (\n backgroundImage: HTMLImageElement | string | null,\n theme: string\n): ProtonPalette => {\n const [palette, setPalette] = useState<ProtonPalette>(LIGHT_PALETTE);\n\n const getPalette = useCallback(async () => {\n if (!backgroundImage) return LIGHT_PALETTE;\n\n try {\n const baseColor = await getDominantColor(\n backgroundImage as HTMLImageElement & string\n );\n const newPalette = generatePalette(baseColor);\n\n return newPalette;\n } catch (error) {\n console.error(\"Failed to generate palette:\", error);\n return LIGHT_PALETTE;\n }\n }, [backgroundImage]);\n\n useEffect(() => {\n const fetchPalette = async () => {\n if (backgroundImage) {\n const newPalette = await getPalette();\n setPalette(newPalette);\n return;\n }\n\n if (theme === THEMES.DARK) {\n setPalette(DARK_PALETTE);\n return;\n }\n\n setPalette(LIGHT_PALETTE);\n };\n\n fetchPalette();\n }, [backgroundImage, theme, getPalette]);\n\n return useMemo(() => palette, [palette]);\n};\n"],"names":["usePalette","backgroundImage","theme","palette","setPalette","useState","LIGHT_PALETTE","getPalette","useCallback","baseColor","getDominantColor","generatePalette","error","useEffect","newPalette","THEMES","DARK_PALETTE","useMemo"],"mappings":";;;;;;AAaa,MAAAA,IAAa,CACxBC,GACAC,MACkB;AAClB,QAAM,CAACC,GAASC,CAAU,IAAIC,EAAwBC,CAAa,GAE7DC,IAAaC,EAAY,YAAY;AACrC,QAAA,CAACP,EAAwB,QAAAK;AAEzB,QAAA;AACF,YAAMG,IAAY,MAAMC;AAAA,QACtBT;AAAA,MAAA;AAIK,aAFYU,EAAgBF,CAAS;AAAA,aAGrCG,GAAO;AACN,qBAAA,MAAM,+BAA+BA,CAAK,GAC3CN;AAAA,IACT;AAAA,EAAA,GACC,CAACL,CAAe,CAAC;AAEpB,SAAAY,EAAU,MAAM;AAgBD,KAfQ,YAAY;AAC/B,UAAIZ,GAAiB;AACb,cAAAa,IAAa,MAAMP;AACzB,QAAAH,EAAWU,CAAU;AACrB;AAAA,MACF;AAEI,UAAAZ,MAAUa,EAAO,MAAM;AACzB,QAAAX,EAAWY,CAAY;AACvB;AAAA,MACF;AAEA,MAAAZ,EAAWE,CAAa;AAAA,IAAA;EAIzB,GAAA,CAACL,GAAiBC,GAAOK,CAAU,CAAC,GAEhCU,EAAQ,MAAMd,GAAS,CAACA,CAAO,CAAC;AACzC;"}
|