@graupl/graupl 1.0.0-beta.1 → 1.0.0-beta.10
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/.devcontainer/devcontainer.json +221 -0
- package/.env +3 -0
- package/.github/workflows/docs.yml +13 -6
- package/.github/workflows/prerelease.yml +125 -0
- package/.github/workflows/release.yml +111 -0
- package/.github/workflows/test.yml +54 -3
- package/.versionrc.cjs +12 -0
- package/.vscode/settings.json +10 -0
- package/CHANGELOG.md +196 -1
- package/build.js +4 -2
- package/combine-at-rules.cjs +61 -0
- package/container/.env +26 -0
- package/container/build/app.dockerfile +41 -0
- package/container/docker-compose.yml +27 -0
- package/dist/css/base/button.css +1 -1
- package/dist/css/base/button.css.map +1 -1
- package/dist/css/base/form.css +1 -1
- package/dist/css/base/form.css.map +1 -1
- package/dist/css/base/link.css +1 -1
- package/dist/css/base/link.css.map +1 -1
- package/dist/css/base/table.css +1 -1
- package/dist/css/base/table.css.map +1 -1
- package/dist/css/base.css +1 -1
- package/dist/css/base.css.map +1 -1
- package/dist/css/component/accordion.css +4 -1
- package/dist/css/component/accordion.css.map +1 -1
- package/dist/css/component/alert.css +1 -1
- package/dist/css/component/alert.css.map +1 -1
- package/dist/css/component/card.css +1 -1
- package/dist/css/component/card.css.map +1 -1
- package/dist/css/component/carousel.css +1 -1
- package/dist/css/component/carousel.css.map +1 -1
- package/dist/css/component/input-group.css +1 -1
- package/dist/css/component/input-group.css.map +1 -1
- package/dist/css/component/list.css +2 -0
- package/dist/css/component/list.css.map +1 -0
- package/dist/css/component/menu.css +1 -1
- package/dist/css/component/menu.css.map +1 -1
- package/dist/css/component/navigation.css +1 -1
- package/dist/css/component/navigation.css.map +1 -1
- package/dist/css/component.css +4 -1
- package/dist/css/component.css.map +1 -1
- package/dist/css/graupl.css +4 -1
- package/dist/css/graupl.css.map +1 -1
- package/dist/css/init.css.map +1 -1
- package/dist/css/layout/columns.css +1 -1
- package/dist/css/layout/columns.css.map +1 -1
- package/dist/css/layout/container.css +1 -1
- package/dist/css/layout/container.css.map +1 -1
- package/dist/css/layout/flex-columns.css +1 -1
- package/dist/css/layout/flex-columns.css.map +1 -1
- package/dist/css/layout.css +4 -1
- package/dist/css/layout.css.map +1 -1
- package/dist/css/normalize.css +1 -1
- package/dist/css/normalize.css.map +1 -1
- package/dist/css/state/focus.css +1 -1
- package/dist/css/state/focus.css.map +1 -1
- package/dist/css/state.css +1 -1
- package/dist/css/state.css.map +1 -1
- package/dist/css/theme/color.css +1 -1
- package/dist/css/theme/color.css.map +1 -1
- package/dist/css/theme/typography.css +1 -1
- package/dist/css/theme/typography.css.map +1 -1
- package/dist/css/theme.css +1 -1
- package/dist/css/theme.css.map +1 -1
- package/dist/css/utilities/alignment.css +1 -1
- package/dist/css/utilities/alignment.css.map +1 -1
- package/dist/css/utilities/background.css +2 -0
- package/dist/css/utilities/background.css.map +1 -0
- package/dist/css/utilities/border.css +2 -0
- package/dist/css/utilities/border.css.map +1 -0
- package/dist/css/utilities/color.css +1 -1
- package/dist/css/utilities/color.css.map +1 -1
- package/dist/css/utilities/container.css +2 -0
- package/dist/css/utilities/container.css.map +1 -0
- package/dist/css/utilities/display.css +1 -1
- package/dist/css/utilities/display.css.map +1 -1
- package/dist/css/utilities/flex.css +1 -1
- package/dist/css/utilities/flex.css.map +1 -1
- package/dist/css/utilities/gradient.css +2 -0
- package/dist/css/utilities/gradient.css.map +1 -0
- package/dist/css/utilities/height.css +1 -1
- package/dist/css/utilities/height.css.map +1 -1
- package/dist/css/utilities/inset.css +1 -1
- package/dist/css/utilities/inset.css.map +1 -1
- package/dist/css/utilities/justification.css +1 -1
- package/dist/css/utilities/justification.css.map +1 -1
- package/dist/css/utilities/list.css +1 -1
- package/dist/css/utilities/list.css.map +1 -1
- package/dist/css/utilities/order.css +1 -1
- package/dist/css/utilities/order.css.map +1 -1
- package/dist/css/utilities/position.css +2 -0
- package/dist/css/utilities/position.css.map +1 -0
- package/dist/css/utilities/ratio.css +1 -1
- package/dist/css/utilities/ratio.css.map +1 -1
- package/dist/css/utilities/spacing.css +1 -1
- package/dist/css/utilities/spacing.css.map +1 -1
- package/dist/css/utilities/typography.css +1 -1
- package/dist/css/utilities/typography.css.map +1 -1
- package/dist/css/utilities/visibility.css +1 -1
- package/dist/css/utilities/visibility.css.map +1 -1
- package/dist/css/utilities/visually-hidden.css +2 -0
- package/dist/css/utilities/visually-hidden.css.map +1 -0
- package/dist/css/utilities/width.css +1 -1
- package/dist/css/utilities/width.css.map +1 -1
- package/dist/css/utilities/z-index.css +2 -0
- package/dist/css/utilities/z-index.css.map +1 -0
- package/dist/css/utilities.css +1 -1
- package/dist/css/utilities.css.map +1 -1
- package/dist/js/graupl.cjs.js +5 -3
- package/dist/js/graupl.esm.js +1305 -206
- package/dist/js/graupl.iife.js +5 -3
- package/docs/.vitepress/config.js +31 -1
- package/docs/.vitepress/theme/custom.scss +16 -16
- package/docs/compiling-graupl.md +6 -5
- package/docs/utilities/alignment.md +411 -0
- package/docs/utilities/background.md +192 -0
- package/docs/utilities/border.md +268 -0
- package/docs/utilities/color.md +348 -0
- package/docs/utilities/container.md +3 -0
- package/docs/utilities/display.md +3 -0
- package/docs/utilities/flex.md +3 -0
- package/docs/utilities/gradient.md +3 -0
- package/docs/utilities/height.md +3 -0
- package/docs/utilities/inset.md +3 -0
- package/docs/utilities/justification.md +3 -0
- package/docs/utilities/list.md +3 -0
- package/docs/utilities/order.md +3 -0
- package/docs/utilities/position.md +3 -0
- package/docs/utilities/ratio.md +3 -0
- package/docs/utilities/responsive-classes.md +3 -0
- package/docs/utilities/spacing.md +3 -0
- package/docs/utilities/typography.md +3 -0
- package/docs/utilities/visibility.md +3 -0
- package/docs/utilities/visually-hidden.md +3 -0
- package/docs/utilities/width.md +3 -0
- package/docs/utilities/z-index.md +3 -0
- package/favicon.ico +0 -0
- package/index.html +418 -55
- package/logo.svg +296 -0
- package/package.json +33 -37
- package/packages/core/build.js +9 -0
- package/packages/core/dist/css/base/button.css +2 -0
- package/packages/core/dist/css/base/button.css.map +1 -0
- package/packages/core/dist/css/base/form.css +2 -0
- package/packages/core/dist/css/base/form.css.map +1 -0
- package/packages/core/dist/css/base/link.css +2 -0
- package/packages/core/dist/css/base/link.css.map +1 -0
- package/packages/core/dist/css/base/table.css +2 -0
- package/packages/core/dist/css/base/table.css.map +1 -0
- package/packages/core/dist/css/base.css +2 -0
- package/packages/core/dist/css/base.css.map +1 -0
- package/packages/core/dist/css/component/accordion.css +5 -0
- package/packages/core/dist/css/component/accordion.css.map +1 -0
- package/packages/core/dist/css/component/alert.css +2 -0
- package/packages/core/dist/css/component/alert.css.map +1 -0
- package/packages/core/dist/css/component/card.css +2 -0
- package/packages/core/dist/css/component/card.css.map +1 -0
- package/packages/core/dist/css/component/carousel.css +2 -0
- package/packages/core/dist/css/component/carousel.css.map +1 -0
- package/packages/core/dist/css/component/input-group.css +2 -0
- package/packages/core/dist/css/component/input-group.css.map +1 -0
- package/packages/core/dist/css/component/list.css +2 -0
- package/packages/core/dist/css/component/list.css.map +1 -0
- package/packages/core/dist/css/component/menu.css +2 -0
- package/packages/core/dist/css/component/menu.css.map +1 -0
- package/packages/core/dist/css/component/navigation.css +2 -0
- package/packages/core/dist/css/component/navigation.css.map +1 -0
- package/packages/core/dist/css/component.css +5 -0
- package/packages/core/dist/css/component.css.map +1 -0
- package/packages/core/dist/css/graupl.css +5 -0
- package/packages/core/dist/css/graupl.css.map +1 -0
- package/{src/scss/_init.scss → packages/core/dist/css/init.css} +1 -2
- package/packages/core/dist/css/init.css.map +1 -0
- package/packages/core/dist/css/layout/columns.css +2 -0
- package/packages/core/dist/css/layout/columns.css.map +1 -0
- package/packages/core/dist/css/layout/container.css +2 -0
- package/packages/core/dist/css/layout/container.css.map +1 -0
- package/packages/core/dist/css/layout/flex-columns.css +2 -0
- package/packages/core/dist/css/layout/flex-columns.css.map +1 -0
- package/packages/core/dist/css/layout.css +5 -0
- package/packages/core/dist/css/layout.css.map +1 -0
- package/packages/core/dist/css/normalize.css +2 -0
- package/packages/core/dist/css/normalize.css.map +1 -0
- package/packages/core/dist/css/state/focus.css +2 -0
- package/packages/core/dist/css/state/focus.css.map +1 -0
- package/packages/core/dist/css/state.css +2 -0
- package/packages/core/dist/css/state.css.map +1 -0
- package/packages/core/dist/css/theme/color.css +2 -0
- package/packages/core/dist/css/theme/color.css.map +1 -0
- package/packages/core/dist/css/theme/typography.css +2 -0
- package/packages/core/dist/css/theme/typography.css.map +1 -0
- package/packages/core/dist/css/theme.css +2 -0
- package/packages/core/dist/css/theme.css.map +1 -0
- package/packages/core/dist/css/utilities/alignment.css +2 -0
- package/packages/core/dist/css/utilities/alignment.css.map +1 -0
- package/packages/core/dist/css/utilities/background.css +2 -0
- package/packages/core/dist/css/utilities/background.css.map +1 -0
- package/packages/core/dist/css/utilities/border.css +2 -0
- package/packages/core/dist/css/utilities/border.css.map +1 -0
- package/packages/core/dist/css/utilities/color.css +2 -0
- package/packages/core/dist/css/utilities/color.css.map +1 -0
- package/packages/core/dist/css/utilities/container.css +2 -0
- package/packages/core/dist/css/utilities/container.css.map +1 -0
- package/packages/core/dist/css/utilities/display.css +2 -0
- package/packages/core/dist/css/utilities/display.css.map +1 -0
- package/packages/core/dist/css/utilities/flex.css +2 -0
- package/packages/core/dist/css/utilities/flex.css.map +1 -0
- package/packages/core/dist/css/utilities/gradient.css +2 -0
- package/packages/core/dist/css/utilities/gradient.css.map +1 -0
- package/packages/core/dist/css/utilities/height.css +2 -0
- package/packages/core/dist/css/utilities/height.css.map +1 -0
- package/packages/core/dist/css/utilities/inset.css +2 -0
- package/packages/core/dist/css/utilities/inset.css.map +1 -0
- package/packages/core/dist/css/utilities/justification.css +2 -0
- package/packages/core/dist/css/utilities/justification.css.map +1 -0
- package/packages/core/dist/css/utilities/list.css +2 -0
- package/packages/core/dist/css/utilities/list.css.map +1 -0
- package/packages/core/dist/css/utilities/order.css +2 -0
- package/packages/core/dist/css/utilities/order.css.map +1 -0
- package/packages/core/dist/css/utilities/position.css +2 -0
- package/packages/core/dist/css/utilities/position.css.map +1 -0
- package/packages/core/dist/css/utilities/ratio.css +2 -0
- package/packages/core/dist/css/utilities/ratio.css.map +1 -0
- package/packages/core/dist/css/utilities/spacing.css +2 -0
- package/packages/core/dist/css/utilities/spacing.css.map +1 -0
- package/packages/core/dist/css/utilities/typography.css +2 -0
- package/packages/core/dist/css/utilities/typography.css.map +1 -0
- package/packages/core/dist/css/utilities/visibility.css +2 -0
- package/packages/core/dist/css/utilities/visibility.css.map +1 -0
- package/packages/core/dist/css/utilities/visually-hidden.css +2 -0
- package/packages/core/dist/css/utilities/visually-hidden.css.map +1 -0
- package/packages/core/dist/css/utilities/width.css +2 -0
- package/packages/core/dist/css/utilities/width.css.map +1 -0
- package/packages/core/dist/css/utilities/z-index.css +2 -0
- package/packages/core/dist/css/utilities/z-index.css.map +1 -0
- package/packages/core/dist/css/utilities.css +2 -0
- package/packages/core/dist/css/utilities.css.map +1 -0
- package/packages/core/package.json +58 -0
- package/packages/core/scss/base/button.scss +3 -0
- package/packages/core/scss/base/form.scss +3 -0
- package/packages/core/scss/base/link.scss +3 -0
- package/packages/core/scss/base/table.scss +3 -0
- package/packages/core/scss/base.scss +3 -0
- package/packages/core/scss/component/accordion.scss +3 -0
- package/packages/core/scss/component/alert.scss +3 -0
- package/packages/core/scss/component/card.scss +3 -0
- package/packages/core/scss/component/carousel.scss +3 -0
- package/packages/core/scss/component/input-group.scss +3 -0
- package/packages/core/scss/component/list.scss +3 -0
- package/packages/core/scss/component/menu.scss +3 -0
- package/packages/core/scss/component/navigation.scss +3 -0
- package/packages/core/scss/component.scss +3 -0
- package/packages/core/scss/graupl.scss +3 -0
- package/packages/core/scss/init.scss +3 -0
- package/packages/core/scss/layout/columns.scss +3 -0
- package/packages/core/scss/layout/container.scss +3 -0
- package/packages/core/scss/layout/flex-columns.scss +3 -0
- package/packages/core/scss/layout.scss +3 -0
- package/packages/core/scss/normalize.scss +3 -0
- package/packages/core/scss/state/focus.scss +3 -0
- package/packages/core/scss/state.scss +3 -0
- package/packages/core/scss/theme/color.scss +3 -0
- package/packages/core/scss/theme/typography.scss +3 -0
- package/packages/core/scss/theme.scss +3 -0
- package/packages/core/scss/utilities/alignment.scss +3 -0
- package/packages/core/scss/utilities/background.scss +3 -0
- package/packages/core/scss/utilities/border.scss +3 -0
- package/packages/core/scss/utilities/color.scss +3 -0
- package/packages/core/scss/utilities/container.scss +3 -0
- package/packages/core/scss/utilities/display.scss +3 -0
- package/packages/core/scss/utilities/flex.scss +3 -0
- package/packages/core/scss/utilities/gradient.scss +3 -0
- package/packages/core/scss/utilities/height.scss +3 -0
- package/packages/core/scss/utilities/inset.scss +3 -0
- package/packages/core/scss/utilities/justification.scss +3 -0
- package/packages/core/scss/utilities/list.scss +3 -0
- package/packages/core/scss/utilities/order.scss +3 -0
- package/{scss/utilities/postion.scss → packages/core/scss/utilities/position.scss} +1 -1
- package/packages/core/scss/utilities/ratio.scss +3 -0
- package/packages/core/scss/utilities/spacing.scss +3 -0
- package/packages/core/scss/utilities/typography.scss +3 -0
- package/packages/core/scss/utilities/visibility.scss +3 -0
- package/packages/core/scss/utilities/visually-hidden.scss +3 -0
- package/packages/core/scss/utilities/width.scss +3 -0
- package/packages/core/scss/utilities/z-index.scss +3 -0
- package/packages/core/scss/utilities.scss +3 -0
- package/{src → packages/core/src}/scss/_defaults.scss +59 -11
- package/{src → packages/core/src}/scss/_index.scss +1 -1
- package/packages/core/src/scss/_init.scss +6 -0
- package/{src → packages/core/src}/scss/_normalize.scss +1 -1
- package/{src → packages/core/src}/scss/_variables.scss +43 -1
- package/{src → packages/core/src}/scss/base/_index.scss +1 -1
- package/{src → packages/core/src}/scss/base/button/_defaults.scss +13 -24
- package/packages/core/src/scss/base/button/_index.scss +206 -0
- package/packages/core/src/scss/base/button/_mixins.scss +104 -0
- package/{src → packages/core/src}/scss/base/button/_variables.scss +108 -32
- package/{src → packages/core/src}/scss/base/form/_defaults.scss +8 -1
- package/packages/core/src/scss/base/form/_index.scss +227 -0
- package/packages/core/src/scss/base/form/_variables.scss +245 -0
- package/packages/core/src/scss/base/link/_defaults.scss +35 -0
- package/packages/core/src/scss/base/link/_index.scss +245 -0
- package/{src → packages/core/src}/scss/base/link/_variables.scss +148 -40
- package/packages/core/src/scss/base/table/_defaults.scss +68 -0
- package/packages/core/src/scss/base/table/_index.scss +314 -0
- package/packages/core/src/scss/base/table/_variables.scss +309 -0
- package/{src → packages/core/src}/scss/component/_index.scss +2 -1
- package/{src → packages/core/src}/scss/component/accordion/_defaults.scss +1 -1
- package/{src → packages/core/src}/scss/component/accordion/_index.scss +73 -55
- package/{src → packages/core/src}/scss/component/accordion/_variables.scss +68 -28
- package/{src → packages/core/src}/scss/component/alert/_defaults.scss +1 -1
- package/{src → packages/core/src}/scss/component/alert/_index.scss +45 -44
- package/{src → packages/core/src}/scss/component/alert/_variables.scss +54 -24
- package/{src → packages/core/src}/scss/component/card/_defaults.scss +1 -1
- package/{src → packages/core/src}/scss/component/card/_index.scss +47 -13
- package/{src → packages/core/src}/scss/component/card/_variables.scss +54 -24
- package/{src → packages/core/src}/scss/component/carousel/_defaults.scss +1 -1
- package/{src → packages/core/src}/scss/component/carousel/_index.scss +29 -25
- package/{src → packages/core/src}/scss/component/carousel/_variables.scss +1 -1
- package/{src → packages/core/src}/scss/component/input-group/_defaults.scss +1 -1
- package/{src → packages/core/src}/scss/component/input-group/_index.scss +2 -2
- package/{src → packages/core/src}/scss/component/input-group/_variables.scss +1 -1
- package/{src/scss/utilities/order → packages/core/src/scss/component/list}/_defaults.scss +7 -14
- package/packages/core/src/scss/component/list/_index.scss +52 -0
- package/packages/core/src/scss/component/list/_variables.scss +236 -0
- package/{src → packages/core/src}/scss/component/menu/_defaults.scss +11 -20
- package/{src → packages/core/src}/scss/component/menu/_index.scss +9 -6
- package/{src → packages/core/src}/scss/component/menu/_variables.scss +199 -57
- package/packages/core/src/scss/component/navigation/_defaults.scss +23 -0
- package/{src → packages/core/src}/scss/component/navigation/_index.scss +3 -2
- package/{src → packages/core/src}/scss/component/navigation/_variables.scss +79 -26
- package/packages/core/src/scss/functions/_container.scss +38 -0
- package/packages/core/src/scss/functions/_important.scss +36 -0
- package/{src → packages/core/src}/scss/functions/_screen.scss +9 -1
- package/{src → packages/core/src}/scss/functions/_theme.scss +2 -2
- package/packages/core/src/scss/functions/_utility.scss +28 -0
- package/{src → packages/core/src}/scss/layout/_index.scss +1 -1
- package/{src → packages/core/src}/scss/layout/columns/_defaults.scss +9 -4
- package/packages/core/src/scss/layout/columns/_index.scss +137 -0
- package/{src → packages/core/src}/scss/layout/columns/_variables.scss +6 -2
- package/packages/core/src/scss/layout/container/_defaults.scss +35 -0
- package/packages/core/src/scss/layout/container/_index.scss +628 -0
- package/packages/core/src/scss/layout/container/_variables.scss +114 -0
- package/packages/core/src/scss/layout/flex-columns/_defaults.scss +28 -0
- package/packages/core/src/scss/layout/flex-columns/_index.scss +184 -0
- package/{src → packages/core/src}/scss/layout/flex-columns/_variables.scss +5 -1
- package/{src → packages/core/src}/scss/mixins/_animation.scss +1 -1
- package/packages/core/src/scss/mixins/_container.scss +80 -0
- package/{src → packages/core/src}/scss/mixins/_layer.scss +6 -2
- package/{src → packages/core/src}/scss/mixins/_screen.scss +25 -4
- package/packages/core/src/scss/mixins/_state.scss +18 -0
- package/packages/core/src/scss/mixins/_theme.scss +15 -0
- package/packages/core/src/scss/mixins/_utility.scss +185 -0
- package/packages/core/src/scss/mixins/_visually-hidden.scss +30 -0
- package/packages/core/src/scss/state/_index.scss +3 -0
- package/{src → packages/core/src}/scss/state/focus/_defaults.scss +1 -2
- package/packages/core/src/scss/state/focus/_index.scss +42 -0
- package/packages/core/src/scss/state/focus/_mixins.scss +13 -0
- package/{src → packages/core/src}/scss/state/focus/_variables.scss +16 -10
- package/{src → packages/core/src}/scss/theme/_index.scss +1 -1
- package/{src → packages/core/src}/scss/theme/color/_defaults.scss +1 -1
- package/{src → packages/core/src}/scss/theme/color/_index.scss +5 -5
- package/{src → packages/core/src}/scss/theme/color/_variables.scss +5 -1
- package/{src → packages/core/src}/scss/theme/typography/_defaults.scss +1 -1
- package/{src → packages/core/src}/scss/theme/typography/_index.scss +10 -1
- package/{src → packages/core/src}/scss/theme/typography/_variables.scss +19 -2
- package/{src → packages/core/src}/scss/utilities/_index.scss +7 -1
- package/packages/core/src/scss/utilities/_template/_defaults.scss +41 -0
- package/packages/core/src/scss/utilities/_template/_index.scss +171 -0
- package/{src/scss/utilities/alignment → packages/core/src/scss/utilities/_template}/_variables.scss +1 -1
- package/{src → packages/core/src}/scss/utilities/alignment/_defaults.scss +21 -7
- package/packages/core/src/scss/utilities/alignment/_index.scss +336 -0
- package/{src/scss/utilities/display → packages/core/src/scss/utilities/alignment}/_variables.scss +1 -1
- package/packages/core/src/scss/utilities/background/_defaults.scss +122 -0
- package/packages/core/src/scss/utilities/background/_index.scss +634 -0
- package/packages/core/src/scss/utilities/background/_variables.scss +6 -0
- package/packages/core/src/scss/utilities/border/_defaults.scss +73 -0
- package/packages/core/src/scss/utilities/border/_index.scss +558 -0
- package/{src/scss/utilities/list → packages/core/src/scss/utilities/border}/_variables.scss +1 -1
- package/packages/core/src/scss/utilities/color/_defaults.scss +49 -0
- package/packages/core/src/scss/utilities/color/_index.scss +469 -0
- package/{src/scss/utilities/flex → packages/core/src/scss/utilities/color}/_variables.scss +1 -1
- package/packages/core/src/scss/utilities/container/_defaults.scss +40 -0
- package/packages/core/src/scss/utilities/container/_index.scss +174 -0
- package/packages/core/src/scss/utilities/container/_variables.scss +6 -0
- package/packages/core/src/scss/utilities/display/_defaults.scss +47 -0
- package/packages/core/src/scss/utilities/display/_index.scss +184 -0
- package/{src/scss/utilities/inset → packages/core/src/scss/utilities/display}/_variables.scss +1 -1
- package/packages/core/src/scss/utilities/flex/_defaults.scss +99 -0
- package/packages/core/src/scss/utilities/flex/_index.scss +486 -0
- package/{src/scss/utilities/color → packages/core/src/scss/utilities/flex}/_variables.scss +1 -1
- package/packages/core/src/scss/utilities/gradient/_defaults.scss +70 -0
- package/packages/core/src/scss/utilities/gradient/_index.scss +696 -0
- package/packages/core/src/scss/utilities/gradient/_variables.scss +29 -0
- package/packages/core/src/scss/utilities/height/_defaults.scss +54 -0
- package/packages/core/src/scss/utilities/height/_index.scss +525 -0
- package/packages/core/src/scss/utilities/height/_variables.scss +6 -0
- package/packages/core/src/scss/utilities/inset/_defaults.scss +55 -0
- package/packages/core/src/scss/utilities/inset/_index.scss +258 -0
- package/packages/core/src/scss/utilities/inset/_variables.scss +6 -0
- package/{src → packages/core/src}/scss/utilities/justification/_defaults.scss +21 -7
- package/packages/core/src/scss/utilities/justification/_index.scss +333 -0
- package/packages/core/src/scss/utilities/justification/_variables.scss +6 -0
- package/packages/core/src/scss/utilities/list/_defaults.scss +53 -0
- package/packages/core/src/scss/utilities/list/_index.scss +253 -0
- package/packages/core/src/scss/utilities/list/_variables.scss +6 -0
- package/packages/core/src/scss/utilities/order/_defaults.scss +36 -0
- package/packages/core/src/scss/utilities/order/_index.scss +246 -0
- package/packages/core/src/scss/utilities/order/_variables.scss +6 -0
- package/packages/core/src/scss/utilities/position/_defaults.scss +41 -0
- package/packages/core/src/scss/utilities/position/_index.scss +178 -0
- package/{src/scss/utilities/height → packages/core/src/scss/utilities/position}/_variables.scss +1 -1
- package/packages/core/src/scss/utilities/ratio/_defaults.scss +42 -0
- package/packages/core/src/scss/utilities/ratio/_index.scss +188 -0
- package/{src → packages/core/src}/scss/utilities/ratio/_variables.scss +1 -1
- package/{src → packages/core/src}/scss/utilities/spacing/_defaults.scss +19 -4
- package/packages/core/src/scss/utilities/spacing/_index.scss +970 -0
- package/packages/core/src/scss/utilities/spacing/_variables.scss +6 -0
- package/packages/core/src/scss/utilities/typography/_defaults.scss +58 -0
- package/packages/core/src/scss/utilities/typography/_index.scss +1089 -0
- package/packages/core/src/scss/utilities/typography/_variables.scss +6 -0
- package/packages/core/src/scss/utilities/visibility/_defaults.scss +39 -0
- package/packages/core/src/scss/utilities/visibility/_index.scss +173 -0
- package/packages/core/src/scss/utilities/visibility/_variables.scss +6 -0
- package/packages/core/src/scss/utilities/visually-hidden/_defaults.scss +29 -0
- package/packages/core/src/scss/utilities/visually-hidden/_index.scss +189 -0
- package/packages/core/src/scss/utilities/visually-hidden/_variables.scss +6 -0
- package/packages/core/src/scss/utilities/width/_defaults.scss +54 -0
- package/packages/core/src/scss/utilities/width/_index.scss +525 -0
- package/packages/core/src/scss/utilities/width/_variables.scss +6 -0
- package/packages/core/src/scss/utilities/z-index/_defaults.scss +40 -0
- package/packages/core/src/scss/utilities/z-index/_index.scss +173 -0
- package/packages/core/src/scss/utilities/z-index/_variables.scss +6 -0
- package/packages/core/vite.config.js +28 -0
- package/packages/icons/dist/css/base/button.css +2 -0
- package/packages/icons/dist/css/base/button.css.map +1 -0
- package/packages/icons/dist/css/base/link.css +2 -0
- package/packages/icons/dist/css/base/link.css.map +1 -0
- package/packages/icons/dist/css/base.css +2 -0
- package/packages/icons/dist/css/base.css.map +1 -0
- package/packages/icons/dist/css/component/icon.css +2 -0
- package/packages/icons/dist/css/component/icon.css.map +1 -0
- package/packages/icons/dist/css/component.css +2 -0
- package/packages/icons/dist/css/component.css.map +1 -0
- package/packages/icons/dist/css/icon.css +2 -0
- package/packages/icons/dist/css/icon.css.map +1 -0
- package/packages/icons/package.json +48 -0
- package/packages/icons/scss/base/button.scss +3 -0
- package/packages/icons/scss/base/link.scss +3 -0
- package/packages/icons/scss/base.scss +3 -0
- package/packages/icons/scss/component/icon.scss +3 -0
- package/packages/icons/scss/component.scss +3 -0
- package/packages/icons/scss/icon.scss +3 -0
- package/packages/icons/src/scss/_index.scss +4 -0
- package/packages/icons/src/scss/base/_index.scss +4 -0
- package/packages/icons/src/scss/base/button/_defaults.scss +7 -0
- package/packages/icons/src/scss/base/button/_index.scss +58 -0
- package/packages/icons/src/scss/base/button/_variables.scss +7 -0
- package/packages/icons/src/scss/base/link/_defaults.scss +7 -0
- package/packages/icons/src/scss/base/link/_index.scss +58 -0
- package/packages/icons/src/scss/base/link/_variables.scss +7 -0
- package/packages/icons/src/scss/component/_index.scss +3 -0
- package/packages/icons/src/scss/component/icon/_defaults.scss +30 -0
- package/packages/icons/src/scss/component/icon/_index.scss +60 -0
- package/packages/icons/src/scss/component/icon/_mixins.scss +62 -0
- package/packages/icons/src/scss/component/icon/_variables.scss +24 -0
- package/postcss.config.cjs +2 -3
- package/scss/base/button.scss +1 -1
- package/scss/base/form.scss +1 -1
- package/scss/base/link.scss +1 -1
- package/scss/base/table.scss +1 -1
- package/scss/base.scss +1 -1
- package/scss/component/accordion.scss +1 -1
- package/scss/component/alert.scss +1 -1
- package/scss/component/card.scss +1 -1
- package/scss/component/carousel.scss +1 -1
- package/scss/component/input-group.scss +1 -1
- package/scss/component/list.scss +3 -0
- package/scss/component/menu.scss +1 -1
- package/scss/component/navigation.scss +1 -1
- package/scss/component.scss +1 -1
- package/scss/graupl.scss +1 -1
- package/scss/init.scss +1 -1
- package/scss/layout/columns.scss +1 -1
- package/scss/layout/container.scss +1 -1
- package/scss/layout/flex-columns.scss +1 -1
- package/scss/layout.scss +1 -1
- package/scss/normalize.scss +1 -1
- package/scss/state/focus.scss +1 -1
- package/scss/state.scss +1 -1
- package/scss/theme/color.scss +1 -1
- package/scss/theme/typography.scss +1 -1
- package/scss/theme.scss +1 -1
- package/scss/utilities/alignment.scss +1 -1
- package/scss/utilities/background.scss +3 -0
- package/scss/utilities/border.scss +3 -0
- package/scss/utilities/color.scss +1 -1
- package/scss/utilities/container.scss +3 -0
- package/scss/utilities/display.scss +1 -1
- package/scss/utilities/flex.scss +1 -1
- package/scss/utilities/gradient.scss +3 -0
- package/scss/utilities/height.scss +1 -1
- package/scss/utilities/inset.scss +1 -1
- package/scss/utilities/justification.scss +1 -1
- package/scss/utilities/list.scss +1 -1
- package/scss/utilities/order.scss +1 -1
- package/scss/utilities/position.scss +3 -0
- package/scss/utilities/ratio.scss +1 -1
- package/scss/utilities/spacing.scss +1 -1
- package/scss/utilities/typography.scss +1 -1
- package/scss/utilities/visibility.scss +1 -1
- package/scss/utilities/visually-hidden.scss +3 -0
- package/scss/utilities/width.scss +1 -1
- package/scss/utilities/z-index.scss +3 -0
- package/scss/utilities.scss +1 -1
- package/stylelint.config.js +1 -0
- package/vite.config.js +6 -35
- package/dist/css/utilities/postion.css +0 -2
- package/dist/css/utilities/postion.css.map +0 -1
- package/dist/js/component/accordion.cjs.js +0 -3
- package/dist/js/component/accordion.esm.js +0 -1289
- package/dist/js/component/accordion.iife.js +0 -3
- package/dist/js/component/alert.cjs.js +0 -3
- package/dist/js/component/alert.esm.js +0 -529
- package/dist/js/component/alert.iife.js +0 -3
- package/dist/js/component/carousel.cjs.js +0 -3
- package/dist/js/component/carousel.esm.js +0 -1110
- package/dist/js/component/carousel.iife.js +0 -3
- package/src/scss/base/button/_index.scss +0 -107
- package/src/scss/base/button/_mixins.scss +0 -166
- package/src/scss/base/form/_index.scss +0 -93
- package/src/scss/base/form/_variables.scss +0 -153
- package/src/scss/base/link/_defaults.scss +0 -50
- package/src/scss/base/link/_index.scss +0 -134
- package/src/scss/base/table/_defaults.scss +0 -53
- package/src/scss/base/table/_index.scss +0 -121
- package/src/scss/base/table/_variables.scss +0 -135
- package/src/scss/component/navigation/_defaults.scss +0 -29
- package/src/scss/functions/_important.scss +0 -13
- package/src/scss/layout/columns/_index.scss +0 -58
- package/src/scss/layout/container/_defaults.scss +0 -17
- package/src/scss/layout/container/_index.scss +0 -41
- package/src/scss/layout/container/_variables.scss +0 -50
- package/src/scss/layout/flex-columns/_defaults.scss +0 -18
- package/src/scss/layout/flex-columns/_index.scss +0 -80
- package/src/scss/mixins/_utility.scss +0 -30
- package/src/scss/mixins/_visually-hidden.scss +0 -20
- package/src/scss/state/_index.scss +0 -3
- package/src/scss/state/focus/_index.scss +0 -13
- package/src/scss/state/focus/_mixins.scss +0 -15
- package/src/scss/utilities/alignment/_index.scss +0 -75
- package/src/scss/utilities/color/_defaults.scss +0 -35
- package/src/scss/utilities/color/_index.scss +0 -91
- package/src/scss/utilities/display/_defaults.scss +0 -32
- package/src/scss/utilities/display/_index.scss +0 -61
- package/src/scss/utilities/flex/_defaults.scss +0 -63
- package/src/scss/utilities/flex/_index.scss +0 -71
- package/src/scss/utilities/height/_defaults.scss +0 -41
- package/src/scss/utilities/height/_index.scss +0 -98
- package/src/scss/utilities/inset/_defaults.scss +0 -41
- package/src/scss/utilities/inset/_index.scss +0 -37
- package/src/scss/utilities/justification/_index.scss +0 -75
- package/src/scss/utilities/justification/_variables.scss +0 -6
- package/src/scss/utilities/list/_defaults.scss +0 -39
- package/src/scss/utilities/list/_index.scss +0 -56
- package/src/scss/utilities/order/_index.scss +0 -63
- package/src/scss/utilities/order/_variables.scss +0 -6
- package/src/scss/utilities/position/_defaults.scss +0 -26
- package/src/scss/utilities/position/_index.scss +0 -37
- package/src/scss/utilities/position/_variables.scss +0 -6
- package/src/scss/utilities/ratio/_defaults.scss +0 -28
- package/src/scss/utilities/ratio/_index.scss +0 -52
- package/src/scss/utilities/spacing/_index.scss +0 -169
- package/src/scss/utilities/spacing/_variables.scss +0 -6
- package/src/scss/utilities/typography/_defaults.scss +0 -30
- package/src/scss/utilities/typography/_index.scss +0 -224
- package/src/scss/utilities/typography/_variables.scss +0 -6
- package/src/scss/utilities/visibility/_defaults.scss +0 -25
- package/src/scss/utilities/visibility/_index.scss +0 -36
- package/src/scss/utilities/visibility/_variables.scss +0 -6
- package/src/scss/utilities/width/_defaults.scss +0 -41
- package/src/scss/utilities/width/_index.scss +0 -98
- package/src/scss/utilities/width/_variables.scss +0 -6
- /package/{src → packages/core/src}/js/accordion/Accordion.js +0 -0
- /package/{src → packages/core/src}/js/accordion/AccordionItem.js +0 -0
- /package/{src → packages/core/src}/js/accordion/index.js +0 -0
- /package/{src → packages/core/src}/js/alert/Alert.js +0 -0
- /package/{src → packages/core/src}/js/alert/index.js +0 -0
- /package/{src → packages/core/src}/js/carousel/Carousel.js +0 -0
- /package/{src → packages/core/src}/js/carousel/index.js +0 -0
- /package/{src → packages/core/src}/js/domHelpers.js +0 -0
- /package/{src → packages/core/src}/js/eventHandlers.js +0 -0
- /package/{src → packages/core/src}/js/navigation/index.js +0 -0
- /package/{src → packages/core/src}/js/storage.js +0 -0
- /package/{src → packages/core/src}/js/validate.js +0 -0
package/dist/js/graupl.cjs.js
CHANGED
|
@@ -1,5 +1,7 @@
|
|
|
1
|
-
"use strict";var F=Object.defineProperty;var
|
|
1
|
+
"use strict";var F=Object.defineProperty;var q=(s,t,e)=>t in s?F(s,t,{enumerable:!0,configurable:!0,writable:!0,value:e}):s[t]=e;var r=(s,t,e)=>q(s,typeof t!="symbol"?t+"":t,e);function C(s,t){try{if(typeof t!="object"){const e=typeof t;throw new TypeError(`Elements given to isValidInstance() must be inside of an object. "${e}" given.`)}for(const e in t)if(!(t[e]instanceof s)){const i=typeof t[e];throw new TypeError(`${e} must be an instance of ${s.name}. "${i}" given.`)}return{status:!0,error:null}}catch(e){return{status:!1,error:e}}}function o(s,t){try{if(typeof t!="object"){const e=typeof t;throw new TypeError(`Values given to isValidType() must be inside of an object. "${e}" given.`)}for(const e in t){const i=typeof t[e];if(i!==s)throw new TypeError(`${e} must be a ${s}. "${i}" given.`)}return{status:!0,error:null}}catch(e){return{status:!1,error:e}}}function D(s){try{if(typeof s!="object"){const t=typeof s;throw new TypeError(`Values given to isQuerySelector() must be inside of an object. "${t}" given.`)}for(const t in s)try{if(s[t]===null)throw new Error;document.querySelector(s[t])}catch{throw new TypeError(`${t} must be a valid query selector. "${s[t]}" given.`)}return{status:!0,error:null}}catch(t){return{status:!1,error:t}}}function h(s){try{if(typeof s!="object"||Array.isArray(s)){const t=typeof s;throw new TypeError(`Values given to isValidClassList() must be inside of an object. "${t}" given.`)}for(const t in s){const e=typeof s[t];if(e!=="string")if(Array.isArray(s[t]))s[t].forEach(i=>{if(typeof i!="string")throw new TypeError(`${t} must be a string or an array of strings. An array containing non-strings given.`)});else throw new TypeError(`${t} must be a string or an array of strings. "${e}" given.`);else{const i={};i[t]=s[t],D(i)}}return{status:!0,error:null}}catch(t){return{status:!1,error:t}}}function y(s,t){if(o("string",{tagName:s}).status&&C(HTMLElement,t).status){const e=s.toLowerCase();let i=!0;for(const n in t)t[n].tagName.toLowerCase()!==e&&(i=!1);return i}else return!1}function u(s,t){s===""||s.length===0||(typeof s=="string"?t.classList.add(s):t.classList.add(...s))}function d(s,t){s===""||s.length===0||(typeof s=="string"?t.classList.remove(s):t.classList.remove(...s))}class v{constructor({accordionItemElement:t,accordionItemToggleElement:e,accordionItemHeaderElement:i,accordionItemContentElement:n,parentAccordion:a=null}){r(this,"_dom",{item:null,toggle:null,header:null,content:null});r(this,"_elements",{parentAccordion:null});r(this,"_open",!1);r(this,"_locked",!1);r(this,"_expandEvent",new CustomEvent("grauplAccordionItemExpand",{bubbles:!0,detail:{item:this}}));r(this,"_collapseEvent",new CustomEvent("grauplAccordionItemCollapse",{bubbles:!0,detail:{item:this}}));this._dom.item=t,this._dom.toggle=e,this._dom.header=i,this._dom.content=n,this._elements.parentAccordion=a}initialize(){this._setIds(),this._setAriaAttributes(),this.dom.toggle.getAttribute("aria-expanded")==="true"?this.show(!1,!1):this.hide(!1,!1)}get dom(){return this._dom}get elements(){return this._elements}get isOpen(){return this._open}get isLocked(){return this._locked}set isOpen(t){o("boolean",{value:t}),this._open!==t&&(this._open=t)}_setIds(){const{key:t}=this.elements.parentAccordion,e=this.elements.parentAccordion.dom.accordionItems.indexOf(this.dom.item);this.dom.item.id=this.dom.item.id||`accordion-item-${t}-${e}`,this.dom.toggle.id=this.dom.toggle.id||`accordion-item-toggle-${t}-${e}`,this.dom.header.id=this.dom.header.id||`accordion-item-header-${t}-${e}`,this.dom.content.id=this.dom.content.id||`accordion-item-content-${t}-${e}`}_setAriaAttributes(){y("button",{toggle:this.dom.toggle})||this.dom.toggle.setAttribute("role","button"),this.dom.toggle.getAttribute("aria-expanded")!=="true"&&this.dom.toggle.setAttribute("aria-expanded","false"),this.dom.toggle.setAttribute("aria-controls",this.dom.content.id),y("section",{content:this.dom.content})||this.dom.content.setAttribute("role","region"),this.dom.content.setAttribute("aria-labelledby",this.dom.toggle.id)}show(t=!0,e=!0){if(this._open)return;const{closeClass:i,openClass:n,transitionClass:a,openDuration:c}=this.elements.parentAccordion;this.dom.toggle.setAttribute("aria-expanded","true"),e&&a!==""?(u(a,this.dom.item),requestAnimationFrame(()=>{d(i,this.dom.item),this.dom.item.style.height=`${this.dom.header.getBoundingClientRect().height}px`,requestAnimationFrame(()=>{u(n,this.dom.item),this.dom.item.style.height=`${this.dom.header.getBoundingClientRect().height+this.dom.content.getBoundingClientRect().height}px`,requestAnimationFrame(()=>{setTimeout(()=>{d(a,this.dom.item),this.dom.item.style.height=""},c)})})})):(u(n,this.dom.item),d(i,this.dom.item)),this._open=!0,this.elements.parentAccordion.allowMultipleExpand||(this.unlockSiblings(),this.closeSiblings()),this.elements.parentAccordion.allowNoExpand||(this.elements.parentAccordion.openAccordionItems.length<=1?this.lock():this.unlockSiblings()),t&&this.dom.item.dispatchEvent(this._expandEvent)}hide(t=!0,e=!0){if(!this._open||!this.elements.parentAccordion.allowNoExpand&&this.elements.parentAccordion.openAccordionItems.length<=1)return;const{closeClass:i,openClass:n,transitionClass:a,closeDuration:c}=this.elements.parentAccordion;this.dom.toggle.setAttribute("aria-expanded","false"),e&&a!==""?(u(a,this.dom.item),this.dom.item.style.height=`${this.dom.item.getBoundingClientRect().height}px`,requestAnimationFrame(()=>{d(n,this.dom.item),this.dom.item.style.height=`${this.dom.header.getBoundingClientRect().height}px`,requestAnimationFrame(()=>{u(i,this.dom.item),requestAnimationFrame(()=>{setTimeout(()=>{d(a,this.dom.item),this.dom.item.style.height=""},c)})})})):(u(i,this.dom.item),d(n,this.dom.item)),this._open=!1,!this.elements.parentAccordion.allowNoExpand&&this.elements.parentAccordion.openAccordionItems.length===1&&this.elements.parentAccordion.openAccordionItems[0].lock(),t&&this.dom.item.dispatchEvent(this._collapseEvent)}toggle(){this.isOpen?this.hide():this.show()}focus(){this.dom.toggle.focus()}blur(){this.dom.toggle.blur()}lock(){this._locked=!0,this.dom.toggle.setAttribute("disabled","true")}unlock(){this._locked=!1,this.dom.toggle.removeAttribute("disabled")}closeSiblings(){this.elements.parentAccordion&&this.elements.parentAccordion.elements.accordionItems.forEach(t=>{t!==this&&t.hide()})}unlockSiblings(){this.elements.parentAccordion&&this.elements.parentAccordion.elements.accordionItems.forEach(t=>{t!==this&&t.unlock()})}}function f(s){try{const t=s.key||s.keyCode,e={Enter:t==="Enter"||t===13,Space:t===" "||t==="Spacebar"||t===32,Escape:t==="Escape"||t==="Esc"||t===27,ArrowUp:t==="ArrowUp"||t==="Up"||t===38,ArrowRight:t==="ArrowRight"||t==="Right"||t===39,ArrowDown:t==="ArrowDown"||t==="Down"||t===40,ArrowLeft:t==="ArrowLeft"||t==="Left"||t===37,Home:t==="Home"||t===36,End:t==="End"||t===35,Tab:t==="Tab"||t===9};return Object.keys(e).find(i=>e[i]===!0)||""}catch{return""}}function p(s){s.preventDefault(),s.stopPropagation()}function H(s=null){window.Graupl=window.Graupl||{},o("string",{type:s})&&(window.Graupl[s]=window.Graupl[s]||{})}function G(s=null){return o("string",{type:s})?window.Graupl[s]:window.Graupl}function z(s,t={}){o("string",{type:s})&&o("object",{data:t})&&(window.Graupl[s]=t)}function j(s){o("string",{type:s})&&(window.Graupl[s]={})}function P(s,t,e){o("string",{type:s,key:t})&&(window.Graupl[s][t]=e)}function N(s,t){return o("string",{type:s,key:t})?window.Graupl[s][t]:null}function V(s,t){o("string",{type:s,key:t})&&delete window.Graupl[s][t]}const g={initializeStorage:H,getStorage:G,setStorage:z,clearStorage:j,pushToStorage:P,getFromStorage:N,removeFromStorage:V};class R{constructor({accordionElement:t,accordionItemSelector:e=".accordion-item",accordionItemToggleSelector:i=".accordion-item-toggle",accordionItemHeaderSelector:n=".accordion-item-header",accordionItemContentSelector:a=".accordion-item-content",openClass:c="show",closeClass:_="hide",transitionClass:l="transitioning",transitionDuration:m=300,openDuration:E=-1,closeDuration:w=-1,optionalKeySupport:I=!1,allowMultipleExpand:b=!0,allowNoExpand:k=!0,prefix:A="am-",key:T=null,initialize:x=!1}){r(this,"_dom",{accordion:null,accordionItems:[],accordionItemToggles:[],accordionItemHeaders:[],accordionItemContents:[]});r(this,"_domLock",["accordion"]);r(this,"_selectors",{accordionItems:"",accordionItemToggles:"",accordionItemHeaders:"",accordionItemContents:""});r(this,"_elements",{accordionItems:[]});r(this,"_openClass","show");r(this,"_closeClass","hide");r(this,"_transitionClass","transitioning");r(this,"_transitionDuration",300);r(this,"_openDuration",-1);r(this,"_closeDuration",-1);r(this,"_optionalKeySupport",!0);r(this,"_allowMultipleExpand",!0);r(this,"_allowNoExpand",!0);r(this,"_currentChild",0);r(this,"_prefix","graupl-");r(this,"_key","");r(this,"_errors",[]);this._dom.accordion=t,this._selectors.accordionItems=e,this._selectors.accordionItemToggles=i,this._selectors.accordionItemHeaders=n,this._selectors.accordionItemContents=a,this._openClass=c||"",this._closeClass=_||"",this._transitionClass=l||"",this._transitionDuration=m,this._openDuration=E,this._closeDuration=w,this._optionalKeySupport=I,this._allowMultipleExpand=b,this._allowNoExpand=k,this._prefix=A||"",this._key=T||"",x&&this.initialize()}initialize(){try{if(!this._validate())throw new Error(`Graupl Accordion: cannot initialize accordion. The following errors have been found:
|
|
2
2
|
- ${this.errors.join(`
|
|
3
|
-
- `)}`);this._generateKey(),this._setIds(),this._handleClick(),this._handleKeydown(),this._handleKeyup(),
|
|
3
|
+
- `)}`);this._generateKey(),this._setDOMElements(),this._setIds(),this._createChildElements(),this._handleFocus(),this._handleClick(),this._handleKeydown(),this._handleKeyup(),this._setTransitionDurations(),g.initializeStorage("accordions"),g.pushToStorage("accordions",this.dom.accordion.id,this)}catch(t){console.error(t)}}get openClass(){return this._openClass}get closeClass(){return this._closeClass}get transitionClass(){return this._transitionClass}get transitionDuration(){return this._transitionDuration}get openDuration(){return this._openDuration===-1?this.transitionDuration:this._openDuration}get closeDuration(){return this._closeDuration===-1?this.transitionDuration:this._closeDuration}get currentChild(){return this._currentChild}get dom(){return this._dom}get elements(){return this._elements}get selectors(){return this._selectors}get optionalKeySupport(){return this._optionalKeySupport}get currentAccordionItem(){return this.elements.accordionItems[this.currentChild]}get openAccordionItems(){return this.elements.accordionItems.filter(t=>t.isOpen)}get allowMultipleExpand(){return this._allowMultipleExpand}get allowNoExpand(){return this._allowNoExpand}get prefix(){return this._prefix}get key(){return this._key}get errors(){return this._errors}set openClass(t){h({openClass:t}),this._openClass!==t&&(this._openClass=t)}set closeClass(t){h({closeClass:t}),this._closeClass!==t&&(this._closeClass=t)}set transitionClass(t){h({transitionClass:t}),this._transitionClass!==t&&(this._transitionClass=t)}set transitionDuration(t){o("number",{value:t}),this._transitionDuration!==t&&(this._transitionDuration=t,this._setTransitionDurations())}set openDuration(t){o("number",{value:t}),this._openDuration!==t&&(this._openDuration=t,this._setTransitionDurations())}set closeDuration(t){o("number",{value:t}),this._closeDuration!==t&&(this._closeDuration=t,this._setTransitionDurations())}set currentChild(t){o("number",{value:t}),this._currentChild!==t&&t>=0&&t<this.elements.accordionItems.length&&(this._currentChild=t)}set accordionItems(t){o("object",{value:t}),t!=null&&t.isArray()&&t.every(e=>e instanceof v)&&(this._accordionItems=t)}set allowMultipleExpand(t){o("boolean",{value:t}),this._allowMultipleExpand!==t&&(this._allowMultipleExpand=t)}set allowNoExpand(t){o("boolean",{value:t}),this._allowNoExpand!==t&&(this._allowNoExpand=t)}set prefix(t){o("string",{value:t}),this._prefix!==t&&(this._prefix=t)}set key(t){o("string",{value:t}),this._key!==t&&(this._key=t)}_setDOMElementType(t,e=this.dom.accordion,i=!0,n=!1){if(typeof this.selectors[t]=="string"){if(this._domLock.includes(t))throw new Error(`Graupl ${this.contructor.name}: "${t}" element cannot be set through _setDOMElementType.`);e!==this.dom.accordion&&C(HTMLElement,{base:e});const c=Array.from(e.querySelectorAll(this.selectors[t])).filter(_=>n?_.parentElement===e:!0);i?this._dom[t]=c:this._dom[t]=[...this._dom[t],...c]}else throw new Error(`Graupl ${this.contructor.name}: "${t}" is not a valid element type.`)}_resetDOMElementType(t){if(typeof this.selectors[t]=="string"){if(this._domLock.includes(t))throw new Error(`Graupl ${this.contructor.name}: "${t}" element cannot be reset through _resetDOMElementType.`);Array.isArray(this._dom[t])?this._dom[t]=[]:this._dom[t]=null}else throw new Error(`Graupl ${this.contructor.name}: "${t}" is not a valid element type.`)}_setDOMElements(){this._setDOMElementType("accordionItems"),this._resetDOMElementType("accordionItemToggles"),this.dom.accordionItems.forEach(t=>{this._setDOMElementType("accordionItemToggles",t,!1),this._setDOMElementType("accordionItemHeaders",t,!1),this._setDOMElementType("accordionItemContents",t,!1)})}_generateKey(t=!1){(this.key===""||t)&&(this.key=Math.random().toString(36).replace(/[^a-z]+/g,"").substring(0,10))}_setIds(){this.dom.accordion.id=this.dom.accordion.id||`accordion-${this.key}`}_createChildElements(){this.dom.accordionItems.forEach((t,e)=>{const i=new v({accordionItemElement:t,accordionItemToggleElement:this.dom.accordionItemToggles[e],accordionItemHeaderElement:this.dom.accordionItemHeaders[e],accordionItemContentElement:this.dom.accordionItemContents[e],parentAccordion:this});i.initialize(),this.elements.accordionItems.push(i)})}_validate(){let t=!0;const e=C(HTMLElement,{accordionElement:this.dom.accordion});e||(this._errors.push(e.message),t=!1);const i=D({accordionItemSelector:this._selectors.accordionItems,accordionItemToggleSelector:this._selectors.accordionItemToggles,accordionItemHeaderSelector:this._selectors.accordionItemHeaders,accordionItemContentSelector:this._selectors.accordionItemContents});if(i||(this._errors.push(i.message),t=!1),this._openClass!==""){const m=h({openClass:this._openClass});m.status||(this._errors.push(m.error.message),t=!1)}if(this._closeClass!==""){const m=h({closeClass:this._closeClass});m.status||(this._errors.push(m.error.message),t=!1)}if(this._transitionClass!==""){const m=h({transitionClass:this._transitionClass});m.status||(this._errors.push(m.error.message),t=!1)}const n=o("number",{transitionDuration:this._transitionDuration});n.status||(this._errors.push(n.error.message),t=!1);const a=o("number",{openDuration:this._openDuration});a.status||(this._errors.push(a.error.message),t=!1);const c=o("number",{closeDuration:this._closeDuration});c.status||(this._errors.push(c.error.message),t=!1);const _=o("boolean",{optionalKeySupport:this._optionalKeySupport,allowMultipleExpand:this._allowMultipleExpand,allowNoExpand:this._allowNoExpand});if(_.status||(this._errors.push(_.error.message),t=!1),this._key!==""){const m=o("string",{key:this._key});m.status||(this._errors.push(m.error.message),t=!1)}const l=o("string",{prefix:this._prefix});return l.status||(this._errors.push(l.error.message),t=!1),t}_handleFocus(){this.elements.accordionItems.forEach((t,e)=>{t.dom.toggle.addEventListener("focus",()=>{this.currentChild=e})})}_handleClick(){this.elements.accordionItems.forEach((t,e)=>{t.dom.toggle.addEventListener("pointerup",()=>{this.currentChild=e,t.toggle()})})}_handleKeydown(){this.dom.accordionItemToggles.forEach(t=>{t.addEventListener("keydown",e=>{const i=f(e);(["Space","Enter"].includes(i)||this.optionalKeySupport&&["ArrowDown","ArrowUp","Home","End"].includes(i))&&p(e)})})}_handleKeyup(){this.dom.accordionItemToggles.forEach(t=>{t.addEventListener("keyup",e=>{const i=f(e);switch(i){case"Space":case"Enter":p(e),this.currentAccordionItem.toggle();break}if(this.optionalKeySupport)switch(i){case"Home":p(e),this.focusFirstChild();break;case"End":p(e),this.focusLastChild();break;case"ArrowDown":p(e),this.focusNextChild();break;case"ArrowUp":p(e),this.focusPreviousChild();break}})})}_setTransitionDurations(){this.dom.accordion.style.setProperty(`--${this.prefix}accordion-transition-duration`,`${this.transitionDuration}ms`),this.dom.accordion.style.setProperty(`--${this.prefix}accordion-open-transition-duration`,`${this.openDuration}ms`),this.dom.accordion.style.setProperty(`--${this.prefix}accordion-close-transition-duration`,`${this.closeDuration}ms`)}focusCurrentChild(){this.currentChild!==-1&&this.currentAccordionItem.focus()}focusChild(t){this.blurCurrentChild(),this.currentChild=t,this.focusCurrentChild()}focusFirstChild(){this.focusChild(0)}focusLastChild(){this.focusChild(this.elements.accordionItems.length-1)}focusNextChild(){this.currentChild<this.elements.accordionItems.length-1?this.focusChild(this.currentChild+1):this.focusCurrentChild()}focusPreviousChild(){this.currentChild>0?this.focusChild(this.currentChild-1):this.focusCurrentChild()}blurCurrentChild(){this.currentChild!==-1&&this.currentAccordionItem.blur()}openChildren(){this.elements.accordionItems.forEach(t=>t.show())}closeChildren(){this.elements.accordionItems.forEach(t=>t.hide())}}class B{constructor({alertElement:t,controllerElement:e=null,showClass:i="show",hideClass:n="hide",transitionClass:a="transitioning",transitionTimer:c=150,isHidden:_=!1,key:l=null,initialize:m=!1}){r(this,"_dom",{alert:null,controller:null});r(this,"_hidden",!1);r(this,"_showClass","");r(this,"_hideClass","");r(this,"_transitionClass","");r(this,"_transitionTimer",150);r(this,"_key","");r(this,"_errors",[]);r(this,"_showEvent",new CustomEvent("grauplAlertShow",{bubbles:!0,detail:{alert:this}}));r(this,"_hideEvent",new CustomEvent("grauplAlertHide",{bubbles:!0,detail:{alert:this}}));this._dom.alert=t,this._dom.controller=e,this._showClass=i||"",this._hideClass=n||"",this._transitionClass=a||"",this._transitionTimer=c,this._hidden=_,this._key=l||"",m&&this.initialize()}initialize(){try{if(!this._validate())throw new Error(`Graupl Alert: cannot initialize alert. The following errors have been found:
|
|
4
4
|
- ${this.errors.join(`
|
|
5
|
-
- `)}`);this._generateKey(),this._setDOMElements(),this._setIds(),this._setAriaAttributes(),this.activateFirstItem(),this._handleAutoplay(),this._handleFocus(),this._handleClick(),this._handleHover(),this._handleKeydown(),this._handleKeyup(),this._setTransitionDuration(),C.initializeStorage("carousels"),C.pushToStorage("carousels",this.dom.carousel.id,this)}catch(t){console.error(t)}}get dom(){return this._dom}get selectors(){return this._selectors}get activeClass(){return this._activeClass}get previousClass(){return this._previousClass}get nextClass(){return this._nextClass}get playClass(){return this._playClass}get pauseClass(){return this._pauseClass}get currentItem(){return this._currentItem}get currentCarouselItem(){return this.dom.carouselItems[this.currentItem]}get currentCarouselTab(){return this.dom.carouselTabs[this.currentItem]}get autoplay(){return this._autoplay}get transitionDelay(){return this._transitionDelay}get transitionDuration(){return this._transitionDuration}get playText(){return this._playText}get pauseText(){return this._pauseText}get prefix(){return this._prefix}get key(){return this._key}get currentAction(){return this._currentAction}get errors(){return this._errors}set currentItem(t){if(a("number",{value:t}),t===this.currentItem)return;t<0?this._currentItem=0:t>=this.dom.carouselItems.length?this._currentItem=this.dom.carouselItems.length-1:this._currentItem=t,this._dom.carousel.querySelectorAll(this.selectors.carouselTab)&&this.dom.carouselItems.forEach((i,n)=>{i.setAttribute("aria-selected",n===this._currentItem)})}set autoplay(t){a("boolean",{value:t}),this._autoplay!==t&&(this._autoplay=t)}set activeClass(t){h({activeClass:t}),this._activeClass!==t&&(this._activeClass=t)}set previousClass(t){h({previousClass:t}),this._previousClass!==t&&(this._previousClass=t)}set nextClass(t){h({nextClass:t}),this._nextClass!==t&&(this._nextClass=t)}set playClass(t){h({playClass:t}),this._playClass!==t&&(this._playClass=t)}set pauseClass(t){h({pauseClass:t}),this._pauseClass!==t&&(this._pauseClass=t)}set transitionDelay(t){a("number",{value:t}),t!==this.transitionDelay&&t>=0&&(this._currentItem=t)}set transitionDuration(t){a("number",{value:t}),this._transitionDuration!==t&&t>=0&&(this._transitionDuration=t,this._setTransitionDuration())}set playText(t){a("string",{value:t}),this._playText!==t&&(this._playText=t)}set pauseText(t){a("string",{value:t}),this._pauseText!==t&&(this._pauseText=t)}set prefix(t){a("string",{value:t}),this._prefix!==t&&(this._prefix=t)}set key(t){a("string",{value:t}),this._key!==t&&(this._key=t)}_validate(){let t=!0;const s=f(HTMLElement,{carousel:this.dom.carousel});s||(this._errors.push(s.message),t=!1);const i=w({carouselItemsSelector:this._selectors.carouselItems,carouselItemContainerSelector:this._selectors.carouselItemContainer,carouselControlsSelector:this._selectors.carouselControls,carouselControlContainerSelector:this._selectors.carouselControlContainer,carouselTabsSelector:this._selectors.carouselTabs,carouselTabContainerSelector:this._selectors.carouselTabContainer,autoplaySelector:this._selectors.autoplay,nextSelector:this._selectors.next,previousSelector:this._selectors.previous});i||(this._errors.push(i.message),t=!1);const n=a("boolean",{autoplay:this.autoplay});n||(this._errors.push(n.message),t=!1);const l=a("number",{transitionDelay:this._transitionDelay});l||(this._errors.push(l.message),t=!1);const d=a("number",{transitionDuration:this._transitionDuration});if(d||(this._errors.push(d.message),t=!1),this._activeClass!==""){const o=h({activeClass:this._activeClass});o||(this._errors.push(o.message),t=!1)}if(this._previousClass!==""){const o=h({previousClass:this._previousClass});o||(this._errors.push(o.message),t=!1)}if(this._nextClass!==""){const o=h({nextClass:this._nextClass});o||(this._errors.push(o.message),t=!1)}if(this._playClass!==""){const o=h({playClass:this._playClass});o||(this._errors.push(o.message),t=!1)}if(this._pauseClass!==""){const o=h({pauseClass:this._pauseClass});o||(this._errors.push(o.message),t=!1)}if(this._playText!==""){const o=a("string",{playText:this._playText});o||(this._errors.push(o.message),t=!1)}if(this._pauseText!==""){const o=a("string",{pauseText:this._pauseText});o||(this._errors.push(o.message),t=!1)}const p=a("string",{prefix:this._prefix});return p||(this._errors.push(p.message),t=!1),t}_setDOMElementType(t,s=this.dom.carousel,i=!0){if(typeof this.selectors[t]=="string"){if(t==="carousel")throw new Error(`Graupl Carousel: "${t}" element cannot be set through _setDOMElementType.`);if(s!==this.dom.carousel&&f(HTMLElement,{base:s}),Array.isArray(this._dom[t])){const l=Array.from(s.querySelectorAll(this.selectors[t])).filter(d=>d.parentElement===s);i?this._dom[t]=l:this._dom[t]=[...this._dom[t],...l]}else{const n=s.querySelector(this.selectors[t]);if(n&&n.parentElement!==s)return;i&&(this._dom[t]=n)}}else throw new Error(`Graupl Carousel: "${t}" is not a valid element type within the carousel.`)}_resetDOMElementType(t){if(typeof this.selectors[t]=="string"){if(t==="carousel")throw new Error(`Graupl Carousel: "${t}" element cannot be reset through _resetDOMElementType.`);Array.isArray(this._dom[t])?this._dom[t]=[]:this._dom[t]=null}else throw new Error(`Graupl Carousel: "${t}" is not a valid element type within the carousel.`)}_setDOMElements(){this._setDOMElementType("carouselItemContainer"),this._setDOMElementType("carouselControlContainer"),this._setDOMElementType("carouselTabContainer"),this.dom.carouselItemContainer&&this._setDOMElementType("carouselItems",this.dom.carouselItemContainer),this.dom.carouselControlContainer&&(this._setDOMElementType("carouselControls",this.dom.carouselControlContainer),this._setDOMElementType("autoplay",this.dom.carouselControlContainer),this._setDOMElementType("next",this.dom.carouselControlContainer),this._setDOMElementType("previous",this.dom.carouselControlContainer)),this._dom.carouselTabContainer&&this._setDOMElementType("carouselTabs",this.dom.carouselTabContainer)}_generateKey(t=!1){(this.key===""||t)&&(this.key=Math.random().toString(36).replace(/[^a-z]+/g,"").substring(0,10))}_setIds(){this.dom.carousel.id=this.dom.carousel.id||`carousel-${this.key}`,this.dom.carouselItems.forEach((t,s)=>{t.id=t.id||`carousel-item-${this.key}-${s}`}),this.dom.carouselTabs.forEach((t,s)=>{t.id=t.id||`carousel-tab-${this.key}-${s}`})}_setAriaAttributes(){!g("section",{carousel:this.dom.carousel})&&!this.dom.carousel.getAttribute("role")!=="region"&&this.dom.carousel.setAttribute("role","group"),this._dom.carousel.setAttribute("aria-roledescription","carousel"),this.dom.carouselTabContainer&&this.dom.carouselTabContainer.setAttribute("role","tablist"),this.dom.carouselTabs.forEach((t,s)=>{g("button",{tab:t})||t.setAttribute("role","button"),t.setAttribute("aria-selected",s===0),t.setAttribute("aria-controls",this.dom.carouselItems[s].id)})}_setInterval(){this._clearInterval(),this._autoplayInterval=setInterval(()=>{this.activateNextItem()},this.transitionDelay)}_clearInterval(){clearInterval(this._autoplayInterval)}_handleAutoplay(){this.autoplay?(u(this.pauseClass,this.dom.autoplay),c(this.playClass,this.dom.autoplay),this.dom.autoplay.setAttribute("aria-label",this.pauseText),this.dom.carousel.setAttribute("aria-live","off"),this._setInterval()):(u(this.playClass,this.dom.autoplay),c(this.pauseClass,this.dom.autoplay),this.dom.autoplay.setAttribute("aria-label",this.playText),this.dom.carousel.setAttribute("aria-live","polite"),this._clearInterval())}_handleFocus(){this.dom.carousel.addEventListener("focusin",()=>{this.autoplay&&this._clearInterval()}),this.dom.carousel.addEventListener("focusout",()=>{this.autoplay&&this._setInterval()})}_handleClick(){this.dom.next.addEventListener("pointerup",()=>{this.activateNextItem()}),this.dom.previous.addEventListener("pointerup",()=>{this.activatePreviousItem()}),this.dom.autoplay.addEventListener("pointerup",()=>{this.toggleAutoplay()}),this.dom.carouselTabs.forEach((t,s)=>{t.addEventListener("pointerup",()=>{this.currentItem>s?this._currentAction="previous":this._currentAction="next",this.activateItem(s)})})}_handleHover(){this.dom.carousel.addEventListener("pointerover",()=>{this.autoplay&&this._clearInterval()}),this.dom.carousel.addEventListener("pointerleave",()=>{this.autoplay&&this._setInterval()})}_handleKeydown(){this.dom.carouselControls.forEach(t=>{t.addEventListener("keydown",s=>{switch(m(s)){case"Space":case"Enter":_(s);break}})}),this.dom.carouselTabs.forEach(t=>{t.addEventListener("keydown",s=>{switch(m(s)){case"Space":case"Enter":_(s);break}})})}_handleKeyup(){this.dom.next.addEventListener("keyup",t=>{switch(m(t)){case"Space":case"Enter":this.activateNextItem(),_(t);break}}),this.dom.previous.addEventListener("keyup",t=>{switch(m(t)){case"Space":case"Enter":this.activatePreviousItem(),_(t);break}}),this.dom.autoplay.addEventListener("keyup",t=>{switch(m(t)){case"Space":case"Enter":this.toggleAutoplay(),_(t);break}}),this.dom.carouselTabs.forEach((t,s)=>{t.addEventListener("keyup",i=>{switch(m(i)){case"Space":case"Enter":this.activateItem(s),_(i);break}})})}_setTransitionDuration(){this.dom.carousel.style.setProperty(`--${this.prefix}carousel-transition-duration`,`${this.transitionDuration}ms`)}activateCurrentItem(){u(this.activeClass,this.currentCarouselItem),this.currentCarouselTab&&(this.currentCarouselTab.setAttribute("aria-selected",!0),u(this.activeClass,this.currentCarouselTab))}deactivateCurrentItem(){c(this.activeClass,this.currentCarouselItem),this.currentCarouselTab&&(this.currentCarouselTab.setAttribute("aria-selected",!1),c(this.activeClass,this.currentCarouselTab))}activateItem(t){const s=this.currentItem;this.dom.carousel.dataset.grauplAction=this._currentAction,this.autoplay&&this._clearInterval(),u(this.previousClass,this.currentCarouselItem),u(this.nextClass,this.dom.carouselItems[t]),requestAnimationFrame(()=>{this.deactivateCurrentItem(),this.currentItem=t,this.activateCurrentItem(),requestAnimationFrame(()=>{setTimeout(()=>{c(this.previousClass,this.dom.carouselItems[s]),c(this.nextClass,this.currentCarouselItem)},this.transitionDuration)})}),this.autoplay&&this._setInterval()}activateFirstItem(){this.activateItem(0)}activateLastItem(){this.activateItem(this.dom.carouselItems.length-1)}activateNextItem(){this._currentAction="next",this.currentItem+1>=this.dom.carouselItems.length?this.activateFirstItem():this.activateItem(this.currentItem+1)}activatePreviousItem(){this._currentAction="previous",this.currentItem-1<0?this.activateLastItem():this.activateItem(this.currentItem-1)}toggleAutoplay(){this.autoplay=!this.autoplay,this._handleAutoplay()}}const Q={Alert:R,Carousel:U};module.exports=Q;
|
|
5
|
+
- `)}`);this._generateKey(),this._setIds(),this._handleClick(),this._handleKeydown(),this._handleKeyup(),g.initializeStorage("alerts"),g.pushToStorage("alerts",this.dom.alert.id,this)}catch(t){console.error(t)}}get dom(){return this._dom}get showClass(){return this._showClass}get hideClass(){return this._hideClass}get transitionClass(){return this._transitionClass}get transitionTimer(){return this._transitionTimer}get key(){return this._key}set showClass(t){h({showClass:t}),this._showClass!==t&&(this._showClass=t)}set hideClass(t){h({hideClass:t}),this._hideClass!==t&&(this._hideClass=t)}set transitionClass(t){h({transitionClass:t}),this._transitionClass!==t&&(this._transitionClass=t)}set transitionTimer(t){o("number",{transitionTimer:t}),this._transitionTimer!==t&&(this._transitionTimer=t)}set key(t){o("string",{value:t}),this._key!==t&&(this._key=t)}_validate(){let t=!0,e;if(this._dom.controller!==null?e=C(HTMLElement,{alertElement:this._dom.alert,controllerElement:this._dom.controller}):e=C(HTMLElement,{alertElement:this._dom.alert}),e.status||(this._errors.push(e.message),t=!1),this._showClass!==""){const a=h({showClass:this._showClass});a.status||(this._errors.push(a.message),t=!1)}if(this._hideClass!==""){const a=h({hideClass:this._hideClass});a.status||(this._errors.push(a.message),t=!1)}if(this._transitionClass!==""){const a=h({transitionClass:this._transitionClass});a.status||(this._errors.push(a.message),t=!1)}const i=o("number",{transitionTimer:this._transitionTimer});i.status||(this._errors.push(i.message),t=!1);const n=o("boolean",{isHidden:this._hidden});return n.status||(this._errors.push(n.message),t=!1),t}_generateKey(t=!1){(this.key===""||t)&&(this.key=Math.random().toString(36).replace(/[^a-z]+/g,"").substring(0,10))}_setIds(){this.dom.alert.id=this.dom.alert.id||`alert-${this.key}`,this.dom.controller.id=this.dom.controller.id||`alert-controller-${this.key}`}show(t=!0){this._hidden&&(this.transitionClass!==""?(u(this.transitionClass,this.dom.alert),requestAnimationFrame(()=>{this.hideClass!==""&&d(this.hideClass,this.dom.alert),requestAnimationFrame(()=>{this.showClass!==""&&u(this.showClass,this.dom.alert),requestAnimationFrame(()=>{d(this.transitionClass,this.dom.alert)})})})):(this.showClass!==""&&u(this.showClass,this.dom.alert),this.hideClass!==""&&d(this.hideClass,this.dom.alert)),this._hidden=!1,t&&this.dom.alert.dispatchEvent(this._hideEvent))}hide(t=!0){this._hidden||(this.transitionClass!==""?(u(this.transitionClass,this.dom.alert),requestAnimationFrame(()=>{this.showClass!==""&&d(this.showClass,this.dom.alert),requestAnimationFrame(()=>{this.transitionTimer>0?setTimeout(()=>{this.hideClass!==""&&u(this.hideClass,this.dom.alert),requestAnimationFrame(()=>{d(this.transitionClass,this.dom.alert)})},this.transitionTimer):(this.hideClass!==""&&u(this.hideClass,this.dom.alert),requestAnimationFrame(()=>{d(this.transitionClass,this.dom.alert)}))})})):(this.hideClass!==""&&u(this.hideClass,this.dom.alert),this.showClass!==""&&d(this.showClass,this.dom.alert)),this._hidden=!0,t&&this.dom.alert.dispatchEvent(this._hideEvent))}_handleClick(){this.dom.controller!==null&&this.dom.controller.addEventListener("pointerup",()=>this.hide())}_handleKeydown(){this.dom.controller!==null&&this.dom.controller.addEventListener("keydown",t=>{const e=f(t);(e==="Space"||e==="Enter")&&p(t)})}_handleKeyup(){this.dom.controller!==null&&this.dom.controller.addEventListener("keyup",t=>{const e=f(t);(e==="Space"||e==="Enter")&&this.hide()})}}class U{constructor({carouselElement:t,carouselItemSelector:e=".carousel-item",carouselItemContainerSelector:i=".carousel-item-container",carouselControlSelector:n=".carousel-control",carouselControlContainerSelector:a=".carousel-control-container",carouselTabSelector:c=".carousel-tab",carouselTabContainerSelector:_=".carousel-tab-container",autoplaySelector:l=".autoplay",nextSelector:m=".next",previousSelector:E=".previous",activeClass:w="active",previousClass:I="previous",nextClass:b="next",playClass:k="play",pauseClass:A="pause",autoplay:T=!0,transitionDelay:x=1e4,transitionDuration:S=500,playText:$="Play",pauseText:L="Pause",prefix:M="graupl-",key:O=null,initialize:K=!1}){r(this,"_dom",{carousel:null,carouselItems:[],carouselItemContainer:null,carouselControls:[],carouselControlContainer:null,carouselTabs:[],carouselTabContainer:null,autoplay:null,next:null,previous:null});r(this,"_selectors",{carouselItems:"",carouselItemContainer:"",carouselControls:"",carouselControlContainer:"",carouselTabs:"",carouselTabContainer:"",autoplay:"",next:"",previous:""});r(this,"_activeClass","active");r(this,"_previousClass","previous");r(this,"_nextClass","next");r(this,"_playClass","play");r(this,"_pauseClass","pause");r(this,"_currentItem",0);r(this,"_autoplay",!0);r(this,"_transitionDelay",1e4);r(this,"_transitionDuration",500);r(this,"_playText","Play");r(this,"_pauseText","Pause");r(this,"_currentAction","next");r(this,"_autoplayInterval",null);r(this,"_prefix","graupl-");r(this,"_key","");r(this,"_errors",[]);this._dom.carousel=t,this._selectors.carouselItems=e,this._selectors.carouselItemContainer=i,this._selectors.carouselControls=n,this._selectors.carouselControlContainer=a,this._selectors.carouselTabs=c,this._selectors.carouselTabContainer=_,this._selectors.autoplay=l,this._selectors.next=m,this._selectors.previous=E,this._activeClass=w||"",this._previousClass=I||"",this._nextClass=b||"",this._playClass=k||"",this._pauseClass=A||"",this._autoplay=T,this._transitionDelay=x,this._transitionDuration=S,this._playText=$||"",this._pauseText=L||"",this._prefix=M||"",this._key=O||"",K&&this.initialize()}initialize(){try{if(!this._validate())throw new Error(`Graupl Carousel: cannot initialize carousel. The following errors have been found:
|
|
6
|
+
- ${this.errors.join(`
|
|
7
|
+
- `)}`);this._generateKey(),this._setDOMElements(),this._setIds(),this._setAriaAttributes(),this.activateFirstItem(),this._handleAutoplay(),this._handleFocus(),this._handleClick(),this._handleHover(),this._handleKeydown(),this._handleKeyup(),this._setTransitionDuration(),g.initializeStorage("carousels"),g.pushToStorage("carousels",this.dom.carousel.id,this)}catch(t){console.error(t)}}get dom(){return this._dom}get selectors(){return this._selectors}get activeClass(){return this._activeClass}get previousClass(){return this._previousClass}get nextClass(){return this._nextClass}get playClass(){return this._playClass}get pauseClass(){return this._pauseClass}get currentItem(){return this._currentItem}get currentCarouselItem(){return this.dom.carouselItems[this.currentItem]}get currentCarouselTab(){return this.dom.carouselTabs[this.currentItem]}get autoplay(){return this._autoplay}get transitionDelay(){return this._transitionDelay}get transitionDuration(){return this._transitionDuration}get playText(){return this._playText}get pauseText(){return this._pauseText}get prefix(){return this._prefix}get key(){return this._key}get currentAction(){return this._currentAction}get errors(){return this._errors}set currentItem(t){if(o("number",{value:t}),t===this.currentItem)return;t<0?this._currentItem=0:t>=this.dom.carouselItems.length?this._currentItem=this.dom.carouselItems.length-1:this._currentItem=t,this._dom.carousel.querySelectorAll(this.selectors.carouselTab)&&this.dom.carouselItems.forEach((i,n)=>{i.setAttribute("aria-selected",n===this._currentItem)})}set autoplay(t){o("boolean",{value:t}),this._autoplay!==t&&(this._autoplay=t)}set activeClass(t){h({activeClass:t}),this._activeClass!==t&&(this._activeClass=t)}set previousClass(t){h({previousClass:t}),this._previousClass!==t&&(this._previousClass=t)}set nextClass(t){h({nextClass:t}),this._nextClass!==t&&(this._nextClass=t)}set playClass(t){h({playClass:t}),this._playClass!==t&&(this._playClass=t)}set pauseClass(t){h({pauseClass:t}),this._pauseClass!==t&&(this._pauseClass=t)}set transitionDelay(t){o("number",{value:t}),t!==this.transitionDelay&&t>=0&&(this._currentItem=t)}set transitionDuration(t){o("number",{value:t}),this._transitionDuration!==t&&t>=0&&(this._transitionDuration=t,this._setTransitionDuration())}set playText(t){o("string",{value:t}),this._playText!==t&&(this._playText=t)}set pauseText(t){o("string",{value:t}),this._pauseText!==t&&(this._pauseText=t)}set prefix(t){o("string",{value:t}),this._prefix!==t&&(this._prefix=t)}set key(t){o("string",{value:t}),this._key!==t&&(this._key=t)}_validate(){let t=!0;const e=C(HTMLElement,{carousel:this.dom.carousel});e||(this._errors.push(e.message),t=!1);const i=D({carouselItemsSelector:this._selectors.carouselItems,carouselItemContainerSelector:this._selectors.carouselItemContainer,carouselControlsSelector:this._selectors.carouselControls,carouselControlContainerSelector:this._selectors.carouselControlContainer,carouselTabsSelector:this._selectors.carouselTabs,carouselTabContainerSelector:this._selectors.carouselTabContainer,autoplaySelector:this._selectors.autoplay,nextSelector:this._selectors.next,previousSelector:this._selectors.previous});i||(this._errors.push(i.message),t=!1);const n=o("boolean",{autoplay:this.autoplay});n||(this._errors.push(n.message),t=!1);const a=o("number",{transitionDelay:this._transitionDelay});a||(this._errors.push(a.message),t=!1);const c=o("number",{transitionDuration:this._transitionDuration});if(c||(this._errors.push(c.message),t=!1),this._activeClass!==""){const l=h({activeClass:this._activeClass});l||(this._errors.push(l.message),t=!1)}if(this._previousClass!==""){const l=h({previousClass:this._previousClass});l||(this._errors.push(l.message),t=!1)}if(this._nextClass!==""){const l=h({nextClass:this._nextClass});l||(this._errors.push(l.message),t=!1)}if(this._playClass!==""){const l=h({playClass:this._playClass});l||(this._errors.push(l.message),t=!1)}if(this._pauseClass!==""){const l=h({pauseClass:this._pauseClass});l||(this._errors.push(l.message),t=!1)}if(this._playText!==""){const l=o("string",{playText:this._playText});l||(this._errors.push(l.message),t=!1)}if(this._pauseText!==""){const l=o("string",{pauseText:this._pauseText});l||(this._errors.push(l.message),t=!1)}const _=o("string",{prefix:this._prefix});return _||(this._errors.push(_.message),t=!1),t}_setDOMElementType(t,e=this.dom.carousel,i=!0){if(typeof this.selectors[t]=="string"){if(t==="carousel")throw new Error(`Graupl Carousel: "${t}" element cannot be set through _setDOMElementType.`);if(e!==this.dom.carousel&&C(HTMLElement,{base:e}),Array.isArray(this._dom[t])){const a=Array.from(e.querySelectorAll(this.selectors[t])).filter(c=>c.parentElement===e);i?this._dom[t]=a:this._dom[t]=[...this._dom[t],...a]}else{const n=e.querySelector(this.selectors[t]);if(n&&n.parentElement!==e)return;i&&(this._dom[t]=n)}}else throw new Error(`Graupl Carousel: "${t}" is not a valid element type within the carousel.`)}_resetDOMElementType(t){if(typeof this.selectors[t]=="string"){if(t==="carousel")throw new Error(`Graupl Carousel: "${t}" element cannot be reset through _resetDOMElementType.`);Array.isArray(this._dom[t])?this._dom[t]=[]:this._dom[t]=null}else throw new Error(`Graupl Carousel: "${t}" is not a valid element type within the carousel.`)}_setDOMElements(){this._setDOMElementType("carouselItemContainer"),this._setDOMElementType("carouselControlContainer"),this._setDOMElementType("carouselTabContainer"),this.dom.carouselItemContainer&&this._setDOMElementType("carouselItems",this.dom.carouselItemContainer),this.dom.carouselControlContainer&&(this._setDOMElementType("carouselControls",this.dom.carouselControlContainer),this._setDOMElementType("autoplay",this.dom.carouselControlContainer),this._setDOMElementType("next",this.dom.carouselControlContainer),this._setDOMElementType("previous",this.dom.carouselControlContainer)),this._dom.carouselTabContainer&&this._setDOMElementType("carouselTabs",this.dom.carouselTabContainer)}_generateKey(t=!1){(this.key===""||t)&&(this.key=Math.random().toString(36).replace(/[^a-z]+/g,"").substring(0,10))}_setIds(){this.dom.carousel.id=this.dom.carousel.id||`carousel-${this.key}`,this.dom.carouselItems.forEach((t,e)=>{t.id=t.id||`carousel-item-${this.key}-${e}`}),this.dom.carouselTabs.forEach((t,e)=>{t.id=t.id||`carousel-tab-${this.key}-${e}`})}_setAriaAttributes(){!y("section",{carousel:this.dom.carousel})&&!this.dom.carousel.getAttribute("role")!=="region"&&this.dom.carousel.setAttribute("role","group"),this._dom.carousel.setAttribute("aria-roledescription","carousel"),this.dom.carouselTabContainer&&this.dom.carouselTabContainer.setAttribute("role","tablist"),this.dom.carouselTabs.forEach((t,e)=>{y("button",{tab:t})||t.setAttribute("role","button"),t.setAttribute("aria-selected",e===0),t.setAttribute("aria-controls",this.dom.carouselItems[e].id)})}_setInterval(){this._clearInterval(),this._autoplayInterval=setInterval(()=>{this.activateNextItem()},this.transitionDelay)}_clearInterval(){clearInterval(this._autoplayInterval)}_handleAutoplay(){this.autoplay?(u(this.pauseClass,this.dom.autoplay),d(this.playClass,this.dom.autoplay),this.dom.autoplay.setAttribute("aria-label",this.pauseText),this.dom.carousel.setAttribute("aria-live","off"),this._setInterval()):(u(this.playClass,this.dom.autoplay),d(this.pauseClass,this.dom.autoplay),this.dom.autoplay.setAttribute("aria-label",this.playText),this.dom.carousel.setAttribute("aria-live","polite"),this._clearInterval())}_handleFocus(){this.dom.carousel.addEventListener("focusin",()=>{this.autoplay&&this._clearInterval()}),this.dom.carousel.addEventListener("focusout",()=>{this.autoplay&&this._setInterval()})}_handleClick(){this.dom.next.addEventListener("pointerup",()=>{this.activateNextItem()}),this.dom.previous.addEventListener("pointerup",()=>{this.activatePreviousItem()}),this.dom.autoplay.addEventListener("pointerup",()=>{this.toggleAutoplay()}),this.dom.carouselTabs.forEach((t,e)=>{t.addEventListener("pointerup",()=>{this.currentItem>e?this._currentAction="previous":this._currentAction="next",this.activateItem(e)})})}_handleHover(){this.dom.carousel.addEventListener("pointerover",()=>{this.autoplay&&this._clearInterval()}),this.dom.carousel.addEventListener("pointerleave",()=>{this.autoplay&&this._setInterval()})}_handleKeydown(){this.dom.carouselControls.forEach(t=>{t.addEventListener("keydown",e=>{switch(f(e)){case"Space":case"Enter":p(e);break}})}),this.dom.carouselTabs.forEach(t=>{t.addEventListener("keydown",e=>{switch(f(e)){case"Space":case"Enter":p(e);break}})})}_handleKeyup(){this.dom.next.addEventListener("keyup",t=>{switch(f(t)){case"Space":case"Enter":this.activateNextItem(),p(t);break}}),this.dom.previous.addEventListener("keyup",t=>{switch(f(t)){case"Space":case"Enter":this.activatePreviousItem(),p(t);break}}),this.dom.autoplay.addEventListener("keyup",t=>{switch(f(t)){case"Space":case"Enter":this.toggleAutoplay(),p(t);break}}),this.dom.carouselTabs.forEach((t,e)=>{t.addEventListener("keyup",i=>{switch(f(i)){case"Space":case"Enter":this.activateItem(e),p(i);break}})})}_setTransitionDuration(){this.dom.carousel.style.setProperty(`--${this.prefix}carousel-transition-duration`,`${this.transitionDuration}ms`)}activateCurrentItem(){u(this.activeClass,this.currentCarouselItem),this.currentCarouselTab&&(this.currentCarouselTab.setAttribute("aria-selected",!0),u(this.activeClass,this.currentCarouselTab))}deactivateCurrentItem(){d(this.activeClass,this.currentCarouselItem),this.currentCarouselTab&&(this.currentCarouselTab.setAttribute("aria-selected",!1),d(this.activeClass,this.currentCarouselTab))}activateItem(t){const e=this.currentItem;this.dom.carousel.dataset.grauplAction=this._currentAction,this.autoplay&&this._clearInterval(),u(this.previousClass,this.currentCarouselItem),u(this.nextClass,this.dom.carouselItems[t]),requestAnimationFrame(()=>{this.deactivateCurrentItem(),this.currentItem=t,this.activateCurrentItem(),requestAnimationFrame(()=>{setTimeout(()=>{d(this.previousClass,this.dom.carouselItems[e]),d(this.nextClass,this.currentCarouselItem)},this.transitionDuration)})}),this.autoplay&&this._setInterval()}activateFirstItem(){this.activateItem(0)}activateLastItem(){this.activateItem(this.dom.carouselItems.length-1)}activateNextItem(){this._currentAction="next",this.currentItem+1>=this.dom.carouselItems.length?this.activateFirstItem():this.activateItem(this.currentItem+1)}activatePreviousItem(){this._currentAction="previous",this.currentItem-1<0?this.activateLastItem():this.activateItem(this.currentItem-1)}toggleAutoplay(){this.autoplay=!this.autoplay,this._handleAutoplay()}}const Q={Accordion:R,Alert:B,Carousel:U};module.exports=Q;
|