@govtechsg/sgds-web-component 2.0.1 → 2.1.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/base/card-element.cjs.js +1 -0
- package/base/card-element.cjs.js.map +1 -1
- package/base/card-element.js +1 -0
- package/base/card-element.js.map +1 -1
- package/base/card.cjs.js +1 -0
- package/base/card.cjs.js.map +1 -1
- package/base/card.js +1 -0
- package/base/card.js.map +1 -1
- package/base/dropdown-element.cjs.js +1 -0
- package/base/dropdown-element.cjs.js.map +1 -1
- package/base/dropdown-element.js +1 -0
- package/base/dropdown-element.js.map +1 -1
- package/base/dropdown-list-element.cjs.js +1 -0
- package/base/dropdown-list-element.cjs.js.map +1 -1
- package/base/dropdown-list-element.js +1 -0
- package/base/dropdown-list-element.js.map +1 -1
- package/base/form-check-element.cjs.js +1 -0
- package/base/form-check-element.cjs.js.map +1 -1
- package/base/form-check-element.js +1 -0
- package/base/form-check-element.js.map +1 -1
- package/base/link-element.cjs.js +1 -0
- package/base/link-element.cjs.js.map +1 -1
- package/base/link-element.js +1 -0
- package/base/link-element.js.map +1 -1
- package/base/sgds-element.cjs.js +1 -0
- package/base/sgds-element.cjs.js.map +1 -1
- package/base/sgds-element.cjs2.js +1 -0
- package/base/sgds-element.cjs2.js.map +1 -1
- package/base/sgds-element.js +1 -0
- package/base/sgds-element.js.map +1 -1
- package/base/sgds-element2.js +1 -0
- package/base/sgds-element2.js.map +1 -1
- package/components/Accordion/accordion-item.cjs.js +1 -0
- package/components/Accordion/accordion-item.cjs.js.map +1 -1
- package/components/Accordion/accordion-item.js +1 -0
- package/components/Accordion/accordion-item.js.map +1 -1
- package/components/Accordion/accordion.cjs.js +1 -0
- package/components/Accordion/accordion.cjs.js.map +1 -1
- package/components/Accordion/accordion.js +1 -0
- package/components/Accordion/accordion.js.map +1 -1
- package/components/Accordion/sgds-accordion-item.cjs.js +1 -0
- package/components/Accordion/sgds-accordion-item.cjs.js.map +1 -1
- package/components/Accordion/sgds-accordion-item.js +1 -0
- package/components/Accordion/sgds-accordion-item.js.map +1 -1
- package/components/Accordion/sgds-accordion.cjs.js +1 -0
- package/components/Accordion/sgds-accordion.cjs.js.map +1 -1
- package/components/Accordion/sgds-accordion.js +1 -0
- package/components/Accordion/sgds-accordion.js.map +1 -1
- package/components/ActionCard/action-card.cjs.js +1 -0
- package/components/ActionCard/action-card.cjs.js.map +1 -1
- package/components/ActionCard/action-card.js +1 -0
- package/components/ActionCard/action-card.js.map +1 -1
- package/components/ActionCard/sgds-action-card.cjs.js +1 -0
- package/components/ActionCard/sgds-action-card.cjs.js.map +1 -1
- package/components/ActionCard/sgds-action-card.js +1 -0
- package/components/ActionCard/sgds-action-card.js.map +1 -1
- package/components/Alert/alert-link.cjs.js +1 -0
- package/components/Alert/alert-link.cjs.js.map +1 -1
- package/components/Alert/alert-link.js +1 -0
- package/components/Alert/alert-link.js.map +1 -1
- package/components/Alert/alert.cjs.js +1 -0
- package/components/Alert/alert.cjs.js.map +1 -1
- package/components/Alert/alert.js +1 -0
- package/components/Alert/alert.js.map +1 -1
- package/components/Alert/sgds-alert-heading.cjs.js +1 -0
- package/components/Alert/sgds-alert-heading.cjs.js.map +1 -1
- package/components/Alert/sgds-alert-heading.js +1 -0
- package/components/Alert/sgds-alert-heading.js.map +1 -1
- package/components/Alert/sgds-alert-link.cjs.js +1 -0
- package/components/Alert/sgds-alert-link.cjs.js.map +1 -1
- package/components/Alert/sgds-alert-link.js +1 -0
- package/components/Alert/sgds-alert-link.js.map +1 -1
- package/components/Alert/sgds-alert.cjs.js +1 -0
- package/components/Alert/sgds-alert.cjs.js.map +1 -1
- package/components/Alert/sgds-alert.js +1 -0
- package/components/Alert/sgds-alert.js.map +1 -1
- package/components/Badge/badge.cjs.js +1 -0
- package/components/Badge/badge.cjs.js.map +1 -1
- package/components/Badge/badge.js +1 -0
- package/components/Badge/badge.js.map +1 -1
- package/components/Badge/sgds-badge.cjs.js +1 -0
- package/components/Badge/sgds-badge.cjs.js.map +1 -1
- package/components/Badge/sgds-badge.js +1 -0
- package/components/Badge/sgds-badge.js.map +1 -1
- package/components/Breadcrumb/breadcrumb-item.cjs.js +1 -0
- package/components/Breadcrumb/breadcrumb-item.cjs.js.map +1 -1
- package/components/Breadcrumb/breadcrumb-item.js +1 -0
- package/components/Breadcrumb/breadcrumb-item.js.map +1 -1
- package/components/Breadcrumb/breadcrumb.cjs.js +1 -0
- package/components/Breadcrumb/breadcrumb.cjs.js.map +1 -1
- package/components/Breadcrumb/breadcrumb.js +1 -0
- package/components/Breadcrumb/breadcrumb.js.map +1 -1
- package/components/Breadcrumb/sgds-breadcrumb-item.cjs.js +1 -0
- package/components/Breadcrumb/sgds-breadcrumb-item.cjs.js.map +1 -1
- package/components/Breadcrumb/sgds-breadcrumb-item.js +1 -0
- package/components/Breadcrumb/sgds-breadcrumb-item.js.map +1 -1
- package/components/Breadcrumb/sgds-breadcrumb.cjs.js +1 -0
- package/components/Breadcrumb/sgds-breadcrumb.cjs.js.map +1 -1
- package/components/Breadcrumb/sgds-breadcrumb.js +1 -0
- package/components/Breadcrumb/sgds-breadcrumb.js.map +1 -1
- package/components/Button/button.cjs.js +1 -0
- package/components/Button/button.cjs.js.map +1 -1
- package/components/Button/button.js +1 -0
- package/components/Button/button.js.map +1 -1
- package/components/Button/sgds-button.cjs.js +1 -0
- package/components/Button/sgds-button.cjs.js.map +1 -1
- package/components/Button/sgds-button.js +1 -0
- package/components/Button/sgds-button.js.map +1 -1
- package/components/Card/card.cjs.js +1 -0
- package/components/Card/card.cjs.js.map +1 -1
- package/components/Card/card.js +1 -0
- package/components/Card/card.js.map +1 -1
- package/components/Card/sgds-card.cjs.js +1 -0
- package/components/Card/sgds-card.cjs.js.map +1 -1
- package/components/Card/sgds-card.js +1 -0
- package/components/Card/sgds-card.js.map +1 -1
- package/components/Checkbox/checkbox.cjs.js +1 -0
- package/components/Checkbox/checkbox.cjs.js.map +1 -1
- package/components/Checkbox/checkbox.js +1 -0
- package/components/Checkbox/checkbox.js.map +1 -1
- package/components/Checkbox/sgds-checkbox.cjs.js +1 -0
- package/components/Checkbox/sgds-checkbox.cjs.js.map +1 -1
- package/components/Checkbox/sgds-checkbox.js +1 -0
- package/components/Checkbox/sgds-checkbox.js.map +1 -1
- package/components/ComboBox/combo-box.cjs.js +1 -0
- package/components/ComboBox/combo-box.cjs.js.map +1 -1
- package/components/ComboBox/combo-box.js +1 -0
- package/components/ComboBox/combo-box.js.map +1 -1
- package/components/ComboBox/sgds-combo-box.cjs.js +1 -0
- package/components/ComboBox/sgds-combo-box.cjs.js.map +1 -1
- package/components/ComboBox/sgds-combo-box.js +1 -0
- package/components/ComboBox/sgds-combo-box.js.map +1 -1
- package/components/Datepicker/datepicker-calendar.cjs.js +1 -0
- package/components/Datepicker/datepicker-calendar.cjs.js.map +1 -1
- package/components/Datepicker/datepicker-calendar.cjs2.js +1 -0
- package/components/Datepicker/datepicker-calendar.cjs2.js.map +1 -1
- package/components/Datepicker/datepicker-calendar.js +1 -0
- package/components/Datepicker/datepicker-calendar.js.map +1 -1
- package/components/Datepicker/datepicker-calendar2.js +1 -0
- package/components/Datepicker/datepicker-calendar2.js.map +1 -1
- package/components/Datepicker/datepicker-header.cjs.js +1 -0
- package/components/Datepicker/datepicker-header.cjs.js.map +1 -1
- package/components/Datepicker/datepicker-header.cjs2.js +1 -0
- package/components/Datepicker/datepicker-header.cjs2.js.map +1 -1
- package/components/Datepicker/datepicker-header.js +1 -0
- package/components/Datepicker/datepicker-header.js.map +1 -1
- package/components/Datepicker/datepicker-header2.js +1 -0
- package/components/Datepicker/datepicker-header2.js.map +1 -1
- package/components/Datepicker/datepicker-input.cjs.js +1 -0
- package/components/Datepicker/datepicker-input.cjs.js.map +1 -1
- package/components/Datepicker/datepicker-input.cjs2.js +1 -0
- package/components/Datepicker/datepicker-input.cjs2.js.map +1 -1
- package/components/Datepicker/datepicker-input.js +1 -0
- package/components/Datepicker/datepicker-input.js.map +1 -1
- package/components/Datepicker/datepicker-input2.js +1 -0
- package/components/Datepicker/datepicker-input2.js.map +1 -1
- package/components/Datepicker/datepicker.cjs.js +1 -0
- package/components/Datepicker/datepicker.cjs.js.map +1 -1
- package/components/Datepicker/datepicker.js +1 -0
- package/components/Datepicker/datepicker.js.map +1 -1
- package/components/Datepicker/sgds-datepicker.cjs.js +1 -0
- package/components/Datepicker/sgds-datepicker.cjs.js.map +1 -1
- package/components/Datepicker/sgds-datepicker.js +1 -0
- package/components/Datepicker/sgds-datepicker.js.map +1 -1
- package/components/Drawer/drawer.cjs.js +1 -0
- package/components/Drawer/drawer.cjs.js.map +1 -1
- package/components/Drawer/drawer.js +1 -0
- package/components/Drawer/drawer.js.map +1 -1
- package/components/Drawer/sgds-drawer.cjs.js +1 -0
- package/components/Drawer/sgds-drawer.cjs.js.map +1 -1
- package/components/Drawer/sgds-drawer.js +1 -0
- package/components/Drawer/sgds-drawer.js.map +1 -1
- package/components/Dropdown/dropdown.cjs.js +1 -0
- package/components/Dropdown/dropdown.cjs.js.map +1 -1
- package/components/Dropdown/dropdown.js +1 -0
- package/components/Dropdown/dropdown.js.map +1 -1
- package/components/Dropdown/sgds-dropdown-item.cjs.js +1 -0
- package/components/Dropdown/sgds-dropdown-item.cjs.js.map +1 -1
- package/components/Dropdown/sgds-dropdown-item.js +1 -0
- package/components/Dropdown/sgds-dropdown-item.js.map +1 -1
- package/components/Dropdown/sgds-dropdown.cjs.js +1 -0
- package/components/Dropdown/sgds-dropdown.cjs.js.map +1 -1
- package/components/Dropdown/sgds-dropdown.js +1 -0
- package/components/Dropdown/sgds-dropdown.js.map +1 -1
- package/components/FileUpload/file-upload.cjs.js +1 -0
- package/components/FileUpload/file-upload.cjs.js.map +1 -1
- package/components/FileUpload/file-upload.js +1 -0
- package/components/FileUpload/file-upload.js.map +1 -1
- package/components/FileUpload/sgds-file-upload.cjs.js +1 -0
- package/components/FileUpload/sgds-file-upload.cjs.js.map +1 -1
- package/components/FileUpload/sgds-file-upload.js +1 -0
- package/components/FileUpload/sgds-file-upload.js.map +1 -1
- package/components/Footer/footer.cjs.js +1 -0
- package/components/Footer/footer.cjs.js.map +1 -1
- package/components/Footer/footer.js +1 -0
- package/components/Footer/footer.js.map +1 -1
- package/components/Footer/sgds-footer.cjs.js +1 -0
- package/components/Footer/sgds-footer.cjs.js.map +1 -1
- package/components/Footer/sgds-footer.js +1 -0
- package/components/Footer/sgds-footer.js.map +1 -1
- package/components/Input/input.cjs.js +1 -0
- package/components/Input/input.cjs.js.map +1 -1
- package/components/Input/input.js +1 -0
- package/components/Input/input.js.map +1 -1
- package/components/Input/sgds-input.cjs.js +1 -0
- package/components/Input/sgds-input.cjs.js.map +1 -1
- package/components/Input/sgds-input.js +1 -0
- package/components/Input/sgds-input.js.map +1 -1
- package/components/Mainnav/mainnav-dropdown.cjs.js +1 -0
- package/components/Mainnav/mainnav-dropdown.cjs.js.map +1 -1
- package/components/Mainnav/mainnav-dropdown.js +1 -0
- package/components/Mainnav/mainnav-dropdown.js.map +1 -1
- package/components/Mainnav/mainnav-item.cjs.js +1 -0
- package/components/Mainnav/mainnav-item.cjs.js.map +1 -1
- package/components/Mainnav/mainnav-item.js +1 -0
- package/components/Mainnav/mainnav-item.js.map +1 -1
- package/components/Mainnav/mainnav.cjs.js +1 -0
- package/components/Mainnav/mainnav.cjs.js.map +1 -1
- package/components/Mainnav/mainnav.js +1 -0
- package/components/Mainnav/mainnav.js.map +1 -1
- package/components/Mainnav/sgds-mainnav-dropdown.cjs.js +1 -0
- package/components/Mainnav/sgds-mainnav-dropdown.cjs.js.map +1 -1
- package/components/Mainnav/sgds-mainnav-dropdown.js +1 -0
- package/components/Mainnav/sgds-mainnav-dropdown.js.map +1 -1
- package/components/Mainnav/sgds-mainnav-item.cjs.js +1 -0
- package/components/Mainnav/sgds-mainnav-item.cjs.js.map +1 -1
- package/components/Mainnav/sgds-mainnav-item.js +1 -0
- package/components/Mainnav/sgds-mainnav-item.js.map +1 -1
- package/components/Mainnav/sgds-mainnav.cjs.js +1 -0
- package/components/Mainnav/sgds-mainnav.cjs.js.map +1 -1
- package/components/Mainnav/sgds-mainnav.js +1 -0
- package/components/Mainnav/sgds-mainnav.js.map +1 -1
- package/components/Masthead/masthead.cjs.js +1 -0
- package/components/Masthead/masthead.cjs.js.map +1 -1
- package/components/Masthead/masthead.js +1 -0
- package/components/Masthead/masthead.js.map +1 -1
- package/components/Masthead/sgds-masthead.cjs.js +1 -0
- package/components/Masthead/sgds-masthead.cjs.js.map +1 -1
- package/components/Masthead/sgds-masthead.js +1 -0
- package/components/Masthead/sgds-masthead.js.map +1 -1
- package/components/Modal/modal.cjs.js +1 -0
- package/components/Modal/modal.cjs.js.map +1 -1
- package/components/Modal/modal.js +1 -0
- package/components/Modal/modal.js.map +1 -1
- package/components/Modal/sgds-modal.cjs.js +1 -0
- package/components/Modal/sgds-modal.cjs.js.map +1 -1
- package/components/Modal/sgds-modal.js +1 -0
- package/components/Modal/sgds-modal.js.map +1 -1
- package/components/Pagination/pagination.cjs.js +1 -0
- package/components/Pagination/pagination.cjs.js.map +1 -1
- package/components/Pagination/pagination.js +1 -0
- package/components/Pagination/pagination.js.map +1 -1
- package/components/Pagination/sgds-pagination.cjs.js +1 -0
- package/components/Pagination/sgds-pagination.cjs.js.map +1 -1
- package/components/Pagination/sgds-pagination.js +1 -0
- package/components/Pagination/sgds-pagination.js.map +1 -1
- package/components/Progress/progress-bar.cjs.js +1 -0
- package/components/Progress/progress-bar.cjs.js.map +1 -1
- package/components/Progress/progress-bar.js +1 -0
- package/components/Progress/progress-bar.js.map +1 -1
- package/components/Progress/progress.cjs.js +1 -0
- package/components/Progress/progress.cjs.js.map +1 -1
- package/components/Progress/progress.js +1 -0
- package/components/Progress/progress.js.map +1 -1
- package/components/Progress/sgds-progress-bar.cjs.js +1 -0
- package/components/Progress/sgds-progress-bar.cjs.js.map +1 -1
- package/components/Progress/sgds-progress-bar.js +1 -0
- package/components/Progress/sgds-progress-bar.js.map +1 -1
- package/components/Progress/sgds-progress.cjs.js +1 -0
- package/components/Progress/sgds-progress.cjs.js.map +1 -1
- package/components/Progress/sgds-progress.js +1 -0
- package/components/Progress/sgds-progress.js.map +1 -1
- package/components/QuantityToggle/quantity-toggle.cjs.js +1 -0
- package/components/QuantityToggle/quantity-toggle.cjs.js.map +1 -1
- package/components/QuantityToggle/quantity-toggle.js +1 -0
- package/components/QuantityToggle/quantity-toggle.js.map +1 -1
- package/components/QuantityToggle/sgds-quantity-toggle.cjs.js +1 -0
- package/components/QuantityToggle/sgds-quantity-toggle.cjs.js.map +1 -1
- package/components/QuantityToggle/sgds-quantity-toggle.js +1 -0
- package/components/QuantityToggle/sgds-quantity-toggle.js.map +1 -1
- package/components/Radio/radio-group.cjs.js +1 -0
- package/components/Radio/radio-group.cjs.js.map +1 -1
- package/components/Radio/radio-group.js +1 -0
- package/components/Radio/radio-group.js.map +1 -1
- package/components/Radio/radio.cjs.js +1 -0
- package/components/Radio/radio.cjs.js.map +1 -1
- package/components/Radio/radio.js +1 -0
- package/components/Radio/radio.js.map +1 -1
- package/components/Radio/sgds-radio-group.cjs.js +1 -0
- package/components/Radio/sgds-radio-group.cjs.js.map +1 -1
- package/components/Radio/sgds-radio-group.js +1 -0
- package/components/Radio/sgds-radio-group.js.map +1 -1
- package/components/Radio/sgds-radio.cjs.js +1 -0
- package/components/Radio/sgds-radio.cjs.js.map +1 -1
- package/components/Radio/sgds-radio.js +1 -0
- package/components/Radio/sgds-radio.js.map +1 -1
- package/components/Sidenav/sgds-sidenav-item.cjs.js +1 -0
- package/components/Sidenav/sgds-sidenav-item.cjs.js.map +1 -1
- package/components/Sidenav/sgds-sidenav-item.js +1 -0
- package/components/Sidenav/sgds-sidenav-item.js.map +1 -1
- package/components/Sidenav/sgds-sidenav-link.cjs.js +1 -0
- package/components/Sidenav/sgds-sidenav-link.cjs.js.map +1 -1
- package/components/Sidenav/sgds-sidenav-link.js +1 -0
- package/components/Sidenav/sgds-sidenav-link.js.map +1 -1
- package/components/Sidenav/sgds-sidenav.cjs.js +1 -0
- package/components/Sidenav/sgds-sidenav.cjs.js.map +1 -1
- package/components/Sidenav/sgds-sidenav.js +1 -0
- package/components/Sidenav/sgds-sidenav.js.map +1 -1
- package/components/Sidenav/sidenav-item.cjs.js +1 -0
- package/components/Sidenav/sidenav-item.cjs.js.map +1 -1
- package/components/Sidenav/sidenav-item.js +1 -0
- package/components/Sidenav/sidenav-item.js.map +1 -1
- package/components/Sidenav/sidenav-link.cjs.js +1 -0
- package/components/Sidenav/sidenav-link.cjs.js.map +1 -1
- package/components/Sidenav/sidenav-link.js +1 -0
- package/components/Sidenav/sidenav-link.js.map +1 -1
- package/components/Sidenav/sidenav.cjs.js +1 -0
- package/components/Sidenav/sidenav.cjs.js.map +1 -1
- package/components/Sidenav/sidenav.js +1 -0
- package/components/Sidenav/sidenav.js.map +1 -1
- package/components/Spinner/sgds-spinner.cjs.js +1 -0
- package/components/Spinner/sgds-spinner.cjs.js.map +1 -1
- package/components/Spinner/sgds-spinner.js +1 -0
- package/components/Spinner/sgds-spinner.js.map +1 -1
- package/components/Spinner/spinner.cjs.js +1 -0
- package/components/Spinner/spinner.cjs.js.map +1 -1
- package/components/Spinner/spinner.js +1 -0
- package/components/Spinner/spinner.js.map +1 -1
- package/components/Stepper/sgds-stepper.cjs.js +1 -0
- package/components/Stepper/sgds-stepper.cjs.js.map +1 -1
- package/components/Stepper/sgds-stepper.js +1 -0
- package/components/Stepper/sgds-stepper.js.map +1 -1
- package/components/Stepper/stepper.cjs.js +1 -0
- package/components/Stepper/stepper.cjs.js.map +1 -1
- package/components/Stepper/stepper.js +1 -0
- package/components/Stepper/stepper.js.map +1 -1
- package/components/Tab/sgds-tab-group.cjs.js +1 -0
- package/components/Tab/sgds-tab-group.cjs.js.map +1 -1
- package/components/Tab/sgds-tab-group.js +1 -0
- package/components/Tab/sgds-tab-group.js.map +1 -1
- package/components/Tab/sgds-tab-panel.cjs.js +1 -0
- package/components/Tab/sgds-tab-panel.cjs.js.map +1 -1
- package/components/Tab/sgds-tab-panel.js +1 -0
- package/components/Tab/sgds-tab-panel.js.map +1 -1
- package/components/Tab/sgds-tab.cjs.js +1 -0
- package/components/Tab/sgds-tab.cjs.js.map +1 -1
- package/components/Tab/sgds-tab.js +1 -0
- package/components/Tab/sgds-tab.js.map +1 -1
- package/components/Tab/tab-group.cjs.js +1 -0
- package/components/Tab/tab-group.cjs.js.map +1 -1
- package/components/Tab/tab-group.js +1 -0
- package/components/Tab/tab-group.js.map +1 -1
- package/components/Tab/tab-panel.cjs.js +1 -0
- package/components/Tab/tab-panel.cjs.js.map +1 -1
- package/components/Tab/tab-panel.js +1 -0
- package/components/Tab/tab-panel.js.map +1 -1
- package/components/Tab/tab.cjs.js +1 -0
- package/components/Tab/tab.cjs.js.map +1 -1
- package/components/Tab/tab.js +1 -0
- package/components/Tab/tab.js.map +1 -1
- package/components/Table/sgds-table.cjs.js +1 -0
- package/components/Table/sgds-table.cjs.js.map +1 -1
- package/components/Table/sgds-table.js +1 -0
- package/components/Table/sgds-table.js.map +1 -1
- package/components/Table/table.cjs.js +1 -0
- package/components/Table/table.cjs.js.map +1 -1
- package/components/Table/table.js +1 -0
- package/components/Table/table.js.map +1 -1
- package/components/Textarea/sgds-textarea.cjs.js +1 -0
- package/components/Textarea/sgds-textarea.cjs.js.map +1 -1
- package/components/Textarea/sgds-textarea.js +1 -0
- package/components/Textarea/sgds-textarea.js.map +1 -1
- package/components/Textarea/textarea.cjs.js +1 -0
- package/components/Textarea/textarea.cjs.js.map +1 -1
- package/components/Textarea/textarea.js +1 -0
- package/components/Textarea/textarea.js.map +1 -1
- package/components/Toast/sgds-toast-container.cjs.js +1 -0
- package/components/Toast/sgds-toast-container.cjs.js.map +1 -1
- package/components/Toast/sgds-toast-container.js +1 -0
- package/components/Toast/sgds-toast-container.js.map +1 -1
- package/components/Toast/sgds-toast.cjs.js +1 -0
- package/components/Toast/sgds-toast.cjs.js.map +1 -1
- package/components/Toast/sgds-toast.js +1 -0
- package/components/Toast/sgds-toast.js.map +1 -1
- package/components/Toast/toast-container.cjs.js +1 -0
- package/components/Toast/toast-container.cjs.js.map +1 -1
- package/components/Toast/toast-container.js +1 -0
- package/components/Toast/toast-container.js.map +1 -1
- package/components/Toast/toast.cjs.js +1 -0
- package/components/Toast/toast.cjs.js.map +1 -1
- package/components/Toast/toast.js +1 -0
- package/components/Toast/toast.js.map +1 -1
- package/components/Tooltip/sgds-tooltip.cjs.js +1 -0
- package/components/Tooltip/sgds-tooltip.cjs.js.map +1 -1
- package/components/Tooltip/sgds-tooltip.js +1 -0
- package/components/Tooltip/sgds-tooltip.js.map +1 -1
- package/components/Tooltip/tooltip.cjs.js +1 -0
- package/components/Tooltip/tooltip.cjs.js.map +1 -1
- package/components/Tooltip/tooltip.js +1 -0
- package/components/Tooltip/tooltip.js.map +1 -1
- package/internals/CloseButton/close-button.cjs.js +1 -0
- package/internals/CloseButton/close-button.cjs.js.map +1 -1
- package/internals/CloseButton/close-button.js +1 -0
- package/internals/CloseButton/close-button.js.map +1 -1
- package/internals/CloseButton/sgds-close-button.cjs.js +1 -0
- package/internals/CloseButton/sgds-close-button.cjs.js.map +1 -1
- package/internals/CloseButton/sgds-close-button.js +1 -0
- package/internals/CloseButton/sgds-close-button.js.map +1 -1
- package/package.json +1 -1
- package/react/accordion/index.cjs.js +1 -0
- package/react/accordion/index.cjs.js.map +1 -1
- package/react/accordion/index.js +1 -0
- package/react/accordion/index.js.map +1 -1
- package/react/accordion-item/index.cjs.js +1 -0
- package/react/accordion-item/index.cjs.js.map +1 -1
- package/react/accordion-item/index.js +1 -0
- package/react/accordion-item/index.js.map +1 -1
- package/react/action-card/index.cjs.js +1 -0
- package/react/action-card/index.cjs.js.map +1 -1
- package/react/action-card/index.js +1 -0
- package/react/action-card/index.js.map +1 -1
- package/react/alert/index.cjs.js +1 -0
- package/react/alert/index.cjs.js.map +1 -1
- package/react/alert/index.js +1 -0
- package/react/alert/index.js.map +1 -1
- package/react/alert-heading/index.cjs.js +1 -0
- package/react/alert-heading/index.cjs.js.map +1 -1
- package/react/alert-heading/index.js +1 -0
- package/react/alert-heading/index.js.map +1 -1
- package/react/alert-link/index.cjs.js +1 -0
- package/react/alert-link/index.cjs.js.map +1 -1
- package/react/alert-link/index.js +1 -0
- package/react/alert-link/index.js.map +1 -1
- package/react/badge/index.cjs.js +1 -0
- package/react/badge/index.cjs.js.map +1 -1
- package/react/badge/index.js +1 -0
- package/react/badge/index.js.map +1 -1
- package/react/breadcrumb/index.cjs.js +1 -0
- package/react/breadcrumb/index.cjs.js.map +1 -1
- package/react/breadcrumb/index.js +1 -0
- package/react/breadcrumb/index.js.map +1 -1
- package/react/breadcrumb-item/index.cjs.js +1 -0
- package/react/breadcrumb-item/index.cjs.js.map +1 -1
- package/react/breadcrumb-item/index.js +1 -0
- package/react/breadcrumb-item/index.js.map +1 -1
- package/react/button/index.cjs.js +1 -0
- package/react/button/index.cjs.js.map +1 -1
- package/react/button/index.js +1 -0
- package/react/button/index.js.map +1 -1
- package/react/card/index.cjs.js +1 -0
- package/react/card/index.cjs.js.map +1 -1
- package/react/card/index.js +1 -0
- package/react/card/index.js.map +1 -1
- package/react/checkbox/index.cjs.js +1 -0
- package/react/checkbox/index.cjs.js.map +1 -1
- package/react/checkbox/index.js +1 -0
- package/react/checkbox/index.js.map +1 -1
- package/react/combo-box/index.cjs.js +1 -0
- package/react/combo-box/index.cjs.js.map +1 -1
- package/react/combo-box/index.js +1 -0
- package/react/combo-box/index.js.map +1 -1
- package/react/datepicker/index.cjs.js +1 -0
- package/react/datepicker/index.cjs.js.map +1 -1
- package/react/datepicker/index.js +1 -0
- package/react/datepicker/index.js.map +1 -1
- package/react/drawer/index.cjs.js +1 -0
- package/react/drawer/index.cjs.js.map +1 -1
- package/react/drawer/index.js +1 -0
- package/react/drawer/index.js.map +1 -1
- package/react/dropdown/index.cjs.js +1 -0
- package/react/dropdown/index.cjs.js.map +1 -1
- package/react/dropdown/index.js +1 -0
- package/react/dropdown/index.js.map +1 -1
- package/react/dropdown-item/index.cjs.js +1 -0
- package/react/dropdown-item/index.cjs.js.map +1 -1
- package/react/dropdown-item/index.js +1 -0
- package/react/dropdown-item/index.js.map +1 -1
- package/react/file-upload/index.cjs.js +1 -0
- package/react/file-upload/index.cjs.js.map +1 -1
- package/react/file-upload/index.js +1 -0
- package/react/file-upload/index.js.map +1 -1
- package/react/footer/index.cjs.js +1 -0
- package/react/footer/index.cjs.js.map +1 -1
- package/react/footer/index.js +1 -0
- package/react/footer/index.js.map +1 -1
- package/react/index.cjs.js +1 -0
- package/react/index.cjs.js.map +1 -1
- package/react/index.js +1 -0
- package/react/index.js.map +1 -1
- package/react/input/index.cjs.js +1 -0
- package/react/input/index.cjs.js.map +1 -1
- package/react/input/index.js +1 -0
- package/react/input/index.js.map +1 -1
- package/react/mainnav/index.cjs.js +1 -0
- package/react/mainnav/index.cjs.js.map +1 -1
- package/react/mainnav/index.js +1 -0
- package/react/mainnav/index.js.map +1 -1
- package/react/mainnav-dropdown/index.cjs.js +1 -0
- package/react/mainnav-dropdown/index.cjs.js.map +1 -1
- package/react/mainnav-dropdown/index.js +1 -0
- package/react/mainnav-dropdown/index.js.map +1 -1
- package/react/mainnav-item/index.cjs.js +1 -0
- package/react/mainnav-item/index.cjs.js.map +1 -1
- package/react/mainnav-item/index.js +1 -0
- package/react/mainnav-item/index.js.map +1 -1
- package/react/masthead/index.cjs.js +1 -0
- package/react/masthead/index.cjs.js.map +1 -1
- package/react/masthead/index.js +1 -0
- package/react/masthead/index.js.map +1 -1
- package/react/modal/index.cjs.js +1 -0
- package/react/modal/index.cjs.js.map +1 -1
- package/react/modal/index.js +1 -0
- package/react/modal/index.js.map +1 -1
- package/react/pagination/index.cjs.js +1 -0
- package/react/pagination/index.cjs.js.map +1 -1
- package/react/pagination/index.js +1 -0
- package/react/pagination/index.js.map +1 -1
- package/react/progress/index.cjs.js +1 -0
- package/react/progress/index.cjs.js.map +1 -1
- package/react/progress/index.js +1 -0
- package/react/progress/index.js.map +1 -1
- package/react/progress-bar/index.cjs.js +1 -0
- package/react/progress-bar/index.cjs.js.map +1 -1
- package/react/progress-bar/index.js +1 -0
- package/react/progress-bar/index.js.map +1 -1
- package/react/quantity-toggle/index.cjs.js +1 -0
- package/react/quantity-toggle/index.cjs.js.map +1 -1
- package/react/quantity-toggle/index.js +1 -0
- package/react/quantity-toggle/index.js.map +1 -1
- package/react/radio/index.cjs.js +1 -0
- package/react/radio/index.cjs.js.map +1 -1
- package/react/radio/index.js +1 -0
- package/react/radio/index.js.map +1 -1
- package/react/radio-group/index.cjs.js +1 -0
- package/react/radio-group/index.cjs.js.map +1 -1
- package/react/radio-group/index.js +1 -0
- package/react/radio-group/index.js.map +1 -1
- package/react/sidenav/index.cjs.js +1 -0
- package/react/sidenav/index.cjs.js.map +1 -1
- package/react/sidenav/index.js +1 -0
- package/react/sidenav/index.js.map +1 -1
- package/react/sidenav-item/index.cjs.js +1 -0
- package/react/sidenav-item/index.cjs.js.map +1 -1
- package/react/sidenav-item/index.js +1 -0
- package/react/sidenav-item/index.js.map +1 -1
- package/react/sidenav-link/index.cjs.js +1 -0
- package/react/sidenav-link/index.cjs.js.map +1 -1
- package/react/sidenav-link/index.js +1 -0
- package/react/sidenav-link/index.js.map +1 -1
- package/react/spinner/index.cjs.js +1 -0
- package/react/spinner/index.cjs.js.map +1 -1
- package/react/spinner/index.js +1 -0
- package/react/spinner/index.js.map +1 -1
- package/react/stepper/index.cjs.js +1 -0
- package/react/stepper/index.cjs.js.map +1 -1
- package/react/stepper/index.js +1 -0
- package/react/stepper/index.js.map +1 -1
- package/react/tab/index.cjs.js +1 -0
- package/react/tab/index.cjs.js.map +1 -1
- package/react/tab/index.js +1 -0
- package/react/tab/index.js.map +1 -1
- package/react/tab-group/index.cjs.js +1 -0
- package/react/tab-group/index.cjs.js.map +1 -1
- package/react/tab-group/index.js +1 -0
- package/react/tab-group/index.js.map +1 -1
- package/react/tab-panel/index.cjs.js +1 -0
- package/react/tab-panel/index.cjs.js.map +1 -1
- package/react/tab-panel/index.js +1 -0
- package/react/tab-panel/index.js.map +1 -1
- package/react/table/index.cjs.js +1 -0
- package/react/table/index.cjs.js.map +1 -1
- package/react/table/index.js +1 -0
- package/react/table/index.js.map +1 -1
- package/react/textarea/index.cjs.js +1 -0
- package/react/textarea/index.cjs.js.map +1 -1
- package/react/textarea/index.js +1 -0
- package/react/textarea/index.js.map +1 -1
- package/react/toast/index.cjs.js +1 -0
- package/react/toast/index.cjs.js.map +1 -1
- package/react/toast/index.js +1 -0
- package/react/toast/index.js.map +1 -1
- package/react/toast-container/index.cjs.js +1 -0
- package/react/toast-container/index.cjs.js.map +1 -1
- package/react/toast-container/index.js +1 -0
- package/react/toast-container/index.js.map +1 -1
- package/react/tooltip/index.cjs.js +1 -0
- package/react/tooltip/index.cjs.js.map +1 -1
- package/react/tooltip/index.js +1 -0
- package/react/tooltip/index.js.map +1 -1
- package/styles/anchor.cjs.js +1 -0
- package/styles/anchor.cjs.js.map +1 -1
- package/styles/anchor.js +1 -0
- package/styles/anchor.js.map +1 -1
- package/styles/bg-variants.cjs.js +1 -0
- package/styles/bg-variants.cjs.js.map +1 -1
- package/styles/bg-variants.js +1 -0
- package/styles/bg-variants.js.map +1 -1
- package/styles/border-variants.cjs.js +1 -0
- package/styles/border-variants.cjs.js.map +1 -1
- package/styles/border-variants.js +1 -0
- package/styles/border-variants.js.map +1 -1
- package/styles/feedback.cjs.js +1 -0
- package/styles/feedback.cjs.js.map +1 -1
- package/styles/feedback.js +1 -0
- package/styles/feedback.js.map +1 -1
- package/styles/form-hint.cjs.js +1 -0
- package/styles/form-hint.cjs.js.map +1 -1
- package/styles/form-hint.js +1 -0
- package/styles/form-hint.js.map +1 -1
- package/styles/form-label.cjs.js +1 -0
- package/styles/form-label.cjs.js.map +1 -1
- package/styles/form-label.js +1 -0
- package/styles/form-label.js.map +1 -1
- package/styles/header-class.cjs.js +1 -0
- package/styles/header-class.cjs.js.map +1 -1
- package/styles/header-class.js +1 -0
- package/styles/header-class.js.map +1 -1
- package/styles/paragraph.cjs.js +1 -0
- package/styles/paragraph.cjs.js.map +1 -1
- package/styles/paragraph.js +1 -0
- package/styles/paragraph.js.map +1 -1
- package/styles/svg.cjs.js +1 -0
- package/styles/svg.cjs.js.map +1 -1
- package/styles/svg.js +1 -0
- package/styles/svg.js.map +1 -1
- package/styles/text-variants.cjs.js +1 -0
- package/styles/text-variants.cjs.js.map +1 -1
- package/styles/text-variants.js +1 -0
- package/styles/text-variants.js.map +1 -1
- package/utils/animate.cjs.js +1 -0
- package/utils/animate.cjs.js.map +1 -1
- package/utils/animate.js +1 -0
- package/utils/animate.js.map +1 -1
- package/utils/animation-registry.cjs.js +1 -0
- package/utils/animation-registry.cjs.js.map +1 -1
- package/utils/animation-registry.js +1 -0
- package/utils/animation-registry.js.map +1 -1
- package/utils/breakpoints.cjs.js +1 -0
- package/utils/breakpoints.cjs.js.map +1 -1
- package/utils/breakpoints.js +1 -0
- package/utils/breakpoints.js.map +1 -1
- package/utils/defaultvalue.cjs.js +1 -0
- package/utils/defaultvalue.cjs.js.map +1 -1
- package/utils/defaultvalue.js +1 -0
- package/utils/defaultvalue.js.map +1 -1
- package/utils/event.cjs.js +1 -0
- package/utils/event.cjs.js.map +1 -1
- package/utils/event.js +1 -0
- package/utils/event.js.map +1 -1
- package/utils/form.cjs.js +1 -0
- package/utils/form.cjs.js.map +1 -1
- package/utils/form.js +1 -0
- package/utils/form.js.map +1 -1
- package/utils/generateId.cjs.js +1 -0
- package/utils/generateId.cjs.js.map +1 -1
- package/utils/generateId.js +1 -0
- package/utils/generateId.js.map +1 -1
- package/utils/mergeDeep.cjs.js +1 -0
- package/utils/mergeDeep.cjs.js.map +1 -1
- package/utils/mergeDeep.js +1 -0
- package/utils/mergeDeep.js.map +1 -1
- package/utils/modal.cjs.js +1 -0
- package/utils/modal.cjs.js.map +1 -1
- package/utils/modal.js +1 -0
- package/utils/modal.js.map +1 -1
- package/utils/object.cjs.js +1 -0
- package/utils/object.cjs.js.map +1 -1
- package/utils/object.js +1 -0
- package/utils/object.js.map +1 -1
- package/utils/scroll.cjs.js +1 -0
- package/utils/scroll.cjs.js.map +1 -1
- package/utils/scroll.js +1 -0
- package/utils/scroll.js.map +1 -1
- package/utils/slot.cjs.js +1 -0
- package/utils/slot.cjs.js.map +1 -1
- package/utils/slot.js +1 -0
- package/utils/slot.js.map +1 -1
- package/utils/tabbable.cjs.js +1 -0
- package/utils/tabbable.cjs.js.map +1 -1
- package/utils/tabbable.js +1 -0
- package/utils/tabbable.js.map +1 -1
- package/utils/time.cjs.js +1 -0
- package/utils/time.cjs.js.map +1 -1
- package/utils/time.js +1 -0
- package/utils/time.js.map +1 -1
- package/utils/watch.cjs.js +1 -0
- package/utils/watch.cjs.js.map +1 -1
- package/utils/watch.js +1 -0
- package/utils/watch.js.map +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sgds-radio-group.js","sources":["../../../src/components/Radio/sgds-radio-group.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property, query, queryAssignedElements, state } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { FormSubmitController } from \"../../utils/form\";\nimport { watch } from \"../../utils/watch\";\nimport radioGroupStyles from \"./radio-group.css\";\nimport SgdsRadio from \"./sgds-radio\";\nimport feedbackStyles from \"../../styles/feedback.css\";\nimport formLabelStyles from \"../../styles/form-label.css\";\n\n/**\n * @summary RadioGroup group multiple radios so they function as a single form control.\n *\n * @slot default - The default slot where sgds-radio are placed.\n *\n * @event sgds-change - Emitted when the radio group's selected value changes.\n *\n *\n */\nexport class SgdsRadioGroup extends SgdsElement {\n static styles = [...SgdsElement.styles, feedbackStyles, formLabelStyles, radioGroupStyles];\n /**@internal */\n protected readonly formSubmitController = new FormSubmitController(this, {\n defaultValue: (control: SgdsRadioGroup) => control.defaultValue\n });\n /**@internal */\n @query(\"slot:not([name])\") defaultSlot: HTMLSlotElement;\n /**@internal */\n @query(\".radio-group-validation-input\") input: HTMLInputElement;\n /**@internal */\n @state() defaultValue = \"\";\n /**@internal */\n @state() private customErrorMessage = \"\";\n /** This will be true when the control is in an invalid state. */\n @property({ type: Boolean, reflect: true }) invalid = false;\n\n /** The selected value of the control. */\n @property({ reflect: true }) value = \"\";\n\n /** The name assigned to the radio controls. */\n @property({ reflect: true }) name = \"option\";\n\n /** Ensures a child radio is checked before allowing the containing form to submit. */\n @property({ type: Boolean, reflect: true }) required = false;\n\n /**Feedback text for error state when validated */\n @property({ type: String, reflect: true }) invalidFeedback = \"\";\n /** Allows invalidFeedback, invalid and valid styles to be visible with the input */\n @property({ type: Boolean, reflect: true }) hasFeedback = false;\n\n @watch(\"value\", { waitUntilFirstUpdate: true })\n _handleValueChange() {\n this.emit(\"sgds-change\", { detail: { value: this.value } });\n this._updateCheckedRadio();\n }\n\n connectedCallback() {\n super.connectedCallback();\n this.defaultValue = this.value;\n }\n\n firstUpdated() {\n const radios = this._radios;\n radios.forEach((item, index) => {\n if (radios.length > 1) {\n switch (index) {\n case 0:\n item.setAttribute(\"first-of-type\", \"\");\n break;\n\n case radios.length - 1:\n item.setAttribute(\"last-of-type\", \"\");\n break;\n\n default:\n item.setAttribute(\"nth-of-type\", \"\");\n }\n }\n });\n }\n\n /** Gets and return the ValidityState object. */\n get validity(): ValidityState {\n const hasMissingData = !((this.value && this.required) || !this.required);\n const hasCustomError = this.customErrorMessage !== \"\";\n return {\n badInput: false,\n customError: hasCustomError,\n patternMismatch: false,\n rangeOverflow: false,\n rangeUnderflow: false,\n stepMismatch: false,\n tooLong: false,\n tooShort: false,\n typeMismatch: false,\n valid: hasMissingData ? false : true,\n valueMissing: !hasMissingData\n };\n }\n\n /** Checks for validity and shows the browser's validation message if the control is invalid. */\n public reportValidity(): boolean {\n const validity = this.validity;\n\n this.invalid = !validity.valid;\n\n if (!validity.valid) {\n this._showNativeErrorMessage();\n }\n\n return !this.invalid;\n }\n /**@internal */\n @queryAssignedElements()\n private _radios!: Array<SgdsRadio>;\n\n private _handleRadioClick(event: MouseEvent) {\n const target = event.target as SgdsRadio;\n\n if (target.disabled) {\n return;\n }\n\n this.value = target.value;\n const radios = this._radios;\n radios.forEach(radio => (radio.checked = radio === target));\n }\n\n private _handleKeyDown(event: KeyboardEvent) {\n if (![\"ArrowUp\", \"ArrowDown\", \"ArrowLeft\", \"ArrowRight\", \" \"].includes(event.key)) {\n return;\n }\n\n const radios = this._radios.filter(radio => !radio.disabled);\n const checkedRadio = radios.find(radio => radio.checked) ?? radios[0];\n //if eventkey is space, index increment is 0, if eventkey arrowup/arrowleft, index is -1, arrowright/arrowdown, index incr is 1\n const incr = event.key === \" \" ? 0 : [\"ArrowUp\", \"ArrowLeft\"].includes(event.key) ? -1 : 1;\n let index = radios.indexOf(checkedRadio) + incr;\n if (index < 0) {\n index = radios.length - 1;\n }\n if (index > radios.length - 1) {\n index = 0;\n }\n\n this._radios.forEach(radio => {\n radio.checked = false;\n radio.tabIndex = -1;\n });\n\n this.value = radios[index].value;\n radios[index].checked = true;\n radios[index].tabIndex = 0;\n radios[index].focus();\n\n event.preventDefault();\n }\n\n private _handleLabelClick() {\n const radios = this._radios;\n const checked = radios.find(radio => radio.checked);\n const radioToFocus = checked || radios[0];\n\n // Move focus to the checked radio (or the first one if none are checked) when clicking the label\n if (radioToFocus) {\n radioToFocus.focus();\n }\n }\n\n private _handleSlotChange() {\n const radios = this._radios;\n\n radios.forEach(radio => (radio.checked = radio.value === this.value));\n\n if (!radios.some(radio => radio.checked)) {\n if (radios[0]) radios[0].tabIndex = 0;\n }\n }\n\n private _handleInvalid(e: Event) {\n e.preventDefault();\n this.invalid = true;\n this._radios.forEach(radio => (radio.invalid = true));\n }\n\n private _showNativeErrorMessage() {\n this.input.reportValidity();\n }\n\n private _updateCheckedRadio() {\n const radios = this._radios;\n radios.forEach(radio => (radio.checked = radio.value === this.value));\n this.invalid = !this.validity.valid;\n this._radios.forEach(radio => (radio.invalid = this.invalid));\n }\n\n render() {\n const defaultSlot = html`\n <div>\n <slot\n @click=${this._handleRadioClick}\n @keydown=${this._handleKeyDown}\n @slotchange=${this._handleSlotChange}\n role=\"presentation\"\n ></slot>\n </div>\n `;\n return html`\n <fieldset name=${this.name}>\n <label\n @click=${this._handleLabelClick}\n class=${classMap({\n \"form-label\": true,\n required: this.required\n })}\n >\n <slot name=\"label\"></slot>\n </label>\n ${defaultSlot}\n <input\n type=\"text\"\n class=\"radio-group-validation-input ${classMap({\n \"is-invalid\": this.hasFeedback && this.invalid\n })}\"\n ?required=${this.required}\n tabindex=\"-1\"\n @invalid=${(e: Event) => this._handleInvalid(e)}\n />\n ${this.hasFeedback ? html`<div class=\"invalid-feedback\">${this.invalidFeedback}</div>` : \"\"}\n </fieldset>\n `;\n }\n}\n\nexport default SgdsRadioGroup;\n"],"names":["feedbackStyles","formLabelStyles","radioGroupStyles"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"sgds-radio-group.js","sources":["../../../src/components/Radio/sgds-radio-group.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property, query, queryAssignedElements, state } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { FormSubmitController } from \"../../utils/form\";\nimport { watch } from \"../../utils/watch\";\nimport radioGroupStyles from \"./radio-group.css\";\nimport SgdsRadio from \"./sgds-radio\";\nimport feedbackStyles from \"../../styles/feedback.css\";\nimport formLabelStyles from \"../../styles/form-label.css\";\n\n/**\n * @summary RadioGroup group multiple radios so they function as a single form control.\n *\n * @slot default - The default slot where sgds-radio are placed.\n *\n * @event sgds-change - Emitted when the radio group's selected value changes.\n *\n *\n */\nexport class SgdsRadioGroup extends SgdsElement {\n static styles = [...SgdsElement.styles, feedbackStyles, formLabelStyles, radioGroupStyles];\n /**@internal */\n protected readonly formSubmitController = new FormSubmitController(this, {\n defaultValue: (control: SgdsRadioGroup) => control.defaultValue\n });\n /**@internal */\n @query(\"slot:not([name])\") defaultSlot: HTMLSlotElement;\n /**@internal */\n @query(\".radio-group-validation-input\") input: HTMLInputElement;\n /**@internal */\n @state() defaultValue = \"\";\n /**@internal */\n @state() private customErrorMessage = \"\";\n /** This will be true when the control is in an invalid state. */\n @property({ type: Boolean, reflect: true }) invalid = false;\n\n /** The selected value of the control. */\n @property({ reflect: true }) value = \"\";\n\n /** The name assigned to the radio controls. */\n @property({ reflect: true }) name = \"option\";\n\n /** Ensures a child radio is checked before allowing the containing form to submit. */\n @property({ type: Boolean, reflect: true }) required = false;\n\n /**Feedback text for error state when validated */\n @property({ type: String, reflect: true }) invalidFeedback = \"\";\n /** Allows invalidFeedback, invalid and valid styles to be visible with the input */\n @property({ type: Boolean, reflect: true }) hasFeedback = false;\n\n @watch(\"value\", { waitUntilFirstUpdate: true })\n _handleValueChange() {\n this.emit(\"sgds-change\", { detail: { value: this.value } });\n this._updateCheckedRadio();\n }\n\n connectedCallback() {\n super.connectedCallback();\n this.defaultValue = this.value;\n }\n\n firstUpdated() {\n const radios = this._radios;\n radios.forEach((item, index) => {\n if (radios.length > 1) {\n switch (index) {\n case 0:\n item.setAttribute(\"first-of-type\", \"\");\n break;\n\n case radios.length - 1:\n item.setAttribute(\"last-of-type\", \"\");\n break;\n\n default:\n item.setAttribute(\"nth-of-type\", \"\");\n }\n }\n });\n }\n\n /** Gets and return the ValidityState object. */\n get validity(): ValidityState {\n const hasMissingData = !((this.value && this.required) || !this.required);\n const hasCustomError = this.customErrorMessage !== \"\";\n return {\n badInput: false,\n customError: hasCustomError,\n patternMismatch: false,\n rangeOverflow: false,\n rangeUnderflow: false,\n stepMismatch: false,\n tooLong: false,\n tooShort: false,\n typeMismatch: false,\n valid: hasMissingData ? false : true,\n valueMissing: !hasMissingData\n };\n }\n\n /** Checks for validity and shows the browser's validation message if the control is invalid. */\n public reportValidity(): boolean {\n const validity = this.validity;\n\n this.invalid = !validity.valid;\n\n if (!validity.valid) {\n this._showNativeErrorMessage();\n }\n\n return !this.invalid;\n }\n /**@internal */\n @queryAssignedElements()\n private _radios!: Array<SgdsRadio>;\n\n private _handleRadioClick(event: MouseEvent) {\n const target = event.target as SgdsRadio;\n\n if (target.disabled) {\n return;\n }\n\n this.value = target.value;\n const radios = this._radios;\n radios.forEach(radio => (radio.checked = radio === target));\n }\n\n private _handleKeyDown(event: KeyboardEvent) {\n if (![\"ArrowUp\", \"ArrowDown\", \"ArrowLeft\", \"ArrowRight\", \" \"].includes(event.key)) {\n return;\n }\n\n const radios = this._radios.filter(radio => !radio.disabled);\n const checkedRadio = radios.find(radio => radio.checked) ?? radios[0];\n //if eventkey is space, index increment is 0, if eventkey arrowup/arrowleft, index is -1, arrowright/arrowdown, index incr is 1\n const incr = event.key === \" \" ? 0 : [\"ArrowUp\", \"ArrowLeft\"].includes(event.key) ? -1 : 1;\n let index = radios.indexOf(checkedRadio) + incr;\n if (index < 0) {\n index = radios.length - 1;\n }\n if (index > radios.length - 1) {\n index = 0;\n }\n\n this._radios.forEach(radio => {\n radio.checked = false;\n radio.tabIndex = -1;\n });\n\n this.value = radios[index].value;\n radios[index].checked = true;\n radios[index].tabIndex = 0;\n radios[index].focus();\n\n event.preventDefault();\n }\n\n private _handleLabelClick() {\n const radios = this._radios;\n const checked = radios.find(radio => radio.checked);\n const radioToFocus = checked || radios[0];\n\n // Move focus to the checked radio (or the first one if none are checked) when clicking the label\n if (radioToFocus) {\n radioToFocus.focus();\n }\n }\n\n private _handleSlotChange() {\n const radios = this._radios;\n\n radios.forEach(radio => (radio.checked = radio.value === this.value));\n\n if (!radios.some(radio => radio.checked)) {\n if (radios[0]) radios[0].tabIndex = 0;\n }\n }\n\n private _handleInvalid(e: Event) {\n e.preventDefault();\n this.invalid = true;\n this._radios.forEach(radio => (radio.invalid = true));\n }\n\n private _showNativeErrorMessage() {\n this.input.reportValidity();\n }\n\n private _updateCheckedRadio() {\n const radios = this._radios;\n radios.forEach(radio => (radio.checked = radio.value === this.value));\n this.invalid = !this.validity.valid;\n this._radios.forEach(radio => (radio.invalid = this.invalid));\n }\n\n render() {\n const defaultSlot = html`\n <div>\n <slot\n @click=${this._handleRadioClick}\n @keydown=${this._handleKeyDown}\n @slotchange=${this._handleSlotChange}\n role=\"presentation\"\n ></slot>\n </div>\n `;\n return html`\n <fieldset name=${this.name}>\n <label\n @click=${this._handleLabelClick}\n class=${classMap({\n \"form-label\": true,\n required: this.required\n })}\n >\n <slot name=\"label\"></slot>\n </label>\n ${defaultSlot}\n <input\n type=\"text\"\n class=\"radio-group-validation-input ${classMap({\n \"is-invalid\": this.hasFeedback && this.invalid\n })}\"\n ?required=${this.required}\n tabindex=\"-1\"\n @invalid=${(e: Event) => this._handleInvalid(e)}\n />\n ${this.hasFeedback ? html`<div class=\"invalid-feedback\">${this.invalidFeedback}</div>` : \"\"}\n </fieldset>\n `;\n }\n}\n\nexport default SgdsRadioGroup;\n"],"names":["feedbackStyles","formLabelStyles","radioGroupStyles"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sgds-radio.cjs.js","sources":["../../../src/components/Radio/sgds-radio.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport genId from \"../../utils/generateId\";\nimport { watch } from \"../../utils/watch\";\nimport radioStyles from \"./radio.css\";\nimport formLabelStyles from \"../../styles/form-label.css\";\n/**\n * @summary Radio allows the user to select one option from a set while seeing all available options.\n *\n * @slot default - The label of the radio input\n *\n * @event sgds-focus - Emitted when the control gains focus.\n * @event sgds-blur - Emitted when the control loses focus.\n */\nexport class SgdsRadio extends SgdsElement {\n static styles = [...SgdsElement.styles, formLabelStyles, radioStyles];\n /**\n * Draws the radio in a checked state\n */\n @property({ type: Boolean, reflect: true }) checked = false;\n\n /** The radio's value attribute. */\n @property() value: string;\n\n /** Disables the radio. */\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n /** Aligns the radios horizontally */\n @property({ type: Boolean, reflect: true }) isInline = false;\n\n /** For aria-label */\n @property({ type: String, reflect: true }) ariaLabel = \"\";\n\n /**Feedback text for error state when validated */\n @property({ type: String, reflect: true }) invalidFeedback = \"\";\n /** Allows invalidFeedback, invalid and valid styles to be visible with the input */\n @property({ type: Boolean, reflect: true }) hasFeedback = false;\n /** Marks the radio input as invalid. Replace the pseudo :invalid selector for absent in custom elements */\n @property({ type: Boolean, reflect: true }) invalid = false;\n\n private radioId: string = genId(\"radio\");\n\n connectedCallback(): void {\n super.connectedCallback();\n this.setInitialAttributes();\n this.addEventListeners();\n }\n\n @watch(\"checked\")\n handleCheckedChange() {\n this.setAttribute(\"aria-checked\", this.checked ? \"true\" : \"false\");\n this.setAttribute(\"tabindex\", this.checked ? \"0\" : \"-1\");\n }\n\n @watch(\"disabled\", { waitUntilFirstUpdate: true })\n handleDisabledChange() {\n this.setAttribute(\"aria-disabled\", this.disabled ? \"true\" : \"false\");\n }\n\n private handleBlur() {\n this.emit(\"sgds-blur\");\n }\n\n private handleClick() {\n if (!this.disabled) {\n this.checked = true;\n }\n }\n\n private handleFocus() {\n this.emit(\"sgds-focus\");\n }\n\n private addEventListeners() {\n this.addEventListener(\"blur\", () => this.handleBlur());\n this.addEventListener(\"click\", () => this.handleClick());\n this.addEventListener(\"focus\", () => this.handleFocus());\n }\n\n private setInitialAttributes() {\n this.setAttribute(\"role\", \"radio\");\n this.setAttribute(\"tabindex\", \"-1\");\n this.setAttribute(\"aria-disabled\", this.disabled ? \"true\" : \"false\");\n }\n\n render() {\n return html`\n <div\n class=${classMap({\n \"form-check\": true,\n \"form-check-inline\": this.isInline\n })}\n tabindex=\"-1\"\n >\n <input\n class=${classMap({\n \"form-check-input\": true,\n \"is-invalid\": this.invalid\n })}\n type=\"radio\"\n id=${ifDefined(this.radioId)}\n value=${ifDefined(this.value)}\n ?checked=${this.checked}\n ?disabled=${this.disabled}\n aria-disabled=${this.disabled ? \"true\" : \"false\"}\n aria-checked=${this.checked ? \"true\" : \"false\"}\n @click=${this.handleClick}\n />\n <label for=\"${ifDefined(this.radioId)}\" aria-label=${ifDefined(this.ariaLabel)} class=\"form-check-label\"\n ><slot></slot\n ></label>\n </div>\n `;\n }\n}\n\nexport default SgdsRadio;\n"],"names":["SgdsElement","genId","html","classMap","ifDefined","formLabelStyles","radioStyles","__decorate","property","watch"],"mappings":"
|
|
1
|
+
{"version":3,"file":"sgds-radio.cjs.js","sources":["../../../src/components/Radio/sgds-radio.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport genId from \"../../utils/generateId\";\nimport { watch } from \"../../utils/watch\";\nimport radioStyles from \"./radio.css\";\nimport formLabelStyles from \"../../styles/form-label.css\";\n/**\n * @summary Radio allows the user to select one option from a set while seeing all available options.\n *\n * @slot default - The label of the radio input\n *\n * @event sgds-focus - Emitted when the control gains focus.\n * @event sgds-blur - Emitted when the control loses focus.\n */\nexport class SgdsRadio extends SgdsElement {\n static styles = [...SgdsElement.styles, formLabelStyles, radioStyles];\n /**\n * Draws the radio in a checked state\n */\n @property({ type: Boolean, reflect: true }) checked = false;\n\n /** The radio's value attribute. */\n @property() value: string;\n\n /** Disables the radio. */\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n /** Aligns the radios horizontally */\n @property({ type: Boolean, reflect: true }) isInline = false;\n\n /** For aria-label */\n @property({ type: String, reflect: true }) ariaLabel = \"\";\n\n /**Feedback text for error state when validated */\n @property({ type: String, reflect: true }) invalidFeedback = \"\";\n /** Allows invalidFeedback, invalid and valid styles to be visible with the input */\n @property({ type: Boolean, reflect: true }) hasFeedback = false;\n /** Marks the radio input as invalid. Replace the pseudo :invalid selector for absent in custom elements */\n @property({ type: Boolean, reflect: true }) invalid = false;\n\n private radioId: string = genId(\"radio\");\n\n connectedCallback(): void {\n super.connectedCallback();\n this.setInitialAttributes();\n this.addEventListeners();\n }\n\n @watch(\"checked\")\n handleCheckedChange() {\n this.setAttribute(\"aria-checked\", this.checked ? \"true\" : \"false\");\n this.setAttribute(\"tabindex\", this.checked ? \"0\" : \"-1\");\n }\n\n @watch(\"disabled\", { waitUntilFirstUpdate: true })\n handleDisabledChange() {\n this.setAttribute(\"aria-disabled\", this.disabled ? \"true\" : \"false\");\n }\n\n private handleBlur() {\n this.emit(\"sgds-blur\");\n }\n\n private handleClick() {\n if (!this.disabled) {\n this.checked = true;\n }\n }\n\n private handleFocus() {\n this.emit(\"sgds-focus\");\n }\n\n private addEventListeners() {\n this.addEventListener(\"blur\", () => this.handleBlur());\n this.addEventListener(\"click\", () => this.handleClick());\n this.addEventListener(\"focus\", () => this.handleFocus());\n }\n\n private setInitialAttributes() {\n this.setAttribute(\"role\", \"radio\");\n this.setAttribute(\"tabindex\", \"-1\");\n this.setAttribute(\"aria-disabled\", this.disabled ? \"true\" : \"false\");\n }\n\n render() {\n return html`\n <div\n class=${classMap({\n \"form-check\": true,\n \"form-check-inline\": this.isInline\n })}\n tabindex=\"-1\"\n >\n <input\n class=${classMap({\n \"form-check-input\": true,\n \"is-invalid\": this.invalid\n })}\n type=\"radio\"\n id=${ifDefined(this.radioId)}\n value=${ifDefined(this.value)}\n ?checked=${this.checked}\n ?disabled=${this.disabled}\n aria-disabled=${this.disabled ? \"true\" : \"false\"}\n aria-checked=${this.checked ? \"true\" : \"false\"}\n @click=${this.handleClick}\n />\n <label for=\"${ifDefined(this.radioId)}\" aria-label=${ifDefined(this.ariaLabel)} class=\"form-check-label\"\n ><slot></slot\n ></label>\n </div>\n `;\n }\n}\n\nexport default SgdsRadio;\n"],"names":["SgdsElement","genId","html","classMap","ifDefined","formLabelStyles","radioStyles","__decorate","property","watch"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sgds-radio.js","sources":["../../../src/components/Radio/sgds-radio.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport genId from \"../../utils/generateId\";\nimport { watch } from \"../../utils/watch\";\nimport radioStyles from \"./radio.css\";\nimport formLabelStyles from \"../../styles/form-label.css\";\n/**\n * @summary Radio allows the user to select one option from a set while seeing all available options.\n *\n * @slot default - The label of the radio input\n *\n * @event sgds-focus - Emitted when the control gains focus.\n * @event sgds-blur - Emitted when the control loses focus.\n */\nexport class SgdsRadio extends SgdsElement {\n static styles = [...SgdsElement.styles, formLabelStyles, radioStyles];\n /**\n * Draws the radio in a checked state\n */\n @property({ type: Boolean, reflect: true }) checked = false;\n\n /** The radio's value attribute. */\n @property() value: string;\n\n /** Disables the radio. */\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n /** Aligns the radios horizontally */\n @property({ type: Boolean, reflect: true }) isInline = false;\n\n /** For aria-label */\n @property({ type: String, reflect: true }) ariaLabel = \"\";\n\n /**Feedback text for error state when validated */\n @property({ type: String, reflect: true }) invalidFeedback = \"\";\n /** Allows invalidFeedback, invalid and valid styles to be visible with the input */\n @property({ type: Boolean, reflect: true }) hasFeedback = false;\n /** Marks the radio input as invalid. Replace the pseudo :invalid selector for absent in custom elements */\n @property({ type: Boolean, reflect: true }) invalid = false;\n\n private radioId: string = genId(\"radio\");\n\n connectedCallback(): void {\n super.connectedCallback();\n this.setInitialAttributes();\n this.addEventListeners();\n }\n\n @watch(\"checked\")\n handleCheckedChange() {\n this.setAttribute(\"aria-checked\", this.checked ? \"true\" : \"false\");\n this.setAttribute(\"tabindex\", this.checked ? \"0\" : \"-1\");\n }\n\n @watch(\"disabled\", { waitUntilFirstUpdate: true })\n handleDisabledChange() {\n this.setAttribute(\"aria-disabled\", this.disabled ? \"true\" : \"false\");\n }\n\n private handleBlur() {\n this.emit(\"sgds-blur\");\n }\n\n private handleClick() {\n if (!this.disabled) {\n this.checked = true;\n }\n }\n\n private handleFocus() {\n this.emit(\"sgds-focus\");\n }\n\n private addEventListeners() {\n this.addEventListener(\"blur\", () => this.handleBlur());\n this.addEventListener(\"click\", () => this.handleClick());\n this.addEventListener(\"focus\", () => this.handleFocus());\n }\n\n private setInitialAttributes() {\n this.setAttribute(\"role\", \"radio\");\n this.setAttribute(\"tabindex\", \"-1\");\n this.setAttribute(\"aria-disabled\", this.disabled ? \"true\" : \"false\");\n }\n\n render() {\n return html`\n <div\n class=${classMap({\n \"form-check\": true,\n \"form-check-inline\": this.isInline\n })}\n tabindex=\"-1\"\n >\n <input\n class=${classMap({\n \"form-check-input\": true,\n \"is-invalid\": this.invalid\n })}\n type=\"radio\"\n id=${ifDefined(this.radioId)}\n value=${ifDefined(this.value)}\n ?checked=${this.checked}\n ?disabled=${this.disabled}\n aria-disabled=${this.disabled ? \"true\" : \"false\"}\n aria-checked=${this.checked ? \"true\" : \"false\"}\n @click=${this.handleClick}\n />\n <label for=\"${ifDefined(this.radioId)}\" aria-label=${ifDefined(this.ariaLabel)} class=\"form-check-label\"\n ><slot></slot\n ></label>\n </div>\n `;\n }\n}\n\nexport default SgdsRadio;\n"],"names":["formLabelStyles","radioStyles"],"mappings":"
|
|
1
|
+
{"version":3,"file":"sgds-radio.js","sources":["../../../src/components/Radio/sgds-radio.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport genId from \"../../utils/generateId\";\nimport { watch } from \"../../utils/watch\";\nimport radioStyles from \"./radio.css\";\nimport formLabelStyles from \"../../styles/form-label.css\";\n/**\n * @summary Radio allows the user to select one option from a set while seeing all available options.\n *\n * @slot default - The label of the radio input\n *\n * @event sgds-focus - Emitted when the control gains focus.\n * @event sgds-blur - Emitted when the control loses focus.\n */\nexport class SgdsRadio extends SgdsElement {\n static styles = [...SgdsElement.styles, formLabelStyles, radioStyles];\n /**\n * Draws the radio in a checked state\n */\n @property({ type: Boolean, reflect: true }) checked = false;\n\n /** The radio's value attribute. */\n @property() value: string;\n\n /** Disables the radio. */\n @property({ type: Boolean, reflect: true }) disabled = false;\n\n /** Aligns the radios horizontally */\n @property({ type: Boolean, reflect: true }) isInline = false;\n\n /** For aria-label */\n @property({ type: String, reflect: true }) ariaLabel = \"\";\n\n /**Feedback text for error state when validated */\n @property({ type: String, reflect: true }) invalidFeedback = \"\";\n /** Allows invalidFeedback, invalid and valid styles to be visible with the input */\n @property({ type: Boolean, reflect: true }) hasFeedback = false;\n /** Marks the radio input as invalid. Replace the pseudo :invalid selector for absent in custom elements */\n @property({ type: Boolean, reflect: true }) invalid = false;\n\n private radioId: string = genId(\"radio\");\n\n connectedCallback(): void {\n super.connectedCallback();\n this.setInitialAttributes();\n this.addEventListeners();\n }\n\n @watch(\"checked\")\n handleCheckedChange() {\n this.setAttribute(\"aria-checked\", this.checked ? \"true\" : \"false\");\n this.setAttribute(\"tabindex\", this.checked ? \"0\" : \"-1\");\n }\n\n @watch(\"disabled\", { waitUntilFirstUpdate: true })\n handleDisabledChange() {\n this.setAttribute(\"aria-disabled\", this.disabled ? \"true\" : \"false\");\n }\n\n private handleBlur() {\n this.emit(\"sgds-blur\");\n }\n\n private handleClick() {\n if (!this.disabled) {\n this.checked = true;\n }\n }\n\n private handleFocus() {\n this.emit(\"sgds-focus\");\n }\n\n private addEventListeners() {\n this.addEventListener(\"blur\", () => this.handleBlur());\n this.addEventListener(\"click\", () => this.handleClick());\n this.addEventListener(\"focus\", () => this.handleFocus());\n }\n\n private setInitialAttributes() {\n this.setAttribute(\"role\", \"radio\");\n this.setAttribute(\"tabindex\", \"-1\");\n this.setAttribute(\"aria-disabled\", this.disabled ? \"true\" : \"false\");\n }\n\n render() {\n return html`\n <div\n class=${classMap({\n \"form-check\": true,\n \"form-check-inline\": this.isInline\n })}\n tabindex=\"-1\"\n >\n <input\n class=${classMap({\n \"form-check-input\": true,\n \"is-invalid\": this.invalid\n })}\n type=\"radio\"\n id=${ifDefined(this.radioId)}\n value=${ifDefined(this.value)}\n ?checked=${this.checked}\n ?disabled=${this.disabled}\n aria-disabled=${this.disabled ? \"true\" : \"false\"}\n aria-checked=${this.checked ? \"true\" : \"false\"}\n @click=${this.handleClick}\n />\n <label for=\"${ifDefined(this.radioId)}\" aria-label=${ifDefined(this.ariaLabel)} class=\"form-check-label\"\n ><slot></slot\n ></label>\n </div>\n `;\n }\n}\n\nexport default SgdsRadio;\n"],"names":["formLabelStyles","radioStyles"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sgds-sidenav-item.cjs.js","sources":["../../../src/components/Sidenav/sgds-sidenav-item.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property, query } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { animateTo, shimKeyframesHeightAuto, stopAnimations } from \"../../utils/animate\";\nimport { getAnimation, setDefaultAnimation } from \"../../utils/animation-registry\";\nimport { waitForEvent } from \"../../utils/event\";\nimport genId from \"../../utils/generateId\";\nimport { watch } from \"../../utils/watch\";\nimport sidenavItemStyle from \"./sidenav-item.css\";\n\n/**\n *\n * @event sgds-toggle - Emitted when the sidenav item's button is clicked.\n * @event sgds-show - Emitted on show.\n * @event sgds-after-show - Emitted on show after animation has completed.\n * @event sgds-hide - Emitted on hide.\n * @event sgds-after-hide - Emitted on hide after animation has completed.\n *\n * @slot default - default slot for SgdsSidenavLink element.\n * @slot title - title slot for the content of SgdsSidenavItem's button / anchor element.\n * @slot icon - icon slot for the content of SgdsSidenavItem's button / anchor element.\n * @slot caret-icon - The slot for the caret arrow icon of SgdsSidenavItem.\n *\n * @cssproperty --sidenav-item-button-border-left-width - sidenav item left border width\n * @cssproperty --sidenav-item-padding-x - sidenav item padding left and right\n * @cssproperty --sidenav-item-padding-y - sidenav item padding top and bottom\n * @cssproperty --sidenav-item-icon-title-gap - the flex gap between sidenav item icon and title\n */\n\nexport class SgdsSidenavItem extends SgdsElement {\n static styles = [...SgdsElement.styles, sidenavItemStyle];\n\n @query(\".sidenav-body\") body: HTMLElement;\n /** @internal */\n @query(\".sidenav-btn\") header: HTMLElement;\n /**\n * when true, toggles the sidenav-item to open on first load and set the active stylings.\n */\n @property({ type: Boolean })\n active = false;\n\n /**\n * When defined, converts SgdsSidenavItem from a button element to an Anchor element. In this case, only one level of navigation is allowed\n */\n @property({ type: String })\n href = \"\";\n\n /**\n * Disables the SgdsSidenavItem\n */\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /**\n * @internal Forwards to id attribute of div.collapse and aria-controls attribute of button in SgdsSidenavItem. By default, SgdsSidenavItem auto-generates a unique id. Override the default id by specifiying your own\n */\n\n private collapseId: string = genId(\"sidenav\", \"collapse\");\n\n /**\n * @internal Forwards to id attribute of button and aria-labelledby attribute of ul.sidenav-list in SgdsSidenavItem. By default, SgdsSidenavItem auto-generates a unique id. Override the default id by specifiying your own\n */\n private buttonId: string = genId(\"sidenav\", \"button\");\n\n /** @internal */\n private index = \"-1\";\n\n private _onToggle() {\n this.emit(\"sgds-toggle\", { detail: { index: this.index } });\n }\n\n private _onClickLink() {\n this._onToggle();\n this.active = true;\n }\n\n /** Shows the sidenav item. */\n public async show() {\n if (this.active) {\n return;\n }\n\n this.active = true;\n return waitForEvent(this, \"sgds-after-show\");\n }\n\n /** Hide the sidenav item */\n public async hide() {\n if (!this.active) {\n return;\n }\n this.active = false;\n return waitForEvent(this, \"sgds-after-hide\");\n }\n\n /**\n * @deprecated since 1.1. Will be removed in 2.0 and replaced by hide.\n * When invoked, closes the SgdsSidenavItem\n */\n public async closeItem() {\n return await this.hide();\n }\n /**\n * @deprecated since 1.1. Will be removed in 2.0 and replaced by show.\n * When invoked, opens the SgdsSidenavItem\n */\n public async openItem() {\n return await this.show();\n }\n\n firstUpdated() {\n if (!this.href) {\n this.body.hidden = !this.active;\n this.body.style.height = this.active ? \"auto\" : \"0\";\n }\n }\n private _handleSummaryClick() {\n if (this.active) {\n this.hide();\n } else {\n this.show();\n }\n\n this._onToggle();\n this.header.focus();\n }\n private _handleSummaryKeyDown(event: KeyboardEvent) {\n if (event.key === \"Enter\" || event.key === \" \") {\n event.preventDefault();\n\n if (this.active) {\n this.hide();\n } else {\n this.show();\n }\n }\n\n if (event.key === \"ArrowUp\" || event.key === \"ArrowLeft\") {\n event.preventDefault();\n this.hide();\n }\n\n if (event.key === \"ArrowDown\" || event.key === \"ArrowRight\") {\n event.preventDefault();\n this.show();\n }\n }\n\n @watch(\"active\", { waitUntilFirstUpdate: true })\n async handleOpenChange() {\n if (this.href) return;\n if (this.active) {\n // Show\n const sgdsShow = this.emit(\"sgds-show\", { cancelable: true });\n if (sgdsShow.defaultPrevented) {\n this.active = false;\n return;\n }\n\n await stopAnimations(this.body);\n this.body.hidden = false;\n\n const { keyframes, options } = getAnimation(this, \"sidenav.show\");\n await animateTo(this.body, shimKeyframesHeightAuto(keyframes, this.body.scrollHeight), options);\n this.body.style.height = \"auto\";\n\n this.emit(\"sgds-after-show\");\n } else {\n // Hide\n const sgdsHide = this.emit(\"sgds-hide\", { cancelable: true });\n if (sgdsHide.defaultPrevented) {\n this.active = true;\n return;\n }\n\n await stopAnimations(this.body);\n\n const { keyframes, options } = getAnimation(this, \"sidenav.hide\");\n await animateTo(this.body, shimKeyframesHeightAuto(keyframes, this.body.scrollHeight), options);\n this.body.hidden = true;\n this.body.style.height = \"auto\";\n\n this.emit(\"sgds-after-hide\");\n }\n }\n\n render() {\n const withMenuTemplate = html` <button\n @click=${this._handleSummaryClick}\n @keydown=${this._handleSummaryKeyDown}\n class=\"sidenav-btn ${classMap({\n disabled: this.disabled,\n active: this.active\n })} \"\n aria-expanded=\"${this.active}\"\n aria-controls=\"${this.collapseId}\"\n aria-current=\"${this.active}\"\n id=\"${this.buttonId}\"\n ?disabled=${this.disabled}\n aria-disabled=${this.disabled ? \"true\" : \"false\"}\n >\n <slot name=\"icon\"></slot>\n <slot name=\"title\"></slot>\n <slot name=\"caret-icon\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n fill=\"currentColor\"\n class=\"bi bi-chevron-down\"\n viewBox=\"0 0 16 16\"\n >\n <path\n fill-rule=\"evenodd\"\n d=\"M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z\"\n />\n </svg>\n </slot>\n </button>\n <div class=\"sidenav-body\" id=\"${this.collapseId}\">\n <div class=\"sidenav-list\" aria-labelledby=\"${this.buttonId}\">\n <slot></slot>\n </div>\n </div>`;\n\n const noMenuTemplate = html`\n <a\n href=${this.href}\n @click=${() => this._onClickLink()}\n class=\"sidenav-btn ${classMap({\n disabled: this.disabled,\n active: this.active\n })} \"\n aria-current=\"${this.active}\"\n ?disabled=${this.disabled}\n aria-disabled=${this.disabled ? \"true\" : \"false\"}\n >\n <slot name=\"icon\"></slot>\n <slot name=\"title\"></slot>\n </a>\n `;\n return html`\n <div class=\"sidenav-item\" aria-haspopup=\"${!this.href}\">${this.href ? noMenuTemplate : withMenuTemplate}</div>\n `;\n }\n}\nsetDefaultAnimation(\"sidenav.show\", {\n keyframes: [\n { height: \"0\", opacity: \"0\" },\n { height: \"auto\", opacity: \"1\" }\n ],\n options: { duration: 200, easing: \"ease-in-out\" }\n});\n\nsetDefaultAnimation(\"sidenav.hide\", {\n keyframes: [\n { height: \"auto\", opacity: \"1\" },\n { height: \"0\", opacity: \"0\" }\n ],\n options: { duration: 200, easing: \"ease-in-out\" }\n});\nexport default SgdsSidenavItem;\n"],"names":["SgdsElement","genId","waitForEvent","stopAnimations","getAnimation","animateTo","shimKeyframesHeightAuto","html","classMap","sidenavItemStyle","__decorate","query","property","watch","setDefaultAnimation"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"sgds-sidenav-item.cjs.js","sources":["../../../src/components/Sidenav/sgds-sidenav-item.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property, query } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { animateTo, shimKeyframesHeightAuto, stopAnimations } from \"../../utils/animate\";\nimport { getAnimation, setDefaultAnimation } from \"../../utils/animation-registry\";\nimport { waitForEvent } from \"../../utils/event\";\nimport genId from \"../../utils/generateId\";\nimport { watch } from \"../../utils/watch\";\nimport sidenavItemStyle from \"./sidenav-item.css\";\n\n/**\n *\n * @event sgds-toggle - Emitted when the sidenav item's button is clicked.\n * @event sgds-show - Emitted on show.\n * @event sgds-after-show - Emitted on show after animation has completed.\n * @event sgds-hide - Emitted on hide.\n * @event sgds-after-hide - Emitted on hide after animation has completed.\n *\n * @slot default - default slot for SgdsSidenavLink element.\n * @slot title - title slot for the content of SgdsSidenavItem's button / anchor element.\n * @slot icon - icon slot for the content of SgdsSidenavItem's button / anchor element.\n * @slot caret-icon - The slot for the caret arrow icon of SgdsSidenavItem.\n *\n * @cssproperty --sidenav-item-button-border-left-width - sidenav item left border width\n * @cssproperty --sidenav-item-padding-x - sidenav item padding left and right\n * @cssproperty --sidenav-item-padding-y - sidenav item padding top and bottom\n * @cssproperty --sidenav-item-icon-title-gap - the flex gap between sidenav item icon and title\n */\n\nexport class SgdsSidenavItem extends SgdsElement {\n static styles = [...SgdsElement.styles, sidenavItemStyle];\n\n @query(\".sidenav-body\") body: HTMLElement;\n /** @internal */\n @query(\".sidenav-btn\") header: HTMLElement;\n /**\n * when true, toggles the sidenav-item to open on first load and set the active stylings.\n */\n @property({ type: Boolean })\n active = false;\n\n /**\n * When defined, converts SgdsSidenavItem from a button element to an Anchor element. In this case, only one level of navigation is allowed\n */\n @property({ type: String })\n href = \"\";\n\n /**\n * Disables the SgdsSidenavItem\n */\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /**\n * @internal Forwards to id attribute of div.collapse and aria-controls attribute of button in SgdsSidenavItem. By default, SgdsSidenavItem auto-generates a unique id. Override the default id by specifiying your own\n */\n\n private collapseId: string = genId(\"sidenav\", \"collapse\");\n\n /**\n * @internal Forwards to id attribute of button and aria-labelledby attribute of ul.sidenav-list in SgdsSidenavItem. By default, SgdsSidenavItem auto-generates a unique id. Override the default id by specifiying your own\n */\n private buttonId: string = genId(\"sidenav\", \"button\");\n\n /** @internal */\n private index = \"-1\";\n\n private _onToggle() {\n this.emit(\"sgds-toggle\", { detail: { index: this.index } });\n }\n\n private _onClickLink() {\n this._onToggle();\n this.active = true;\n }\n\n /** Shows the sidenav item. */\n public async show() {\n if (this.active) {\n return;\n }\n\n this.active = true;\n return waitForEvent(this, \"sgds-after-show\");\n }\n\n /** Hide the sidenav item */\n public async hide() {\n if (!this.active) {\n return;\n }\n this.active = false;\n return waitForEvent(this, \"sgds-after-hide\");\n }\n\n /**\n * @deprecated since 1.1. Will be removed in 2.0 and replaced by hide.\n * When invoked, closes the SgdsSidenavItem\n */\n public async closeItem() {\n return await this.hide();\n }\n /**\n * @deprecated since 1.1. Will be removed in 2.0 and replaced by show.\n * When invoked, opens the SgdsSidenavItem\n */\n public async openItem() {\n return await this.show();\n }\n\n firstUpdated() {\n if (!this.href) {\n this.body.hidden = !this.active;\n this.body.style.height = this.active ? \"auto\" : \"0\";\n }\n }\n private _handleSummaryClick() {\n if (this.active) {\n this.hide();\n } else {\n this.show();\n }\n\n this._onToggle();\n this.header.focus();\n }\n private _handleSummaryKeyDown(event: KeyboardEvent) {\n if (event.key === \"Enter\" || event.key === \" \") {\n event.preventDefault();\n\n if (this.active) {\n this.hide();\n } else {\n this.show();\n }\n }\n\n if (event.key === \"ArrowUp\" || event.key === \"ArrowLeft\") {\n event.preventDefault();\n this.hide();\n }\n\n if (event.key === \"ArrowDown\" || event.key === \"ArrowRight\") {\n event.preventDefault();\n this.show();\n }\n }\n\n @watch(\"active\", { waitUntilFirstUpdate: true })\n async handleOpenChange() {\n if (this.href) return;\n if (this.active) {\n // Show\n const sgdsShow = this.emit(\"sgds-show\", { cancelable: true });\n if (sgdsShow.defaultPrevented) {\n this.active = false;\n return;\n }\n\n await stopAnimations(this.body);\n this.body.hidden = false;\n\n const { keyframes, options } = getAnimation(this, \"sidenav.show\");\n await animateTo(this.body, shimKeyframesHeightAuto(keyframes, this.body.scrollHeight), options);\n this.body.style.height = \"auto\";\n\n this.emit(\"sgds-after-show\");\n } else {\n // Hide\n const sgdsHide = this.emit(\"sgds-hide\", { cancelable: true });\n if (sgdsHide.defaultPrevented) {\n this.active = true;\n return;\n }\n\n await stopAnimations(this.body);\n\n const { keyframes, options } = getAnimation(this, \"sidenav.hide\");\n await animateTo(this.body, shimKeyframesHeightAuto(keyframes, this.body.scrollHeight), options);\n this.body.hidden = true;\n this.body.style.height = \"auto\";\n\n this.emit(\"sgds-after-hide\");\n }\n }\n\n render() {\n const withMenuTemplate = html` <button\n @click=${this._handleSummaryClick}\n @keydown=${this._handleSummaryKeyDown}\n class=\"sidenav-btn ${classMap({\n disabled: this.disabled,\n active: this.active\n })} \"\n aria-expanded=\"${this.active}\"\n aria-controls=\"${this.collapseId}\"\n aria-current=\"${this.active}\"\n id=\"${this.buttonId}\"\n ?disabled=${this.disabled}\n aria-disabled=${this.disabled ? \"true\" : \"false\"}\n >\n <slot name=\"icon\"></slot>\n <slot name=\"title\"></slot>\n <slot name=\"caret-icon\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n fill=\"currentColor\"\n class=\"bi bi-chevron-down\"\n viewBox=\"0 0 16 16\"\n >\n <path\n fill-rule=\"evenodd\"\n d=\"M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z\"\n />\n </svg>\n </slot>\n </button>\n <div class=\"sidenav-body\" id=\"${this.collapseId}\">\n <div class=\"sidenav-list\" aria-labelledby=\"${this.buttonId}\">\n <slot></slot>\n </div>\n </div>`;\n\n const noMenuTemplate = html`\n <a\n href=${this.href}\n @click=${() => this._onClickLink()}\n class=\"sidenav-btn ${classMap({\n disabled: this.disabled,\n active: this.active\n })} \"\n aria-current=\"${this.active}\"\n ?disabled=${this.disabled}\n aria-disabled=${this.disabled ? \"true\" : \"false\"}\n >\n <slot name=\"icon\"></slot>\n <slot name=\"title\"></slot>\n </a>\n `;\n return html`\n <div class=\"sidenav-item\" aria-haspopup=\"${!this.href}\">${this.href ? noMenuTemplate : withMenuTemplate}</div>\n `;\n }\n}\nsetDefaultAnimation(\"sidenav.show\", {\n keyframes: [\n { height: \"0\", opacity: \"0\" },\n { height: \"auto\", opacity: \"1\" }\n ],\n options: { duration: 200, easing: \"ease-in-out\" }\n});\n\nsetDefaultAnimation(\"sidenav.hide\", {\n keyframes: [\n { height: \"auto\", opacity: \"1\" },\n { height: \"0\", opacity: \"0\" }\n ],\n options: { duration: 200, easing: \"ease-in-out\" }\n});\nexport default SgdsSidenavItem;\n"],"names":["SgdsElement","genId","waitForEvent","stopAnimations","getAnimation","animateTo","shimKeyframesHeightAuto","html","classMap","sidenavItemStyle","__decorate","query","property","watch","setDefaultAnimation"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sgds-sidenav-item.js","sources":["../../../src/components/Sidenav/sgds-sidenav-item.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property, query } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { animateTo, shimKeyframesHeightAuto, stopAnimations } from \"../../utils/animate\";\nimport { getAnimation, setDefaultAnimation } from \"../../utils/animation-registry\";\nimport { waitForEvent } from \"../../utils/event\";\nimport genId from \"../../utils/generateId\";\nimport { watch } from \"../../utils/watch\";\nimport sidenavItemStyle from \"./sidenav-item.css\";\n\n/**\n *\n * @event sgds-toggle - Emitted when the sidenav item's button is clicked.\n * @event sgds-show - Emitted on show.\n * @event sgds-after-show - Emitted on show after animation has completed.\n * @event sgds-hide - Emitted on hide.\n * @event sgds-after-hide - Emitted on hide after animation has completed.\n *\n * @slot default - default slot for SgdsSidenavLink element.\n * @slot title - title slot for the content of SgdsSidenavItem's button / anchor element.\n * @slot icon - icon slot for the content of SgdsSidenavItem's button / anchor element.\n * @slot caret-icon - The slot for the caret arrow icon of SgdsSidenavItem.\n *\n * @cssproperty --sidenav-item-button-border-left-width - sidenav item left border width\n * @cssproperty --sidenav-item-padding-x - sidenav item padding left and right\n * @cssproperty --sidenav-item-padding-y - sidenav item padding top and bottom\n * @cssproperty --sidenav-item-icon-title-gap - the flex gap between sidenav item icon and title\n */\n\nexport class SgdsSidenavItem extends SgdsElement {\n static styles = [...SgdsElement.styles, sidenavItemStyle];\n\n @query(\".sidenav-body\") body: HTMLElement;\n /** @internal */\n @query(\".sidenav-btn\") header: HTMLElement;\n /**\n * when true, toggles the sidenav-item to open on first load and set the active stylings.\n */\n @property({ type: Boolean })\n active = false;\n\n /**\n * When defined, converts SgdsSidenavItem from a button element to an Anchor element. In this case, only one level of navigation is allowed\n */\n @property({ type: String })\n href = \"\";\n\n /**\n * Disables the SgdsSidenavItem\n */\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /**\n * @internal Forwards to id attribute of div.collapse and aria-controls attribute of button in SgdsSidenavItem. By default, SgdsSidenavItem auto-generates a unique id. Override the default id by specifiying your own\n */\n\n private collapseId: string = genId(\"sidenav\", \"collapse\");\n\n /**\n * @internal Forwards to id attribute of button and aria-labelledby attribute of ul.sidenav-list in SgdsSidenavItem. By default, SgdsSidenavItem auto-generates a unique id. Override the default id by specifiying your own\n */\n private buttonId: string = genId(\"sidenav\", \"button\");\n\n /** @internal */\n private index = \"-1\";\n\n private _onToggle() {\n this.emit(\"sgds-toggle\", { detail: { index: this.index } });\n }\n\n private _onClickLink() {\n this._onToggle();\n this.active = true;\n }\n\n /** Shows the sidenav item. */\n public async show() {\n if (this.active) {\n return;\n }\n\n this.active = true;\n return waitForEvent(this, \"sgds-after-show\");\n }\n\n /** Hide the sidenav item */\n public async hide() {\n if (!this.active) {\n return;\n }\n this.active = false;\n return waitForEvent(this, \"sgds-after-hide\");\n }\n\n /**\n * @deprecated since 1.1. Will be removed in 2.0 and replaced by hide.\n * When invoked, closes the SgdsSidenavItem\n */\n public async closeItem() {\n return await this.hide();\n }\n /**\n * @deprecated since 1.1. Will be removed in 2.0 and replaced by show.\n * When invoked, opens the SgdsSidenavItem\n */\n public async openItem() {\n return await this.show();\n }\n\n firstUpdated() {\n if (!this.href) {\n this.body.hidden = !this.active;\n this.body.style.height = this.active ? \"auto\" : \"0\";\n }\n }\n private _handleSummaryClick() {\n if (this.active) {\n this.hide();\n } else {\n this.show();\n }\n\n this._onToggle();\n this.header.focus();\n }\n private _handleSummaryKeyDown(event: KeyboardEvent) {\n if (event.key === \"Enter\" || event.key === \" \") {\n event.preventDefault();\n\n if (this.active) {\n this.hide();\n } else {\n this.show();\n }\n }\n\n if (event.key === \"ArrowUp\" || event.key === \"ArrowLeft\") {\n event.preventDefault();\n this.hide();\n }\n\n if (event.key === \"ArrowDown\" || event.key === \"ArrowRight\") {\n event.preventDefault();\n this.show();\n }\n }\n\n @watch(\"active\", { waitUntilFirstUpdate: true })\n async handleOpenChange() {\n if (this.href) return;\n if (this.active) {\n // Show\n const sgdsShow = this.emit(\"sgds-show\", { cancelable: true });\n if (sgdsShow.defaultPrevented) {\n this.active = false;\n return;\n }\n\n await stopAnimations(this.body);\n this.body.hidden = false;\n\n const { keyframes, options } = getAnimation(this, \"sidenav.show\");\n await animateTo(this.body, shimKeyframesHeightAuto(keyframes, this.body.scrollHeight), options);\n this.body.style.height = \"auto\";\n\n this.emit(\"sgds-after-show\");\n } else {\n // Hide\n const sgdsHide = this.emit(\"sgds-hide\", { cancelable: true });\n if (sgdsHide.defaultPrevented) {\n this.active = true;\n return;\n }\n\n await stopAnimations(this.body);\n\n const { keyframes, options } = getAnimation(this, \"sidenav.hide\");\n await animateTo(this.body, shimKeyframesHeightAuto(keyframes, this.body.scrollHeight), options);\n this.body.hidden = true;\n this.body.style.height = \"auto\";\n\n this.emit(\"sgds-after-hide\");\n }\n }\n\n render() {\n const withMenuTemplate = html` <button\n @click=${this._handleSummaryClick}\n @keydown=${this._handleSummaryKeyDown}\n class=\"sidenav-btn ${classMap({\n disabled: this.disabled,\n active: this.active\n })} \"\n aria-expanded=\"${this.active}\"\n aria-controls=\"${this.collapseId}\"\n aria-current=\"${this.active}\"\n id=\"${this.buttonId}\"\n ?disabled=${this.disabled}\n aria-disabled=${this.disabled ? \"true\" : \"false\"}\n >\n <slot name=\"icon\"></slot>\n <slot name=\"title\"></slot>\n <slot name=\"caret-icon\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n fill=\"currentColor\"\n class=\"bi bi-chevron-down\"\n viewBox=\"0 0 16 16\"\n >\n <path\n fill-rule=\"evenodd\"\n d=\"M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z\"\n />\n </svg>\n </slot>\n </button>\n <div class=\"sidenav-body\" id=\"${this.collapseId}\">\n <div class=\"sidenav-list\" aria-labelledby=\"${this.buttonId}\">\n <slot></slot>\n </div>\n </div>`;\n\n const noMenuTemplate = html`\n <a\n href=${this.href}\n @click=${() => this._onClickLink()}\n class=\"sidenav-btn ${classMap({\n disabled: this.disabled,\n active: this.active\n })} \"\n aria-current=\"${this.active}\"\n ?disabled=${this.disabled}\n aria-disabled=${this.disabled ? \"true\" : \"false\"}\n >\n <slot name=\"icon\"></slot>\n <slot name=\"title\"></slot>\n </a>\n `;\n return html`\n <div class=\"sidenav-item\" aria-haspopup=\"${!this.href}\">${this.href ? noMenuTemplate : withMenuTemplate}</div>\n `;\n }\n}\nsetDefaultAnimation(\"sidenav.show\", {\n keyframes: [\n { height: \"0\", opacity: \"0\" },\n { height: \"auto\", opacity: \"1\" }\n ],\n options: { duration: 200, easing: \"ease-in-out\" }\n});\n\nsetDefaultAnimation(\"sidenav.hide\", {\n keyframes: [\n { height: \"auto\", opacity: \"1\" },\n { height: \"0\", opacity: \"0\" }\n ],\n options: { duration: 200, easing: \"ease-in-out\" }\n});\nexport default SgdsSidenavItem;\n"],"names":["sidenavItemStyle"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"sgds-sidenav-item.js","sources":["../../../src/components/Sidenav/sgds-sidenav-item.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property, query } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport { animateTo, shimKeyframesHeightAuto, stopAnimations } from \"../../utils/animate\";\nimport { getAnimation, setDefaultAnimation } from \"../../utils/animation-registry\";\nimport { waitForEvent } from \"../../utils/event\";\nimport genId from \"../../utils/generateId\";\nimport { watch } from \"../../utils/watch\";\nimport sidenavItemStyle from \"./sidenav-item.css\";\n\n/**\n *\n * @event sgds-toggle - Emitted when the sidenav item's button is clicked.\n * @event sgds-show - Emitted on show.\n * @event sgds-after-show - Emitted on show after animation has completed.\n * @event sgds-hide - Emitted on hide.\n * @event sgds-after-hide - Emitted on hide after animation has completed.\n *\n * @slot default - default slot for SgdsSidenavLink element.\n * @slot title - title slot for the content of SgdsSidenavItem's button / anchor element.\n * @slot icon - icon slot for the content of SgdsSidenavItem's button / anchor element.\n * @slot caret-icon - The slot for the caret arrow icon of SgdsSidenavItem.\n *\n * @cssproperty --sidenav-item-button-border-left-width - sidenav item left border width\n * @cssproperty --sidenav-item-padding-x - sidenav item padding left and right\n * @cssproperty --sidenav-item-padding-y - sidenav item padding top and bottom\n * @cssproperty --sidenav-item-icon-title-gap - the flex gap between sidenav item icon and title\n */\n\nexport class SgdsSidenavItem extends SgdsElement {\n static styles = [...SgdsElement.styles, sidenavItemStyle];\n\n @query(\".sidenav-body\") body: HTMLElement;\n /** @internal */\n @query(\".sidenav-btn\") header: HTMLElement;\n /**\n * when true, toggles the sidenav-item to open on first load and set the active stylings.\n */\n @property({ type: Boolean })\n active = false;\n\n /**\n * When defined, converts SgdsSidenavItem from a button element to an Anchor element. In this case, only one level of navigation is allowed\n */\n @property({ type: String })\n href = \"\";\n\n /**\n * Disables the SgdsSidenavItem\n */\n @property({ type: Boolean, reflect: true })\n disabled = false;\n\n /**\n * @internal Forwards to id attribute of div.collapse and aria-controls attribute of button in SgdsSidenavItem. By default, SgdsSidenavItem auto-generates a unique id. Override the default id by specifiying your own\n */\n\n private collapseId: string = genId(\"sidenav\", \"collapse\");\n\n /**\n * @internal Forwards to id attribute of button and aria-labelledby attribute of ul.sidenav-list in SgdsSidenavItem. By default, SgdsSidenavItem auto-generates a unique id. Override the default id by specifiying your own\n */\n private buttonId: string = genId(\"sidenav\", \"button\");\n\n /** @internal */\n private index = \"-1\";\n\n private _onToggle() {\n this.emit(\"sgds-toggle\", { detail: { index: this.index } });\n }\n\n private _onClickLink() {\n this._onToggle();\n this.active = true;\n }\n\n /** Shows the sidenav item. */\n public async show() {\n if (this.active) {\n return;\n }\n\n this.active = true;\n return waitForEvent(this, \"sgds-after-show\");\n }\n\n /** Hide the sidenav item */\n public async hide() {\n if (!this.active) {\n return;\n }\n this.active = false;\n return waitForEvent(this, \"sgds-after-hide\");\n }\n\n /**\n * @deprecated since 1.1. Will be removed in 2.0 and replaced by hide.\n * When invoked, closes the SgdsSidenavItem\n */\n public async closeItem() {\n return await this.hide();\n }\n /**\n * @deprecated since 1.1. Will be removed in 2.0 and replaced by show.\n * When invoked, opens the SgdsSidenavItem\n */\n public async openItem() {\n return await this.show();\n }\n\n firstUpdated() {\n if (!this.href) {\n this.body.hidden = !this.active;\n this.body.style.height = this.active ? \"auto\" : \"0\";\n }\n }\n private _handleSummaryClick() {\n if (this.active) {\n this.hide();\n } else {\n this.show();\n }\n\n this._onToggle();\n this.header.focus();\n }\n private _handleSummaryKeyDown(event: KeyboardEvent) {\n if (event.key === \"Enter\" || event.key === \" \") {\n event.preventDefault();\n\n if (this.active) {\n this.hide();\n } else {\n this.show();\n }\n }\n\n if (event.key === \"ArrowUp\" || event.key === \"ArrowLeft\") {\n event.preventDefault();\n this.hide();\n }\n\n if (event.key === \"ArrowDown\" || event.key === \"ArrowRight\") {\n event.preventDefault();\n this.show();\n }\n }\n\n @watch(\"active\", { waitUntilFirstUpdate: true })\n async handleOpenChange() {\n if (this.href) return;\n if (this.active) {\n // Show\n const sgdsShow = this.emit(\"sgds-show\", { cancelable: true });\n if (sgdsShow.defaultPrevented) {\n this.active = false;\n return;\n }\n\n await stopAnimations(this.body);\n this.body.hidden = false;\n\n const { keyframes, options } = getAnimation(this, \"sidenav.show\");\n await animateTo(this.body, shimKeyframesHeightAuto(keyframes, this.body.scrollHeight), options);\n this.body.style.height = \"auto\";\n\n this.emit(\"sgds-after-show\");\n } else {\n // Hide\n const sgdsHide = this.emit(\"sgds-hide\", { cancelable: true });\n if (sgdsHide.defaultPrevented) {\n this.active = true;\n return;\n }\n\n await stopAnimations(this.body);\n\n const { keyframes, options } = getAnimation(this, \"sidenav.hide\");\n await animateTo(this.body, shimKeyframesHeightAuto(keyframes, this.body.scrollHeight), options);\n this.body.hidden = true;\n this.body.style.height = \"auto\";\n\n this.emit(\"sgds-after-hide\");\n }\n }\n\n render() {\n const withMenuTemplate = html` <button\n @click=${this._handleSummaryClick}\n @keydown=${this._handleSummaryKeyDown}\n class=\"sidenav-btn ${classMap({\n disabled: this.disabled,\n active: this.active\n })} \"\n aria-expanded=\"${this.active}\"\n aria-controls=\"${this.collapseId}\"\n aria-current=\"${this.active}\"\n id=\"${this.buttonId}\"\n ?disabled=${this.disabled}\n aria-disabled=${this.disabled ? \"true\" : \"false\"}\n >\n <slot name=\"icon\"></slot>\n <slot name=\"title\"></slot>\n <slot name=\"caret-icon\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"16\"\n height=\"16\"\n fill=\"currentColor\"\n class=\"bi bi-chevron-down\"\n viewBox=\"0 0 16 16\"\n >\n <path\n fill-rule=\"evenodd\"\n d=\"M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z\"\n />\n </svg>\n </slot>\n </button>\n <div class=\"sidenav-body\" id=\"${this.collapseId}\">\n <div class=\"sidenav-list\" aria-labelledby=\"${this.buttonId}\">\n <slot></slot>\n </div>\n </div>`;\n\n const noMenuTemplate = html`\n <a\n href=${this.href}\n @click=${() => this._onClickLink()}\n class=\"sidenav-btn ${classMap({\n disabled: this.disabled,\n active: this.active\n })} \"\n aria-current=\"${this.active}\"\n ?disabled=${this.disabled}\n aria-disabled=${this.disabled ? \"true\" : \"false\"}\n >\n <slot name=\"icon\"></slot>\n <slot name=\"title\"></slot>\n </a>\n `;\n return html`\n <div class=\"sidenav-item\" aria-haspopup=\"${!this.href}\">${this.href ? noMenuTemplate : withMenuTemplate}</div>\n `;\n }\n}\nsetDefaultAnimation(\"sidenav.show\", {\n keyframes: [\n { height: \"0\", opacity: \"0\" },\n { height: \"auto\", opacity: \"1\" }\n ],\n options: { duration: 200, easing: \"ease-in-out\" }\n});\n\nsetDefaultAnimation(\"sidenav.hide\", {\n keyframes: [\n { height: \"auto\", opacity: \"1\" },\n { height: \"0\", opacity: \"0\" }\n ],\n options: { duration: 200, easing: \"ease-in-out\" }\n});\nexport default SgdsSidenavItem;\n"],"names":["sidenavItemStyle"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sgds-sidenav-link.cjs.js","sources":["../../../src/components/Sidenav/sgds-sidenav-link.ts"],"sourcesContent":["import LinkElement from \"../../base/link-element\";\nimport sidenavLinkStyle from \"./sidenav-link.css\";\n\n/**\n * @slot default - slot for label of anchor tag.\n *\n * @cssproperty --sidenav-link-font-size - sidenav link font size, default to `--sgds-body-font-size`\n * @cssproperty --sidenav-link-padding-x - sidenav link padding left and right\n * @cssproperty --sidenav-link-padding-y - sidenav link padding top and bottom\n * @cssproperty --sidenav-link-disabled-color - sidenav link disabled color, default to `--sgds-gray-600`\n */\nexport class SgdsSidenavLink extends LinkElement {\n static styles = [...LinkElement.styles, sidenavLinkStyle];\n}\n\nexport default SgdsSidenavLink;\n"],"names":["LinkElement","sidenavLinkStyle"],"mappings":"
|
|
1
|
+
{"version":3,"file":"sgds-sidenav-link.cjs.js","sources":["../../../src/components/Sidenav/sgds-sidenav-link.ts"],"sourcesContent":["import LinkElement from \"../../base/link-element\";\nimport sidenavLinkStyle from \"./sidenav-link.css\";\n\n/**\n * @slot default - slot for label of anchor tag.\n *\n * @cssproperty --sidenav-link-font-size - sidenav link font size, default to `--sgds-body-font-size`\n * @cssproperty --sidenav-link-padding-x - sidenav link padding left and right\n * @cssproperty --sidenav-link-padding-y - sidenav link padding top and bottom\n * @cssproperty --sidenav-link-disabled-color - sidenav link disabled color, default to `--sgds-gray-600`\n */\nexport class SgdsSidenavLink extends LinkElement {\n static styles = [...LinkElement.styles, sidenavLinkStyle];\n}\n\nexport default SgdsSidenavLink;\n"],"names":["LinkElement","sidenavLinkStyle"],"mappings":";;;;;;;;AAGA;;;;;;;AAOG;AACG,MAAO,eAAgB,SAAQA,sBAAW,CAAA;;AACvC,eAAM,CAAA,MAAA,GAAG,CAAC,GAAGA,sBAAW,CAAC,MAAM,EAAEC,sBAAgB,CAAC;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sgds-sidenav-link.js","sources":["../../../src/components/Sidenav/sgds-sidenav-link.ts"],"sourcesContent":["import LinkElement from \"../../base/link-element\";\nimport sidenavLinkStyle from \"./sidenav-link.css\";\n\n/**\n * @slot default - slot for label of anchor tag.\n *\n * @cssproperty --sidenav-link-font-size - sidenav link font size, default to `--sgds-body-font-size`\n * @cssproperty --sidenav-link-padding-x - sidenav link padding left and right\n * @cssproperty --sidenav-link-padding-y - sidenav link padding top and bottom\n * @cssproperty --sidenav-link-disabled-color - sidenav link disabled color, default to `--sgds-gray-600`\n */\nexport class SgdsSidenavLink extends LinkElement {\n static styles = [...LinkElement.styles, sidenavLinkStyle];\n}\n\nexport default SgdsSidenavLink;\n"],"names":["sidenavLinkStyle"],"mappings":"
|
|
1
|
+
{"version":3,"file":"sgds-sidenav-link.js","sources":["../../../src/components/Sidenav/sgds-sidenav-link.ts"],"sourcesContent":["import LinkElement from \"../../base/link-element\";\nimport sidenavLinkStyle from \"./sidenav-link.css\";\n\n/**\n * @slot default - slot for label of anchor tag.\n *\n * @cssproperty --sidenav-link-font-size - sidenav link font size, default to `--sgds-body-font-size`\n * @cssproperty --sidenav-link-padding-x - sidenav link padding left and right\n * @cssproperty --sidenav-link-padding-y - sidenav link padding top and bottom\n * @cssproperty --sidenav-link-disabled-color - sidenav link disabled color, default to `--sgds-gray-600`\n */\nexport class SgdsSidenavLink extends LinkElement {\n static styles = [...LinkElement.styles, sidenavLinkStyle];\n}\n\nexport default SgdsSidenavLink;\n"],"names":["sidenavLinkStyle"],"mappings":";;;;AAGA;;;;;;;AAOG;AACG,MAAO,eAAgB,SAAQ,WAAW,CAAA;;AACvC,eAAM,CAAA,MAAA,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,EAAEA,QAAgB,CAAC;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sgds-sidenav.cjs.js","sources":["../../../src/components/Sidenav/sgds-sidenav.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property, queryAssignedElements } from \"lit/decorators.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport SgdsSidenavItem from \"./sgds-sidenav-item\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport sidenavStyle from \"./sidenav.css\";\n\n/**\n * @summary The side navigation is used to display a list of links to move between pages within a related category.\n * It is used as a secondary form of navigation where the primary navigation is located hierachically above the page frame.\n * Maximum two levels of navigations are allowed.\n *\n * @slot default - Default slot for SgdsSidenavItem element.\n *\n * @cssproperty --sidenav-theme-color - overall sidenav theme color\n * @cssproperty --sidenav-sticky-top - set the top value of the sticky sidenav. Defaults to 0rem\n */\nexport class SgdsSidenav extends SgdsElement {\n static styles = [...SgdsElement.styles, sidenavStyle];\n\n /** Allow sidenav items to stay open when another item is opened */\n @property({ type: Boolean, attribute: true })\n alwaysOpen = false;\n\n /** Apply position sticky to the sidenav */\n @property({ type: Boolean, attribute: true })\n sticky = false;\n\n /** @internal */\n @queryAssignedElements()\n private defaultNodes!: SgdsSidenavItem[];\n\n /** @internal */\n get items(): SgdsSidenavItem[] {\n return [...(this.defaultNodes || [])].filter(\n (node: HTMLElement) => typeof node.tagName !== \"undefined\"\n ) as SgdsSidenavItem[];\n }\n\n async onToggle(event: Event): Promise<void> {\n const target = event.target as SgdsSidenavItem;\n const isSidenavLink = target.tagName === \"SGDS-SIDENAV-LINK\";\n // Let the event pass through the DOM so that it can be\n // prevented from the outside if a user so desires.\n if (this.alwaysOpen || event.defaultPrevented || isSidenavLink) {\n // No toggling when `alwaysOpen` or the user prevents it.\n return;\n }\n const items = [...this.items] as SgdsSidenavItem[];\n\n if (items && !items.length) {\n // no toggling when there aren't items.\n return;\n }\n items.forEach(item => {\n // Covers all elements within sidenav-item\n if (!event.composedPath().includes(item)) {\n // Close all the items that didn't dispatch the event.\n item.active = false;\n }\n });\n }\n\n render() {\n return html`\n <nav class=${classMap({ sticky: this.sticky })}>\n <div>\n <slot @click=${this.onToggle}></slot>\n </div>\n </nav>\n `;\n }\n}\n\nexport default SgdsSidenav;\n"],"names":["SgdsElement","html","classMap","sidenavStyle","__decorate","property","queryAssignedElements"],"mappings":"
|
|
1
|
+
{"version":3,"file":"sgds-sidenav.cjs.js","sources":["../../../src/components/Sidenav/sgds-sidenav.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property, queryAssignedElements } from \"lit/decorators.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport SgdsSidenavItem from \"./sgds-sidenav-item\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport sidenavStyle from \"./sidenav.css\";\n\n/**\n * @summary The side navigation is used to display a list of links to move between pages within a related category.\n * It is used as a secondary form of navigation where the primary navigation is located hierachically above the page frame.\n * Maximum two levels of navigations are allowed.\n *\n * @slot default - Default slot for SgdsSidenavItem element.\n *\n * @cssproperty --sidenav-theme-color - overall sidenav theme color\n * @cssproperty --sidenav-sticky-top - set the top value of the sticky sidenav. Defaults to 0rem\n */\nexport class SgdsSidenav extends SgdsElement {\n static styles = [...SgdsElement.styles, sidenavStyle];\n\n /** Allow sidenav items to stay open when another item is opened */\n @property({ type: Boolean, attribute: true })\n alwaysOpen = false;\n\n /** Apply position sticky to the sidenav */\n @property({ type: Boolean, attribute: true })\n sticky = false;\n\n /** @internal */\n @queryAssignedElements()\n private defaultNodes!: SgdsSidenavItem[];\n\n /** @internal */\n get items(): SgdsSidenavItem[] {\n return [...(this.defaultNodes || [])].filter(\n (node: HTMLElement) => typeof node.tagName !== \"undefined\"\n ) as SgdsSidenavItem[];\n }\n\n async onToggle(event: Event): Promise<void> {\n const target = event.target as SgdsSidenavItem;\n const isSidenavLink = target.tagName === \"SGDS-SIDENAV-LINK\";\n // Let the event pass through the DOM so that it can be\n // prevented from the outside if a user so desires.\n if (this.alwaysOpen || event.defaultPrevented || isSidenavLink) {\n // No toggling when `alwaysOpen` or the user prevents it.\n return;\n }\n const items = [...this.items] as SgdsSidenavItem[];\n\n if (items && !items.length) {\n // no toggling when there aren't items.\n return;\n }\n items.forEach(item => {\n // Covers all elements within sidenav-item\n if (!event.composedPath().includes(item)) {\n // Close all the items that didn't dispatch the event.\n item.active = false;\n }\n });\n }\n\n render() {\n return html`\n <nav class=${classMap({ sticky: this.sticky })}>\n <div>\n <slot @click=${this.onToggle}></slot>\n </div>\n </nav>\n `;\n }\n}\n\nexport default SgdsSidenav;\n"],"names":["SgdsElement","html","classMap","sidenavStyle","__decorate","property","queryAssignedElements"],"mappings":";;;;;;;;;;;;AAOA;;;;;;;;;AASG;AACG,MAAO,WAAY,SAAQA,sBAAW,CAAA;AAA5C,IAAA,WAAA,GAAA;;;QAKE,IAAU,CAAA,UAAA,GAAG,KAAK,CAAC;;QAInB,IAAM,CAAA,MAAA,GAAG,KAAK,CAAC;KA8ChB;;AAvCC,IAAA,IAAI,KAAK,GAAA;QACP,OAAO,CAAC,IAAI,IAAI,CAAC,YAAY,IAAI,EAAE,CAAC,CAAC,CAAC,MAAM,CAC1C,CAAC,IAAiB,KAAK,OAAO,IAAI,CAAC,OAAO,KAAK,WAAW,CACtC,CAAC;KACxB;IAED,MAAM,QAAQ,CAAC,KAAY,EAAA;AACzB,QAAA,MAAM,MAAM,GAAG,KAAK,CAAC,MAAyB,CAAC;AAC/C,QAAA,MAAM,aAAa,GAAG,MAAM,CAAC,OAAO,KAAK,mBAAmB,CAAC;;;QAG7D,IAAI,IAAI,CAAC,UAAU,IAAI,KAAK,CAAC,gBAAgB,IAAI,aAAa,EAAE;;YAE9D,OAAO;SACR;QACD,MAAM,KAAK,GAAG,CAAC,GAAG,IAAI,CAAC,KAAK,CAAsB,CAAC;AAEnD,QAAA,IAAI,KAAK,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE;;YAE1B,OAAO;SACR;AACD,QAAA,KAAK,CAAC,OAAO,CAAC,IAAI,IAAG;;YAEnB,IAAI,CAAC,KAAK,CAAC,YAAY,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE;;AAExC,gBAAA,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;aACrB;AACH,SAAC,CAAC,CAAC;KACJ;IAED,MAAM,GAAA;AACJ,QAAA,OAAOC,QAAI,CAAA,CAAA;mBACIC,oBAAQ,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,CAAC,CAAA;;AAE3B,uBAAA,EAAA,IAAI,CAAC,QAAQ,CAAA;;;KAGjC,CAAC;KACH;;AArDM,WAAM,CAAA,MAAA,GAAG,CAAC,GAAGF,sBAAW,CAAC,MAAM,EAAEG,kBAAY,CAAvC,CAAyC;AAItDC,gBAAA,CAAA;IADCC,sBAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;AAC1B,CAAA,EAAA,WAAA,CAAA,SAAA,EAAA,YAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAInBD,gBAAA,CAAA;IADCC,sBAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;AAC9B,CAAA,EAAA,WAAA,CAAA,SAAA,EAAA,QAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAIPD,gBAAA,CAAA;AADP,IAAAE,mCAAqB,EAAE;AACiB,CAAA,EAAA,WAAA,CAAA,SAAA,EAAA,cAAA,EAAA,KAAA,CAAA,CAAA;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sgds-sidenav.js","sources":["../../../src/components/Sidenav/sgds-sidenav.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property, queryAssignedElements } from \"lit/decorators.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport SgdsSidenavItem from \"./sgds-sidenav-item\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport sidenavStyle from \"./sidenav.css\";\n\n/**\n * @summary The side navigation is used to display a list of links to move between pages within a related category.\n * It is used as a secondary form of navigation where the primary navigation is located hierachically above the page frame.\n * Maximum two levels of navigations are allowed.\n *\n * @slot default - Default slot for SgdsSidenavItem element.\n *\n * @cssproperty --sidenav-theme-color - overall sidenav theme color\n * @cssproperty --sidenav-sticky-top - set the top value of the sticky sidenav. Defaults to 0rem\n */\nexport class SgdsSidenav extends SgdsElement {\n static styles = [...SgdsElement.styles, sidenavStyle];\n\n /** Allow sidenav items to stay open when another item is opened */\n @property({ type: Boolean, attribute: true })\n alwaysOpen = false;\n\n /** Apply position sticky to the sidenav */\n @property({ type: Boolean, attribute: true })\n sticky = false;\n\n /** @internal */\n @queryAssignedElements()\n private defaultNodes!: SgdsSidenavItem[];\n\n /** @internal */\n get items(): SgdsSidenavItem[] {\n return [...(this.defaultNodes || [])].filter(\n (node: HTMLElement) => typeof node.tagName !== \"undefined\"\n ) as SgdsSidenavItem[];\n }\n\n async onToggle(event: Event): Promise<void> {\n const target = event.target as SgdsSidenavItem;\n const isSidenavLink = target.tagName === \"SGDS-SIDENAV-LINK\";\n // Let the event pass through the DOM so that it can be\n // prevented from the outside if a user so desires.\n if (this.alwaysOpen || event.defaultPrevented || isSidenavLink) {\n // No toggling when `alwaysOpen` or the user prevents it.\n return;\n }\n const items = [...this.items] as SgdsSidenavItem[];\n\n if (items && !items.length) {\n // no toggling when there aren't items.\n return;\n }\n items.forEach(item => {\n // Covers all elements within sidenav-item\n if (!event.composedPath().includes(item)) {\n // Close all the items that didn't dispatch the event.\n item.active = false;\n }\n });\n }\n\n render() {\n return html`\n <nav class=${classMap({ sticky: this.sticky })}>\n <div>\n <slot @click=${this.onToggle}></slot>\n </div>\n </nav>\n `;\n }\n}\n\nexport default SgdsSidenav;\n"],"names":["sidenavStyle"],"mappings":"
|
|
1
|
+
{"version":3,"file":"sgds-sidenav.js","sources":["../../../src/components/Sidenav/sgds-sidenav.ts"],"sourcesContent":["import { html } from \"lit\";\nimport { property, queryAssignedElements } from \"lit/decorators.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport SgdsSidenavItem from \"./sgds-sidenav-item\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport sidenavStyle from \"./sidenav.css\";\n\n/**\n * @summary The side navigation is used to display a list of links to move between pages within a related category.\n * It is used as a secondary form of navigation where the primary navigation is located hierachically above the page frame.\n * Maximum two levels of navigations are allowed.\n *\n * @slot default - Default slot for SgdsSidenavItem element.\n *\n * @cssproperty --sidenav-theme-color - overall sidenav theme color\n * @cssproperty --sidenav-sticky-top - set the top value of the sticky sidenav. Defaults to 0rem\n */\nexport class SgdsSidenav extends SgdsElement {\n static styles = [...SgdsElement.styles, sidenavStyle];\n\n /** Allow sidenav items to stay open when another item is opened */\n @property({ type: Boolean, attribute: true })\n alwaysOpen = false;\n\n /** Apply position sticky to the sidenav */\n @property({ type: Boolean, attribute: true })\n sticky = false;\n\n /** @internal */\n @queryAssignedElements()\n private defaultNodes!: SgdsSidenavItem[];\n\n /** @internal */\n get items(): SgdsSidenavItem[] {\n return [...(this.defaultNodes || [])].filter(\n (node: HTMLElement) => typeof node.tagName !== \"undefined\"\n ) as SgdsSidenavItem[];\n }\n\n async onToggle(event: Event): Promise<void> {\n const target = event.target as SgdsSidenavItem;\n const isSidenavLink = target.tagName === \"SGDS-SIDENAV-LINK\";\n // Let the event pass through the DOM so that it can be\n // prevented from the outside if a user so desires.\n if (this.alwaysOpen || event.defaultPrevented || isSidenavLink) {\n // No toggling when `alwaysOpen` or the user prevents it.\n return;\n }\n const items = [...this.items] as SgdsSidenavItem[];\n\n if (items && !items.length) {\n // no toggling when there aren't items.\n return;\n }\n items.forEach(item => {\n // Covers all elements within sidenav-item\n if (!event.composedPath().includes(item)) {\n // Close all the items that didn't dispatch the event.\n item.active = false;\n }\n });\n }\n\n render() {\n return html`\n <nav class=${classMap({ sticky: this.sticky })}>\n <div>\n <slot @click=${this.onToggle}></slot>\n </div>\n </nav>\n `;\n }\n}\n\nexport default SgdsSidenav;\n"],"names":["sidenavStyle"],"mappings":";;;;;;;;AAOA;;;;;;;;;AASG;AACG,MAAO,WAAY,SAAQ,WAAW,CAAA;AAA5C,IAAA,WAAA,GAAA;;;QAKE,IAAU,CAAA,UAAA,GAAG,KAAK,CAAC;;QAInB,IAAM,CAAA,MAAA,GAAG,KAAK,CAAC;KA8ChB;;AAvCC,IAAA,IAAI,KAAK,GAAA;QACP,OAAO,CAAC,IAAI,IAAI,CAAC,YAAY,IAAI,EAAE,CAAC,CAAC,CAAC,MAAM,CAC1C,CAAC,IAAiB,KAAK,OAAO,IAAI,CAAC,OAAO,KAAK,WAAW,CACtC,CAAC;KACxB;IAED,MAAM,QAAQ,CAAC,KAAY,EAAA;AACzB,QAAA,MAAM,MAAM,GAAG,KAAK,CAAC,MAAyB,CAAC;AAC/C,QAAA,MAAM,aAAa,GAAG,MAAM,CAAC,OAAO,KAAK,mBAAmB,CAAC;;;QAG7D,IAAI,IAAI,CAAC,UAAU,IAAI,KAAK,CAAC,gBAAgB,IAAI,aAAa,EAAE;;YAE9D,OAAO;SACR;QACD,MAAM,KAAK,GAAG,CAAC,GAAG,IAAI,CAAC,KAAK,CAAsB,CAAC;AAEnD,QAAA,IAAI,KAAK,IAAI,CAAC,KAAK,CAAC,MAAM,EAAE;;YAE1B,OAAO;SACR;AACD,QAAA,KAAK,CAAC,OAAO,CAAC,IAAI,IAAG;;YAEnB,IAAI,CAAC,KAAK,CAAC,YAAY,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE;;AAExC,gBAAA,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;aACrB;AACH,SAAC,CAAC,CAAC;KACJ;IAED,MAAM,GAAA;AACJ,QAAA,OAAO,IAAI,CAAA,CAAA;mBACI,QAAQ,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,CAAC,CAAA;;AAE3B,uBAAA,EAAA,IAAI,CAAC,QAAQ,CAAA;;;KAGjC,CAAC;KACH;;AArDM,WAAM,CAAA,MAAA,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,EAAEA,QAAY,CAAvC,CAAyC;AAItD,UAAA,CAAA;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;AAC1B,CAAA,EAAA,WAAA,CAAA,SAAA,EAAA,YAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAInB,UAAA,CAAA;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;AAC9B,CAAA,EAAA,WAAA,CAAA,SAAA,EAAA,QAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAIP,UAAA,CAAA;AADP,IAAA,qBAAqB,EAAE;AACiB,CAAA,EAAA,WAAA,CAAA,SAAA,EAAA,cAAA,EAAA,KAAA,CAAA,CAAA;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sidenav-item.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"sidenav-item.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;"}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
'use client';
|
|
1
2
|
import { css } from 'lit';
|
|
2
3
|
|
|
3
4
|
var css_248z = css`:host{--sidenav-item-btn-border-left-width:0.125rem;--sidenav-item-btn-padding-x:1rem;--sidenav-item-btn-padding-y:0.5rem;--sidenav-item-icon-title-gap:1rem}.sidenav-btn{align-items:center;background:0;border:0;border-radius:0;display:flex;font-size:var(--sgds-body-font-size);gap:var(--sidenav-item-icon-title-gap);line-height:1.5rem;padding:var(--sidenav-item-btn-padding-y) var(--sidenav-item-btn-padding-x);text-align:initial;width:100%;slot[name=caret-icon]::slotted(*),svg.bi-chevron-down{margin-left:auto;transform:rotate(180deg);transition:all .3s ease-in-out}}.sidenav-btn.active,.sidenav-btn:hover{border-left:.125rem solid;color:var(--sidenav-theme-color);font-weight:700}.sidenav-btn.disabled{cursor:not-allowed;opacity:var(--sgds-disabled-opacity)}.sidenav-btn:not(.active){slot[name=caret-icon]::slotted(*),svg.bi-chevron-down{transform:rotate(0deg)}}a.sidenav-btn{color:inherit;line-height:var(--sgds-line-height-md);text-decoration:none}div.sidenav-list{display:flex;flex-direction:column;line-height:var(--sgds-line-height-lg);list-style:none;margin:0;padding-left:0}`;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sidenav-item.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"sidenav-item.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sidenav-link.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"sidenav-link.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;"}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
'use client';
|
|
1
2
|
import { css } from 'lit';
|
|
2
3
|
|
|
3
4
|
var css_248z = css`:host{--sidenav-link-font-size:var(--sgds-body-font-size);--sidenav-link-padding-x:1rem;--sidenav-link-padding-y:0.5rem;--sidenav-link-disabled-color:var(--sgds-disabled-color)}a.nav-link{color:inherit;display:block;font-size:var(--sidenav-link-font-size);padding-bottom:var(--sidenav-link-padding-y);padding-left:calc(var(--sidenav-link-padding-y)*4 + var(--sidenav-item-btn-border-left-width));padding-right:0;padding-top:var(--sidenav-link-padding-y);text-decoration:none}a.nav-link.active,a.nav-link:hover{color:var(--sidenav-theme-color)}a.nav-link.disabled{color:var(--sidenav-link-disabled-color);cursor:not-allowed;pointer-events:none}`;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sidenav-link.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"sidenav-link.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sidenav.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"sidenav.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;"}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
'use client';
|
|
1
2
|
import { css } from 'lit';
|
|
2
3
|
|
|
3
4
|
var css_248z = css`:host{--sidenav-theme-color:var(--sgds-primary);--sidenav-sticky-top:0rem}div{display:flex;flex-direction:column;gap:1rem;list-style:none;margin:0;padding-left:0}.sticky{height:calc(100vh - var(--sidenav-sticky-top));overflow-y:auto;position:sticky;top:var(--sidenav-sticky-top)}`;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sidenav.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"sidenav.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sgds-spinner.cjs.js","sources":["../../../src/components/Spinner/sgds-spinner.ts"],"sourcesContent":["import { property } from \"lit/decorators.js\";\nimport { html } from \"lit/static-html.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport spinnerStyle from \"./spinner.css\";\nimport textStyles from \"../../styles/text-variants.css\";\n/**\n * @summary Spinners notify the users that their request is being processed.\n *\n */\nexport class SgdsSpinner extends SgdsElement {\n static styles = [...SgdsElement.styles, textStyles, spinnerStyle];\n /** The type of spinner */\n @property({ type: String, reflect: true }) type: SpinnerType = \"border\";\n /** The color of spinner */\n @property({ type: String, reflect: true }) color: SpinnerColor = \"primary\";\n\n render() {\n return html`\n <div class=\"spinner-${this.type} spinner\" role=\"status\">\n <span class=\"sr-only\">Loading...</span>\n </div>\n `;\n }\n}\n\nexport type SpinnerColor = \"primary\" | \"secondary\" | \"success\" | \"danger\" | \"warning\" | \"info\" | \"light\" | \"dark\";\n\nexport type SpinnerType = \"border\" | \"grow\";\n\nexport default SgdsSpinner;\n"],"names":["SgdsElement","html","textStyles","spinnerStyle","__decorate","property"],"mappings":"
|
|
1
|
+
{"version":3,"file":"sgds-spinner.cjs.js","sources":["../../../src/components/Spinner/sgds-spinner.ts"],"sourcesContent":["import { property } from \"lit/decorators.js\";\nimport { html } from \"lit/static-html.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport spinnerStyle from \"./spinner.css\";\nimport textStyles from \"../../styles/text-variants.css\";\n/**\n * @summary Spinners notify the users that their request is being processed.\n *\n */\nexport class SgdsSpinner extends SgdsElement {\n static styles = [...SgdsElement.styles, textStyles, spinnerStyle];\n /** The type of spinner */\n @property({ type: String, reflect: true }) type: SpinnerType = \"border\";\n /** The color of spinner */\n @property({ type: String, reflect: true }) color: SpinnerColor = \"primary\";\n\n render() {\n return html`\n <div class=\"spinner-${this.type} spinner\" role=\"status\">\n <span class=\"sr-only\">Loading...</span>\n </div>\n `;\n }\n}\n\nexport type SpinnerColor = \"primary\" | \"secondary\" | \"success\" | \"danger\" | \"warning\" | \"info\" | \"light\" | \"dark\";\n\nexport type SpinnerType = \"border\" | \"grow\";\n\nexport default SgdsSpinner;\n"],"names":["SgdsElement","html","textStyles","spinnerStyle","__decorate","property"],"mappings":";;;;;;;;;;;;AAKA;;;AAGG;AACG,MAAO,WAAY,SAAQA,sBAAW,CAAA;AAA5C,IAAA,WAAA,GAAA;;;QAG6C,IAAI,CAAA,IAAA,GAAgB,QAAQ,CAAC;;QAE7B,IAAK,CAAA,KAAA,GAAiB,SAAS,CAAC;KAS5E;IAPC,MAAM,GAAA;AACJ,QAAA,OAAOC,kBAAI,CAAA,CAAA;AACa,0BAAA,EAAA,IAAI,CAAC,IAAI,CAAA;;;KAGhC,CAAC;KACH;;AAZM,WAAA,CAAA,MAAM,GAAG,CAAC,GAAGD,sBAAW,CAAC,MAAM,EAAEE,uBAAU,EAAEC,kBAAY,CAAnD,CAAqD;AAEvBC,gBAAA,CAAA;IAA1CC,sBAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAA8B,CAAA,EAAA,WAAA,CAAA,SAAA,EAAA,MAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAE7BD,gBAAA,CAAA;IAA1CC,sBAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAAiC,CAAA,EAAA,WAAA,CAAA,SAAA,EAAA,OAAA,EAAA,KAAA,CAAA,CAAA;;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sgds-spinner.js","sources":["../../../src/components/Spinner/sgds-spinner.ts"],"sourcesContent":["import { property } from \"lit/decorators.js\";\nimport { html } from \"lit/static-html.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport spinnerStyle from \"./spinner.css\";\nimport textStyles from \"../../styles/text-variants.css\";\n/**\n * @summary Spinners notify the users that their request is being processed.\n *\n */\nexport class SgdsSpinner extends SgdsElement {\n static styles = [...SgdsElement.styles, textStyles, spinnerStyle];\n /** The type of spinner */\n @property({ type: String, reflect: true }) type: SpinnerType = \"border\";\n /** The color of spinner */\n @property({ type: String, reflect: true }) color: SpinnerColor = \"primary\";\n\n render() {\n return html`\n <div class=\"spinner-${this.type} spinner\" role=\"status\">\n <span class=\"sr-only\">Loading...</span>\n </div>\n `;\n }\n}\n\nexport type SpinnerColor = \"primary\" | \"secondary\" | \"success\" | \"danger\" | \"warning\" | \"info\" | \"light\" | \"dark\";\n\nexport type SpinnerType = \"border\" | \"grow\";\n\nexport default SgdsSpinner;\n"],"names":["textStyles","spinnerStyle"],"mappings":"
|
|
1
|
+
{"version":3,"file":"sgds-spinner.js","sources":["../../../src/components/Spinner/sgds-spinner.ts"],"sourcesContent":["import { property } from \"lit/decorators.js\";\nimport { html } from \"lit/static-html.js\";\nimport SgdsElement from \"../../base/sgds-element\";\nimport spinnerStyle from \"./spinner.css\";\nimport textStyles from \"../../styles/text-variants.css\";\n/**\n * @summary Spinners notify the users that their request is being processed.\n *\n */\nexport class SgdsSpinner extends SgdsElement {\n static styles = [...SgdsElement.styles, textStyles, spinnerStyle];\n /** The type of spinner */\n @property({ type: String, reflect: true }) type: SpinnerType = \"border\";\n /** The color of spinner */\n @property({ type: String, reflect: true }) color: SpinnerColor = \"primary\";\n\n render() {\n return html`\n <div class=\"spinner-${this.type} spinner\" role=\"status\">\n <span class=\"sr-only\">Loading...</span>\n </div>\n `;\n }\n}\n\nexport type SpinnerColor = \"primary\" | \"secondary\" | \"success\" | \"danger\" | \"warning\" | \"info\" | \"light\" | \"dark\";\n\nexport type SpinnerType = \"border\" | \"grow\";\n\nexport default SgdsSpinner;\n"],"names":["textStyles","spinnerStyle"],"mappings":";;;;;;;;AAKA;;;AAGG;AACG,MAAO,WAAY,SAAQ,WAAW,CAAA;AAA5C,IAAA,WAAA,GAAA;;;QAG6C,IAAI,CAAA,IAAA,GAAgB,QAAQ,CAAC;;QAE7B,IAAK,CAAA,KAAA,GAAiB,SAAS,CAAC;KAS5E;IAPC,MAAM,GAAA;AACJ,QAAA,OAAO,IAAI,CAAA,CAAA;AACa,0BAAA,EAAA,IAAI,CAAC,IAAI,CAAA;;;KAGhC,CAAC;KACH;;AAZM,WAAA,CAAA,MAAM,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,EAAEA,QAAU,EAAEC,UAAY,CAAnD,CAAqD;AAEvB,UAAA,CAAA;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAA8B,CAAA,EAAA,WAAA,CAAA,SAAA,EAAA,MAAA,EAAA,KAAA,CAAA,CAAA,CAAA;AAE7B,UAAA,CAAA;IAA1C,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC;AAAiC,CAAA,EAAA,WAAA,CAAA,SAAA,EAAA,OAAA,EAAA,KAAA,CAAA,CAAA;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"spinner.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"spinner.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
'use client';
|
|
1
2
|
import { css } from 'lit';
|
|
2
3
|
|
|
3
4
|
var css_248z = css`.spinner{--sgds-spinner-color:var(--sgds-primary-filled);color:var(--sgds-spinner-color)}:host([color=secondary]) .spinner{--sgds-spinner-color:var(--sgds-secondary-filled)}:host([color=warning]) .spinner{--sgds-spinner-color:var(--sgds-warning-filled)}:host([color=danger]) .spinner{--sgds-spinner-color:var(--sgds-danger-filled)}:host([color=success]) .spinner{--sgds-spinner-color:var(--sgds-success-filled)}:host([color=info]) .spinner{--sgds-spinner-color:var(--sgds-info-filled)}:host([color=light]) .spinner{--sgds-spinner-color:var(--sgds-light-filled)}:host([color=dark]) .spinner{--sgds-spinner-color:var(--sgds-dark-filled)}.spinner-border{animation:spinner-border .75s linear infinite;border:.25em solid;border-radius:50%;border-right:.25em solid transparent;color:var(--sgds-spinner-color)}.spinner-border,.spinner-grow{display:inline-block;height:2rem;vertical-align:-.125em;width:2rem}.spinner-grow{animation:spinner-grow .75s linear infinite;background-color:var(--sgds-spinner-color);border-radius:50%;opacity:0}@media (prefers-reduced-motion:reduce){.spinner-border,.spinner-grow{animation-duration:1.5s}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"spinner.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"spinner.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}
|