@haiilo/catalyst 11.0.0 → 12.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/catalyst/catalyst.esm.js +1 -1
- package/dist/catalyst/catalyst.esm.js.map +1 -1
- package/dist/catalyst/index.esm.js +2 -2
- package/dist/catalyst/index.esm.js.map +1 -1
- package/dist/catalyst/loader.esm.js.map +1 -0
- package/dist/catalyst/p-6a54965a.entry.js +10 -0
- package/dist/catalyst/p-6a54965a.entry.js.map +1 -0
- package/dist/catalyst/p-B-m4GNf1.js +3 -0
- package/dist/catalyst/p-B-m4GNf1.js.map +1 -0
- package/dist/catalyst/p-DQuL1Twl.js +2 -0
- package/dist/catalyst/p-DQuL1Twl.js.map +1 -0
- package/dist/catalyst/p-LJZzaWFR.js +2 -0
- package/dist/catalyst/p-LJZzaWFR.js.map +1 -0
- package/dist/cjs/app-globals-V2Kpy_OQ.js +8 -0
- package/dist/cjs/app-globals-V2Kpy_OQ.js.map +1 -0
- package/dist/cjs/cat-alert_30.cjs.entry.js +1467 -1833
- package/dist/cjs/cat-alert_30.cjs.entry.js.map +1 -1
- package/dist/cjs/catalyst.cjs.js +8 -7
- package/dist/cjs/catalyst.cjs.js.map +1 -1
- package/dist/cjs/index-DNLT6JC9.js +10178 -0
- package/dist/cjs/index-DNLT6JC9.js.map +1 -0
- package/dist/cjs/{index-1094f0fc.js → index-jGQAsDy6.js} +528 -358
- package/dist/cjs/index-jGQAsDy6.js.map +1 -0
- package/dist/cjs/index.cjs.js +461 -453
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/cjs/loader.cjs.js +4 -5
- package/dist/cjs/loader.cjs.js.map +1 -1
- package/dist/collection/collection-manifest.json +2 -2
- package/dist/collection/components/cat-alert/cat-alert.js +15 -4
- package/dist/collection/components/cat-alert/cat-alert.js.map +1 -1
- package/dist/collection/components/cat-avatar/cat-avatar.js +33 -14
- package/dist/collection/components/cat-avatar/cat-avatar.js.map +1 -1
- package/dist/collection/components/cat-badge/cat-badge.js +45 -9
- package/dist/collection/components/cat-badge/cat-badge.js.map +1 -1
- package/dist/collection/components/cat-button/cat-button.css +4 -2
- package/dist/collection/components/cat-button/cat-button.js +107 -35
- package/dist/collection/components/cat-button/cat-button.js.map +1 -1
- package/dist/collection/components/cat-button-group/cat-button-group.js +3 -2
- package/dist/collection/components/cat-button-group/cat-button-group.js.map +1 -1
- package/dist/collection/components/cat-checkbox/cat-checkbox.js +83 -24
- package/dist/collection/components/cat-checkbox/cat-checkbox.js.map +1 -1
- package/dist/collection/components/cat-date/cat-date.js +114 -39
- package/dist/collection/components/cat-date/cat-date.js.map +1 -1
- package/dist/collection/components/cat-date-inline/cat-date-inline.js +69 -19
- package/dist/collection/components/cat-date-inline/cat-date-inline.js.map +1 -1
- package/dist/collection/components/cat-datepicker/cat-datepicker.js +130 -42
- package/dist/collection/components/cat-datepicker/cat-datepicker.js.map +1 -1
- package/dist/collection/components/cat-datepicker-inline/cat-datepicker-inline.js +37 -12
- package/dist/collection/components/cat-datepicker-inline/cat-datepicker-inline.js.map +1 -1
- package/dist/collection/components/cat-dropdown/cat-dropdown.js +129 -17
- package/dist/collection/components/cat-dropdown/cat-dropdown.js.map +1 -1
- package/dist/collection/components/cat-form-group/cat-form-group.js +19 -4
- package/dist/collection/components/cat-form-group/cat-form-group.js.map +1 -1
- package/dist/collection/components/cat-icon/cat-icon.js +15 -7
- package/dist/collection/components/cat-icon/cat-icon.js.map +1 -1
- package/dist/collection/components/cat-input/cat-input.js +143 -51
- package/dist/collection/components/cat-input/cat-input.js.map +1 -1
- package/dist/collection/components/cat-pagination/cat-pagination.js +60 -10
- package/dist/collection/components/cat-pagination/cat-pagination.js.map +1 -1
- package/dist/collection/components/cat-radio/cat-radio.js +65 -18
- package/dist/collection/components/cat-radio/cat-radio.js.map +1 -1
- package/dist/collection/components/cat-radio-group/cat-radio-group.js +21 -8
- package/dist/collection/components/cat-radio-group/cat-radio-group.js.map +1 -1
- package/dist/collection/components/cat-scrollable/cat-scrollable.js +32 -7
- package/dist/collection/components/cat-scrollable/cat-scrollable.js.map +1 -1
- package/dist/collection/components/cat-select/cat-select.js +105 -34
- package/dist/collection/components/cat-select/cat-select.js.map +1 -1
- package/dist/collection/components/cat-skeleton/cat-skeleton.js +22 -5
- package/dist/collection/components/cat-skeleton/cat-skeleton.js.map +1 -1
- package/dist/collection/components/cat-spinner/cat-spinner.js +15 -4
- package/dist/collection/components/cat-spinner/cat-spinner.js.map +1 -1
- package/dist/collection/components/cat-tab/cat-tab.js +84 -17
- package/dist/collection/components/cat-tab/cat-tab.js.map +1 -1
- package/dist/collection/components/cat-tabs/cat-tabs.css +29 -12
- package/dist/collection/components/cat-tabs/cat-tabs.js +189 -8
- package/dist/collection/components/cat-tabs/cat-tabs.js.map +1 -1
- package/dist/collection/components/cat-tag/cat-tag.js +84 -25
- package/dist/collection/components/cat-tag/cat-tag.js.map +1 -1
- package/dist/collection/components/cat-textarea/cat-textarea.js +90 -32
- package/dist/collection/components/cat-textarea/cat-textarea.js.map +1 -1
- package/dist/collection/components/cat-time/cat-time.js +120 -39
- package/dist/collection/components/cat-time/cat-time.js.map +1 -1
- package/dist/collection/components/cat-toggle/cat-toggle.js +71 -22
- package/dist/collection/components/cat-toggle/cat-toggle.js.map +1 -1
- package/dist/collection/components/cat-tooltip/cat-tooltip.js +49 -8
- package/dist/collection/components/cat-tooltip/cat-tooltip.js.map +1 -1
- package/dist/components/cat-alert.js +8 -3
- package/dist/components/cat-alert.js.map +1 -1
- package/dist/components/cat-avatar.js +1 -0
- package/dist/components/cat-avatar2.js +11 -8
- package/dist/components/cat-avatar2.js.map +1 -1
- package/dist/components/cat-badge.js +23 -3
- package/dist/components/cat-badge.js.map +1 -1
- package/dist/components/cat-button-group.js +2 -3
- package/dist/components/cat-button-group.js.map +1 -1
- package/dist/components/cat-button.js +1 -0
- package/dist/components/cat-button2.js +41 -17
- package/dist/components/cat-button2.js.map +1 -1
- package/dist/components/cat-card.js +2 -2
- package/dist/components/cat-card.js.map +1 -1
- package/dist/components/cat-checkbox.js +1 -0
- package/dist/components/cat-checkbox2.js +34 -10
- package/dist/components/cat-checkbox2.js.map +1 -1
- package/dist/components/cat-date-inline.js +1 -0
- package/dist/components/cat-date-inline2.js +29 -7
- package/dist/components/cat-date-inline2.js.map +1 -1
- package/dist/components/cat-date.js +41 -17
- package/dist/components/cat-date.js.map +1 -1
- package/dist/components/cat-datepicker-inline.js +16 -8
- package/dist/components/cat-datepicker-inline.js.map +1 -1
- package/dist/components/cat-datepicker.js +50 -20
- package/dist/components/cat-datepicker.js.map +1 -1
- package/dist/components/cat-datepicker.locale.js +110 -99
- package/dist/components/cat-datepicker.locale.js.map +1 -1
- package/dist/components/cat-dropdown.js +1 -0
- package/dist/components/cat-dropdown2.js +70 -13
- package/dist/components/cat-dropdown2.js.map +1 -1
- package/dist/components/cat-form-group.js +12 -3
- package/dist/components/cat-form-group.js.map +1 -1
- package/dist/components/cat-form-hint.js +1 -0
- package/dist/components/cat-form-hint.js.map +1 -1
- package/dist/components/cat-i18n-registry.js +1 -0
- package/dist/components/cat-i18n-registry.js.map +1 -1
- package/dist/components/cat-icon-registry.js +22 -21
- package/dist/components/cat-icon-registry.js.map +1 -1
- package/dist/components/cat-icon.js +1 -0
- package/dist/components/cat-icon2.js +5 -5
- package/dist/components/cat-icon2.js.map +1 -1
- package/dist/components/cat-input.js +1 -0
- package/dist/components/cat-input2.js +50 -25
- package/dist/components/cat-input2.js.map +1 -1
- package/dist/components/cat-pagination.js +32 -2
- package/dist/components/cat-pagination.js.map +1 -1
- package/dist/components/cat-radio-group.js +8 -5
- package/dist/components/cat-radio-group.js.map +1 -1
- package/dist/components/cat-radio.js +28 -8
- package/dist/components/cat-radio.js.map +1 -1
- package/dist/components/cat-scrollable.js +1 -0
- package/dist/components/cat-scrollable2.js +322 -542
- package/dist/components/cat-scrollable2.js.map +1 -1
- package/dist/components/cat-select-demo.js +27 -49
- package/dist/components/cat-select-demo.js.map +1 -1
- package/dist/components/cat-select.js +1 -0
- package/dist/components/cat-select2.js +135 -316
- package/dist/components/cat-select2.js.map +1 -1
- package/dist/components/cat-skeleton.js +1 -0
- package/dist/components/cat-skeleton2.js +12 -3
- package/dist/components/cat-skeleton2.js.map +1 -1
- package/dist/components/cat-spinner.js +1 -0
- package/dist/components/cat-spinner2.js +8 -3
- package/dist/components/cat-spinner2.js.map +1 -1
- package/dist/components/cat-tab.js +34 -9
- package/dist/components/cat-tab.js.map +1 -1
- package/dist/components/cat-tabs.js +140 -11
- package/dist/components/cat-tabs.js.map +1 -1
- package/dist/components/cat-tag.js +35 -13
- package/dist/components/cat-tag.js.map +1 -1
- package/dist/components/cat-textarea.js +33 -16
- package/dist/components/cat-textarea.js.map +1 -1
- package/dist/components/cat-time.js +44 -16
- package/dist/components/cat-time.js.map +1 -1
- package/dist/components/cat-toggle.js +28 -10
- package/dist/components/cat-toggle.js.map +1 -1
- package/dist/components/cat-tooltip.js +28 -3
- package/dist/components/cat-tooltip.js.map +1 -1
- package/dist/components/coerce.js +1 -0
- package/dist/components/coerce.js.map +1 -1
- package/dist/components/first-tabbable.js +1 -0
- package/dist/components/first-tabbable.js.map +1 -1
- package/dist/components/{floating-ui.dom.esm.js → floating-ui.dom.js} +3 -492
- package/dist/components/floating-ui.dom.js.map +1 -0
- package/dist/components/index.js +460 -450
- package/dist/components/index.js.map +1 -1
- package/dist/components/index2.js +9456 -0
- package/dist/components/index2.js.map +1 -0
- package/dist/components/loglevel.js +368 -356
- package/dist/components/loglevel.js.map +1 -1
- package/dist/components/media-matcher.js +1 -0
- package/dist/components/media-matcher.js.map +1 -1
- package/dist/esm/app-globals-DQuL1Twl.js +6 -0
- package/dist/esm/app-globals-DQuL1Twl.js.map +1 -0
- package/dist/esm/cat-alert_30.entry.js +1428 -1792
- package/dist/esm/cat-alert_30.entry.js.map +1 -1
- package/dist/esm/catalyst.js +7 -5
- package/dist/esm/catalyst.js.map +1 -1
- package/dist/esm/{index-e8c0ddf2.js → index-B-m4GNf1.js} +528 -338
- package/dist/esm/index-B-m4GNf1.js.map +1 -0
- package/dist/esm/index-LJZzaWFR.js +10057 -0
- package/dist/esm/index-LJZzaWFR.js.map +1 -0
- package/dist/esm/index.js +458 -448
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/loader.js +5 -4
- package/dist/esm/loader.js.map +1 -1
- package/dist/types/components/cat-dropdown/cat-dropdown.d.ts +11 -1
- package/dist/types/components/cat-tab/cat-tab.d.ts +6 -0
- package/dist/types/components/cat-tabs/cat-tabs.d.ts +18 -0
- package/dist/types/components.d.ts +46 -0
- package/dist/types/stencil-public-runtime.d.ts +28 -2
- package/loader/index.d.ts +3 -0
- package/package.json +3 -3
- package/dist/catalyst/p-59e2ada2.entry.js +0 -10
- package/dist/catalyst/p-59e2ada2.entry.js.map +0 -1
- package/dist/catalyst/p-7f3bcfb9.js +0 -3
- package/dist/catalyst/p-7f3bcfb9.js.map +0 -1
- package/dist/catalyst/p-9500d6fb.js +0 -2
- package/dist/catalyst/p-9500d6fb.js.map +0 -1
- package/dist/catalyst/p-e1255160.js +0 -2
- package/dist/catalyst/p-e1255160.js.map +0 -1
- package/dist/cjs/app-globals-3a1e7e63.js +0 -7
- package/dist/cjs/app-globals-3a1e7e63.js.map +0 -1
- package/dist/cjs/index-1094f0fc.js.map +0 -1
- package/dist/cjs/of-958251e4.js +0 -1549
- package/dist/cjs/of-958251e4.js.map +0 -1
- package/dist/collection/components/cat-alert/cat-alert.e2e.js +0 -11
- package/dist/collection/components/cat-alert/cat-alert.e2e.js.map +0 -1
- package/dist/collection/components/cat-alert/cat-alert.spec.js +0 -14
- package/dist/collection/components/cat-alert/cat-alert.spec.js.map +0 -1
- package/dist/collection/components/cat-avatar/cat-avatar.e2e.js +0 -10
- package/dist/collection/components/cat-avatar/cat-avatar.e2e.js.map +0 -1
- package/dist/collection/components/cat-avatar/cat-avatar.spec.js +0 -14
- package/dist/collection/components/cat-avatar/cat-avatar.spec.js.map +0 -1
- package/dist/collection/components/cat-badge/cat-badge.e2e.js +0 -10
- package/dist/collection/components/cat-badge/cat-badge.e2e.js.map +0 -1
- package/dist/collection/components/cat-badge/cat-badge.spec.js +0 -14
- package/dist/collection/components/cat-badge/cat-badge.spec.js.map +0 -1
- package/dist/collection/components/cat-button/cat-button.e2e.js +0 -10
- package/dist/collection/components/cat-button/cat-button.e2e.js.map +0 -1
- package/dist/collection/components/cat-button/cat-button.spec.js +0 -20
- package/dist/collection/components/cat-button/cat-button.spec.js.map +0 -1
- package/dist/collection/components/cat-button-group/cat-button-group.e2e.js +0 -10
- package/dist/collection/components/cat-button-group/cat-button-group.e2e.js.map +0 -1
- package/dist/collection/components/cat-button-group/cat-button-group.spec.js +0 -14
- package/dist/collection/components/cat-button-group/cat-button-group.spec.js.map +0 -1
- package/dist/collection/components/cat-card/cat-card.e2e.js +0 -10
- package/dist/collection/components/cat-card/cat-card.e2e.js.map +0 -1
- package/dist/collection/components/cat-card/cat-card.spec.js +0 -14
- package/dist/collection/components/cat-card/cat-card.spec.js.map +0 -1
- package/dist/collection/components/cat-checkbox/cat-checkbox.e2e.js +0 -10
- package/dist/collection/components/cat-checkbox/cat-checkbox.e2e.js.map +0 -1
- package/dist/collection/components/cat-checkbox/cat-checkbox.spec.js +0 -14
- package/dist/collection/components/cat-checkbox/cat-checkbox.spec.js.map +0 -1
- package/dist/collection/components/cat-date/cat-date.e2e.js +0 -11
- package/dist/collection/components/cat-date/cat-date.e2e.js.map +0 -1
- package/dist/collection/components/cat-date/cat-date.spec.js +0 -17
- package/dist/collection/components/cat-date/cat-date.spec.js.map +0 -1
- package/dist/collection/components/cat-date-inline/cat-date-inline.e2e.js +0 -11
- package/dist/collection/components/cat-date-inline/cat-date-inline.e2e.js.map +0 -1
- package/dist/collection/components/cat-date-inline/cat-date-inline.spec.js +0 -16
- package/dist/collection/components/cat-date-inline/cat-date-inline.spec.js.map +0 -1
- package/dist/collection/components/cat-datepicker/cat-datepicker.e2e.js +0 -11
- package/dist/collection/components/cat-datepicker/cat-datepicker.e2e.js.map +0 -1
- package/dist/collection/components/cat-datepicker/cat-datepicker.spec.js +0 -15
- package/dist/collection/components/cat-datepicker/cat-datepicker.spec.js.map +0 -1
- package/dist/collection/components/cat-datepicker-inline/cat-datepicker-inline.e2e.js +0 -11
- package/dist/collection/components/cat-datepicker-inline/cat-datepicker-inline.e2e.js.map +0 -1
- package/dist/collection/components/cat-datepicker-inline/cat-datepicker-inline.spec.js +0 -15
- package/dist/collection/components/cat-datepicker-inline/cat-datepicker-inline.spec.js.map +0 -1
- package/dist/collection/components/cat-dropdown/cat-dropdown.e2e.js +0 -10
- package/dist/collection/components/cat-dropdown/cat-dropdown.e2e.js.map +0 -1
- package/dist/collection/components/cat-dropdown/cat-dropdown.spec.js +0 -21
- package/dist/collection/components/cat-dropdown/cat-dropdown.spec.js.map +0 -1
- package/dist/collection/components/cat-form-group/cat-form-group.e2e.js +0 -10
- package/dist/collection/components/cat-form-group/cat-form-group.e2e.js.map +0 -1
- package/dist/collection/components/cat-form-group/cat-form-group.spec.js +0 -14
- package/dist/collection/components/cat-form-group/cat-form-group.spec.js.map +0 -1
- package/dist/collection/components/cat-form-hint/cat-form-hint.spec.js +0 -15
- package/dist/collection/components/cat-form-hint/cat-form-hint.spec.js.map +0 -1
- package/dist/collection/components/cat-i18n/cat-i18n-registry.spec.js +0 -7
- package/dist/collection/components/cat-i18n/cat-i18n-registry.spec.js.map +0 -1
- package/dist/collection/components/cat-icon/cat-icon-registry.spec.js +0 -7
- package/dist/collection/components/cat-icon/cat-icon-registry.spec.js.map +0 -1
- package/dist/collection/components/cat-icon/cat-icon.e2e.js +0 -11
- package/dist/collection/components/cat-icon/cat-icon.e2e.js.map +0 -1
- package/dist/collection/components/cat-icon/cat-icon.spec.js +0 -15
- package/dist/collection/components/cat-icon/cat-icon.spec.js.map +0 -1
- package/dist/collection/components/cat-input/cat-input.e2e.js +0 -11
- package/dist/collection/components/cat-input/cat-input.e2e.js.map +0 -1
- package/dist/collection/components/cat-input/cat-input.spec.js +0 -15
- package/dist/collection/components/cat-input/cat-input.spec.js.map +0 -1
- package/dist/collection/components/cat-notification/cat-notification.spec.js +0 -7
- package/dist/collection/components/cat-notification/cat-notification.spec.js.map +0 -1
- package/dist/collection/components/cat-pagination/cat-pagination.e2e.js +0 -14
- package/dist/collection/components/cat-pagination/cat-pagination.e2e.js.map +0 -1
- package/dist/collection/components/cat-pagination/cat-pagination.spec.js +0 -15
- package/dist/collection/components/cat-pagination/cat-pagination.spec.js.map +0 -1
- package/dist/collection/components/cat-radio/cat-radio.e2e.js +0 -10
- package/dist/collection/components/cat-radio/cat-radio.e2e.js.map +0 -1
- package/dist/collection/components/cat-radio/cat-radio.spec.js +0 -14
- package/dist/collection/components/cat-radio/cat-radio.spec.js.map +0 -1
- package/dist/collection/components/cat-radio-group/cat-radio-group.e2e.js +0 -10
- package/dist/collection/components/cat-radio-group/cat-radio-group.e2e.js.map +0 -1
- package/dist/collection/components/cat-radio-group/cat-radio-group.spec.js +0 -14
- package/dist/collection/components/cat-radio-group/cat-radio-group.spec.js.map +0 -1
- package/dist/collection/components/cat-scrollable/cat-scrollable.e2e.js +0 -10
- package/dist/collection/components/cat-scrollable/cat-scrollable.e2e.js.map +0 -1
- package/dist/collection/components/cat-scrollable/cat-scrollable.spec.js +0 -14
- package/dist/collection/components/cat-scrollable/cat-scrollable.spec.js.map +0 -1
- package/dist/collection/components/cat-select/cat-select.e2e.js +0 -14
- package/dist/collection/components/cat-select/cat-select.e2e.js.map +0 -1
- package/dist/collection/components/cat-select/cat-select.spec.js +0 -15
- package/dist/collection/components/cat-select/cat-select.spec.js.map +0 -1
- package/dist/collection/components/cat-skeleton/cat-skeleton.e2e.js +0 -10
- package/dist/collection/components/cat-skeleton/cat-skeleton.e2e.js.map +0 -1
- package/dist/collection/components/cat-skeleton/cat-skeleton.spec.js +0 -14
- package/dist/collection/components/cat-skeleton/cat-skeleton.spec.js.map +0 -1
- package/dist/collection/components/cat-spinner/cat-spinner.e2e.js +0 -10
- package/dist/collection/components/cat-spinner/cat-spinner.e2e.js.map +0 -1
- package/dist/collection/components/cat-spinner/cat-spinner.spec.js +0 -18
- package/dist/collection/components/cat-spinner/cat-spinner.spec.js.map +0 -1
- package/dist/collection/components/cat-tab/cat-tab.e2e.js +0 -10
- package/dist/collection/components/cat-tab/cat-tab.e2e.js.map +0 -1
- package/dist/collection/components/cat-tab/cat-tab.spec.js +0 -14
- package/dist/collection/components/cat-tab/cat-tab.spec.js.map +0 -1
- package/dist/collection/components/cat-tabs/cat-tabs.e2e.js +0 -10
- package/dist/collection/components/cat-tabs/cat-tabs.e2e.js.map +0 -1
- package/dist/collection/components/cat-tabs/cat-tabs.spec.js +0 -14
- package/dist/collection/components/cat-tabs/cat-tabs.spec.js.map +0 -1
- package/dist/collection/components/cat-tag/cat-tag.e2e.js +0 -14
- package/dist/collection/components/cat-tag/cat-tag.e2e.js.map +0 -1
- package/dist/collection/components/cat-tag/cat-tag.spec.js +0 -23
- package/dist/collection/components/cat-tag/cat-tag.spec.js.map +0 -1
- package/dist/collection/components/cat-textarea/cat-textarea.e2e.js +0 -11
- package/dist/collection/components/cat-textarea/cat-textarea.e2e.js.map +0 -1
- package/dist/collection/components/cat-textarea/cat-textarea.spec.js +0 -15
- package/dist/collection/components/cat-textarea/cat-textarea.spec.js.map +0 -1
- package/dist/collection/components/cat-time/cat-time.e2e.js +0 -11
- package/dist/collection/components/cat-time/cat-time.e2e.js.map +0 -1
- package/dist/collection/components/cat-time/cat-time.spec.js +0 -16
- package/dist/collection/components/cat-time/cat-time.spec.js.map +0 -1
- package/dist/collection/components/cat-toggle/cat-toggle.e2e.js +0 -10
- package/dist/collection/components/cat-toggle/cat-toggle.e2e.js.map +0 -1
- package/dist/collection/components/cat-toggle/cat-toggle.spec.js +0 -14
- package/dist/collection/components/cat-toggle/cat-toggle.spec.js.map +0 -1
- package/dist/collection/components/cat-tooltip/cat-tooltip.e2e.js +0 -10
- package/dist/collection/components/cat-tooltip/cat-tooltip.e2e.js.map +0 -1
- package/dist/collection/components/cat-tooltip/cat-tooltip.spec.js +0 -20
- package/dist/collection/components/cat-tooltip/cat-tooltip.spec.js.map +0 -1
- package/dist/collection/utils/media-matcher.spec.js +0 -39
- package/dist/collection/utils/media-matcher.spec.js.map +0 -1
- package/dist/components/floating-ui.dom.esm.js.map +0 -1
- package/dist/components/from.js +0 -928
- package/dist/components/from.js.map +0 -1
- package/dist/components/of.js +0 -10
- package/dist/components/of.js.map +0 -1
- package/dist/esm/app-globals-0f993ce5.js +0 -5
- package/dist/esm/app-globals-0f993ce5.js.map +0 -1
- package/dist/esm/index-e8c0ddf2.js.map +0 -1
- package/dist/esm/of-e4ec2eb4.js +0 -1523
- package/dist/esm/of-e4ec2eb4.js.map +0 -1
- package/loader/package.json +0 -11
|
@@ -15,21 +15,39 @@ export class CatToggle {
|
|
|
15
15
|
this._id = `cat-toggle-${nextUniqueId++}`;
|
|
16
16
|
this.hasSlottedLabel = false;
|
|
17
17
|
this.hasSlottedHint = false;
|
|
18
|
+
/**
|
|
19
|
+
* Checked state of the toggle.
|
|
20
|
+
*/
|
|
18
21
|
this.checked = false;
|
|
22
|
+
/**
|
|
23
|
+
* Disabled state of the toggle.
|
|
24
|
+
*/
|
|
19
25
|
this.disabled = false;
|
|
20
|
-
|
|
26
|
+
/**
|
|
27
|
+
* The label of the toggle that is visible.
|
|
28
|
+
*/
|
|
21
29
|
this.label = '';
|
|
30
|
+
/**
|
|
31
|
+
* Visually hide the label, but still show it to assistive technologies like screen readers.
|
|
32
|
+
*/
|
|
22
33
|
this.labelHidden = false;
|
|
23
|
-
|
|
34
|
+
/**
|
|
35
|
+
* Required state of the toggle.
|
|
36
|
+
*/
|
|
24
37
|
this.required = false;
|
|
25
|
-
|
|
26
|
-
|
|
38
|
+
/**
|
|
39
|
+
* The resolved value of the toggle, based on the checked state, value and noValue.
|
|
40
|
+
*/
|
|
41
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
27
42
|
this.resolvedValue = null;
|
|
28
|
-
|
|
43
|
+
/**
|
|
44
|
+
* Whether the label should appear to the left of the toggle.
|
|
45
|
+
*/
|
|
29
46
|
this.labelLeft = false;
|
|
47
|
+
/**
|
|
48
|
+
* The alignment of the checkbox.
|
|
49
|
+
*/
|
|
30
50
|
this.alignment = 'top';
|
|
31
|
-
this.nativeAttributes = undefined;
|
|
32
|
-
this.testId = undefined;
|
|
33
51
|
}
|
|
34
52
|
get id() {
|
|
35
53
|
return this.identifier || this._id;
|
|
@@ -105,6 +123,7 @@ export class CatToggle {
|
|
|
105
123
|
return {
|
|
106
124
|
"checked": {
|
|
107
125
|
"type": "boolean",
|
|
126
|
+
"attribute": "checked",
|
|
108
127
|
"mutable": true,
|
|
109
128
|
"complexType": {
|
|
110
129
|
"original": "boolean",
|
|
@@ -117,12 +136,14 @@ export class CatToggle {
|
|
|
117
136
|
"tags": [],
|
|
118
137
|
"text": "Checked state of the toggle."
|
|
119
138
|
},
|
|
120
|
-
"
|
|
139
|
+
"getter": false,
|
|
140
|
+
"setter": false,
|
|
121
141
|
"reflect": false,
|
|
122
142
|
"defaultValue": "false"
|
|
123
143
|
},
|
|
124
144
|
"disabled": {
|
|
125
145
|
"type": "boolean",
|
|
146
|
+
"attribute": "disabled",
|
|
126
147
|
"mutable": false,
|
|
127
148
|
"complexType": {
|
|
128
149
|
"original": "boolean",
|
|
@@ -135,12 +156,14 @@ export class CatToggle {
|
|
|
135
156
|
"tags": [],
|
|
136
157
|
"text": "Disabled state of the toggle."
|
|
137
158
|
},
|
|
138
|
-
"
|
|
159
|
+
"getter": false,
|
|
160
|
+
"setter": false,
|
|
139
161
|
"reflect": false,
|
|
140
162
|
"defaultValue": "false"
|
|
141
163
|
},
|
|
142
164
|
"identifier": {
|
|
143
165
|
"type": "string",
|
|
166
|
+
"attribute": "identifier",
|
|
144
167
|
"mutable": false,
|
|
145
168
|
"complexType": {
|
|
146
169
|
"original": "string",
|
|
@@ -153,11 +176,13 @@ export class CatToggle {
|
|
|
153
176
|
"tags": [],
|
|
154
177
|
"text": "A unique identifier for the input."
|
|
155
178
|
},
|
|
156
|
-
"
|
|
179
|
+
"getter": false,
|
|
180
|
+
"setter": false,
|
|
157
181
|
"reflect": false
|
|
158
182
|
},
|
|
159
183
|
"label": {
|
|
160
184
|
"type": "string",
|
|
185
|
+
"attribute": "label",
|
|
161
186
|
"mutable": false,
|
|
162
187
|
"complexType": {
|
|
163
188
|
"original": "string",
|
|
@@ -170,12 +195,14 @@ export class CatToggle {
|
|
|
170
195
|
"tags": [],
|
|
171
196
|
"text": "The label of the toggle that is visible."
|
|
172
197
|
},
|
|
173
|
-
"
|
|
198
|
+
"getter": false,
|
|
199
|
+
"setter": false,
|
|
174
200
|
"reflect": false,
|
|
175
201
|
"defaultValue": "''"
|
|
176
202
|
},
|
|
177
203
|
"labelHidden": {
|
|
178
204
|
"type": "boolean",
|
|
205
|
+
"attribute": "label-hidden",
|
|
179
206
|
"mutable": false,
|
|
180
207
|
"complexType": {
|
|
181
208
|
"original": "boolean",
|
|
@@ -188,12 +215,14 @@ export class CatToggle {
|
|
|
188
215
|
"tags": [],
|
|
189
216
|
"text": "Visually hide the label, but still show it to assistive technologies like screen readers."
|
|
190
217
|
},
|
|
191
|
-
"
|
|
218
|
+
"getter": false,
|
|
219
|
+
"setter": false,
|
|
192
220
|
"reflect": false,
|
|
193
221
|
"defaultValue": "false"
|
|
194
222
|
},
|
|
195
223
|
"name": {
|
|
196
224
|
"type": "string",
|
|
225
|
+
"attribute": "name",
|
|
197
226
|
"mutable": false,
|
|
198
227
|
"complexType": {
|
|
199
228
|
"original": "string",
|
|
@@ -206,11 +235,13 @@ export class CatToggle {
|
|
|
206
235
|
"tags": [],
|
|
207
236
|
"text": "The name of the input."
|
|
208
237
|
},
|
|
209
|
-
"
|
|
238
|
+
"getter": false,
|
|
239
|
+
"setter": false,
|
|
210
240
|
"reflect": false
|
|
211
241
|
},
|
|
212
242
|
"required": {
|
|
213
243
|
"type": "boolean",
|
|
244
|
+
"attribute": "required",
|
|
214
245
|
"mutable": false,
|
|
215
246
|
"complexType": {
|
|
216
247
|
"original": "boolean",
|
|
@@ -223,12 +254,14 @@ export class CatToggle {
|
|
|
223
254
|
"tags": [],
|
|
224
255
|
"text": "Required state of the toggle."
|
|
225
256
|
},
|
|
226
|
-
"
|
|
257
|
+
"getter": false,
|
|
258
|
+
"setter": false,
|
|
227
259
|
"reflect": false,
|
|
228
260
|
"defaultValue": "false"
|
|
229
261
|
},
|
|
230
262
|
"value": {
|
|
231
263
|
"type": "any",
|
|
264
|
+
"attribute": "value",
|
|
232
265
|
"mutable": false,
|
|
233
266
|
"complexType": {
|
|
234
267
|
"original": "any",
|
|
@@ -241,11 +274,13 @@ export class CatToggle {
|
|
|
241
274
|
"tags": [],
|
|
242
275
|
"text": "The value of the checked toggle."
|
|
243
276
|
},
|
|
244
|
-
"
|
|
277
|
+
"getter": false,
|
|
278
|
+
"setter": false,
|
|
245
279
|
"reflect": false
|
|
246
280
|
},
|
|
247
281
|
"noValue": {
|
|
248
282
|
"type": "any",
|
|
283
|
+
"attribute": "no-value",
|
|
249
284
|
"mutable": false,
|
|
250
285
|
"complexType": {
|
|
251
286
|
"original": "any",
|
|
@@ -258,11 +293,13 @@ export class CatToggle {
|
|
|
258
293
|
"tags": [],
|
|
259
294
|
"text": "The value of the unchecked toggle."
|
|
260
295
|
},
|
|
261
|
-
"
|
|
296
|
+
"getter": false,
|
|
297
|
+
"setter": false,
|
|
262
298
|
"reflect": false
|
|
263
299
|
},
|
|
264
300
|
"resolvedValue": {
|
|
265
301
|
"type": "any",
|
|
302
|
+
"attribute": "resolved-value",
|
|
266
303
|
"mutable": true,
|
|
267
304
|
"complexType": {
|
|
268
305
|
"original": "any",
|
|
@@ -275,12 +312,14 @@ export class CatToggle {
|
|
|
275
312
|
"tags": [],
|
|
276
313
|
"text": "The resolved value of the toggle, based on the checked state, value and noValue."
|
|
277
314
|
},
|
|
278
|
-
"
|
|
315
|
+
"getter": false,
|
|
316
|
+
"setter": false,
|
|
279
317
|
"reflect": false,
|
|
280
318
|
"defaultValue": "null"
|
|
281
319
|
},
|
|
282
320
|
"hint": {
|
|
283
321
|
"type": "string",
|
|
322
|
+
"attribute": "hint",
|
|
284
323
|
"mutable": false,
|
|
285
324
|
"complexType": {
|
|
286
325
|
"original": "string | string[]",
|
|
@@ -293,11 +332,13 @@ export class CatToggle {
|
|
|
293
332
|
"tags": [],
|
|
294
333
|
"text": "Optional hint text(s) to be displayed with the toggle."
|
|
295
334
|
},
|
|
296
|
-
"
|
|
335
|
+
"getter": false,
|
|
336
|
+
"setter": false,
|
|
297
337
|
"reflect": false
|
|
298
338
|
},
|
|
299
339
|
"labelLeft": {
|
|
300
340
|
"type": "boolean",
|
|
341
|
+
"attribute": "label-left",
|
|
301
342
|
"mutable": false,
|
|
302
343
|
"complexType": {
|
|
303
344
|
"original": "boolean",
|
|
@@ -310,12 +351,14 @@ export class CatToggle {
|
|
|
310
351
|
"tags": [],
|
|
311
352
|
"text": "Whether the label should appear to the left of the toggle."
|
|
312
353
|
},
|
|
313
|
-
"
|
|
354
|
+
"getter": false,
|
|
355
|
+
"setter": false,
|
|
314
356
|
"reflect": false,
|
|
315
357
|
"defaultValue": "false"
|
|
316
358
|
},
|
|
317
359
|
"alignment": {
|
|
318
360
|
"type": "string",
|
|
361
|
+
"attribute": "alignment",
|
|
319
362
|
"mutable": false,
|
|
320
363
|
"complexType": {
|
|
321
364
|
"original": "'center' | 'top' | 'bottom'",
|
|
@@ -328,12 +371,14 @@ export class CatToggle {
|
|
|
328
371
|
"tags": [],
|
|
329
372
|
"text": "The alignment of the checkbox."
|
|
330
373
|
},
|
|
331
|
-
"
|
|
374
|
+
"getter": false,
|
|
375
|
+
"setter": false,
|
|
332
376
|
"reflect": false,
|
|
333
377
|
"defaultValue": "'top'"
|
|
334
378
|
},
|
|
335
379
|
"nativeAttributes": {
|
|
336
380
|
"type": "unknown",
|
|
381
|
+
"attribute": "native-attributes",
|
|
337
382
|
"mutable": false,
|
|
338
383
|
"complexType": {
|
|
339
384
|
"original": "{ [key: string]: string }",
|
|
@@ -345,10 +390,13 @@ export class CatToggle {
|
|
|
345
390
|
"docs": {
|
|
346
391
|
"tags": [],
|
|
347
392
|
"text": "Attributes that will be added to the native HTML input element."
|
|
348
|
-
}
|
|
393
|
+
},
|
|
394
|
+
"getter": false,
|
|
395
|
+
"setter": false
|
|
349
396
|
},
|
|
350
397
|
"testId": {
|
|
351
398
|
"type": "string",
|
|
399
|
+
"attribute": "test-id",
|
|
352
400
|
"mutable": false,
|
|
353
401
|
"complexType": {
|
|
354
402
|
"original": "string",
|
|
@@ -361,7 +409,8 @@ export class CatToggle {
|
|
|
361
409
|
"tags": [],
|
|
362
410
|
"text": "A unique identifier for the underlying native element that is used for\ntesting purposes. The attribute is added as `data-test` attribute and acts\nas a shorthand for `nativeAttributes={ 'data-test': 'test-Id' }`."
|
|
363
411
|
},
|
|
364
|
-
"
|
|
412
|
+
"getter": false,
|
|
413
|
+
"setter": false,
|
|
365
414
|
"reflect": false
|
|
366
415
|
}
|
|
367
416
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"cat-toggle.js","sourceRoot":"","sources":["../../../src/components/cat-toggle/cat-toggle.tsx"],"names":[],"mappings":"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","sourcesContent":["import { AttachInternals, Component, Element, Event, EventEmitter, h, Host, Method, Prop, State } from '@stencil/core';\nimport { CatFormHint } from '../cat-form-hint/cat-form-hint';\n\nlet nextUniqueId = 0;\n\n/**\n * Toggles are graphical interface switches that give user control over a\n * feature or option that can be turned on or off.\n *\n * @slot hint - Optional hint element to be displayed with the toggle.\n * @slot label - The slotted label. If both the label property and the label slot are present, only the label slot will be displayed.\n * @part label - The label content.\n * @part input - The native input element.\n */\n@Component({\n tag: 'cat-toggle',\n styleUrls: ['cat-toggle.scss'],\n formAssociated: true,\n shadow: {\n delegatesFocus: true\n }\n})\nexport class CatToggle {\n private readonly _id = `cat-toggle-${nextUniqueId++}`;\n private get id() {\n return this.identifier || this._id;\n }\n\n private input!: HTMLInputElement;\n\n @Element() hostElement!: HTMLElement;\n\n @State() hasSlottedLabel = false;\n\n @State() hasSlottedHint = false;\n\n @AttachInternals() internals!: ElementInternals;\n\n /**\n * Checked state of the toggle.\n */\n @Prop({ mutable: true }) checked = false;\n\n /**\n * Disabled state of the toggle.\n */\n @Prop() disabled = false;\n\n /**\n * A unique identifier for the input.\n */\n @Prop() identifier?: string;\n\n /**\n * The label of the toggle that is visible.\n */\n @Prop() label = '';\n\n /**\n * Visually hide the label, but still show it to assistive technologies like screen readers.\n */\n @Prop() labelHidden = false;\n\n /**\n * The name of the input.\n */\n @Prop() name?: string;\n\n /**\n * Required state of the toggle.\n */\n @Prop() required = false;\n\n /**\n * The value of the checked toggle.\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n @Prop() value?: any;\n\n /**\n * The value of the unchecked toggle.\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n @Prop() noValue?: any;\n\n /**\n * The resolved value of the toggle, based on the checked state, value and noValue.\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n @Prop({ mutable: true }) resolvedValue: any = null;\n\n /**\n * Optional hint text(s) to be displayed with the toggle.\n */\n @Prop() hint?: string | string[];\n\n /**\n * Whether the label should appear to the left of the toggle.\n */\n @Prop() labelLeft = false;\n\n /**\n * The alignment of the checkbox.\n */\n @Prop() alignment: 'center' | 'top' | 'bottom' = 'top';\n\n /**\n * Attributes that will be added to the native HTML input element.\n */\n @Prop() nativeAttributes?: { [key: string]: string };\n\n /**\n * A unique identifier for the underlying native element that is used for\n * testing purposes. The attribute is added as `data-test` attribute and acts\n * as a shorthand for `nativeAttributes={ 'data-test': 'test-Id' }`.\n */\n @Prop() testId?: string;\n\n /**\n * Emitted when the checked status of the toggle is changed.\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n @Event() catChange!: EventEmitter<any>;\n\n /**\n * Emitted when the toggle received focus.\n */\n @Event() catFocus!: EventEmitter<FocusEvent>;\n\n /**\n * Emitted when the toggle loses focus.\n */\n @Event() catBlur!: EventEmitter<FocusEvent>;\n\n componentWillLoad() {\n this.updateResolved();\n }\n\n componentWillRender(): void {\n this.internals.setFormValue(this.checked ? (this.value ?? 'on') : (this.noValue ?? null));\n this.hasSlottedLabel = !!this.hostElement.querySelector('[slot=\"label\"]');\n this.hasSlottedHint = !!this.hostElement.querySelector('[slot=\"hint\"]');\n }\n\n /**\n * Programmatically move focus to the toggle. Use this method instead of\n * `input.focus()`.\n *\n * @param options An optional object providing options to control aspects of\n * the focusing process.\n */\n @Method()\n async doFocus(options?: FocusOptions): Promise<void> {\n this.input.focus(options);\n }\n\n /**\n * Programmatically remove focus from the toggle. Use this method instead of\n * `input.blur()`.\n */\n @Method()\n async doBlur(): Promise<void> {\n this.input.blur();\n }\n\n render() {\n this.hostElement.tabIndex = Number(this.hostElement.getAttribute('tabindex')) || 0;\n return (\n <Host>\n <label\n htmlFor={this.id}\n class={{\n 'is-hidden': this.labelHidden,\n 'is-disabled': this.disabled,\n 'label-left': this.labelLeft,\n 'align-center': this.alignment === 'center',\n 'align-end': this.alignment === 'bottom'\n }}\n >\n <input\n data-test={this.testId}\n {...this.nativeAttributes}\n part=\"input\"\n ref={el => (this.input = el as HTMLInputElement)}\n id={this.id}\n type=\"checkbox\"\n name={this.name}\n value={this.value}\n checked={this.checked}\n required={this.required}\n disabled={this.disabled}\n class=\"form-check-input\"\n role=\"switch\"\n onInput={this.onInput.bind(this)}\n onFocus={this.onFocus.bind(this)}\n onBlur={this.onBlur.bind(this)}\n aria-describedby={this.hasHint ? this.id + '-hint' : undefined}\n />\n <span class=\"toggle\"></span>\n <span class=\"label\" part=\"label\">\n {(this.hasSlottedLabel && <slot name=\"label\"></slot>) || this.label}\n </span>\n </label>\n {this.hasHint && (\n <div class={{ 'hint-wrapper': true, 'label-left': this.labelLeft }}>\n <div class=\"toggle-placeholder\"></div>\n <CatFormHint id={this.id} hint={this.hint} slottedHint={this.hasSlottedHint && <slot name=\"hint\"></slot>} />\n </div>\n )}\n </Host>\n );\n }\n\n private get hasHint() {\n return !!this.hint || !!this.hasSlottedHint;\n }\n\n private onInput() {\n this.checked = this.input.checked;\n this.internals.setFormValue(this.input.checked ? (this.value ?? 'on') : (this.noValue ?? null));\n this.updateResolved();\n this.catChange.emit(this.resolvedValue);\n }\n\n private onFocus(event: FocusEvent) {\n this.catFocus.emit(event);\n }\n\n private onBlur(event: FocusEvent) {\n this.catBlur.emit(event);\n }\n\n private updateResolved() {\n this.resolvedValue = this.checked ? (this.value ?? true) : (this.noValue ?? false);\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"cat-toggle.js","sourceRoot":"","sources":["../../../src/components/cat-toggle/cat-toggle.tsx"],"names":[],"mappings":"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","sourcesContent":["import { AttachInternals, Component, Element, Event, EventEmitter, h, Host, Method, Prop, State } from '@stencil/core';\nimport { CatFormHint } from '../cat-form-hint/cat-form-hint';\n\nlet nextUniqueId = 0;\n\n/**\n * Toggles are graphical interface switches that give user control over a\n * feature or option that can be turned on or off.\n *\n * @slot hint - Optional hint element to be displayed with the toggle.\n * @slot label - The slotted label. If both the label property and the label slot are present, only the label slot will be displayed.\n * @part label - The label content.\n * @part input - The native input element.\n */\n@Component({\n tag: 'cat-toggle',\n styleUrls: ['cat-toggle.scss'],\n formAssociated: true,\n shadow: {\n delegatesFocus: true\n }\n})\nexport class CatToggle {\n private readonly _id = `cat-toggle-${nextUniqueId++}`;\n private get id() {\n return this.identifier || this._id;\n }\n\n private input!: HTMLInputElement;\n\n @Element() hostElement!: HTMLElement;\n\n @State() hasSlottedLabel = false;\n\n @State() hasSlottedHint = false;\n\n @AttachInternals() internals!: ElementInternals;\n\n /**\n * Checked state of the toggle.\n */\n @Prop({ mutable: true }) checked = false;\n\n /**\n * Disabled state of the toggle.\n */\n @Prop() disabled = false;\n\n /**\n * A unique identifier for the input.\n */\n @Prop() identifier?: string;\n\n /**\n * The label of the toggle that is visible.\n */\n @Prop() label = '';\n\n /**\n * Visually hide the label, but still show it to assistive technologies like screen readers.\n */\n @Prop() labelHidden = false;\n\n /**\n * The name of the input.\n */\n @Prop() name?: string;\n\n /**\n * Required state of the toggle.\n */\n @Prop() required = false;\n\n /**\n * The value of the checked toggle.\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n @Prop() value?: any;\n\n /**\n * The value of the unchecked toggle.\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n @Prop() noValue?: any;\n\n /**\n * The resolved value of the toggle, based on the checked state, value and noValue.\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n @Prop({ mutable: true }) resolvedValue: any = null;\n\n /**\n * Optional hint text(s) to be displayed with the toggle.\n */\n @Prop() hint?: string | string[];\n\n /**\n * Whether the label should appear to the left of the toggle.\n */\n @Prop() labelLeft = false;\n\n /**\n * The alignment of the checkbox.\n */\n @Prop() alignment: 'center' | 'top' | 'bottom' = 'top';\n\n /**\n * Attributes that will be added to the native HTML input element.\n */\n @Prop() nativeAttributes?: { [key: string]: string };\n\n /**\n * A unique identifier for the underlying native element that is used for\n * testing purposes. The attribute is added as `data-test` attribute and acts\n * as a shorthand for `nativeAttributes={ 'data-test': 'test-Id' }`.\n */\n @Prop() testId?: string;\n\n /**\n * Emitted when the checked status of the toggle is changed.\n */\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n @Event() catChange!: EventEmitter<any>;\n\n /**\n * Emitted when the toggle received focus.\n */\n @Event() catFocus!: EventEmitter<FocusEvent>;\n\n /**\n * Emitted when the toggle loses focus.\n */\n @Event() catBlur!: EventEmitter<FocusEvent>;\n\n componentWillLoad() {\n this.updateResolved();\n }\n\n componentWillRender(): void {\n this.internals.setFormValue(this.checked ? (this.value ?? 'on') : (this.noValue ?? null));\n this.hasSlottedLabel = !!this.hostElement.querySelector('[slot=\"label\"]');\n this.hasSlottedHint = !!this.hostElement.querySelector('[slot=\"hint\"]');\n }\n\n /**\n * Programmatically move focus to the toggle. Use this method instead of\n * `input.focus()`.\n *\n * @param options An optional object providing options to control aspects of\n * the focusing process.\n */\n @Method()\n async doFocus(options?: FocusOptions): Promise<void> {\n this.input.focus(options);\n }\n\n /**\n * Programmatically remove focus from the toggle. Use this method instead of\n * `input.blur()`.\n */\n @Method()\n async doBlur(): Promise<void> {\n this.input.blur();\n }\n\n render() {\n this.hostElement.tabIndex = Number(this.hostElement.getAttribute('tabindex')) || 0;\n return (\n <Host>\n <label\n htmlFor={this.id}\n class={{\n 'is-hidden': this.labelHidden,\n 'is-disabled': this.disabled,\n 'label-left': this.labelLeft,\n 'align-center': this.alignment === 'center',\n 'align-end': this.alignment === 'bottom'\n }}\n >\n <input\n data-test={this.testId}\n {...this.nativeAttributes}\n part=\"input\"\n ref={el => (this.input = el as HTMLInputElement)}\n id={this.id}\n type=\"checkbox\"\n name={this.name}\n value={this.value}\n checked={this.checked}\n required={this.required}\n disabled={this.disabled}\n class=\"form-check-input\"\n role=\"switch\"\n onInput={this.onInput.bind(this)}\n onFocus={this.onFocus.bind(this)}\n onBlur={this.onBlur.bind(this)}\n aria-describedby={this.hasHint ? this.id + '-hint' : undefined}\n />\n <span class=\"toggle\"></span>\n <span class=\"label\" part=\"label\">\n {(this.hasSlottedLabel && <slot name=\"label\"></slot>) || this.label}\n </span>\n </label>\n {this.hasHint && (\n <div class={{ 'hint-wrapper': true, 'label-left': this.labelLeft }}>\n <div class=\"toggle-placeholder\"></div>\n <CatFormHint id={this.id} hint={this.hint} slottedHint={this.hasSlottedHint && <slot name=\"hint\"></slot>} />\n </div>\n )}\n </Host>\n );\n }\n\n private get hasHint() {\n return !!this.hint || !!this.hasSlottedHint;\n }\n\n private onInput() {\n this.checked = this.input.checked;\n this.internals.setFormValue(this.input.checked ? (this.value ?? 'on') : (this.noValue ?? null));\n this.updateResolved();\n this.catChange.emit(this.resolvedValue);\n }\n\n private onFocus(event: FocusEvent) {\n this.catFocus.emit(event);\n }\n\n private onBlur(event: FocusEvent) {\n this.catBlur.emit(event);\n }\n\n private updateResolved() {\n this.resolvedValue = this.checked ? (this.value ?? true) : (this.noValue ?? false);\n }\n}\n"]}
|
|
@@ -12,13 +12,38 @@ export class CatTooltip {
|
|
|
12
12
|
this.id = `cat-tooltip-${nextUniqueId++}`;
|
|
13
13
|
this.inactive = false;
|
|
14
14
|
this.open = false;
|
|
15
|
+
/**
|
|
16
|
+
* The content of the tooltip.
|
|
17
|
+
*/
|
|
15
18
|
this.content = '';
|
|
19
|
+
/**
|
|
20
|
+
* Specifies that the tooltip should be disabled. A disabled tooltip is unusable,
|
|
21
|
+
* and invisible. Corresponds with the native HTML disabled attribute.
|
|
22
|
+
*/
|
|
16
23
|
this.disabled = false;
|
|
24
|
+
/**
|
|
25
|
+
* The placement of the tooltip.
|
|
26
|
+
*/
|
|
17
27
|
this.placement = 'top';
|
|
28
|
+
/**
|
|
29
|
+
* Use round tooltip edges.
|
|
30
|
+
*/
|
|
18
31
|
this.round = false;
|
|
32
|
+
/**
|
|
33
|
+
* The size of the tooltip.
|
|
34
|
+
*/
|
|
19
35
|
this.size = 'm';
|
|
36
|
+
/**
|
|
37
|
+
* The delay time for showing tooltip in ms.
|
|
38
|
+
*/
|
|
20
39
|
this.showDelay = 250;
|
|
40
|
+
/**
|
|
41
|
+
* The delay time for hiding tooltip in ms.
|
|
42
|
+
*/
|
|
21
43
|
this.hideDelay = 0;
|
|
44
|
+
/**
|
|
45
|
+
* The duration of tap to show the tooltip.
|
|
46
|
+
*/
|
|
22
47
|
this.longTouchDuration = 1000;
|
|
23
48
|
this.boundShowListener = this.showListener.bind(this);
|
|
24
49
|
this.boundHideListener = this.hideListener.bind(this);
|
|
@@ -159,6 +184,7 @@ export class CatTooltip {
|
|
|
159
184
|
return {
|
|
160
185
|
"content": {
|
|
161
186
|
"type": "string",
|
|
187
|
+
"attribute": "content",
|
|
162
188
|
"mutable": false,
|
|
163
189
|
"complexType": {
|
|
164
190
|
"original": "string",
|
|
@@ -171,12 +197,14 @@ export class CatTooltip {
|
|
|
171
197
|
"tags": [],
|
|
172
198
|
"text": "The content of the tooltip."
|
|
173
199
|
},
|
|
174
|
-
"
|
|
200
|
+
"getter": false,
|
|
201
|
+
"setter": false,
|
|
175
202
|
"reflect": false,
|
|
176
203
|
"defaultValue": "''"
|
|
177
204
|
},
|
|
178
205
|
"disabled": {
|
|
179
206
|
"type": "boolean",
|
|
207
|
+
"attribute": "disabled",
|
|
180
208
|
"mutable": false,
|
|
181
209
|
"complexType": {
|
|
182
210
|
"original": "boolean",
|
|
@@ -189,12 +217,14 @@ export class CatTooltip {
|
|
|
189
217
|
"tags": [],
|
|
190
218
|
"text": "Specifies that the tooltip should be disabled. A disabled tooltip is unusable,\nand invisible. Corresponds with the native HTML disabled attribute."
|
|
191
219
|
},
|
|
192
|
-
"
|
|
220
|
+
"getter": false,
|
|
221
|
+
"setter": false,
|
|
193
222
|
"reflect": false,
|
|
194
223
|
"defaultValue": "false"
|
|
195
224
|
},
|
|
196
225
|
"placement": {
|
|
197
226
|
"type": "string",
|
|
227
|
+
"attribute": "placement",
|
|
198
228
|
"mutable": false,
|
|
199
229
|
"complexType": {
|
|
200
230
|
"original": "TooltipPlacement",
|
|
@@ -213,12 +243,14 @@ export class CatTooltip {
|
|
|
213
243
|
"tags": [],
|
|
214
244
|
"text": "The placement of the tooltip."
|
|
215
245
|
},
|
|
216
|
-
"
|
|
246
|
+
"getter": false,
|
|
247
|
+
"setter": false,
|
|
217
248
|
"reflect": false,
|
|
218
249
|
"defaultValue": "'top'"
|
|
219
250
|
},
|
|
220
251
|
"round": {
|
|
221
252
|
"type": "boolean",
|
|
253
|
+
"attribute": "round",
|
|
222
254
|
"mutable": false,
|
|
223
255
|
"complexType": {
|
|
224
256
|
"original": "boolean",
|
|
@@ -231,12 +263,14 @@ export class CatTooltip {
|
|
|
231
263
|
"tags": [],
|
|
232
264
|
"text": "Use round tooltip edges."
|
|
233
265
|
},
|
|
234
|
-
"
|
|
266
|
+
"getter": false,
|
|
267
|
+
"setter": false,
|
|
235
268
|
"reflect": false,
|
|
236
269
|
"defaultValue": "false"
|
|
237
270
|
},
|
|
238
271
|
"size": {
|
|
239
272
|
"type": "string",
|
|
273
|
+
"attribute": "size",
|
|
240
274
|
"mutable": false,
|
|
241
275
|
"complexType": {
|
|
242
276
|
"original": "'s' | 'm' | 'l'",
|
|
@@ -249,12 +283,14 @@ export class CatTooltip {
|
|
|
249
283
|
"tags": [],
|
|
250
284
|
"text": "The size of the tooltip."
|
|
251
285
|
},
|
|
252
|
-
"
|
|
286
|
+
"getter": false,
|
|
287
|
+
"setter": false,
|
|
253
288
|
"reflect": false,
|
|
254
289
|
"defaultValue": "'m'"
|
|
255
290
|
},
|
|
256
291
|
"showDelay": {
|
|
257
292
|
"type": "number",
|
|
293
|
+
"attribute": "show-delay",
|
|
258
294
|
"mutable": false,
|
|
259
295
|
"complexType": {
|
|
260
296
|
"original": "number",
|
|
@@ -267,12 +303,14 @@ export class CatTooltip {
|
|
|
267
303
|
"tags": [],
|
|
268
304
|
"text": "The delay time for showing tooltip in ms."
|
|
269
305
|
},
|
|
270
|
-
"
|
|
306
|
+
"getter": false,
|
|
307
|
+
"setter": false,
|
|
271
308
|
"reflect": false,
|
|
272
309
|
"defaultValue": "250"
|
|
273
310
|
},
|
|
274
311
|
"hideDelay": {
|
|
275
312
|
"type": "number",
|
|
313
|
+
"attribute": "hide-delay",
|
|
276
314
|
"mutable": false,
|
|
277
315
|
"complexType": {
|
|
278
316
|
"original": "number",
|
|
@@ -285,12 +323,14 @@ export class CatTooltip {
|
|
|
285
323
|
"tags": [],
|
|
286
324
|
"text": "The delay time for hiding tooltip in ms."
|
|
287
325
|
},
|
|
288
|
-
"
|
|
326
|
+
"getter": false,
|
|
327
|
+
"setter": false,
|
|
289
328
|
"reflect": false,
|
|
290
329
|
"defaultValue": "0"
|
|
291
330
|
},
|
|
292
331
|
"longTouchDuration": {
|
|
293
332
|
"type": "number",
|
|
333
|
+
"attribute": "long-touch-duration",
|
|
294
334
|
"mutable": false,
|
|
295
335
|
"complexType": {
|
|
296
336
|
"original": "number",
|
|
@@ -303,7 +343,8 @@ export class CatTooltip {
|
|
|
303
343
|
"tags": [],
|
|
304
344
|
"text": "The duration of tap to show the tooltip."
|
|
305
345
|
},
|
|
306
|
-
"
|
|
346
|
+
"getter": false,
|
|
347
|
+
"setter": false,
|
|
307
348
|
"reflect": false,
|
|
308
349
|
"defaultValue": "1000"
|
|
309
350
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"cat-tooltip.js","sourceRoot":"","sources":["../../../src/components/cat-tooltip/cat-tooltip.tsx"],"names":[],"mappings":"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","sourcesContent":["import { autoUpdate, computePosition, flip, offset, shift } from '@floating-ui/dom';\nimport { Placement } from '@floating-ui/utils';\nimport { Component, Element, h, Host, Listen, Prop, State } from '@stencil/core';\nimport isTouchScreen from '../../utils/is-touch-screen';\n\nlet nextUniqueId = 0;\n\nexport type TooltipPlacement = Placement;\n\n/**\n * Tooltips display additional information when the user hovers over or\n * interacts with a trigger element. The tooltip can be customized with\n * different placements, sizes, and styles.\n */\n@Component({\n tag: 'cat-tooltip',\n styleUrl: 'cat-tooltip.scss',\n shadow: true\n})\nexport class CatTooltip {\n private static readonly OFFSET = 4;\n private static readonly SHIFT_PADDING = 4;\n private readonly id = `cat-tooltip-${nextUniqueId++}`;\n private tooltip?: HTMLElement;\n private trigger?: Element;\n private showTimeout?: number;\n private hideTimeout?: number;\n private touchTimeout?: number;\n private inactive = false;\n private cleanupFloatingUi?: () => void;\n\n private readonly boundShowListener: () => void;\n private readonly boundHideListener: () => void;\n private readonly boundWindowTouchStartListener: () => void;\n private readonly boundTouchStartListener: (event: Event) => void;\n private readonly boundTouchEndListener: () => void;\n\n constructor() {\n this.boundShowListener = this.showListener.bind(this);\n this.boundHideListener = this.hideListener.bind(this);\n this.boundWindowTouchStartListener = this.windowTouchStartListener.bind(this);\n this.boundTouchStartListener = this.touchStartListener.bind(this);\n this.boundTouchEndListener = this.touchEndListener.bind(this);\n }\n\n @Element() hostElement!: HTMLElement;\n\n @State() open = false;\n\n /**\n * The content of the tooltip.\n */\n @Prop() content = '';\n\n /**\n * Specifies that the tooltip should be disabled. A disabled tooltip is unusable,\n * and invisible. Corresponds with the native HTML disabled attribute.\n */\n @Prop() disabled = false;\n\n /**\n * The placement of the tooltip.\n */\n @Prop() placement: TooltipPlacement = 'top';\n\n /**\n * Use round tooltip edges.\n */\n @Prop() round = false;\n\n /**\n * The size of the tooltip.\n */\n @Prop() size: 's' | 'm' | 'l' = 'm';\n\n /**\n * The delay time for showing tooltip in ms.\n */\n @Prop() showDelay = 250;\n\n /**\n * The delay time for hiding tooltip in ms.\n */\n @Prop() hideDelay = 0;\n\n /**\n * The duration of tap to show the tooltip.\n */\n @Prop() longTouchDuration = 1000;\n\n @Listen('keydown', { target: 'window' })\n handleKeyDown({ key }: KeyboardEvent) {\n key === 'Escape' && this.hideTooltip();\n }\n\n componentDidLoad(): void {\n const slot = this.hostElement.shadowRoot?.querySelector('slot');\n this.trigger = slot?.assignedElements?.()?.[0];\n if (this.trigger && !this.trigger.hasAttribute('aria-describedby')) {\n this.trigger.setAttribute('aria-describedby', this.id);\n }\n\n if (isTouchScreen) {\n window.addEventListener('touchstart', this.boundWindowTouchStartListener);\n this.trigger?.addEventListener('touchstart', this.boundTouchStartListener);\n this.trigger?.addEventListener('touchend', this.boundTouchEndListener);\n } else {\n this.trigger?.addEventListener('focusin', this.boundShowListener);\n this.trigger?.addEventListener('focusout', this.boundHideListener);\n this.trigger?.addEventListener('mouseenter', this.boundShowListener);\n this.trigger?.addEventListener('mouseleave', this.boundHideListener);\n }\n }\n\n componentWillRender(): void {\n this.inactive = this.disabled || (!this.content && !this.hostElement.querySelector('[slot=\"content\"]'));\n }\n\n disconnectedCallback(): void {\n if (isTouchScreen) {\n window.removeEventListener('touchstart', this.boundWindowTouchStartListener);\n this.trigger?.removeEventListener('touchstart', this.boundTouchStartListener);\n this.trigger?.removeEventListener('touchend', this.boundTouchEndListener);\n } else {\n this.trigger?.removeEventListener('mouseenter', this.boundShowListener);\n this.trigger?.removeEventListener('mouseleave', this.boundHideListener);\n this.trigger?.removeEventListener('focusin', this.boundShowListener);\n this.trigger?.removeEventListener('focusout', this.boundHideListener);\n }\n }\n\n render() {\n return (\n <Host>\n <slot />\n <div\n ref={el => (this.tooltip = el)}\n id={this.id}\n role=\"tooltip\"\n aria-hidden={!this.open}\n aria-live={this.open ? 'polite' : 'off'}\n class={{\n tooltip: true,\n 'tooltip-hidden': this.inactive,\n 'tooltip-round': this.round,\n [`tooltip-${this.size}`]: Boolean(this.size)\n }}\n >\n <slot name=\"content\">\n {/* The paragraph is needed here to make aria-live work properly. */}\n <p>{this.content}</p>\n </slot>\n </div>\n </Host>\n );\n }\n\n private async update() {\n if (this.trigger && this.tooltip) {\n await computePosition(this.trigger, this.tooltip, {\n strategy: 'fixed',\n placement: this.placement,\n middleware: [\n offset(CatTooltip.OFFSET),\n flip({ fallbackAxisSideDirection: 'start' }),\n shift({ padding: CatTooltip.SHIFT_PADDING })\n ]\n }).then(({ x, y }) => {\n if (this.tooltip) {\n Object.assign(this.tooltip.style, {\n left: `${Math.max(0, x)}px`,\n top: `${y}px`\n });\n }\n });\n }\n }\n\n private showListener() {\n window.clearTimeout(this.hideTimeout);\n this.hideTimeout = undefined;\n if (!this.showTimeout) {\n this.showTimeout = window.setTimeout(() => {\n this.showTimeout = undefined;\n this.showTooltip();\n }, this.showDelay);\n }\n }\n\n private hideListener() {\n window.clearTimeout(this.showTimeout);\n this.showTimeout = undefined;\n if (!this.hideTimeout) {\n this.hideTimeout = window.setTimeout(() => {\n this.hideTimeout = undefined;\n this.hideTooltip();\n }, this.hideDelay);\n }\n }\n\n private touchStartListener(event: Event) {\n event.stopPropagation();\n if (!this.touchTimeout) {\n this.touchTimeout = window.setTimeout(() => {\n this.touchTimeout = undefined;\n this.showTooltip();\n }, this.longTouchDuration);\n }\n }\n\n private touchEndListener() {\n window.clearTimeout(this.touchTimeout);\n this.touchTimeout = undefined;\n this.hideTooltip();\n }\n\n private windowTouchStartListener() {\n this.hideTooltip();\n }\n\n private showTooltip() {\n if (this.trigger && this.tooltip) {\n this.cleanupFloatingUi = autoUpdate(this.trigger, this.tooltip, () => this.update());\n }\n if (!this.inactive) {\n this.open = true;\n this.tooltip?.classList.add('tooltip-show');\n }\n }\n\n private hideTooltip() {\n this.open = false;\n this.tooltip?.classList.remove('tooltip-show');\n this.cleanupFloatingUi?.();\n this.cleanupFloatingUi = undefined;\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"cat-tooltip.js","sourceRoot":"","sources":["../../../src/components/cat-tooltip/cat-tooltip.tsx"],"names":[],"mappings":"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","sourcesContent":["import { autoUpdate, computePosition, flip, offset, shift } from '@floating-ui/dom';\nimport { Placement } from '@floating-ui/utils';\nimport { Component, Element, h, Host, Listen, Prop, State } from '@stencil/core';\nimport isTouchScreen from '../../utils/is-touch-screen';\n\nlet nextUniqueId = 0;\n\nexport type TooltipPlacement = Placement;\n\n/**\n * Tooltips display additional information when the user hovers over or\n * interacts with a trigger element. The tooltip can be customized with\n * different placements, sizes, and styles.\n */\n@Component({\n tag: 'cat-tooltip',\n styleUrl: 'cat-tooltip.scss',\n shadow: true\n})\nexport class CatTooltip {\n private static readonly OFFSET = 4;\n private static readonly SHIFT_PADDING = 4;\n private readonly id = `cat-tooltip-${nextUniqueId++}`;\n private tooltip?: HTMLElement;\n private trigger?: Element;\n private showTimeout?: number;\n private hideTimeout?: number;\n private touchTimeout?: number;\n private inactive = false;\n private cleanupFloatingUi?: () => void;\n\n private readonly boundShowListener: () => void;\n private readonly boundHideListener: () => void;\n private readonly boundWindowTouchStartListener: () => void;\n private readonly boundTouchStartListener: (event: Event) => void;\n private readonly boundTouchEndListener: () => void;\n\n constructor() {\n this.boundShowListener = this.showListener.bind(this);\n this.boundHideListener = this.hideListener.bind(this);\n this.boundWindowTouchStartListener = this.windowTouchStartListener.bind(this);\n this.boundTouchStartListener = this.touchStartListener.bind(this);\n this.boundTouchEndListener = this.touchEndListener.bind(this);\n }\n\n @Element() hostElement!: HTMLElement;\n\n @State() open = false;\n\n /**\n * The content of the tooltip.\n */\n @Prop() content = '';\n\n /**\n * Specifies that the tooltip should be disabled. A disabled tooltip is unusable,\n * and invisible. Corresponds with the native HTML disabled attribute.\n */\n @Prop() disabled = false;\n\n /**\n * The placement of the tooltip.\n */\n @Prop() placement: TooltipPlacement = 'top';\n\n /**\n * Use round tooltip edges.\n */\n @Prop() round = false;\n\n /**\n * The size of the tooltip.\n */\n @Prop() size: 's' | 'm' | 'l' = 'm';\n\n /**\n * The delay time for showing tooltip in ms.\n */\n @Prop() showDelay = 250;\n\n /**\n * The delay time for hiding tooltip in ms.\n */\n @Prop() hideDelay = 0;\n\n /**\n * The duration of tap to show the tooltip.\n */\n @Prop() longTouchDuration = 1000;\n\n @Listen('keydown', { target: 'window' })\n handleKeyDown({ key }: KeyboardEvent) {\n key === 'Escape' && this.hideTooltip();\n }\n\n componentDidLoad(): void {\n const slot = this.hostElement.shadowRoot?.querySelector('slot');\n this.trigger = slot?.assignedElements?.()?.[0];\n if (this.trigger && !this.trigger.hasAttribute('aria-describedby')) {\n this.trigger.setAttribute('aria-describedby', this.id);\n }\n\n if (isTouchScreen) {\n window.addEventListener('touchstart', this.boundWindowTouchStartListener);\n this.trigger?.addEventListener('touchstart', this.boundTouchStartListener);\n this.trigger?.addEventListener('touchend', this.boundTouchEndListener);\n } else {\n this.trigger?.addEventListener('focusin', this.boundShowListener);\n this.trigger?.addEventListener('focusout', this.boundHideListener);\n this.trigger?.addEventListener('mouseenter', this.boundShowListener);\n this.trigger?.addEventListener('mouseleave', this.boundHideListener);\n }\n }\n\n componentWillRender(): void {\n this.inactive = this.disabled || (!this.content && !this.hostElement.querySelector('[slot=\"content\"]'));\n }\n\n disconnectedCallback(): void {\n if (isTouchScreen) {\n window.removeEventListener('touchstart', this.boundWindowTouchStartListener);\n this.trigger?.removeEventListener('touchstart', this.boundTouchStartListener);\n this.trigger?.removeEventListener('touchend', this.boundTouchEndListener);\n } else {\n this.trigger?.removeEventListener('mouseenter', this.boundShowListener);\n this.trigger?.removeEventListener('mouseleave', this.boundHideListener);\n this.trigger?.removeEventListener('focusin', this.boundShowListener);\n this.trigger?.removeEventListener('focusout', this.boundHideListener);\n }\n }\n\n render() {\n return (\n <Host>\n <slot />\n <div\n ref={el => (this.tooltip = el)}\n id={this.id}\n role=\"tooltip\"\n aria-hidden={!this.open}\n aria-live={this.open ? 'polite' : 'off'}\n class={{\n tooltip: true,\n 'tooltip-hidden': this.inactive,\n 'tooltip-round': this.round,\n [`tooltip-${this.size}`]: Boolean(this.size)\n }}\n >\n <slot name=\"content\">\n {/* The paragraph is needed here to make aria-live work properly. */}\n <p>{this.content}</p>\n </slot>\n </div>\n </Host>\n );\n }\n\n private async update() {\n if (this.trigger && this.tooltip) {\n await computePosition(this.trigger, this.tooltip, {\n strategy: 'fixed',\n placement: this.placement,\n middleware: [\n offset(CatTooltip.OFFSET),\n flip({ fallbackAxisSideDirection: 'start' }),\n shift({ padding: CatTooltip.SHIFT_PADDING })\n ]\n }).then(({ x, y }) => {\n if (this.tooltip) {\n Object.assign(this.tooltip.style, {\n left: `${Math.max(0, x)}px`,\n top: `${y}px`\n });\n }\n });\n }\n }\n\n private showListener() {\n window.clearTimeout(this.hideTimeout);\n this.hideTimeout = undefined;\n if (!this.showTimeout) {\n this.showTimeout = window.setTimeout(() => {\n this.showTimeout = undefined;\n this.showTooltip();\n }, this.showDelay);\n }\n }\n\n private hideListener() {\n window.clearTimeout(this.showTimeout);\n this.showTimeout = undefined;\n if (!this.hideTimeout) {\n this.hideTimeout = window.setTimeout(() => {\n this.hideTimeout = undefined;\n this.hideTooltip();\n }, this.hideDelay);\n }\n }\n\n private touchStartListener(event: Event) {\n event.stopPropagation();\n if (!this.touchTimeout) {\n this.touchTimeout = window.setTimeout(() => {\n this.touchTimeout = undefined;\n this.showTooltip();\n }, this.longTouchDuration);\n }\n }\n\n private touchEndListener() {\n window.clearTimeout(this.touchTimeout);\n this.touchTimeout = undefined;\n this.hideTooltip();\n }\n\n private windowTouchStartListener() {\n this.hideTooltip();\n }\n\n private showTooltip() {\n if (this.trigger && this.tooltip) {\n this.cleanupFloatingUi = autoUpdate(this.trigger, this.tooltip, () => this.update());\n }\n if (!this.inactive) {\n this.open = true;\n this.tooltip?.classList.add('tooltip-show');\n }\n }\n\n private hideTooltip() {\n this.open = false;\n this.tooltip?.classList.remove('tooltip-show');\n this.cleanupFloatingUi?.();\n this.cleanupFloatingUi = undefined;\n }\n}\n"]}
|
|
@@ -8,7 +8,6 @@ function setAttributeDefault(host, attr, value) {
|
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
const catAlertCss = ":host{display:flex;gap:0.5rem;padding:1.25rem;border-radius:var(--cat-border-radius-l, 0.5rem)}:host([hidden]){display:none}:host(:focus-visible){outline:2px solid rgb(var(--cat-border-color-focus, 0, 113, 255));outline-offset:1px}.content{align-self:center;width:100%}::slotted(:last-child){margin-bottom:0 !important}:host([color=primary]){background-color:rgb(var(--cat-primary-bg, 0, 129, 148));color:rgb(var(--cat-primary-fill, 255, 255, 255));--cat-primary-text:var(--cat-primary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-primary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-primary-fill-active, 255, 255, 255);--cat-link-decoration:underline}:host([color=secondary]){background-color:rgb(var(--cat-secondary-bg, 105, 118, 135));color:rgb(var(--cat-secondary-fill, 255, 255, 255));--cat-primary-text:var(--cat-secondary-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-secondary-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-secondary-fill-active, 255, 255, 255);--cat-link-decoration:underline}:host([color=info]){background-color:rgb(var(--cat-info-bg, 0, 115, 230));color:rgb(var(--cat-info-fill, 255, 255, 255));--cat-primary-text:var(--cat-info-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-info-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-info-fill-active, 255, 255, 255);--cat-link-decoration:underline}:host([color=success]){background-color:rgb(var(--cat-success-bg, 0, 132, 88));color:rgb(var(--cat-success-fill, 255, 255, 255));--cat-primary-text:var(--cat-success-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-success-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-success-fill-active, 255, 255, 255);--cat-link-decoration:underline}:host([color=warning]){background-color:rgb(var(--cat-warning-bg, 255, 206, 128));color:rgb(var(--cat-warning-fill, 0, 0, 0));--cat-primary-text:var(--cat-warning-fill, 0, 0, 0);--cat-primary-text-hover:var(--cat-warning-fill-hover, 0, 0, 0);--cat-primary-text-active:var(--cat-warning-fill-active, 0, 0, 0);--cat-link-decoration:underline}:host([color=danger]){background-color:rgb(var(--cat-danger-bg, 217, 52, 13));color:rgb(var(--cat-danger-fill, 255, 255, 255));--cat-primary-text:var(--cat-danger-fill, 255, 255, 255);--cat-primary-text-hover:var(--cat-danger-fill-hover, 255, 255, 255);--cat-primary-text-active:var(--cat-danger-fill-active, 255, 255, 255);--cat-link-decoration:underline}";
|
|
11
|
-
const CatAlertStyle0 = catAlertCss;
|
|
12
11
|
|
|
13
12
|
const CatAlert$1 = /*@__PURE__*/ proxyCustomElement(class CatAlert extends HTMLElement {
|
|
14
13
|
constructor() {
|
|
@@ -31,8 +30,13 @@ const CatAlert$1 = /*@__PURE__*/ proxyCustomElement(class CatAlert extends HTMLE
|
|
|
31
30
|
['warning', 'alert'],
|
|
32
31
|
['danger', 'alert']
|
|
33
32
|
]);
|
|
33
|
+
/**
|
|
34
|
+
* The color palette of the alert.
|
|
35
|
+
*/
|
|
34
36
|
this.color = 'primary';
|
|
35
|
-
|
|
37
|
+
/**
|
|
38
|
+
* Whether the icon of the alert is deactivated.
|
|
39
|
+
*/
|
|
36
40
|
this.noIcon = false;
|
|
37
41
|
}
|
|
38
42
|
connectedCallback() {
|
|
@@ -43,7 +47,7 @@ const CatAlert$1 = /*@__PURE__*/ proxyCustomElement(class CatAlert extends HTMLE
|
|
|
43
47
|
return (h(Host, { key: '5cda6d92f1cf40029c2a93723999ed9e8c44baac' }, !this.noIcon && h("cat-icon", { key: '69124d111b0a62932bbd761b6cbd1dc4ab155670', size: "l", icon: this.icon || this.mapIcon.get(this.color) }), h("div", { key: '22f6070cefa6ef5036e8b9e1ec7dcad357a69462', class: "content" }, h("slot", { key: 'e86f500e97dd688b986aa90af5db0f94819407e4' }))));
|
|
44
48
|
}
|
|
45
49
|
get hostElement() { return this; }
|
|
46
|
-
static get style() { return
|
|
50
|
+
static get style() { return catAlertCss; }
|
|
47
51
|
}, [1, "cat-alert", {
|
|
48
52
|
"color": [513],
|
|
49
53
|
"icon": [1],
|
|
@@ -72,5 +76,6 @@ const CatAlert = CatAlert$1;
|
|
|
72
76
|
const defineCustomElement = defineCustomElement$1;
|
|
73
77
|
|
|
74
78
|
export { CatAlert, defineCustomElement };
|
|
79
|
+
//# sourceMappingURL=cat-alert.js.map
|
|
75
80
|
|
|
76
81
|
//# sourceMappingURL=cat-alert.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"cat-alert.js","mappings":";;;SAAgB,mBAAmB,CACjC,IAAO,EACP,IAAY,EACZ,KAAc;
|
|
1
|
+
{"file":"cat-alert.js","mappings":";;;SAAgB,mBAAmB,CACjC,IAAO,EACP,IAAY,EACZ,KAAc,EAAA;AAEd,IAAA,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,YAAY,CAAC,IAAI,CAAC,IAAI,KAAK,IAAI,IAAI,EAAE;AACzD,QAAA,IAAI,CAAC,WAAW,CAAC,YAAY,CAAC,IAAI,EAAE,MAAM,CAAC,KAAK,CAAC,CAAC;;AAEtD;;ACRA,MAAM,WAAW,GAAG,45EAA45E;;MCYn6EA,UAAQ,iBAAAC,kBAAA,CAAA,MAAA,QAAA,SAAA,WAAA,CAAA;AALrB,IAAA,WAAA,GAAA;;;;AAMmB,QAAA,IAAO,CAAA,OAAA,GAAwB,IAAI,GAAG,CAAC;YACtD,CAAC,SAAS,EAAE,oBAAoB,CAAC;YACjC,CAAC,WAAW,EAAE,sBAAsB,CAAC;YACrC,CAAC,MAAM,EAAE,iBAAiB,CAAC;YAC3B,CAAC,SAAS,EAAE,oBAAoB,CAAC;YACjC,CAAC,SAAS,EAAE,oBAAoB,CAAC;YACjC,CAAC,QAAQ,EAAE,mBAAmB;AAC/B,SAAA,CAAC;AACe,QAAA,IAAO,CAAA,OAAA,GAAwB,IAAI,GAAG,CAAC;YACtD,CAAC,SAAS,EAAE,QAAQ,CAAC;YACrB,CAAC,WAAW,EAAE,QAAQ,CAAC;YACvB,CAAC,MAAM,EAAE,QAAQ,CAAC;YAClB,CAAC,SAAS,EAAE,QAAQ,CAAC;YACrB,CAAC,SAAS,EAAE,OAAO,CAAC;YACpB,CAAC,QAAQ,EAAE,OAAO;AACnB,SAAA,CAAC;AAIF;;AAEG;AACsB,QAAA,IAAK,CAAA,KAAA,GAA+D,SAAS;AAOtG;;AAEG;AACK,QAAA,IAAM,CAAA,MAAA,GAAG,KAAK;AAiBvB;IAfC,iBAAiB,GAAA;AACf,QAAA,mBAAmB,CAAC,IAAI,EAAE,UAAU,EAAE,CAAC,CAAC;AACxC,QAAA,mBAAmB,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;;IAGjE,MAAM,GAAA;AACJ,QAAA,QACE,EAAC,IAAI,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACF,CAAC,IAAI,CAAC,MAAM,IAAI,CAAA,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAU,IAAI,EAAC,GAAG,EAAC,IAAI,EAAE,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,KAAK,CAAC,EAAa,CAAA,EAChG,CAAK,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,SAAS,EAAA,EAClB,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACT,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["CatAlert","__stencil_proxyCustomElement"],"sources":["src/utils/setDefault.ts","src/components/cat-alert/cat-alert.scss?tag=cat-alert&encapsulation=shadow","src/components/cat-alert/cat-alert.tsx"],"sourcesContent":["export function setAttributeDefault<T extends { hostElement: HTMLElement }>(\n host: T,\n attr: string,\n value: unknown\n): void {\n if (!host.hostElement.hasAttribute(attr) && value != null) {\n host.hostElement.setAttribute(attr, String(value));\n }\n}\n\nexport function setAttribute<T extends { hostElement: HTMLElement }>(host: T, attr: string, value: unknown): void {\n host.hostElement.setAttribute(attr, String(value));\n}\n","@use 'variables' as *;\n@use 'mixins' as *;\n@use 'sass:map';\n\n:host {\n display: flex;\n gap: 0.5rem;\n padding: 1.25rem;\n border-radius: cat-border-radius('l');\n}\n\n:host([hidden]) {\n display: none;\n}\n\n:host(:focus-visible) {\n outline: 2px solid cat-token('color.ui.border.focus');\n outline-offset: 1px;\n}\n\n.content {\n align-self: center;\n width: 100%;\n}\n\n::slotted(:last-child) {\n margin-bottom: 0 !important;\n}\n\n// ----- theme\n\n@mixin theme($theme) {\n :host([color='#{$theme}']) {\n background-color: cat-token('color.theme.#{$theme}.bg');\n color: cat-token('color.theme.#{$theme}.fill');\n // adjust nested links\n --cat-primary-text: #{cat-token('color.theme.#{$theme}.fill', $wrap: false)};\n --cat-primary-text-hover: #{cat-token('color.theme.#{$theme}.fillHover', $wrap: false)};\n --cat-primary-text-active: #{cat-token('color.theme.#{$theme}.fillActive', $wrap: false)};\n --cat-link-decoration: underline;\n }\n}\n\n@include theme('primary');\n@include theme('secondary');\n@include theme('info');\n@include theme('success');\n@include theme('warning');\n@include theme('danger');\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\nimport { setAttributeDefault } from '../../utils/setDefault';\n\n/**\n * Informs user about important changes or conditions in the interface. Use this\n * component if you need to capture user’s attention in a prominent way.\n */\n@Component({\n tag: 'cat-alert',\n styleUrl: 'cat-alert.scss',\n shadow: true\n})\nexport class CatAlert {\n private readonly mapIcon: Map<string, string> = new Map([\n ['primary', '$cat:alert-primary'],\n ['secondary', '$cat:alert-secondary'],\n ['info', '$cat:alert-info'],\n ['success', '$cat:alert-success'],\n ['warning', '$cat:alert-warning'],\n ['danger', '$cat:alert-danger']\n ]);\n private readonly mapRole: Map<string, string> = new Map([\n ['primary', 'status'],\n ['secondary', 'status'],\n ['info', 'status'],\n ['success', 'status'],\n ['warning', 'alert'],\n ['danger', 'alert']\n ]);\n\n @Element() hostElement!: HTMLElement;\n\n /**\n * The color palette of the alert.\n */\n @Prop({ reflect: true }) color: 'primary' | 'secondary' | 'danger' | 'success' | 'warning' = 'primary';\n\n /**\n * The name of an icon to be displayed in the alert.\n */\n @Prop() icon?: string;\n\n /**\n * Whether the icon of the alert is deactivated.\n */\n @Prop() noIcon = false;\n\n connectedCallback() {\n setAttributeDefault(this, 'tabindex', 0);\n setAttributeDefault(this, 'role', this.mapRole.get(this.color));\n }\n\n render() {\n return (\n <Host>\n {!this.noIcon && <cat-icon size=\"l\" icon={this.icon || this.mapIcon.get(this.color)}></cat-icon>}\n <div class=\"content\">\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
|