@ongov/ontario-design-system-component-library 6.0.0-alpha.5 → 6.0.0-alpha.8
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/components/index.d.ts +43 -0
- package/components/index.js +2169 -0
- package/components/index.js.map +1 -0
- package/components/ontario-accordion.d.ts +11 -0
- package/components/ontario-accordion.js +378 -0
- package/components/ontario-accordion.js.map +1 -0
- package/components/ontario-aside.d.ts +11 -0
- package/components/ontario-aside.js +171 -0
- package/components/ontario-aside.js.map +1 -0
- package/components/ontario-back-to-top.d.ts +11 -0
- package/components/ontario-back-to-top.js +119 -0
- package/components/ontario-back-to-top.js.map +1 -0
- package/components/ontario-badge.d.ts +11 -0
- package/components/ontario-badge.js +9 -0
- package/components/ontario-badge.js.map +1 -0
- package/components/ontario-blockquote.d.ts +11 -0
- package/components/ontario-blockquote.js +145 -0
- package/components/ontario-blockquote.js.map +1 -0
- package/components/ontario-button.d.ts +11 -0
- package/components/ontario-button.js +237 -0
- package/components/ontario-button.js.map +1 -0
- package/components/ontario-callout.d.ts +11 -0
- package/components/ontario-callout.js +170 -0
- package/components/ontario-callout.js.map +1 -0
- package/components/ontario-card-collection.d.ts +11 -0
- package/components/ontario-card-collection.js +111 -0
- package/components/ontario-card-collection.js.map +1 -0
- package/components/ontario-card.d.ts +11 -0
- package/components/ontario-card.js +389 -0
- package/components/ontario-card.js.map +1 -0
- package/components/ontario-checkboxes.d.ts +11 -0
- package/components/ontario-checkboxes.js +428 -0
- package/components/ontario-checkboxes.js.map +1 -0
- package/components/ontario-critical-alert.d.ts +11 -0
- package/components/ontario-critical-alert.js +128 -0
- package/components/ontario-critical-alert.js.map +1 -0
- package/components/ontario-date-input.d.ts +11 -0
- package/components/ontario-date-input.js +623 -0
- package/components/ontario-date-input.js.map +1 -0
- package/components/ontario-dropdown-list.d.ts +11 -0
- package/components/ontario-dropdown-list.js +449 -0
- package/components/ontario-dropdown-list.js.map +1 -0
- package/components/ontario-fieldset.d.ts +11 -0
- package/components/ontario-fieldset.js +167 -0
- package/components/ontario-fieldset.js.map +1 -0
- package/components/ontario-footer.d.ts +11 -0
- package/components/ontario-footer.js +455 -0
- package/components/ontario-footer.js.map +1 -0
- package/components/ontario-form-container.d.ts +11 -0
- package/components/ontario-form-container.js +74 -0
- package/components/ontario-form-container.js.map +1 -0
- package/components/ontario-header-overflow-menu.d.ts +11 -0
- package/components/ontario-header-overflow-menu.js +9 -0
- package/components/ontario-header-overflow-menu.js.map +1 -0
- package/components/ontario-header.d.ts +11 -0
- package/components/ontario-header.js +900 -0
- package/components/ontario-header.js.map +1 -0
- package/components/ontario-hint-expander.d.ts +11 -0
- package/components/ontario-hint-expander.js +9 -0
- package/components/ontario-hint-expander.js.map +1 -0
- package/components/ontario-hint-text.d.ts +11 -0
- package/components/ontario-hint-text.js +9 -0
- package/components/ontario-hint-text.js.map +1 -0
- package/components/ontario-icon-accessibility.d.ts +11 -0
- package/components/ontario-icon-accessibility.js +170 -0
- package/components/ontario-icon-accessibility.js.map +1 -0
- package/components/ontario-icon-account.d.ts +11 -0
- package/components/ontario-icon-account.js +170 -0
- package/components/ontario-icon-account.js.map +1 -0
- package/components/ontario-icon-add-alt.d.ts +11 -0
- package/components/ontario-icon-add-alt.js +171 -0
- package/components/ontario-icon-add-alt.js.map +1 -0
- package/components/ontario-icon-add.d.ts +11 -0
- package/components/ontario-icon-add.js +171 -0
- package/components/ontario-icon-add.js.map +1 -0
- package/components/ontario-icon-alert-error.d.ts +11 -0
- package/components/ontario-icon-alert-error.js +9 -0
- package/components/ontario-icon-alert-error.js.map +1 -0
- package/components/ontario-icon-alert-information.d.ts +11 -0
- package/components/ontario-icon-alert-information.js +9 -0
- package/components/ontario-icon-alert-information.js.map +1 -0
- package/components/ontario-icon-alert-success.d.ts +11 -0
- package/components/ontario-icon-alert-success.js +9 -0
- package/components/ontario-icon-alert-success.js.map +1 -0
- package/components/ontario-icon-alert-warning.d.ts +11 -0
- package/components/ontario-icon-alert-warning.js +9 -0
- package/components/ontario-icon-alert-warning.js.map +1 -0
- package/components/ontario-icon-arrow-up.d.ts +11 -0
- package/components/ontario-icon-arrow-up.js +171 -0
- package/components/ontario-icon-arrow-up.js.map +1 -0
- package/components/ontario-icon-attach.d.ts +11 -0
- package/components/ontario-icon-attach.js +172 -0
- package/components/ontario-icon-attach.js.map +1 -0
- package/components/ontario-icon-bookmark-off.d.ts +11 -0
- package/components/ontario-icon-bookmark-off.js +170 -0
- package/components/ontario-icon-bookmark-off.js.map +1 -0
- package/components/ontario-icon-bookmark-on.d.ts +11 -0
- package/components/ontario-icon-bookmark-on.js +170 -0
- package/components/ontario-icon-bookmark-on.js.map +1 -0
- package/components/ontario-icon-calendar.d.ts +11 -0
- package/components/ontario-icon-calendar.js +170 -0
- package/components/ontario-icon-calendar.js.map +1 -0
- package/components/ontario-icon-camera.d.ts +11 -0
- package/components/ontario-icon-camera.js +170 -0
- package/components/ontario-icon-camera.js.map +1 -0
- package/components/ontario-icon-chevron-down.d.ts +11 -0
- package/components/ontario-icon-chevron-down.js +9 -0
- package/components/ontario-icon-chevron-down.js.map +1 -0
- package/components/ontario-icon-chevron-left.d.ts +11 -0
- package/components/ontario-icon-chevron-left.js +9 -0
- package/components/ontario-icon-chevron-left.js.map +1 -0
- package/components/ontario-icon-chevron-right.d.ts +11 -0
- package/components/ontario-icon-chevron-right.js +171 -0
- package/components/ontario-icon-chevron-right.js.map +1 -0
- package/components/ontario-icon-chevron-up.d.ts +11 -0
- package/components/ontario-icon-chevron-up.js +9 -0
- package/components/ontario-icon-chevron-up.js.map +1 -0
- package/components/ontario-icon-clock.d.ts +11 -0
- package/components/ontario-icon-clock.js +170 -0
- package/components/ontario-icon-clock.js.map +1 -0
- package/components/ontario-icon-close-header.d.ts +11 -0
- package/components/ontario-icon-close-header.js +171 -0
- package/components/ontario-icon-close-header.js.map +1 -0
- package/components/ontario-icon-close.d.ts +11 -0
- package/components/ontario-icon-close.js +171 -0
- package/components/ontario-icon-close.js.map +1 -0
- package/components/ontario-icon-cloud.d.ts +11 -0
- package/components/ontario-icon-cloud.js +170 -0
- package/components/ontario-icon-cloud.js.map +1 -0
- package/components/ontario-icon-collapse.d.ts +11 -0
- package/components/ontario-icon-collapse.js +168 -0
- package/components/ontario-icon-collapse.js.map +1 -0
- package/components/ontario-icon-credit-card.d.ts +11 -0
- package/components/ontario-icon-credit-card.js +171 -0
- package/components/ontario-icon-credit-card.js.map +1 -0
- package/components/ontario-icon-critical-alert-warning.d.ts +11 -0
- package/components/ontario-icon-critical-alert-warning.js +188 -0
- package/components/ontario-icon-critical-alert-warning.js.map +1 -0
- package/components/ontario-icon-delete.d.ts +11 -0
- package/components/ontario-icon-delete.js +170 -0
- package/components/ontario-icon-delete.js.map +1 -0
- package/components/ontario-icon-document.d.ts +11 -0
- package/components/ontario-icon-document.js +170 -0
- package/components/ontario-icon-document.js.map +1 -0
- package/components/ontario-icon-download.d.ts +11 -0
- package/components/ontario-icon-download.js +170 -0
- package/components/ontario-icon-download.js.map +1 -0
- package/components/ontario-icon-dropdown-arrow.d.ts +11 -0
- package/components/ontario-icon-dropdown-arrow.js +142 -0
- package/components/ontario-icon-dropdown-arrow.js.map +1 -0
- package/components/ontario-icon-edit.d.ts +11 -0
- package/components/ontario-icon-edit.js +170 -0
- package/components/ontario-icon-edit.js.map +1 -0
- package/components/ontario-icon-email.d.ts +11 -0
- package/components/ontario-icon-email.js +171 -0
- package/components/ontario-icon-email.js.map +1 -0
- package/components/ontario-icon-expand.d.ts +11 -0
- package/components/ontario-icon-expand.js +168 -0
- package/components/ontario-icon-expand.js.map +1 -0
- package/components/ontario-icon-export.d.ts +11 -0
- package/components/ontario-icon-export.js +170 -0
- package/components/ontario-icon-export.js.map +1 -0
- package/components/ontario-icon-facebook-alt.d.ts +11 -0
- package/components/ontario-icon-facebook-alt.js +170 -0
- package/components/ontario-icon-facebook-alt.js.map +1 -0
- package/components/ontario-icon-facebook.d.ts +11 -0
- package/components/ontario-icon-facebook.js +170 -0
- package/components/ontario-icon-facebook.js.map +1 -0
- package/components/ontario-icon-favourite-off.d.ts +11 -0
- package/components/ontario-icon-favourite-off.js +170 -0
- package/components/ontario-icon-favourite-off.js.map +1 -0
- package/components/ontario-icon-favourite-on.d.ts +11 -0
- package/components/ontario-icon-favourite-on.js +170 -0
- package/components/ontario-icon-favourite-on.js.map +1 -0
- package/components/ontario-icon-filter.d.ts +11 -0
- package/components/ontario-icon-filter.js +170 -0
- package/components/ontario-icon-filter.js.map +1 -0
- package/components/ontario-icon-flickr.d.ts +11 -0
- package/components/ontario-icon-flickr.js +170 -0
- package/components/ontario-icon-flickr.js.map +1 -0
- package/components/ontario-icon-grid.d.ts +11 -0
- package/components/ontario-icon-grid.js +170 -0
- package/components/ontario-icon-grid.js.map +1 -0
- package/components/ontario-icon-help.d.ts +11 -0
- package/components/ontario-icon-help.js +171 -0
- package/components/ontario-icon-help.js.map +1 -0
- package/components/ontario-icon-instagram.d.ts +11 -0
- package/components/ontario-icon-instagram.js +170 -0
- package/components/ontario-icon-instagram.js.map +1 -0
- package/components/ontario-icon-interac-en-alt.d.ts +11 -0
- package/components/ontario-icon-interac-en-alt.js +203 -0
- package/components/ontario-icon-interac-en-alt.js.map +1 -0
- package/components/ontario-icon-interac-en.d.ts +11 -0
- package/components/ontario-icon-interac-en.js +202 -0
- package/components/ontario-icon-interac-en.js.map +1 -0
- package/components/ontario-icon-interac-fr-alt.d.ts +11 -0
- package/components/ontario-icon-interac-fr-alt.js +203 -0
- package/components/ontario-icon-interac-fr-alt.js.map +1 -0
- package/components/ontario-icon-interac-fr.d.ts +11 -0
- package/components/ontario-icon-interac-fr.js +183 -0
- package/components/ontario-icon-interac-fr.js.map +1 -0
- package/components/ontario-icon-linkedin-alt.d.ts +11 -0
- package/components/ontario-icon-linkedin-alt.js +170 -0
- package/components/ontario-icon-linkedin-alt.js.map +1 -0
- package/components/ontario-icon-linkedin.d.ts +11 -0
- package/components/ontario-icon-linkedin.js +170 -0
- package/components/ontario-icon-linkedin.js.map +1 -0
- package/components/ontario-icon-list.d.ts +11 -0
- package/components/ontario-icon-list.js +170 -0
- package/components/ontario-icon-list.js.map +1 -0
- package/components/ontario-icon-live-chat.d.ts +11 -0
- package/components/ontario-icon-live-chat.js +170 -0
- package/components/ontario-icon-live-chat.js.map +1 -0
- package/components/ontario-icon-location-off.d.ts +11 -0
- package/components/ontario-icon-location-off.js +170 -0
- package/components/ontario-icon-location-off.js.map +1 -0
- package/components/ontario-icon-location-on.d.ts +11 -0
- package/components/ontario-icon-location-on.js +170 -0
- package/components/ontario-icon-location-on.js.map +1 -0
- package/components/ontario-icon-lock-off.d.ts +11 -0
- package/components/ontario-icon-lock-off.js +170 -0
- package/components/ontario-icon-lock-off.js.map +1 -0
- package/components/ontario-icon-lock-on.d.ts +11 -0
- package/components/ontario-icon-lock-on.js +170 -0
- package/components/ontario-icon-lock-on.js.map +1 -0
- package/components/ontario-icon-map.d.ts +11 -0
- package/components/ontario-icon-map.js +170 -0
- package/components/ontario-icon-map.js.map +1 -0
- package/components/ontario-icon-mastercard-alt.d.ts +11 -0
- package/components/ontario-icon-mastercard-alt.js +161 -0
- package/components/ontario-icon-mastercard-alt.js.map +1 -0
- package/components/ontario-icon-mastercard.d.ts +11 -0
- package/components/ontario-icon-mastercard.js +173 -0
- package/components/ontario-icon-mastercard.js.map +1 -0
- package/components/ontario-icon-media-fast-forward.d.ts +11 -0
- package/components/ontario-icon-media-fast-forward.js +167 -0
- package/components/ontario-icon-media-fast-forward.js.map +1 -0
- package/components/ontario-icon-media-fast-rewind.d.ts +11 -0
- package/components/ontario-icon-media-fast-rewind.js +170 -0
- package/components/ontario-icon-media-fast-rewind.js.map +1 -0
- package/components/ontario-icon-media-pause.d.ts +11 -0
- package/components/ontario-icon-media-pause.js +167 -0
- package/components/ontario-icon-media-pause.js.map +1 -0
- package/components/ontario-icon-media-play.d.ts +11 -0
- package/components/ontario-icon-media-play.js +167 -0
- package/components/ontario-icon-media-play.js.map +1 -0
- package/components/ontario-icon-media-stop.d.ts +11 -0
- package/components/ontario-icon-media-stop.js +167 -0
- package/components/ontario-icon-media-stop.js.map +1 -0
- package/components/ontario-icon-menu-header.d.ts +11 -0
- package/components/ontario-icon-menu-header.js +171 -0
- package/components/ontario-icon-menu-header.js.map +1 -0
- package/components/ontario-icon-menu.d.ts +11 -0
- package/components/ontario-icon-menu.js +171 -0
- package/components/ontario-icon-menu.js.map +1 -0
- package/components/ontario-icon-microphone-off.d.ts +11 -0
- package/components/ontario-icon-microphone-off.js +170 -0
- package/components/ontario-icon-microphone-off.js.map +1 -0
- package/components/ontario-icon-microphone-on.d.ts +11 -0
- package/components/ontario-icon-microphone-on.js +170 -0
- package/components/ontario-icon-microphone-on.js.map +1 -0
- package/components/ontario-icon-more-vertical.d.ts +11 -0
- package/components/ontario-icon-more-vertical.js +170 -0
- package/components/ontario-icon-more-vertical.js.map +1 -0
- package/components/ontario-icon-new-window.d.ts +11 -0
- package/components/ontario-icon-new-window.js +171 -0
- package/components/ontario-icon-new-window.js.map +1 -0
- package/components/ontario-icon-next.d.ts +11 -0
- package/components/ontario-icon-next.js +170 -0
- package/components/ontario-icon-next.js.map +1 -0
- package/components/ontario-icon-notification.d.ts +11 -0
- package/components/ontario-icon-notification.js +170 -0
- package/components/ontario-icon-notification.js.map +1 -0
- package/components/ontario-icon-password-hide.d.ts +11 -0
- package/components/ontario-icon-password-hide.js +170 -0
- package/components/ontario-icon-password-hide.js.map +1 -0
- package/components/ontario-icon-password-show.d.ts +11 -0
- package/components/ontario-icon-password-show.js +170 -0
- package/components/ontario-icon-password-show.js.map +1 -0
- package/components/ontario-icon-phone.d.ts +11 -0
- package/components/ontario-icon-phone.js +171 -0
- package/components/ontario-icon-phone.js.map +1 -0
- package/components/ontario-icon-photo.d.ts +11 -0
- package/components/ontario-icon-photo.js +170 -0
- package/components/ontario-icon-photo.js.map +1 -0
- package/components/ontario-icon-pin-location-off.d.ts +11 -0
- package/components/ontario-icon-pin-location-off.js +170 -0
- package/components/ontario-icon-pin-location-off.js.map +1 -0
- package/components/ontario-icon-pin-location-on.d.ts +11 -0
- package/components/ontario-icon-pin-location-on.js +170 -0
- package/components/ontario-icon-pin-location-on.js.map +1 -0
- package/components/ontario-icon-previous.d.ts +11 -0
- package/components/ontario-icon-previous.js +170 -0
- package/components/ontario-icon-previous.js.map +1 -0
- package/components/ontario-icon-print.d.ts +11 -0
- package/components/ontario-icon-print.js +170 -0
- package/components/ontario-icon-print.js.map +1 -0
- package/components/ontario-icon-remove-alt.d.ts +11 -0
- package/components/ontario-icon-remove-alt.js +171 -0
- package/components/ontario-icon-remove-alt.js.map +1 -0
- package/components/ontario-icon-remove.d.ts +11 -0
- package/components/ontario-icon-remove.js +171 -0
- package/components/ontario-icon-remove.js.map +1 -0
- package/components/ontario-icon-replay.d.ts +11 -0
- package/components/ontario-icon-replay.js +170 -0
- package/components/ontario-icon-replay.js.map +1 -0
- package/components/ontario-icon-rss-feed.d.ts +11 -0
- package/components/ontario-icon-rss-feed.js +170 -0
- package/components/ontario-icon-rss-feed.js.map +1 -0
- package/components/ontario-icon-save.d.ts +11 -0
- package/components/ontario-icon-save.js +170 -0
- package/components/ontario-icon-save.js.map +1 -0
- package/components/ontario-icon-search-white.d.ts +11 -0
- package/components/ontario-icon-search-white.js +173 -0
- package/components/ontario-icon-search-white.js.map +1 -0
- package/components/ontario-icon-search.d.ts +11 -0
- package/components/ontario-icon-search.js +171 -0
- package/components/ontario-icon-search.js.map +1 -0
- package/components/ontario-icon-sentiment-1.d.ts +11 -0
- package/components/ontario-icon-sentiment-1.js +170 -0
- package/components/ontario-icon-sentiment-1.js.map +1 -0
- package/components/ontario-icon-sentiment-2.d.ts +11 -0
- package/components/ontario-icon-sentiment-2.js +170 -0
- package/components/ontario-icon-sentiment-2.js.map +1 -0
- package/components/ontario-icon-sentiment-3.d.ts +11 -0
- package/components/ontario-icon-sentiment-3.js +170 -0
- package/components/ontario-icon-sentiment-3.js.map +1 -0
- package/components/ontario-icon-sentiment-4.d.ts +11 -0
- package/components/ontario-icon-sentiment-4.js +170 -0
- package/components/ontario-icon-sentiment-4.js.map +1 -0
- package/components/ontario-icon-sentiment-5.d.ts +11 -0
- package/components/ontario-icon-sentiment-5.js +170 -0
- package/components/ontario-icon-sentiment-5.js.map +1 -0
- package/components/ontario-icon-settings.d.ts +11 -0
- package/components/ontario-icon-settings.js +170 -0
- package/components/ontario-icon-settings.js.map +1 -0
- package/components/ontario-icon-share.d.ts +11 -0
- package/components/ontario-icon-share.js +170 -0
- package/components/ontario-icon-share.js.map +1 -0
- package/components/ontario-icon-sort-alphabetical-ascending.d.ts +11 -0
- package/components/ontario-icon-sort-alphabetical-ascending.js +170 -0
- package/components/ontario-icon-sort-alphabetical-ascending.js.map +1 -0
- package/components/ontario-icon-sort-alphabetical-descending.d.ts +11 -0
- package/components/ontario-icon-sort-alphabetical-descending.js +170 -0
- package/components/ontario-icon-sort-alphabetical-descending.js.map +1 -0
- package/components/ontario-icon-sort-ascending.d.ts +11 -0
- package/components/ontario-icon-sort-ascending.js +170 -0
- package/components/ontario-icon-sort-ascending.js.map +1 -0
- package/components/ontario-icon-sort-descending.d.ts +11 -0
- package/components/ontario-icon-sort-descending.js +170 -0
- package/components/ontario-icon-sort-descending.js.map +1 -0
- package/components/ontario-icon-sort-variant.d.ts +11 -0
- package/components/ontario-icon-sort-variant.js +167 -0
- package/components/ontario-icon-sort-variant.js.map +1 -0
- package/components/ontario-icon-sort.d.ts +11 -0
- package/components/ontario-icon-sort.js +170 -0
- package/components/ontario-icon-sort.js.map +1 -0
- package/components/ontario-icon-tag.d.ts +11 -0
- package/components/ontario-icon-tag.js +170 -0
- package/components/ontario-icon-tag.js.map +1 -0
- package/components/ontario-icon-text-message.d.ts +11 -0
- package/components/ontario-icon-text-message.js +170 -0
- package/components/ontario-icon-text-message.js.map +1 -0
- package/components/ontario-icon-timer.d.ts +11 -0
- package/components/ontario-icon-timer.js +170 -0
- package/components/ontario-icon-timer.js.map +1 -0
- package/components/ontario-icon-transport-bicycle.d.ts +11 -0
- package/components/ontario-icon-transport-bicycle.js +170 -0
- package/components/ontario-icon-transport-bicycle.js.map +1 -0
- package/components/ontario-icon-transport-bus.d.ts +11 -0
- package/components/ontario-icon-transport-bus.js +170 -0
- package/components/ontario-icon-transport-bus.js.map +1 -0
- package/components/ontario-icon-transport-car.d.ts +11 -0
- package/components/ontario-icon-transport-car.js +170 -0
- package/components/ontario-icon-transport-car.js.map +1 -0
- package/components/ontario-icon-transport-walk.d.ts +11 -0
- package/components/ontario-icon-transport-walk.js +170 -0
- package/components/ontario-icon-transport-walk.js.map +1 -0
- package/components/ontario-icon-tty.d.ts +11 -0
- package/components/ontario-icon-tty.js +171 -0
- package/components/ontario-icon-tty.js.map +1 -0
- package/components/ontario-icon-twitter-alt.d.ts +11 -0
- package/components/ontario-icon-twitter-alt.js +170 -0
- package/components/ontario-icon-twitter-alt.js.map +1 -0
- package/components/ontario-icon-twitter.d.ts +11 -0
- package/components/ontario-icon-twitter.js +170 -0
- package/components/ontario-icon-twitter.js.map +1 -0
- package/components/ontario-icon-upload.d.ts +11 -0
- package/components/ontario-icon-upload.js +170 -0
- package/components/ontario-icon-upload.js.map +1 -0
- package/components/ontario-icon-video.d.ts +11 -0
- package/components/ontario-icon-video.js +170 -0
- package/components/ontario-icon-video.js.map +1 -0
- package/components/ontario-icon-visa.d.ts +11 -0
- package/components/ontario-icon-visa.js +148 -0
- package/components/ontario-icon-visa.js.map +1 -0
- package/components/ontario-icon-vote-dislike.d.ts +11 -0
- package/components/ontario-icon-vote-dislike.js +170 -0
- package/components/ontario-icon-vote-dislike.js.map +1 -0
- package/components/ontario-icon-vote-like.d.ts +11 -0
- package/components/ontario-icon-vote-like.js +170 -0
- package/components/ontario-icon-vote-like.js.map +1 -0
- package/components/ontario-icon-vpn-key.d.ts +11 -0
- package/components/ontario-icon-vpn-key.js +170 -0
- package/components/ontario-icon-vpn-key.js.map +1 -0
- package/components/ontario-icon-wheelchair.d.ts +11 -0
- package/components/ontario-icon-wheelchair.js +170 -0
- package/components/ontario-icon-wheelchair.js.map +1 -0
- package/components/ontario-icon-wifi.d.ts +11 -0
- package/components/ontario-icon-wifi.js +170 -0
- package/components/ontario-icon-wifi.js.map +1 -0
- package/components/ontario-icon-youtube.d.ts +11 -0
- package/components/ontario-icon-youtube.js +170 -0
- package/components/ontario-icon-youtube.js.map +1 -0
- package/components/ontario-input.d.ts +11 -0
- package/components/ontario-input.js +419 -0
- package/components/ontario-input.js.map +1 -0
- package/components/ontario-language-toggle.d.ts +11 -0
- package/components/ontario-language-toggle.js +9 -0
- package/components/ontario-language-toggle.js.map +1 -0
- package/components/ontario-loading-indicator.d.ts +11 -0
- package/components/ontario-loading-indicator.js +181 -0
- package/components/ontario-loading-indicator.js.map +1 -0
- package/components/ontario-page-alert.d.ts +11 -0
- package/components/ontario-page-alert.js +172 -0
- package/components/ontario-page-alert.js.map +1 -0
- package/components/ontario-radio-buttons.d.ts +11 -0
- package/components/ontario-radio-buttons.js +430 -0
- package/components/ontario-radio-buttons.js.map +1 -0
- package/components/ontario-search-box.d.ts +11 -0
- package/components/ontario-search-box.js +283 -0
- package/components/ontario-search-box.js.map +1 -0
- package/components/ontario-step-indicator.d.ts +11 -0
- package/components/ontario-step-indicator.js +172 -0
- package/components/ontario-step-indicator.js.map +1 -0
- package/components/ontario-table.d.ts +11 -0
- package/components/ontario-table.js +392 -0
- package/components/ontario-table.js.map +1 -0
- package/components/ontario-task-list.d.ts +11 -0
- package/components/ontario-task-list.js +211 -0
- package/components/ontario-task-list.js.map +1 -0
- package/components/ontario-task.d.ts +11 -0
- package/components/ontario-task.js +327 -0
- package/components/ontario-task.js.map +1 -0
- package/components/ontario-textarea.d.ts +11 -0
- package/components/ontario-textarea.js +327 -0
- package/components/ontario-textarea.js.map +1 -0
- package/components/p-6uqsTY-M.js +171 -0
- package/components/p-6uqsTY-M.js.map +1 -0
- package/components/p-A8xwC5QP.js +24 -0
- package/components/p-A8xwC5QP.js.map +1 -0
- package/components/p-BBhl-3u7.js +169 -0
- package/components/p-BBhl-3u7.js.map +1 -0
- package/components/p-BF0_OXTe.js +64 -0
- package/components/p-BF0_OXTe.js.map +1 -0
- package/components/p-BHTls9cv.js +286 -0
- package/components/p-BHTls9cv.js.map +1 -0
- package/components/p-BOcd5PoR.js +330 -0
- package/components/p-BOcd5PoR.js.map +1 -0
- package/components/p-BxXM4eur.js +29 -0
- package/components/p-BxXM4eur.js.map +1 -0
- package/components/p-C-t5TNzY.js +10 -0
- package/components/p-C-t5TNzY.js.map +1 -0
- package/components/p-C0Xvjp7G.js +282 -0
- package/components/p-C0Xvjp7G.js.map +1 -0
- package/components/p-C73HZQcq.js +89 -0
- package/components/p-C73HZQcq.js.map +1 -0
- package/components/p-CI209psv.js +271 -0
- package/components/p-CI209psv.js.map +1 -0
- package/components/p-CIdZS10A.js +20 -0
- package/components/p-CIdZS10A.js.map +1 -0
- package/components/p-CNDrx73J.js +145 -0
- package/components/p-CNDrx73J.js.map +1 -0
- package/components/p-CNqFEifG.js +34 -0
- package/components/p-CNqFEifG.js.map +1 -0
- package/components/p-CRMogYVY.js +168 -0
- package/components/p-CRMogYVY.js.map +1 -0
- package/components/p-CXTm9jmr.js +141 -0
- package/components/p-CXTm9jmr.js.map +1 -0
- package/components/p-CXfntdg5.js +7 -0
- package/components/p-CXfntdg5.js.map +1 -0
- package/components/p-C__FBxsY.js +145 -0
- package/components/p-C__FBxsY.js.map +1 -0
- package/components/p-Cdm-Ot0O.js +95 -0
- package/components/p-Cdm-Ot0O.js.map +1 -0
- package/components/p-CeFeBwzQ.js +331 -0
- package/components/p-CeFeBwzQ.js.map +1 -0
- package/components/p-DGFFJaKo.js +168 -0
- package/components/p-DGFFJaKo.js.map +1 -0
- package/components/p-DIe1tcOp.js +197 -0
- package/components/p-DIe1tcOp.js.map +1 -0
- package/components/p-DJOzeqZ-.js +168 -0
- package/components/p-DJOzeqZ-.js.map +1 -0
- package/components/p-DMH_JI3w.js +6 -0
- package/components/p-DMH_JI3w.js.map +1 -0
- package/components/p-DgMhpSmi.js +324 -0
- package/components/p-DgMhpSmi.js.map +1 -0
- package/components/p-TS9NoIOc.js +11 -0
- package/components/p-TS9NoIOc.js.map +1 -0
- package/components/p-V_1wpeJe.js +17 -0
- package/components/p-V_1wpeJe.js.map +1 -0
- package/components/p-dXtLd1df.js +63 -0
- package/components/p-dXtLd1df.js.map +1 -0
- package/components/p-vdzS-daB.js +145 -0
- package/components/p-vdzS-daB.js.map +1 -0
- package/package.json +11 -9
|
@@ -0,0 +1,168 @@
|
|
|
1
|
+
import { p as proxyCustomElement, H, h } from './index.js';
|
|
2
|
+
import { v as validateColor, I as IconColours } from './p-BOcd5PoR.js';
|
|
3
|
+
import { C as ConsoleMessageClass } from './p-Cdm-Ot0O.js';
|
|
4
|
+
import { v as validateValueAgainstArray } from './p-CNqFEifG.js';
|
|
5
|
+
|
|
6
|
+
const ontarioIconCss =
|
|
7
|
+
'.ontario-icon svg,.ontario-icon{display:inline-block;stroke-width:0;stroke:currentColor;fill:currentColor;vertical-align:middle;overflow:hidden}.ontario-icon--blue svg{stroke:#0066CC;fill:#0066CC}.ontario-icon--grey svg{stroke:#666666;fill:#666666}.ontario-icon--black svg{stroke:#1A1A1A;fill:#1A1A1A}.ontario-icon--white svg{stroke:#FFFFFF;fill:#FFFFFF}.ontario-icon--white svg{stroke:#FFFFFF;fill:#FFFFFF}';
|
|
8
|
+
|
|
9
|
+
const OntarioIconChevronUp = /*@__PURE__*/ proxyCustomElement(
|
|
10
|
+
class OntarioIconChevronUp extends H {
|
|
11
|
+
constructor() {
|
|
12
|
+
super();
|
|
13
|
+
this.__registerHost();
|
|
14
|
+
this.__attachShadow();
|
|
15
|
+
/**
|
|
16
|
+
* The icon width will autogenerate the height since the icons are in square format, thus preserving
|
|
17
|
+
* the aspect ratio.
|
|
18
|
+
*/
|
|
19
|
+
this.iconWidth = 24;
|
|
20
|
+
/**
|
|
21
|
+
* Set the icon's colour.
|
|
22
|
+
*/
|
|
23
|
+
this.colour = 'black';
|
|
24
|
+
}
|
|
25
|
+
/**
|
|
26
|
+
* Watch for changes in the `iconWidth` variable for validation purpose.
|
|
27
|
+
* If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).
|
|
28
|
+
*/
|
|
29
|
+
validateWidth() {
|
|
30
|
+
if (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {
|
|
31
|
+
const message = new ConsoleMessageClass();
|
|
32
|
+
message
|
|
33
|
+
.addDesignSystemTag()
|
|
34
|
+
.addMonospaceText(' icon-width ')
|
|
35
|
+
.addRegularText('on')
|
|
36
|
+
.addMonospaceText(' <ontario-icon-chevron-up> ')
|
|
37
|
+
.addRegularText(
|
|
38
|
+
`${isNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'}; only a positive number is allowed. The default size of`,
|
|
39
|
+
)
|
|
40
|
+
.addMonospaceText(' 24px ')
|
|
41
|
+
.addRegularText('was assumed.')
|
|
42
|
+
.printMessage();
|
|
43
|
+
this.iconWidthState = 24;
|
|
44
|
+
} else {
|
|
45
|
+
this.iconWidthState = this.iconWidth;
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
/**
|
|
49
|
+
* Watch for changes in the `colour` variable for validation purpose.
|
|
50
|
+
* If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).
|
|
51
|
+
* If a match is found in one of the enum values then `colour` will be set to the matching enum value.
|
|
52
|
+
*/
|
|
53
|
+
validateColour() {
|
|
54
|
+
const isValid = validateValueAgainstArray(this.colour, IconColours);
|
|
55
|
+
if (isValid) {
|
|
56
|
+
this.iconColourState = this.colour;
|
|
57
|
+
} else {
|
|
58
|
+
if (validateColor(this.colour)) {
|
|
59
|
+
this.iconCustomColourState = this.colour;
|
|
60
|
+
} else {
|
|
61
|
+
this.iconColourState = this.warnDefaultColour();
|
|
62
|
+
}
|
|
63
|
+
}
|
|
64
|
+
}
|
|
65
|
+
/**
|
|
66
|
+
* Print the invalid colour warning message
|
|
67
|
+
* @returns default colour (black)
|
|
68
|
+
*/
|
|
69
|
+
warnDefaultColour() {
|
|
70
|
+
const message = new ConsoleMessageClass();
|
|
71
|
+
message
|
|
72
|
+
.addDesignSystemTag()
|
|
73
|
+
.addMonospaceText(' colour ')
|
|
74
|
+
.addRegularText('on')
|
|
75
|
+
.addMonospaceText(' <ontario-icon-chevron-up> ')
|
|
76
|
+
.addRegularText('was set to an invalid colour; only')
|
|
77
|
+
.addMonospaceText(' black, blue, grey or white ')
|
|
78
|
+
.addRegularText('are supported. The default colour')
|
|
79
|
+
.addMonospaceText(' black ')
|
|
80
|
+
.addRegularText('is assumed.')
|
|
81
|
+
.printMessage();
|
|
82
|
+
return 'black';
|
|
83
|
+
}
|
|
84
|
+
/**
|
|
85
|
+
* Stencil component lifecycle method that is called once after the component is first connected to the DOM.
|
|
86
|
+
*/
|
|
87
|
+
componentWillLoad() {
|
|
88
|
+
this.validateColour();
|
|
89
|
+
this.validateWidth();
|
|
90
|
+
}
|
|
91
|
+
/**
|
|
92
|
+
* Returns the HTML code to be rendered into a custom element.
|
|
93
|
+
*/
|
|
94
|
+
render() {
|
|
95
|
+
return h(
|
|
96
|
+
'div',
|
|
97
|
+
{
|
|
98
|
+
key: '61344eb4ae52aa2183e1d6dc3a588ec82e4948e8',
|
|
99
|
+
class: `ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`,
|
|
100
|
+
style: { width: `${this.iconWidthState}px` },
|
|
101
|
+
},
|
|
102
|
+
h(
|
|
103
|
+
'svg',
|
|
104
|
+
{
|
|
105
|
+
key: '70f33cc76d5dd533f0342e930652a89cb9fc4d8b',
|
|
106
|
+
class: 'svg-icon',
|
|
107
|
+
style: { fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` },
|
|
108
|
+
role: 'img',
|
|
109
|
+
xmlns: 'http://www.w3.org/2000/svg',
|
|
110
|
+
fill: 'none',
|
|
111
|
+
viewBox: '0 0 24 24',
|
|
112
|
+
id: 'chevron-up',
|
|
113
|
+
},
|
|
114
|
+
h('path', {
|
|
115
|
+
key: 'bffcb104aa98cfbbc9d6bffe75d5cc9f304fa175',
|
|
116
|
+
d: 'M7.4 15.4l4.6-4.58 4.6 4.58L18 14l-6-6-6 6 1.4 1.4z',
|
|
117
|
+
}),
|
|
118
|
+
),
|
|
119
|
+
);
|
|
120
|
+
}
|
|
121
|
+
static get watchers() {
|
|
122
|
+
return {
|
|
123
|
+
iconWidth: ['validateWidth'],
|
|
124
|
+
colour: ['validateColour'],
|
|
125
|
+
};
|
|
126
|
+
}
|
|
127
|
+
static get style() {
|
|
128
|
+
return ontarioIconCss;
|
|
129
|
+
}
|
|
130
|
+
},
|
|
131
|
+
[
|
|
132
|
+
257,
|
|
133
|
+
'ontario-icon-chevron-up',
|
|
134
|
+
{
|
|
135
|
+
iconWidth: [2, 'icon-width'],
|
|
136
|
+
colour: [1],
|
|
137
|
+
iconWidthState: [32],
|
|
138
|
+
iconColourState: [32],
|
|
139
|
+
iconCustomColourState: [32],
|
|
140
|
+
},
|
|
141
|
+
undefined,
|
|
142
|
+
{
|
|
143
|
+
iconWidth: ['validateWidth'],
|
|
144
|
+
colour: ['validateColour'],
|
|
145
|
+
},
|
|
146
|
+
],
|
|
147
|
+
);
|
|
148
|
+
function defineCustomElement() {
|
|
149
|
+
if (typeof customElements === 'undefined') {
|
|
150
|
+
return;
|
|
151
|
+
}
|
|
152
|
+
const components = ['ontario-icon-chevron-up'];
|
|
153
|
+
components.forEach((tagName) => {
|
|
154
|
+
switch (tagName) {
|
|
155
|
+
case 'ontario-icon-chevron-up':
|
|
156
|
+
if (!customElements.get(tagName)) {
|
|
157
|
+
customElements.define(tagName, OntarioIconChevronUp);
|
|
158
|
+
}
|
|
159
|
+
break;
|
|
160
|
+
}
|
|
161
|
+
});
|
|
162
|
+
}
|
|
163
|
+
defineCustomElement();
|
|
164
|
+
|
|
165
|
+
export { OntarioIconChevronUp as O, defineCustomElement as d };
|
|
166
|
+
//# sourceMappingURL=p-CRMogYVY.js.map
|
|
167
|
+
|
|
168
|
+
//# sourceMappingURL=p-CRMogYVY.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"p-CRMogYVY.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-chevron-up&encapsulation=shadow","src/components/ontario-icon/ontario-icon-chevron-up.tsx"],"sourcesContent":["@use 'pkg:@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State } from '@stencil/core';\nimport { IconWithColour } from './icon.interface';\nimport { IconSize, IconColour, IconColours } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\nimport { validateValueAgainstArray } from '../../utils/validation/validation-functions';\nimport validateColor from 'validate-color';\n\n@Component({\n\ttag: 'ontario-icon-chevron-up',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconChevronUp implements IconWithColour {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-chevron-up> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${\n\t\t\t\t\t\tisNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'\n\t\t\t\t\t}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Set the icon's colour.\n\t */\n\t@Prop() colour: IconColour = 'black';\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconColourState: string;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's colour based on validation result.\n\t */\n\t@State() iconCustomColourState: string;\n\n\t/**\n\t * Watch for changes in the `colour` variable for validation purpose.\n\t * If the user input doesn't match one of the enum values then `colour` will be set to its default (`black`).\n\t * If a match is found in one of the enum values then `colour` will be set to the matching enum value.\n\t */\n\t@Watch('colour')\n\tvalidateColour() {\n\t\tconst isValid = validateValueAgainstArray(this.colour, IconColours);\n\t\tif (isValid) {\n\t\t\tthis.iconColourState = this.colour;\n\t\t} else {\n\t\t\tif (validateColor(this.colour)) {\n\t\t\t\tthis.iconCustomColourState = this.colour;\n\t\t\t} else {\n\t\t\t\tthis.iconColourState = this.warnDefaultColour();\n\t\t\t}\n\t\t}\n\t}\n\n\t/**\n\t * Print the invalid colour warning message\n\t * @returns default colour (black)\n\t */\n\tprivate warnDefaultColour(): IconColour {\n\t\tconst message = new ConsoleMessageClass();\n\t\tmessage\n\t\t\t.addDesignSystemTag()\n\t\t\t.addMonospaceText(' colour ')\n\t\t\t.addRegularText('on')\n\t\t\t.addMonospaceText(' <ontario-icon-chevron-up> ')\n\t\t\t.addRegularText('was set to an invalid colour; only')\n\t\t\t.addMonospaceText(' black, blue, grey or white ')\n\t\t\t.addRegularText('are supported. The default colour')\n\t\t\t.addMonospaceText(' black ')\n\t\t\t.addRegularText('is assumed.')\n\t\t\t.printMessage();\n\t\treturn 'black';\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--${this.iconColourState} ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\tclass=\"svg-icon\"\n\t\t\t\t\tstyle={{ fill: `${this.iconCustomColourState}`, stroke: `${this.iconCustomColourState}` }}\n\t\t\t\t\trole=\"img\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tfill=\"none\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tid=\"chevron-up\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M7.4 15.4l4.6-4.58 4.6 4.58L18 14l-6-6-6 6 1.4 1.4z\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"version":3}
|
|
@@ -0,0 +1,141 @@
|
|
|
1
|
+
import { p as proxyCustomElement, H, h } from './index.js';
|
|
2
|
+
import { C as ConsoleMessageClass } from './p-Cdm-Ot0O.js';
|
|
3
|
+
|
|
4
|
+
const ontarioIconCss =
|
|
5
|
+
'.ontario-icon svg,.ontario-icon{display:inline-block;stroke-width:0;stroke:currentColor;fill:currentColor;vertical-align:middle;overflow:hidden}.ontario-icon--blue svg{stroke:#0066CC;fill:#0066CC}.ontario-icon--grey svg{stroke:#666666;fill:#666666}.ontario-icon--black svg{stroke:#1A1A1A;fill:#1A1A1A}.ontario-icon--white svg{stroke:#FFFFFF;fill:#FFFFFF}.ontario-icon--white svg{stroke:#FFFFFF;fill:#FFFFFF}';
|
|
6
|
+
|
|
7
|
+
const OntarioIconAlertWarning = /*@__PURE__*/ proxyCustomElement(
|
|
8
|
+
class OntarioIconAlertWarning extends H {
|
|
9
|
+
constructor() {
|
|
10
|
+
super();
|
|
11
|
+
this.__registerHost();
|
|
12
|
+
this.__attachShadow();
|
|
13
|
+
/**
|
|
14
|
+
* The icon width will autogenerate the height since the icons are in square format, thus preserving
|
|
15
|
+
* the aspect ratio.
|
|
16
|
+
*/
|
|
17
|
+
this.iconWidth = 24;
|
|
18
|
+
}
|
|
19
|
+
/**
|
|
20
|
+
* Watch for changes in the `iconWidth` variable for validation purpose.
|
|
21
|
+
* If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).
|
|
22
|
+
*/
|
|
23
|
+
validateWidth() {
|
|
24
|
+
if (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {
|
|
25
|
+
const message = new ConsoleMessageClass();
|
|
26
|
+
message
|
|
27
|
+
.addDesignSystemTag()
|
|
28
|
+
.addMonospaceText(' icon-width ')
|
|
29
|
+
.addRegularText('on')
|
|
30
|
+
.addMonospaceText(' <ontario-icon-alert-warning> ')
|
|
31
|
+
.addRegularText(
|
|
32
|
+
`${isNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'}; only a positive number is allowed. The default size of`,
|
|
33
|
+
)
|
|
34
|
+
.addMonospaceText(' 24px ')
|
|
35
|
+
.addRegularText('was assumed.')
|
|
36
|
+
.printMessage();
|
|
37
|
+
this.iconWidthState = 24;
|
|
38
|
+
} else {
|
|
39
|
+
this.iconWidthState = this.iconWidth;
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
/**
|
|
43
|
+
* Validate that the `colour` attribute is not set by users
|
|
44
|
+
* Prints a warning message if the `colour` attribute is set
|
|
45
|
+
*/
|
|
46
|
+
validateColour() {
|
|
47
|
+
if (this.host.hasAttribute('colour')) {
|
|
48
|
+
const message = new ConsoleMessageClass();
|
|
49
|
+
message
|
|
50
|
+
.addDesignSystemTag()
|
|
51
|
+
.addMonospaceText(' colour ')
|
|
52
|
+
.addRegularText('on')
|
|
53
|
+
.addMonospaceText(' <ontario-icon-alert-warning> ')
|
|
54
|
+
.addRegularText('cannot be set. The provided colour is ignored.')
|
|
55
|
+
.printMessage();
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
/**
|
|
59
|
+
* Stencil component lifecycle method that is called once after the component is first connected to the DOM.
|
|
60
|
+
*/
|
|
61
|
+
componentWillLoad() {
|
|
62
|
+
this.validateColour();
|
|
63
|
+
this.validateWidth();
|
|
64
|
+
}
|
|
65
|
+
/**
|
|
66
|
+
* Returns the HTML code to be rendered into a custom element.
|
|
67
|
+
*/
|
|
68
|
+
render() {
|
|
69
|
+
return h(
|
|
70
|
+
'div',
|
|
71
|
+
{
|
|
72
|
+
key: 'a4644b91711938ec26ff6b4237058c5212c13792',
|
|
73
|
+
class: `ontario-icon ontario-icon--width-${this.iconWidthState}`,
|
|
74
|
+
style: { width: `${this.iconWidthState}px` },
|
|
75
|
+
},
|
|
76
|
+
h(
|
|
77
|
+
'svg',
|
|
78
|
+
{
|
|
79
|
+
key: 'ee6bf1e9fce0fd1349b01cf1d1e824794d3fe526',
|
|
80
|
+
class: 'svg-icon',
|
|
81
|
+
role: 'img',
|
|
82
|
+
xmlns: 'http://www.w3.org/2000/svg',
|
|
83
|
+
fill: 'none',
|
|
84
|
+
viewBox: '0 0 24 24',
|
|
85
|
+
id: 'alert-warning',
|
|
86
|
+
},
|
|
87
|
+
h('path', {
|
|
88
|
+
key: '48ef165722eae7e4d483130b094faa3dd6caa2a9',
|
|
89
|
+
d: 'M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4z',
|
|
90
|
+
fill: '#ffd440',
|
|
91
|
+
}),
|
|
92
|
+
h('path', { key: '78954d242f8c5d46b59c8aeab61542cea4ccd143', d: 'M11 10h2v4h-2zm0 6h2v2h-2z', fill: '#000' }),
|
|
93
|
+
),
|
|
94
|
+
);
|
|
95
|
+
}
|
|
96
|
+
get host() {
|
|
97
|
+
return this;
|
|
98
|
+
}
|
|
99
|
+
static get watchers() {
|
|
100
|
+
return {
|
|
101
|
+
iconWidth: ['validateWidth'],
|
|
102
|
+
};
|
|
103
|
+
}
|
|
104
|
+
static get style() {
|
|
105
|
+
return ontarioIconCss;
|
|
106
|
+
}
|
|
107
|
+
},
|
|
108
|
+
[
|
|
109
|
+
257,
|
|
110
|
+
'ontario-icon-alert-warning',
|
|
111
|
+
{
|
|
112
|
+
iconWidth: [2, 'icon-width'],
|
|
113
|
+
iconWidthState: [32],
|
|
114
|
+
},
|
|
115
|
+
undefined,
|
|
116
|
+
{
|
|
117
|
+
iconWidth: ['validateWidth'],
|
|
118
|
+
},
|
|
119
|
+
],
|
|
120
|
+
);
|
|
121
|
+
function defineCustomElement() {
|
|
122
|
+
if (typeof customElements === 'undefined') {
|
|
123
|
+
return;
|
|
124
|
+
}
|
|
125
|
+
const components = ['ontario-icon-alert-warning'];
|
|
126
|
+
components.forEach((tagName) => {
|
|
127
|
+
switch (tagName) {
|
|
128
|
+
case 'ontario-icon-alert-warning':
|
|
129
|
+
if (!customElements.get(tagName)) {
|
|
130
|
+
customElements.define(tagName, OntarioIconAlertWarning);
|
|
131
|
+
}
|
|
132
|
+
break;
|
|
133
|
+
}
|
|
134
|
+
});
|
|
135
|
+
}
|
|
136
|
+
defineCustomElement();
|
|
137
|
+
|
|
138
|
+
export { OntarioIconAlertWarning as O, defineCustomElement as d };
|
|
139
|
+
//# sourceMappingURL=p-CXTm9jmr.js.map
|
|
140
|
+
|
|
141
|
+
//# sourceMappingURL=p-CXTm9jmr.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"p-CXTm9jmr.js","mappings":";;;AAAA,MAAM,cAAc,GAAG,yZAAyZ;;MCWna,uBAAuB,iBAAAA,kBAAA,CAAA,MAAA,uBAAA,SAAAC,CAAA,CAAA;AALpC,IAAA,WAAA,GAAA;;;;AAMC;;;AAGG;AACK,QAAA,IAAS,CAAA,SAAA,GAAa,EAAE;AAyFhC;AAjFA;;;AAGG;IAEH,aAAa,GAAA;QACZ,IAAI,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,IAAI,CAAC,SAAS,IAAI,CAAC,CAAC,EAAE;AAC7E,YAAA,MAAM,OAAO,GAAG,IAAI,mBAAmB,EAAE;YACzC;AACE,iBAAA,kBAAkB;iBAClB,gBAAgB,CAAC,cAAc;iBAC/B,cAAc,CAAC,IAAI;iBACnB,gBAAgB,CAAC,gCAAgC;AACjD,iBAAA,cAAc,CACd,CACC,EAAA,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,gCAAgC,GAAG,8BAC5D,0DAA0D;iBAE1D,gBAAgB,CAAC,QAAQ;iBACzB,cAAc,CAAC,cAAc;AAC7B,iBAAA,YAAY,EAAE;AAChB,YAAA,IAAI,CAAC,cAAc,GAAG,EAAE;;aAClB;AACN,YAAA,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,SAAS;;;AAUtC;;;AAGG;IACH,cAAc,GAAA;QACb,IAAI,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,EAAE;AACrC,YAAA,MAAM,OAAO,GAAG,IAAI,mBAAmB,EAAE;YACzC;AACE,iBAAA,kBAAkB;iBAClB,gBAAgB,CAAC,UAAU;iBAC3B,cAAc,CAAC,IAAI;iBACnB,gBAAgB,CAAC,gCAAgC;iBACjD,cAAc,CAAC,gDAAgD;AAC/D,iBAAA,YAAY,EAAE;;;AAIlB;;AAEG;IACH,iBAAiB,GAAA;QAChB,IAAI,CAAC,cAAc,EAAE;QACrB,IAAI,CAAC,aAAa,EAAE;;AAGrB;;AAEG;IACH,MAAM,GAAA;QACL,QACC,4DACC,KAAK,EAAE,CAAoC,iCAAA,EAAA,IAAI,CAAC,cAAc,CAAE,CAAA,EAChE,KAAK,EAAE,EAAE,KAAK,EAAE,CAAG,EAAA,IAAI,CAAC,cAAc,CAAA,EAAA,CAAI,EAAE,EAAA,EAE5C,CACC,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,UAAU,EAChB,IAAI,EAAC,KAAK,EACV,KAAK,EAAC,4BAA4B,EAClC,IAAI,EAAC,MAAM,EACX,OAAO,EAAC,WAAW,EACnB,EAAE,EAAC,eAAe,EAAA,EAElB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,CAAC,EAAC,oDAAoD,EAAC,IAAI,EAAC,SAAS,EAAG,CAAA,EAC9E,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAC,EAAC,4BAA4B,EAAC,IAAI,EAAC,MAAM,EAAG,CAAA,CAC9C,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-alert-warning&encapsulation=shadow","src/components/ontario-icon/ontario-icon-alert-warning.tsx"],"sourcesContent":["@use 'pkg:@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State, Element } from '@stencil/core';\nimport { Icon } from './icon.interface';\nimport { IconSize } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\n\n@Component({\n\ttag: 'ontario-icon-alert-warning',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconAlertWarning implements Icon {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-alert-warning> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${\n\t\t\t\t\t\tisNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'\n\t\t\t\t\t}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Reference to the host element\n\t * Use to check if the host element has the `colour` attribute set\n\t */\n\t@Element() host: HTMLElement;\n\n\t/**\n\t * Validate that the `colour` attribute is not set by users\n\t * Prints a warning message if the `colour` attribute is set\n\t */\n\tvalidateColour() {\n\t\tif (this.host.hasAttribute('colour')) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' colour ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-alert-warning> ')\n\t\t\t\t.addRegularText('cannot be set. The provided colour is ignored.')\n\t\t\t\t.printMessage();\n\t\t}\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\tclass=\"svg-icon\"\n\t\t\t\t\trole=\"img\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tfill=\"none\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tid=\"alert-warning\"\n\t\t\t\t>\n\t\t\t\t\t<path d=\"M1 21h22L12 2 1 21zm12-3h-2v-2h2v2zm0-4h-2v-4h2v4z\" fill=\"#ffd440\" />\n\t\t\t\t\t<path d=\"M11 10h2v4h-2zm0 6h2v2h-2z\" fill=\"#000\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"version":3}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
var OntarioIconSearch = `<svg class="svg-icon" role="img" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" fill="none"><path d="M15.5 14h-.8l-.28-.27A6.47 6.47 0 0 0 16 9.5a6.5 6.5 0 1 0-13 0A6.5 6.5 0 0 0 9.5 16a6.47 6.47 0 0 0 4.23-1.57l.27.28v.8l5 5 1.5-1.5-5-5zm-6 0C7 14 5 12 5 9.5S7 5 9.5 5 14 7 14 9.5 12 14 9.5 14z"/></svg>
|
|
2
|
+
`;
|
|
3
|
+
|
|
4
|
+
export { OntarioIconSearch as O };
|
|
5
|
+
//# sourceMappingURL=p-CXfntdg5.js.map
|
|
6
|
+
|
|
7
|
+
//# sourceMappingURL=p-CXfntdg5.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"p-CXfntdg5.js","mappings":";;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}
|
|
@@ -0,0 +1,145 @@
|
|
|
1
|
+
import { p as proxyCustomElement, H, h } from './index.js';
|
|
2
|
+
import { C as ConsoleMessageClass } from './p-Cdm-Ot0O.js';
|
|
3
|
+
|
|
4
|
+
const ontarioIconCss =
|
|
5
|
+
'.ontario-icon svg,.ontario-icon{display:inline-block;stroke-width:0;stroke:currentColor;fill:currentColor;vertical-align:middle;overflow:hidden}.ontario-icon--blue svg{stroke:#0066CC;fill:#0066CC}.ontario-icon--grey svg{stroke:#666666;fill:#666666}.ontario-icon--black svg{stroke:#1A1A1A;fill:#1A1A1A}.ontario-icon--white svg{stroke:#FFFFFF;fill:#FFFFFF}.ontario-icon--white svg{stroke:#FFFFFF;fill:#FFFFFF}';
|
|
6
|
+
|
|
7
|
+
const OntarioIconAlertInformation = /*@__PURE__*/ proxyCustomElement(
|
|
8
|
+
class OntarioIconAlertInformation extends H {
|
|
9
|
+
constructor() {
|
|
10
|
+
super();
|
|
11
|
+
this.__registerHost();
|
|
12
|
+
this.__attachShadow();
|
|
13
|
+
/**
|
|
14
|
+
* The icon width will autogenerate the height since the icons are in square format, thus preserving
|
|
15
|
+
* the aspect ratio.
|
|
16
|
+
*/
|
|
17
|
+
this.iconWidth = 24;
|
|
18
|
+
}
|
|
19
|
+
/**
|
|
20
|
+
* Watch for changes in the `iconWidth` variable for validation purpose.
|
|
21
|
+
* If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).
|
|
22
|
+
*/
|
|
23
|
+
validateWidth() {
|
|
24
|
+
if (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {
|
|
25
|
+
const message = new ConsoleMessageClass();
|
|
26
|
+
message
|
|
27
|
+
.addDesignSystemTag()
|
|
28
|
+
.addMonospaceText(' icon-width ')
|
|
29
|
+
.addRegularText('on')
|
|
30
|
+
.addMonospaceText(' <ontario-icon-alert-information> ')
|
|
31
|
+
.addRegularText(
|
|
32
|
+
`${isNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'}; only a positive number is allowed. The default size of`,
|
|
33
|
+
)
|
|
34
|
+
.addMonospaceText(' 24px ')
|
|
35
|
+
.addRegularText('was assumed.')
|
|
36
|
+
.printMessage();
|
|
37
|
+
this.iconWidthState = 24;
|
|
38
|
+
} else {
|
|
39
|
+
this.iconWidthState = this.iconWidth;
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
/**
|
|
43
|
+
* Validate that the `colour` attribute is not set by users
|
|
44
|
+
* Prints a warning message if the `colour` attribute is set
|
|
45
|
+
*/
|
|
46
|
+
validateColour() {
|
|
47
|
+
if (this.host.hasAttribute('colour')) {
|
|
48
|
+
const message = new ConsoleMessageClass();
|
|
49
|
+
message
|
|
50
|
+
.addDesignSystemTag()
|
|
51
|
+
.addMonospaceText(' colour ')
|
|
52
|
+
.addRegularText('on')
|
|
53
|
+
.addMonospaceText(' <ontario-icon-alert-information> ')
|
|
54
|
+
.addRegularText('cannot be set. The provided colour is ignored.')
|
|
55
|
+
.printMessage();
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
/**
|
|
59
|
+
* Stencil component lifecycle method that is called once after the component is first connected to the DOM.
|
|
60
|
+
*/
|
|
61
|
+
componentWillLoad() {
|
|
62
|
+
this.validateColour();
|
|
63
|
+
this.validateWidth();
|
|
64
|
+
}
|
|
65
|
+
/**
|
|
66
|
+
* Returns the HTML code to be rendered into a custom element.
|
|
67
|
+
*/
|
|
68
|
+
render() {
|
|
69
|
+
return h(
|
|
70
|
+
'div',
|
|
71
|
+
{
|
|
72
|
+
key: 'c3675ed7cdbec588302cda788c9f39326eb395bf',
|
|
73
|
+
class: `ontario-icon ontario-icon--width-${this.iconWidthState}`,
|
|
74
|
+
style: { width: `${this.iconWidthState}px` },
|
|
75
|
+
},
|
|
76
|
+
h(
|
|
77
|
+
'svg',
|
|
78
|
+
{
|
|
79
|
+
key: 'e38f7392c36781bdf9bf6b70d73b71dfa147ca62',
|
|
80
|
+
class: 'svg-icon',
|
|
81
|
+
role: 'img',
|
|
82
|
+
xmlns: 'http://www.w3.org/2000/svg',
|
|
83
|
+
fill: 'none',
|
|
84
|
+
viewBox: '0 0 24 24',
|
|
85
|
+
id: 'alert-information',
|
|
86
|
+
},
|
|
87
|
+
h('path', {
|
|
88
|
+
key: 'fc46885df7e85b0339a7e2bae2a55b52c023f43f',
|
|
89
|
+
d: 'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z',
|
|
90
|
+
fill: '#1080a6',
|
|
91
|
+
}),
|
|
92
|
+
h('path', {
|
|
93
|
+
key: '981ef5ed08fd3a90df8561e465fa6e531228dea2',
|
|
94
|
+
d: 'M11 17h2v-6h-2v6zm0-8h2V7h-2v2z',
|
|
95
|
+
fill: '#fff',
|
|
96
|
+
}),
|
|
97
|
+
),
|
|
98
|
+
);
|
|
99
|
+
}
|
|
100
|
+
get host() {
|
|
101
|
+
return this;
|
|
102
|
+
}
|
|
103
|
+
static get watchers() {
|
|
104
|
+
return {
|
|
105
|
+
iconWidth: ['validateWidth'],
|
|
106
|
+
};
|
|
107
|
+
}
|
|
108
|
+
static get style() {
|
|
109
|
+
return ontarioIconCss;
|
|
110
|
+
}
|
|
111
|
+
},
|
|
112
|
+
[
|
|
113
|
+
257,
|
|
114
|
+
'ontario-icon-alert-information',
|
|
115
|
+
{
|
|
116
|
+
iconWidth: [2, 'icon-width'],
|
|
117
|
+
iconWidthState: [32],
|
|
118
|
+
},
|
|
119
|
+
undefined,
|
|
120
|
+
{
|
|
121
|
+
iconWidth: ['validateWidth'],
|
|
122
|
+
},
|
|
123
|
+
],
|
|
124
|
+
);
|
|
125
|
+
function defineCustomElement() {
|
|
126
|
+
if (typeof customElements === 'undefined') {
|
|
127
|
+
return;
|
|
128
|
+
}
|
|
129
|
+
const components = ['ontario-icon-alert-information'];
|
|
130
|
+
components.forEach((tagName) => {
|
|
131
|
+
switch (tagName) {
|
|
132
|
+
case 'ontario-icon-alert-information':
|
|
133
|
+
if (!customElements.get(tagName)) {
|
|
134
|
+
customElements.define(tagName, OntarioIconAlertInformation);
|
|
135
|
+
}
|
|
136
|
+
break;
|
|
137
|
+
}
|
|
138
|
+
});
|
|
139
|
+
}
|
|
140
|
+
defineCustomElement();
|
|
141
|
+
|
|
142
|
+
export { OntarioIconAlertInformation as O, defineCustomElement as d };
|
|
143
|
+
//# sourceMappingURL=p-C__FBxsY.js.map
|
|
144
|
+
|
|
145
|
+
//# sourceMappingURL=p-C__FBxsY.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"p-C__FBxsY.js","mappings":";;;AAAA,MAAM,cAAc,GAAG,yZAAyZ;;MCWna,2BAA2B,iBAAAA,kBAAA,CAAA,MAAA,2BAAA,SAAAC,CAAA,CAAA;AALxC,IAAA,WAAA,GAAA;;;;AAMC;;;AAGG;AACK,QAAA,IAAS,CAAA,SAAA,GAAa,EAAE;AA4FhC;AApFA;;;AAGG;IAEH,aAAa,GAAA;QACZ,IAAI,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,IAAI,CAAC,SAAS,IAAI,CAAC,CAAC,EAAE;AAC7E,YAAA,MAAM,OAAO,GAAG,IAAI,mBAAmB,EAAE;YACzC;AACE,iBAAA,kBAAkB;iBAClB,gBAAgB,CAAC,cAAc;iBAC/B,cAAc,CAAC,IAAI;iBACnB,gBAAgB,CAAC,oCAAoC;AACrD,iBAAA,cAAc,CACd,CACC,EAAA,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,GAAG,gCAAgC,GAAG,8BAC5D,0DAA0D;iBAE1D,gBAAgB,CAAC,QAAQ;iBACzB,cAAc,CAAC,cAAc;AAC7B,iBAAA,YAAY,EAAE;AAChB,YAAA,IAAI,CAAC,cAAc,GAAG,EAAE;;aAClB;AACN,YAAA,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,SAAS;;;AAUtC;;;AAGG;IACH,cAAc,GAAA;QACb,IAAI,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,EAAE;AACrC,YAAA,MAAM,OAAO,GAAG,IAAI,mBAAmB,EAAE;YACzC;AACE,iBAAA,kBAAkB;iBAClB,gBAAgB,CAAC,UAAU;iBAC3B,cAAc,CAAC,IAAI;iBACnB,gBAAgB,CAAC,oCAAoC;iBACrD,cAAc,CAAC,gDAAgD;AAC/D,iBAAA,YAAY,EAAE;;;AAIlB;;AAEG;IACH,iBAAiB,GAAA;QAChB,IAAI,CAAC,cAAc,EAAE;QACrB,IAAI,CAAC,aAAa,EAAE;;AAGrB;;AAEG;IACH,MAAM,GAAA;QACL,QACC,4DACC,KAAK,EAAE,CAAoC,iCAAA,EAAA,IAAI,CAAC,cAAc,CAAE,CAAA,EAChE,KAAK,EAAE,EAAE,KAAK,EAAE,CAAG,EAAA,IAAI,CAAC,cAAc,CAAA,EAAA,CAAI,EAAE,EAAA,EAE5C,CACC,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,UAAU,EAChB,IAAI,EAAC,KAAK,EACV,KAAK,EAAC,4BAA4B,EAClC,IAAI,EAAC,MAAM,EACX,OAAO,EAAC,WAAW,EACnB,EAAE,EAAC,mBAAmB,EAAA,EAEtB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACC,CAAC,EAAC,kGAAkG,EACpG,IAAI,EAAC,SAAS,EACb,CAAA,EACF,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAC,EAAC,iCAAiC,EAAC,IAAI,EAAC,MAAM,EAAG,CAAA,CACnD,CACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/ontario-icon/ontario-icon.scss?tag=ontario-icon-alert-information&encapsulation=shadow","src/components/ontario-icon/ontario-icon-alert-information.tsx"],"sourcesContent":["@use 'pkg:@ongov/ontario-design-system-global-styles/dist/styles/scss/1-variables/colours.variables' as colours;\n\n.ontario-icon svg,\n// Fractal component style coverage ↓\n.ontario-icon {\n\tdisplay: inline-block;\n\tstroke-width: 0;\n\tstroke: currentColor;\n\tfill: currentColor;\n\t/* The default vertical-align is `baseline`, which leaves a few pixels of space below the icon. Using `center` prevents this. For icons shown alongside text, you may want to use a more precise value, e.g. `vertical-align: -4px` or `vertical-align: -0.15em`. */\n\tvertical-align: middle;\n\t/* Paths and strokes that overflow the viewBox can show in IE11. */\n\toverflow: hidden;\n}\n\n.ontario-icon--blue svg {\n\tstroke: colours.$ontario-colour-icon-blue;\n\tfill: colours.$ontario-colour-icon-blue;\n}\n\n.ontario-icon--grey svg {\n\tstroke: colours.$ontario-colour-icon-grey;\n\tfill: colours.$ontario-colour-icon-grey;\n}\n\n.ontario-icon--black svg {\n\tstroke: colours.$ontario-colour-icon-black;\n\tfill: colours.$ontario-colour-icon-black;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-icon-white;\n\tfill: colours.$ontario-colour-icon-white;\n}\n\n.ontario-icon--white svg {\n\tstroke: colours.$ontario-colour-white;\n\tfill: colours.$ontario-colour-white;\n}\n","// content automatically generated by `generate-icons.js` begins\nimport { Component, Prop, h, Watch, State, Element } from '@stencil/core';\nimport { Icon } from './icon.interface';\nimport { IconSize } from './icon.types';\nimport { ConsoleMessageClass } from '../../utils/console-message/console-message';\n\n@Component({\n\ttag: 'ontario-icon-alert-information',\n\tstyleUrl: 'ontario-icon.scss',\n\tshadow: true,\n})\nexport class OntarioIconAlertInformation implements Icon {\n\t/**\n\t * The icon width will autogenerate the height since the icons are in square format, thus preserving\n\t * the aspect ratio.\n\t */\n\t@Prop() iconWidth: IconSize = 24;\n\n\t/**\n\t * Mutable variable, for internal use only.\n\t * Set the icon's width depending on validation result.\n\t */\n\t@State() iconWidthState: number;\n\n\t/**\n\t * Watch for changes in the `iconWidth` variable for validation purpose.\n\t * If the user input is not a number or is a negative number then `iconWidth` will be set to its default (24).\n\t */\n\t@Watch('iconWidth')\n\tvalidateWidth() {\n\t\tif (isNaN(this.iconWidth) || (!isNaN(this.iconWidth) && this.iconWidth <= 0)) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' icon-width ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-alert-information> ')\n\t\t\t\t.addRegularText(\n\t\t\t\t\t`${\n\t\t\t\t\t\tisNaN(this.iconWidth) ? 'was set to a non-numeric value' : 'was set to a negative number'\n\t\t\t\t\t}; only a positive number is allowed. The default size of`,\n\t\t\t\t)\n\t\t\t\t.addMonospaceText(' 24px ')\n\t\t\t\t.addRegularText('was assumed.')\n\t\t\t\t.printMessage();\n\t\t\tthis.iconWidthState = 24;\n\t\t} else {\n\t\t\tthis.iconWidthState = this.iconWidth;\n\t\t}\n\t}\n\n\t/**\n\t * Reference to the host element\n\t * Use to check if the host element has the `colour` attribute set\n\t */\n\t@Element() host: HTMLElement;\n\n\t/**\n\t * Validate that the `colour` attribute is not set by users\n\t * Prints a warning message if the `colour` attribute is set\n\t */\n\tvalidateColour() {\n\t\tif (this.host.hasAttribute('colour')) {\n\t\t\tconst message = new ConsoleMessageClass();\n\t\t\tmessage\n\t\t\t\t.addDesignSystemTag()\n\t\t\t\t.addMonospaceText(' colour ')\n\t\t\t\t.addRegularText('on')\n\t\t\t\t.addMonospaceText(' <ontario-icon-alert-information> ')\n\t\t\t\t.addRegularText('cannot be set. The provided colour is ignored.')\n\t\t\t\t.printMessage();\n\t\t}\n\t}\n\n\t/**\n\t * Stencil component lifecycle method that is called once after the component is first connected to the DOM.\n\t */\n\tcomponentWillLoad() {\n\t\tthis.validateColour();\n\t\tthis.validateWidth();\n\t}\n\n\t/**\n\t * Returns the HTML code to be rendered into a custom element.\n\t */\n\trender() {\n\t\treturn (\n\t\t\t<div\n\t\t\t\tclass={`ontario-icon ontario-icon--width-${this.iconWidthState}`}\n\t\t\t\tstyle={{ width: `${this.iconWidthState}px` }}\n\t\t\t>\n\t\t\t\t<svg\n\t\t\t\t\tclass=\"svg-icon\"\n\t\t\t\t\trole=\"img\"\n\t\t\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\t\t\tfill=\"none\"\n\t\t\t\t\tviewBox=\"0 0 24 24\"\n\t\t\t\t\tid=\"alert-information\"\n\t\t\t\t>\n\t\t\t\t\t<path\n\t\t\t\t\t\td=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z\"\n\t\t\t\t\t\tfill=\"#1080a6\"\n\t\t\t\t\t/>\n\t\t\t\t\t<path d=\"M11 17h2v-6h-2v6zm0-8h2V7h-2v2z\" fill=\"#fff\" />\n\t\t\t\t</svg>\n\t\t\t</div>\n\t\t);\n\t}\n}\n// content automatically generated by `generate-icons.js` ends\n"],"version":3}
|
|
@@ -0,0 +1,95 @@
|
|
|
1
|
+
var ConsoleType;
|
|
2
|
+
(function (ConsoleType) {
|
|
3
|
+
ConsoleType['Error'] = 'error';
|
|
4
|
+
ConsoleType['Info'] = 'info';
|
|
5
|
+
ConsoleType['Log'] = 'log';
|
|
6
|
+
ConsoleType['Warning'] = 'warning';
|
|
7
|
+
})(ConsoleType || (ConsoleType = {}));
|
|
8
|
+
var MessageStyle;
|
|
9
|
+
(function (MessageStyle) {
|
|
10
|
+
MessageStyle['Regular'] = 'regular';
|
|
11
|
+
MessageStyle['Code'] = 'code';
|
|
12
|
+
})(MessageStyle || (MessageStyle = {}));
|
|
13
|
+
|
|
14
|
+
// system tag with formatting specifier
|
|
15
|
+
const designSystemTag = 'Ontario Design System';
|
|
16
|
+
// default font size for console messages
|
|
17
|
+
const fontSize = '12px';
|
|
18
|
+
// styles for the system tag in a string format
|
|
19
|
+
// the `background-color`, `color`, `padding` and `border-radius` values are hardcoded because
|
|
20
|
+
// they are specific for console message use case
|
|
21
|
+
const tagStyles = [
|
|
22
|
+
'background-color: #367A76',
|
|
23
|
+
'border: none',
|
|
24
|
+
'color: white',
|
|
25
|
+
'padding: 2px 5px',
|
|
26
|
+
'text-align: center',
|
|
27
|
+
'text-decoration: none',
|
|
28
|
+
'display: inline-block',
|
|
29
|
+
'cursor: pointer',
|
|
30
|
+
'border-radius: 5px',
|
|
31
|
+
].join(';');
|
|
32
|
+
// styles for regular text in string format
|
|
33
|
+
const regularTextStyles = ['font-family: sans-serif', `font-size: ${fontSize}`].join(';');
|
|
34
|
+
// styles for code in string format
|
|
35
|
+
const monospaceTextStyles = ['font-family: monospace', `font-size: ${fontSize}`].join(';');
|
|
36
|
+
function addSpecifier(message) {
|
|
37
|
+
const styleSpecifier = '%c';
|
|
38
|
+
return styleSpecifier.concat(message);
|
|
39
|
+
}
|
|
40
|
+
// build and print console message with a fluent interface design
|
|
41
|
+
class ConsoleMessageClass {
|
|
42
|
+
constructor() {
|
|
43
|
+
this.message = '';
|
|
44
|
+
this.styles = [];
|
|
45
|
+
}
|
|
46
|
+
// add the `Ontario Design System` tag to the beginning of the message
|
|
47
|
+
// the first call in the chain if a tag is required
|
|
48
|
+
addDesignSystemTag() {
|
|
49
|
+
this.message = addSpecifier(designSystemTag);
|
|
50
|
+
this.styles.push(tagStyles);
|
|
51
|
+
return this;
|
|
52
|
+
}
|
|
53
|
+
// build console message as regular text
|
|
54
|
+
addRegularText(text) {
|
|
55
|
+
this.addText(text, regularTextStyles);
|
|
56
|
+
return this;
|
|
57
|
+
}
|
|
58
|
+
// build console message as monospace text
|
|
59
|
+
addMonospaceText(text) {
|
|
60
|
+
this.addText(text, monospaceTextStyles);
|
|
61
|
+
return this;
|
|
62
|
+
}
|
|
63
|
+
// print message to console depending on the `ConsoleType`
|
|
64
|
+
// the last function call in the chain
|
|
65
|
+
printMessage(consoleType = ConsoleType.Warning) {
|
|
66
|
+
const messageArray = [this.message, ...this.styles];
|
|
67
|
+
// pass array of arguments into the console function for printing depending on `consoleType`
|
|
68
|
+
// the `function.apply()` function handles array of arguments which allows list of arguments to be set programmatically
|
|
69
|
+
switch (consoleType) {
|
|
70
|
+
case ConsoleType.Error:
|
|
71
|
+
console.error.apply(null, messageArray);
|
|
72
|
+
break;
|
|
73
|
+
case ConsoleType.Info:
|
|
74
|
+
console.info.apply(null, messageArray);
|
|
75
|
+
break;
|
|
76
|
+
case ConsoleType.Warning:
|
|
77
|
+
console.warn.apply(null, messageArray);
|
|
78
|
+
break;
|
|
79
|
+
default:
|
|
80
|
+
console.log.apply(null, messageArray);
|
|
81
|
+
}
|
|
82
|
+
}
|
|
83
|
+
// add text to the `message` property and associated styles into the `styles` array
|
|
84
|
+
addText(text, style) {
|
|
85
|
+
if (text && (text === null || text === void 0 ? void 0 : text.trim().length) > 0) {
|
|
86
|
+
this.message += addSpecifier(text);
|
|
87
|
+
this.styles.push(style);
|
|
88
|
+
}
|
|
89
|
+
}
|
|
90
|
+
}
|
|
91
|
+
|
|
92
|
+
export { ConsoleMessageClass as C, ConsoleType as a };
|
|
93
|
+
//# sourceMappingURL=p-Cdm-Ot0O.js.map
|
|
94
|
+
|
|
95
|
+
//# sourceMappingURL=p-Cdm-Ot0O.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"file":"p-Cdm-Ot0O.js","mappings":"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","names":[],"sources":["src/utils/console-message/console-message.enum.ts","src/utils/console-message/console-message.ts"],"sourcesContent":["export enum ConsoleType {\n\tError = 'error',\n\tInfo = 'info',\n\tLog = 'log',\n\tWarning = 'warning',\n}\n\nexport enum MessageStyle {\n\tRegular = 'regular',\n\tCode = 'code',\n}\n","import { ConsoleMessage } from './console-message.interface';\nimport { ConsoleType, MessageStyle } from './console-message.enum';\n\n// system tag with formatting specifier\nconst designSystemTag = 'Ontario Design System';\n\n// default font size for console messages\nconst fontSize = '12px';\n\n// styles for the system tag in a string format\n// the `background-color`, `color`, `padding` and `border-radius` values are hardcoded because\n// they are specific for console message use case\nconst tagStyles = [\n\t'background-color: #367A76',\n\t'border: none',\n\t'color: white',\n\t'padding: 2px 5px',\n\t'text-align: center',\n\t'text-decoration: none',\n\t'display: inline-block',\n\t'cursor: pointer',\n\t'border-radius: 5px',\n].join(';');\n\n// styles for regular text in string format\nconst regularTextStyles = ['font-family: sans-serif', `font-size: ${fontSize}`].join(';');\n\n// styles for code in string format\nconst monospaceTextStyles = ['font-family: monospace', `font-size: ${fontSize}`].join(';');\n\nfunction addSpecifier(message: string): string {\n\tconst styleSpecifier = '%c';\n\treturn styleSpecifier.concat(message);\n}\n\n// print message to console depending on the `ConsoleType`\nexport function printConsoleMessage(\n\tmessages: ConsoleMessage[] | string,\n\tconsoleType = ConsoleType.Warning,\n\thasDesignSystemTag = true,\n) {\n\t// retrieve message from each object and concatenate them into one single string in order\n\t// if `hasSystemTag` is true then the message string will being with the value stored within `designSystemTag`.\n\tconst message =\n\t\ttypeof messages === 'string' // Note the TypeScript transpiler Stencil is using doesn't like this type guard as a const.\n\t\t\t? `${addSpecifier(designSystemTag)}${addSpecifier(` ${messages}`)}`\n\t\t\t: messages?.reduce(\n\t\t\t\t\t(message: string, currentObject: ConsoleMessage) => (message += addSpecifier(currentObject.message) ?? ''),\n\t\t\t\t\thasDesignSystemTag ? addSpecifier(designSystemTag) : '',\n\t\t\t\t);\n\n\t// array of arguments to be passed into the the console function\n\tconst messageArray: string[] = [];\n\n\t// push message into the array of arguments\n\t// depending on whether the system tag is used (i.e. `hasSystemTag` is true), push `tagStyles` into the array\n\tif (hasDesignSystemTag) {\n\t\tmessageArray.push(message, tagStyles);\n\t} else {\n\t\tmessageArray.push(message);\n\t}\n\n\t// Note the TypeScript transpiler Stencil is using doesn't like this type guard as a const.\n\tif (typeof messages === 'string') {\n\t\tmessageArray.push(regularTextStyles);\n\t} else {\n\t\t// push style of each message into the array of arguments in order\n\t\tmessages?.forEach((message: ConsoleMessage) => {\n\t\t\tmessageArray.push(message.style && message.style === MessageStyle.Code ? monospaceTextStyles : regularTextStyles);\n\t\t});\n\t}\n\n\t// pass array of arguments into the console function for printing depending on `consoleType`\n\t// the `function.apply()` function handles array of arguments which allows list of arguments to be set programmatically\n\tswitch (consoleType) {\n\t\tcase ConsoleType.Error:\n\t\t\treturn console.error.apply(null, messageArray);\n\n\t\tcase ConsoleType.Info:\n\t\t\treturn console.info.apply(null, messageArray);\n\n\t\tcase ConsoleType.Warning:\n\t\t\treturn console.warn.apply(null, messageArray);\n\n\t\tdefault:\n\t\t\treturn console.log.apply(null, messageArray);\n\t}\n}\n\n// build and print console message with a fluent interface design\nexport class ConsoleMessageClass {\n\tmessage: string;\n\tstyles: string[];\n\n\tconstructor() {\n\t\tthis.message = '';\n\t\tthis.styles = [];\n\t}\n\n\t// add the `Ontario Design System` tag to the beginning of the message\n\t// the first call in the chain if a tag is required\n\taddDesignSystemTag() {\n\t\tthis.message = addSpecifier(designSystemTag);\n\t\tthis.styles.push(tagStyles);\n\t\treturn this;\n\t}\n\n\t// build console message as regular text\n\taddRegularText(text: string) {\n\t\tthis.addText(text, regularTextStyles);\n\t\treturn this;\n\t}\n\n\t// build console message as monospace text\n\taddMonospaceText(text: string) {\n\t\tthis.addText(text, monospaceTextStyles);\n\t\treturn this;\n\t}\n\n\t// print message to console depending on the `ConsoleType`\n\t// the last function call in the chain\n\tprintMessage(consoleType = ConsoleType.Warning) {\n\t\tconst messageArray = [this.message, ...this.styles];\n\n\t\t// pass array of arguments into the console function for printing depending on `consoleType`\n\t\t// the `function.apply()` function handles array of arguments which allows list of arguments to be set programmatically\n\t\tswitch (consoleType) {\n\t\t\tcase ConsoleType.Error:\n\t\t\t\tconsole.error.apply(null, messageArray);\n\t\t\t\tbreak;\n\t\t\tcase ConsoleType.Info:\n\t\t\t\tconsole.info.apply(null, messageArray);\n\t\t\t\tbreak;\n\t\t\tcase ConsoleType.Warning:\n\t\t\t\tconsole.warn.apply(null, messageArray);\n\t\t\t\tbreak;\n\t\t\tdefault:\n\t\t\t\tconsole.log.apply(null, messageArray);\n\t\t}\n\t}\n\n\t// add text to the `message` property and associated styles into the `styles` array\n\tprivate addText(text: string, style: string) {\n\t\tif (text && text?.trim().length > 0) {\n\t\t\tthis.message += addSpecifier(text);\n\t\t\tthis.styles.push(style);\n\t\t}\n\t}\n}\n"],"version":3}
|