@paperless/core 0.1.0-alpha.335 → 0.1.0-alpha.336
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/CHANGELOG.md +8 -0
- package/dist/build/p-004340ec.entry.js +2 -0
- package/dist/build/{p-60b6c14b.entry.js.map → p-004340ec.entry.js.map} +1 -1
- package/dist/build/p-004d55ea.entry.js +2 -0
- package/dist/{paperless/p-ad5ba47b.entry.js.map → build/p-004d55ea.entry.js.map} +1 -1
- package/dist/build/p-0b9838ca.entry.js +2 -0
- package/dist/build/{p-bf38e363.entry.js.map → p-0b9838ca.entry.js.map} +1 -1
- package/dist/build/p-0f3bd28b.entry.js +2 -0
- package/dist/build/{p-d774205e.entry.js.map → p-0f3bd28b.entry.js.map} +1 -1
- package/dist/build/p-11929d70.entry.js +2 -0
- package/dist/build/{p-7e654e16.entry.js.map → p-11929d70.entry.js.map} +1 -1
- package/dist/build/p-150f371d.entry.js +2 -0
- package/dist/build/{p-9dc6f147.entry.js.map → p-150f371d.entry.js.map} +1 -1
- package/dist/{paperless/p-94cf7d35.entry.js → build/p-165b2597.entry.js} +2 -2
- package/dist/{paperless/p-94cf7d35.entry.js.map → build/p-165b2597.entry.js.map} +1 -1
- package/dist/build/p-1c2cc466.entry.js +2 -0
- package/dist/build/{p-6a65767e.entry.js.map → p-1c2cc466.entry.js.map} +1 -1
- package/dist/build/{p-c1e7b677.entry.js → p-268227ff.entry.js} +2 -2
- package/dist/build/{p-c1e7b677.entry.js.map → p-268227ff.entry.js.map} +0 -0
- package/dist/build/p-34e4e210.entry.js +2 -0
- package/dist/build/{p-a206e4cd.entry.js.map → p-34e4e210.entry.js.map} +1 -1
- package/dist/build/p-3e858d20.entry.js +2 -0
- package/dist/build/{p-a5eb1757.entry.js.map → p-3e858d20.entry.js.map} +1 -1
- package/dist/build/{p-06c0c17c.entry.js → p-4c3d6a7f.entry.js} +2 -2
- package/dist/build/{p-06c0c17c.entry.js.map → p-4c3d6a7f.entry.js.map} +0 -0
- package/dist/build/p-594d1cf6.entry.js +2 -0
- package/dist/build/{p-a6576739.entry.js.map → p-594d1cf6.entry.js.map} +1 -1
- package/dist/build/{p-9066d04f.entry.js → p-61cc1cd9.entry.js} +2 -2
- package/dist/build/{p-9066d04f.entry.js.map → p-61cc1cd9.entry.js.map} +1 -1
- package/dist/build/p-7584e581.entry.js +2 -0
- package/dist/build/{p-eee779b4.entry.js.map → p-7584e581.entry.js.map} +1 -1
- package/dist/build/p-7f40fbbf.entry.js +2 -0
- package/dist/build/{p-963d2b2a.entry.js.map → p-7f40fbbf.entry.js.map} +1 -1
- package/dist/build/p-8120c40f.entry.js +2 -0
- package/dist/build/{p-0065fc80.entry.js.map → p-8120c40f.entry.js.map} +1 -1
- package/dist/build/{p-eba0b0a5.entry.js → p-a0a27d24.entry.js} +2 -2
- package/dist/build/{p-eba0b0a5.entry.js.map → p-a0a27d24.entry.js.map} +0 -0
- package/dist/build/p-a0d40482.entry.js +2 -0
- package/dist/build/{p-649b1a0a.entry.js.map → p-a0d40482.entry.js.map} +1 -1
- package/dist/build/p-a134db32.entry.js +2 -0
- package/dist/build/{p-745b9852.entry.js.map → p-a134db32.entry.js.map} +1 -1
- package/dist/build/p-a46af8b4.entry.js +2 -0
- package/dist/{paperless/p-04fe2be7.entry.js.map → build/p-a46af8b4.entry.js.map} +1 -1
- package/dist/build/p-a4e7ec85.entry.js +2 -0
- package/dist/build/{p-b4121a02.entry.js.map → p-a4e7ec85.entry.js.map} +1 -1
- package/dist/build/p-a6313ca8.entry.js +2 -0
- package/dist/build/{p-11e2e81c.entry.js.map → p-a6313ca8.entry.js.map} +1 -1
- package/dist/build/p-ab08ea2e.entry.js +2 -0
- package/dist/{paperless/p-3a1fa184.entry.js.map → build/p-ab08ea2e.entry.js.map} +1 -1
- package/dist/build/p-b131d8d5.entry.js +2 -0
- package/dist/build/{p-c770eac3.entry.js.map → p-b131d8d5.entry.js.map} +1 -1
- package/dist/build/p-b2af2dd2.entry.js +2 -0
- package/dist/build/{p-ba02ea5b.entry.js.map → p-b2af2dd2.entry.js.map} +1 -1
- package/dist/build/p-bd13aa1f.entry.js +2 -0
- package/dist/{paperless/p-97ea9ebe.entry.js.map → build/p-bd13aa1f.entry.js.map} +1 -1
- package/dist/build/p-ca7644aa.entry.js +2 -0
- package/dist/{paperless/p-b4616ed4.entry.js.map → build/p-ca7644aa.entry.js.map} +1 -1
- package/dist/{paperless/p-da62f3c0.entry.js → build/p-d3485dca.entry.js} +2 -2
- package/dist/build/{p-da62f3c0.entry.js.map → p-d3485dca.entry.js.map} +1 -1
- package/dist/build/p-dec019cb.entry.js +2 -0
- package/dist/build/{p-9f88e06d.entry.js.map → p-dec019cb.entry.js.map} +1 -1
- package/dist/build/p-f518e8b6.entry.js +2 -0
- package/dist/build/{p-32ce71f9.entry.js.map → p-f518e8b6.entry.js.map} +1 -1
- package/dist/build/paperless.css +1 -1
- package/dist/build/paperless.esm.js +1 -1
- package/dist/cjs/p-accordion.cjs.entry.js +1 -1
- package/dist/cjs/p-accordion.cjs.entry.js.map +1 -1
- package/dist/cjs/p-avatar.cjs.entry.js +1 -1
- package/dist/cjs/p-backdrop.cjs.entry.js +1 -1
- package/dist/cjs/p-backdrop.cjs.entry.js.map +1 -1
- package/dist/cjs/p-button_3.cjs.entry.js +3 -3
- package/dist/cjs/p-button_3.cjs.entry.js.map +1 -1
- package/dist/cjs/p-calendar.cjs.entry.js +1 -1
- package/dist/cjs/p-calendar.cjs.entry.js.map +1 -1
- package/dist/cjs/p-card-header.cjs.entry.js +1 -1
- package/dist/cjs/p-card-header.cjs.entry.js.map +1 -1
- package/dist/cjs/p-content-slider.cjs.entry.js +1 -1
- package/dist/cjs/p-counter.cjs.entry.js +1 -1
- package/dist/cjs/p-counter.cjs.entry.js.map +1 -1
- package/dist/cjs/p-datepicker.cjs.entry.js +1 -1
- package/dist/cjs/p-datepicker.cjs.entry.js.map +1 -1
- package/dist/cjs/p-divider.cjs.entry.js +1 -1
- package/dist/cjs/p-divider.cjs.entry.js.map +1 -1
- package/dist/cjs/p-drawer-body_3.cjs.entry.js +3 -3
- package/dist/cjs/p-drawer-body_3.cjs.entry.js.map +1 -1
- package/dist/cjs/p-drawer.cjs.entry.js +1 -1
- package/dist/cjs/p-drawer.cjs.entry.js.map +1 -1
- package/dist/cjs/p-dropdown-menu-container.cjs.entry.js +1 -1
- package/dist/cjs/p-dropdown-menu-container.cjs.entry.js.map +1 -1
- package/dist/cjs/p-dropdown_2.cjs.entry.js +2 -2
- package/dist/cjs/p-dropdown_2.cjs.entry.js.map +1 -1
- package/dist/cjs/p-helper_3.cjs.entry.js +3 -3
- package/dist/cjs/p-helper_3.cjs.entry.js.map +1 -1
- package/dist/cjs/p-illustration_6.cjs.entry.js +5 -5
- package/dist/cjs/p-illustration_6.cjs.entry.js.map +1 -1
- package/dist/cjs/p-info-panel.cjs.entry.js +1 -1
- package/dist/cjs/p-info-panel.cjs.entry.js.map +1 -1
- package/dist/cjs/p-label_3.cjs.entry.js +3 -3
- package/dist/cjs/p-label_3.cjs.entry.js.map +1 -1
- package/dist/cjs/p-layout.cjs.entry.js +1 -1
- package/dist/cjs/p-layout.cjs.entry.js.map +1 -1
- package/dist/cjs/p-modal-body_4.cjs.entry.js +4 -4
- package/dist/cjs/p-modal-body_4.cjs.entry.js.map +1 -1
- package/dist/cjs/p-navbar.cjs.entry.js +1 -1
- package/dist/cjs/p-navbar.cjs.entry.js.map +1 -1
- package/dist/cjs/p-navigation-item.cjs.entry.js +1 -1
- package/dist/cjs/p-navigation-item.cjs.entry.js.map +1 -1
- package/dist/cjs/p-page-size-select_3.cjs.entry.js +2 -2
- package/dist/cjs/p-page-size-select_3.cjs.entry.js.map +1 -1
- package/dist/cjs/p-profile.cjs.entry.js +1 -1
- package/dist/cjs/p-profile.cjs.entry.js.map +1 -1
- package/dist/cjs/p-select.cjs.entry.js +1 -1
- package/dist/cjs/p-select.cjs.entry.js.map +1 -1
- package/dist/cjs/p-status.cjs.entry.js +1 -1
- package/dist/cjs/p-status.cjs.entry.js.map +1 -1
- package/dist/cjs/p-stepper-item_2.cjs.entry.js +2 -2
- package/dist/cjs/p-stepper-item_2.cjs.entry.js.map +1 -1
- package/dist/cjs/p-stepper.cjs.entry.js +1 -1
- package/dist/cjs/p-stepper.cjs.entry.js.map +1 -1
- package/dist/cjs/p-tab-item.cjs.entry.js +1 -1
- package/dist/cjs/p-table.cjs.entry.js +1 -1
- package/dist/cjs/p-table.cjs.entry.js.map +1 -1
- package/dist/cjs/p-toast.cjs.entry.js +1 -1
- package/dist/cjs/p-toast.cjs.entry.js.map +1 -1
- package/dist/collection/components/atoms/avatar/avatar.component.css +1 -1
- package/dist/collection/components/atoms/backdrop/backdrop.component.css +1 -1
- package/dist/collection/components/atoms/button/button.component.css +1 -1
- package/dist/collection/components/atoms/card-header/card-header.component.css +1 -1
- package/dist/collection/components/atoms/counter/counter.component.css +1 -1
- package/dist/collection/components/atoms/divider/divider.component.css +1 -1
- package/dist/collection/components/atoms/drawer-body/drawer-body.component.css +1 -1
- package/dist/collection/components/atoms/drawer-container/drawer-container.component.css +1 -1
- package/dist/collection/components/atoms/drawer-header/drawer-header.component.css +1 -1
- package/dist/collection/components/atoms/dropdown-menu-container/dropdown-menu-container.component.css +1 -1
- package/dist/collection/components/atoms/dropdown-menu-item/dropdown-menu-item.component.css +1 -1
- package/dist/collection/components/atoms/helper/helper.component.css +1 -1
- package/dist/collection/components/atoms/icon/icon.component.css +1 -1
- package/dist/collection/components/atoms/info-panel/info-panel.component.css +1 -1
- package/dist/collection/components/atoms/label/label.component.css +1 -1
- package/dist/collection/components/atoms/layout/layout.component.css +1 -1
- package/dist/collection/components/atoms/loader/loader.component.css +1 -1
- package/dist/collection/components/atoms/modal-body/modal-body.component.css +1 -1
- package/dist/collection/components/atoms/modal-container/modal-container.component.css +1 -1
- package/dist/collection/components/atoms/modal-footer/modal-footer.component.css +1 -1
- package/dist/collection/components/atoms/modal-header/modal-header.component.css +1 -1
- package/dist/collection/components/atoms/pagination-item/pagination-item.component.css +1 -1
- package/dist/collection/components/atoms/segment-container/segment-container.component.css +1 -1
- package/dist/collection/components/atoms/segment-item/segment-item.component.css +1 -1
- package/dist/collection/components/atoms/status/status.component.css +1 -1
- package/dist/collection/components/atoms/stepper-item/stepper-item.component.css +1 -1
- package/dist/collection/components/atoms/stepper-line/stepper-line.component.css +1 -1
- package/dist/collection/components/atoms/tab-item/tab-item.component.css +1 -1
- package/dist/collection/components/atoms/table-container/table-container.component.css +1 -1
- package/dist/collection/components/atoms/tooltip/tooltip.component.css +1 -1
- package/dist/collection/components/molecules/accordion/accordion.component.css +1 -1
- package/dist/collection/components/molecules/calendar/calendar.component.css +1 -1
- package/dist/collection/components/molecules/content-slider/content-slider.component.css +1 -1
- package/dist/collection/components/molecules/datepicker/datepicker.component.css +1 -1
- package/dist/collection/components/molecules/dropdown/dropdown.component.css +1 -1
- package/dist/collection/components/molecules/input-group/input-group.component.css +1 -1
- package/dist/collection/components/molecules/navigation-item/navigation-item.component.css +1 -1
- package/dist/collection/components/molecules/pagination/pagination.component.css +1 -1
- package/dist/collection/components/molecules/profile/profile.component.css +1 -1
- package/dist/collection/components/molecules/select/select.component.css +1 -1
- package/dist/collection/components/molecules/stepper/stepper.component.css +1 -1
- package/dist/collection/components/molecules/table-cell/table-cell.component.css +1 -1
- package/dist/collection/components/molecules/table-footer/table-footer.component.css +1 -1
- package/dist/collection/components/molecules/table-header/table-header.component.css +1 -1
- package/dist/collection/components/molecules/table-row/table-row.component.css +1 -1
- package/dist/collection/components/molecules/toast/toast.component.css +1 -1
- package/dist/collection/components/organisms/drawer/drawer.component.css +1 -1
- package/dist/collection/components/organisms/navbar/navbar.component.css +1 -1
- package/dist/collection/components/organisms/table/table.component.css +1 -1
- package/dist/components/backdrop.component.js +1 -1
- package/dist/components/backdrop.component.js.map +1 -1
- package/dist/components/button.component.js +1 -1
- package/dist/components/button.component.js.map +1 -1
- package/dist/components/calendar.component.js +1 -1
- package/dist/components/calendar.component.js.map +1 -1
- package/dist/components/counter.component.js +1 -1
- package/dist/components/counter.component.js.map +1 -1
- package/dist/components/divider.component.js +1 -1
- package/dist/components/divider.component.js.map +1 -1
- package/dist/components/drawer-body.component.js +1 -1
- package/dist/components/drawer-body.component.js.map +1 -1
- package/dist/components/drawer-container.component.js +1 -1
- package/dist/components/drawer-container.component.js.map +1 -1
- package/dist/components/drawer-header.component.js +1 -1
- package/dist/components/drawer-header.component.js.map +1 -1
- package/dist/components/dropdown-menu-container.component.js +1 -1
- package/dist/components/dropdown-menu-container.component.js.map +1 -1
- package/dist/components/dropdown-menu-item.component.js +1 -1
- package/dist/components/dropdown-menu-item.component.js.map +1 -1
- package/dist/components/dropdown.component.js +1 -1
- package/dist/components/dropdown.component.js.map +1 -1
- package/dist/components/helper.component.js +1 -1
- package/dist/components/helper.component.js.map +1 -1
- package/dist/components/icon.component.js +1 -1
- package/dist/components/icon.component.js.map +1 -1
- package/dist/components/input-group.component.js +1 -1
- package/dist/components/input-group.component.js.map +1 -1
- package/dist/components/label.component.js +1 -1
- package/dist/components/label.component.js.map +1 -1
- package/dist/components/loader.component.js +1 -1
- package/dist/components/loader.component.js.map +1 -1
- package/dist/components/modal-body.component.js +1 -1
- package/dist/components/modal-body.component.js.map +1 -1
- package/dist/components/modal-container.component.js +1 -1
- package/dist/components/modal-container.component.js.map +1 -1
- package/dist/components/modal-footer.component.js +1 -1
- package/dist/components/modal-footer.component.js.map +1 -1
- package/dist/components/modal-header.component.js +1 -1
- package/dist/components/modal-header.component.js.map +1 -1
- package/dist/components/p-accordion.js +1 -1
- package/dist/components/p-accordion.js.map +1 -1
- package/dist/components/p-avatar.js +1 -1
- package/dist/components/p-card-header.js +1 -1
- package/dist/components/p-card-header.js.map +1 -1
- package/dist/components/p-content-slider.js +1 -1
- package/dist/components/p-datepicker.js +1 -1
- package/dist/components/p-datepicker.js.map +1 -1
- package/dist/components/p-drawer.js +1 -1
- package/dist/components/p-drawer.js.map +1 -1
- package/dist/components/p-info-panel.js +1 -1
- package/dist/components/p-info-panel.js.map +1 -1
- package/dist/components/p-layout.js +1 -1
- package/dist/components/p-layout.js.map +1 -1
- package/dist/components/p-navbar.js +1 -1
- package/dist/components/p-navbar.js.map +1 -1
- package/dist/components/p-navigation-item.js +1 -1
- package/dist/components/p-navigation-item.js.map +1 -1
- package/dist/components/p-profile.js +1 -1
- package/dist/components/p-profile.js.map +1 -1
- package/dist/components/p-select.js +1 -1
- package/dist/components/p-select.js.map +1 -1
- package/dist/components/p-status.js +1 -1
- package/dist/components/p-status.js.map +1 -1
- package/dist/components/p-stepper.js +1 -1
- package/dist/components/p-stepper.js.map +1 -1
- package/dist/components/p-tab-item.js +1 -1
- package/dist/components/p-table.js +1 -1
- package/dist/components/p-table.js.map +1 -1
- package/dist/components/p-toast.js +1 -1
- package/dist/components/p-toast.js.map +1 -1
- package/dist/components/pagination-item.component.js +1 -1
- package/dist/components/pagination-item.component.js.map +1 -1
- package/dist/components/pagination.component.js +1 -1
- package/dist/components/pagination.component.js.map +1 -1
- package/dist/components/segment-container.component.js +1 -1
- package/dist/components/segment-container.component.js.map +1 -1
- package/dist/components/segment-item.component.js +1 -1
- package/dist/components/segment-item.component.js.map +1 -1
- package/dist/components/stepper-item.component.js +1 -1
- package/dist/components/stepper-item.component.js.map +1 -1
- package/dist/components/stepper-line.component.js +1 -1
- package/dist/components/stepper-line.component.js.map +1 -1
- package/dist/components/table-cell.component.js +1 -1
- package/dist/components/table-cell.component.js.map +1 -1
- package/dist/components/table-container.component.js +1 -1
- package/dist/components/table-container.component.js.map +1 -1
- package/dist/components/table-footer.component.js +1 -1
- package/dist/components/table-footer.component.js.map +1 -1
- package/dist/components/table-header.component.js +1 -1
- package/dist/components/table-header.component.js.map +1 -1
- package/dist/components/table-row.component.js +1 -1
- package/dist/components/table-row.component.js.map +1 -1
- package/dist/components/tooltip.component.js +1 -1
- package/dist/components/tooltip.component.js.map +1 -1
- package/dist/esm/p-accordion.entry.js +1 -1
- package/dist/esm/p-accordion.entry.js.map +1 -1
- package/dist/esm/p-avatar.entry.js +1 -1
- package/dist/esm/p-backdrop.entry.js +1 -1
- package/dist/esm/p-backdrop.entry.js.map +1 -1
- package/dist/esm/p-button_3.entry.js +3 -3
- package/dist/esm/p-button_3.entry.js.map +1 -1
- package/dist/esm/p-calendar.entry.js +1 -1
- package/dist/esm/p-calendar.entry.js.map +1 -1
- package/dist/esm/p-card-header.entry.js +1 -1
- package/dist/esm/p-card-header.entry.js.map +1 -1
- package/dist/esm/p-content-slider.entry.js +1 -1
- package/dist/esm/p-counter.entry.js +1 -1
- package/dist/esm/p-counter.entry.js.map +1 -1
- package/dist/esm/p-datepicker.entry.js +1 -1
- package/dist/esm/p-datepicker.entry.js.map +1 -1
- package/dist/esm/p-divider.entry.js +1 -1
- package/dist/esm/p-divider.entry.js.map +1 -1
- package/dist/esm/p-drawer-body_3.entry.js +3 -3
- package/dist/esm/p-drawer-body_3.entry.js.map +1 -1
- package/dist/esm/p-drawer.entry.js +1 -1
- package/dist/esm/p-drawer.entry.js.map +1 -1
- package/dist/esm/p-dropdown-menu-container.entry.js +1 -1
- package/dist/esm/p-dropdown-menu-container.entry.js.map +1 -1
- package/dist/esm/p-dropdown_2.entry.js +2 -2
- package/dist/esm/p-dropdown_2.entry.js.map +1 -1
- package/dist/esm/p-helper_3.entry.js +3 -3
- package/dist/esm/p-helper_3.entry.js.map +1 -1
- package/dist/esm/p-illustration_6.entry.js +5 -5
- package/dist/esm/p-illustration_6.entry.js.map +1 -1
- package/dist/esm/p-info-panel.entry.js +1 -1
- package/dist/esm/p-info-panel.entry.js.map +1 -1
- package/dist/esm/p-label_3.entry.js +3 -3
- package/dist/esm/p-label_3.entry.js.map +1 -1
- package/dist/esm/p-layout.entry.js +1 -1
- package/dist/esm/p-layout.entry.js.map +1 -1
- package/dist/esm/p-modal-body_4.entry.js +4 -4
- package/dist/esm/p-modal-body_4.entry.js.map +1 -1
- package/dist/esm/p-navbar.entry.js +1 -1
- package/dist/esm/p-navbar.entry.js.map +1 -1
- package/dist/esm/p-navigation-item.entry.js +1 -1
- package/dist/esm/p-navigation-item.entry.js.map +1 -1
- package/dist/esm/p-page-size-select_3.entry.js +2 -2
- package/dist/esm/p-page-size-select_3.entry.js.map +1 -1
- package/dist/esm/p-profile.entry.js +1 -1
- package/dist/esm/p-profile.entry.js.map +1 -1
- package/dist/esm/p-select.entry.js +1 -1
- package/dist/esm/p-select.entry.js.map +1 -1
- package/dist/esm/p-status.entry.js +1 -1
- package/dist/esm/p-status.entry.js.map +1 -1
- package/dist/esm/p-stepper-item_2.entry.js +2 -2
- package/dist/esm/p-stepper-item_2.entry.js.map +1 -1
- package/dist/esm/p-stepper.entry.js +1 -1
- package/dist/esm/p-stepper.entry.js.map +1 -1
- package/dist/esm/p-tab-item.entry.js +1 -1
- package/dist/esm/p-table.entry.js +1 -1
- package/dist/esm/p-table.entry.js.map +1 -1
- package/dist/esm/p-toast.entry.js +1 -1
- package/dist/esm/p-toast.entry.js.map +1 -1
- package/dist/index.html +1 -1
- package/dist/paperless/p-004340ec.entry.js +2 -0
- package/dist/paperless/{p-60b6c14b.entry.js.map → p-004340ec.entry.js.map} +1 -1
- package/dist/paperless/p-004d55ea.entry.js +2 -0
- package/dist/{build/p-ad5ba47b.entry.js.map → paperless/p-004d55ea.entry.js.map} +1 -1
- package/dist/paperless/p-0b9838ca.entry.js +2 -0
- package/dist/paperless/{p-bf38e363.entry.js.map → p-0b9838ca.entry.js.map} +1 -1
- package/dist/paperless/p-0f3bd28b.entry.js +2 -0
- package/dist/paperless/{p-d774205e.entry.js.map → p-0f3bd28b.entry.js.map} +1 -1
- package/dist/paperless/p-11929d70.entry.js +2 -0
- package/dist/paperless/{p-7e654e16.entry.js.map → p-11929d70.entry.js.map} +1 -1
- package/dist/paperless/p-150f371d.entry.js +2 -0
- package/dist/paperless/{p-9dc6f147.entry.js.map → p-150f371d.entry.js.map} +1 -1
- package/dist/{build/p-94cf7d35.entry.js → paperless/p-165b2597.entry.js} +2 -2
- package/dist/{build/p-94cf7d35.entry.js.map → paperless/p-165b2597.entry.js.map} +1 -1
- package/dist/paperless/p-1c2cc466.entry.js +2 -0
- package/dist/paperless/{p-6a65767e.entry.js.map → p-1c2cc466.entry.js.map} +1 -1
- package/dist/paperless/{p-c1e7b677.entry.js → p-268227ff.entry.js} +2 -2
- package/dist/paperless/{p-c1e7b677.entry.js.map → p-268227ff.entry.js.map} +0 -0
- package/dist/paperless/p-34e4e210.entry.js +2 -0
- package/dist/paperless/{p-a206e4cd.entry.js.map → p-34e4e210.entry.js.map} +1 -1
- package/dist/paperless/p-3e858d20.entry.js +2 -0
- package/dist/paperless/{p-a5eb1757.entry.js.map → p-3e858d20.entry.js.map} +1 -1
- package/dist/paperless/{p-06c0c17c.entry.js → p-4c3d6a7f.entry.js} +2 -2
- package/dist/paperless/{p-06c0c17c.entry.js.map → p-4c3d6a7f.entry.js.map} +0 -0
- package/dist/paperless/p-594d1cf6.entry.js +2 -0
- package/dist/paperless/{p-a6576739.entry.js.map → p-594d1cf6.entry.js.map} +1 -1
- package/dist/paperless/{p-9066d04f.entry.js → p-61cc1cd9.entry.js} +2 -2
- package/dist/paperless/{p-9066d04f.entry.js.map → p-61cc1cd9.entry.js.map} +1 -1
- package/dist/paperless/p-7584e581.entry.js +2 -0
- package/dist/paperless/{p-eee779b4.entry.js.map → p-7584e581.entry.js.map} +1 -1
- package/dist/paperless/p-7f40fbbf.entry.js +2 -0
- package/dist/paperless/{p-963d2b2a.entry.js.map → p-7f40fbbf.entry.js.map} +1 -1
- package/dist/paperless/p-8120c40f.entry.js +2 -0
- package/dist/paperless/{p-0065fc80.entry.js.map → p-8120c40f.entry.js.map} +1 -1
- package/dist/paperless/{p-eba0b0a5.entry.js → p-a0a27d24.entry.js} +2 -2
- package/dist/paperless/{p-eba0b0a5.entry.js.map → p-a0a27d24.entry.js.map} +0 -0
- package/dist/paperless/p-a0d40482.entry.js +2 -0
- package/dist/paperless/{p-649b1a0a.entry.js.map → p-a0d40482.entry.js.map} +1 -1
- package/dist/paperless/p-a134db32.entry.js +2 -0
- package/dist/paperless/{p-745b9852.entry.js.map → p-a134db32.entry.js.map} +1 -1
- package/dist/paperless/p-a46af8b4.entry.js +2 -0
- package/dist/{build/p-04fe2be7.entry.js.map → paperless/p-a46af8b4.entry.js.map} +1 -1
- package/dist/paperless/p-a4e7ec85.entry.js +2 -0
- package/dist/paperless/{p-b4121a02.entry.js.map → p-a4e7ec85.entry.js.map} +1 -1
- package/dist/paperless/p-a6313ca8.entry.js +2 -0
- package/dist/paperless/{p-11e2e81c.entry.js.map → p-a6313ca8.entry.js.map} +1 -1
- package/dist/paperless/p-ab08ea2e.entry.js +2 -0
- package/dist/{build/p-3a1fa184.entry.js.map → paperless/p-ab08ea2e.entry.js.map} +1 -1
- package/dist/paperless/p-b131d8d5.entry.js +2 -0
- package/dist/paperless/{p-c770eac3.entry.js.map → p-b131d8d5.entry.js.map} +1 -1
- package/dist/paperless/p-b2af2dd2.entry.js +2 -0
- package/dist/paperless/{p-ba02ea5b.entry.js.map → p-b2af2dd2.entry.js.map} +1 -1
- package/dist/paperless/p-bd13aa1f.entry.js +2 -0
- package/dist/{build/p-97ea9ebe.entry.js.map → paperless/p-bd13aa1f.entry.js.map} +1 -1
- package/dist/paperless/p-ca7644aa.entry.js +2 -0
- package/dist/{build/p-b4616ed4.entry.js.map → paperless/p-ca7644aa.entry.js.map} +1 -1
- package/dist/{build/p-da62f3c0.entry.js → paperless/p-d3485dca.entry.js} +2 -2
- package/dist/paperless/{p-da62f3c0.entry.js.map → p-d3485dca.entry.js.map} +1 -1
- package/dist/paperless/p-dec019cb.entry.js +2 -0
- package/dist/paperless/{p-9f88e06d.entry.js.map → p-dec019cb.entry.js.map} +1 -1
- package/dist/paperless/p-f518e8b6.entry.js +2 -0
- package/dist/paperless/{p-32ce71f9.entry.js.map → p-f518e8b6.entry.js.map} +1 -1
- package/dist/paperless/paperless.css +43 -43
- package/dist/paperless/paperless.esm.js +1 -1
- package/dist/sw.js +1 -1
- package/dist/sw.js.map +1 -1
- package/package.json +2 -2
- package/dist/build/p-0065fc80.entry.js +0 -2
- package/dist/build/p-04fe2be7.entry.js +0 -2
- package/dist/build/p-11e2e81c.entry.js +0 -2
- package/dist/build/p-32ce71f9.entry.js +0 -2
- package/dist/build/p-3a1fa184.entry.js +0 -2
- package/dist/build/p-60b6c14b.entry.js +0 -2
- package/dist/build/p-649b1a0a.entry.js +0 -2
- package/dist/build/p-6a65767e.entry.js +0 -2
- package/dist/build/p-745b9852.entry.js +0 -2
- package/dist/build/p-7e654e16.entry.js +0 -2
- package/dist/build/p-963d2b2a.entry.js +0 -2
- package/dist/build/p-97ea9ebe.entry.js +0 -2
- package/dist/build/p-9dc6f147.entry.js +0 -2
- package/dist/build/p-9f88e06d.entry.js +0 -2
- package/dist/build/p-a206e4cd.entry.js +0 -2
- package/dist/build/p-a5eb1757.entry.js +0 -2
- package/dist/build/p-a6576739.entry.js +0 -2
- package/dist/build/p-ad5ba47b.entry.js +0 -2
- package/dist/build/p-b4121a02.entry.js +0 -2
- package/dist/build/p-b4616ed4.entry.js +0 -2
- package/dist/build/p-ba02ea5b.entry.js +0 -2
- package/dist/build/p-bf38e363.entry.js +0 -2
- package/dist/build/p-c770eac3.entry.js +0 -2
- package/dist/build/p-d774205e.entry.js +0 -2
- package/dist/build/p-eee779b4.entry.js +0 -2
- package/dist/paperless/p-0065fc80.entry.js +0 -2
- package/dist/paperless/p-04fe2be7.entry.js +0 -2
- package/dist/paperless/p-11e2e81c.entry.js +0 -2
- package/dist/paperless/p-32ce71f9.entry.js +0 -2
- package/dist/paperless/p-3a1fa184.entry.js +0 -2
- package/dist/paperless/p-60b6c14b.entry.js +0 -2
- package/dist/paperless/p-649b1a0a.entry.js +0 -2
- package/dist/paperless/p-6a65767e.entry.js +0 -2
- package/dist/paperless/p-745b9852.entry.js +0 -2
- package/dist/paperless/p-7e654e16.entry.js +0 -2
- package/dist/paperless/p-963d2b2a.entry.js +0 -2
- package/dist/paperless/p-97ea9ebe.entry.js +0 -2
- package/dist/paperless/p-9dc6f147.entry.js +0 -2
- package/dist/paperless/p-9f88e06d.entry.js +0 -2
- package/dist/paperless/p-a206e4cd.entry.js +0 -2
- package/dist/paperless/p-a5eb1757.entry.js +0 -2
- package/dist/paperless/p-a6576739.entry.js +0 -2
- package/dist/paperless/p-ad5ba47b.entry.js +0 -2
- package/dist/paperless/p-b4121a02.entry.js +0 -2
- package/dist/paperless/p-b4616ed4.entry.js +0 -2
- package/dist/paperless/p-ba02ea5b.entry.js +0 -2
- package/dist/paperless/p-bf38e363.entry.js +0 -2
- package/dist/paperless/p-c770eac3.entry.js +0 -2
- package/dist/paperless/p-d774205e.entry.js +0 -2
- package/dist/paperless/p-eee779b4.entry.js +0 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["tableComponentCss","Table","this","_ctrlDown","defaultSize","defaultSizeOptions","_a","formatTranslation","_locales","empty_state","no_filter","header","content","action","filtered","componentWillLoad","_setLocales","_parseItems","items","_generateColumns","componentDidRender","hasRendered","emit","render","h","Host","class","quickFilters","activeQuickFilterIdentifier","onQuickFilter","detail","quickFilter","enableSearch","query","onQueryChange","queryChange","enableFilter","selectedFiltersAmount","filterButtonTemplate","onFilter","filter","enableEdit","canEdit","selectedRows","length","editButtonTemplate","onEdit","edit","itemsSelectedAmount","_b","loading","headerLoading","_getHeader","_getRows","hideOnSinglePage","enablePageSize","pageSize","pageSizeOptions","onPageSizeChange","pageSizeChange","enablePagination","page","total","onPageChange","pageChange","enableExport","onExport","export","footerLoading","async","getLocaleComponentStrings","_el","onTableDefinitionUpdated","keyDown","key","keyUp","visibilityChange","document","visibilityState","_items","Array","isArray","JSON","parse","definitions","querySelectorAll","_columns","from","variant","map","col","index","definition","value","name","checkbox","_getCheckbox","amountOfLoadingRows","_","i","enableHover","enableRowSelection","enableRowClick","_getLoadingColumns","_getEmptyState","item","onClick","ev","_rowClick","_getRowColumns","colIndex","rowIndex","selectionKey","type","onChange","_selectAllChange","checked","_selectionContainsAll","indeterminate","_selectionIndeterminate","_checkboxChange","target","disabled","canSelectKey","_selectionContains","emptyStateFilteredHeader","emptyStateFilteredContent","emptyStateActionClick","emptyStateHeader","emptyStateContent","icon","size","emptyStateAction","$event","_getCheckedValue","toAdd","row","push","rowSelected","selectedRowsChange","find","d","_getSelectionValue","rowDeselected","indexOfToRemove","selection","splice","returnIndex","returnValue","findIndex","contains","containsCount","_c","tagName","toLowerCase","_findRow","_findRowAction","rowClick","ctrlDown","querySelector","el","parentElement","getAttribute"],"sources":["./src/components/organisms/table/table.component.scss?tag=p-table","./src/components/organisms/table/table.component.tsx"],"sourcesContent":["p-table {\n @apply flex flex-col;\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { QuickFilter, RowClickEvent } from '../../../types/table';\nimport { formatTranslation, getLocaleComponentStrings } from '../../../utils';\nimport { TableColumn } from '../../helpers/table-column/table-column.component';\nimport {\n defaultSize,\n defaultSizeOptions,\n} from '../../molecules/page-size-select/constants';\nimport { buttonTemplateFunc } from '../../molecules/table-header/table-header.component';\n\nexport type templateFunc = () => string;\n\n@Component({\n tag: 'p-table',\n styleUrl: 'table.component.scss',\n})\nexport class Table {\n /**\n * The items to be fed to the table\n */\n @Prop() items: string;\n\n /**\n * Wether data is loading\n */\n @Prop() loading: boolean = false;\n\n /**\n * Wether the header should show loading state\n */\n @Prop() headerLoading: boolean = false;\n\n /**\n * Wether the footer should show loading state\n */\n @Prop() footerLoading: boolean = false;\n\n /**\n * The amount of loading rows to show\n */\n @Prop() amountOfLoadingRows: number = 6;\n\n /**\n * Wether to enable selection\n */\n @Prop() enableRowSelection: boolean = true;\n\n /**\n * Wether to enable row clicking\n */\n @Prop() enableRowClick: boolean = true;\n\n /**\n * The current selection of items\n */\n @Prop() selectedRows: any[] = [];\n\n /**\n * Event whenever the current selection changes\n */\n @Event() selectedRowsChange: EventEmitter<any>;\n\n /**\n * The key to determine if a row is selected\n */\n @Prop() selectionKey: string;\n\n /**\n * A key to determine if a row can be selected\n */\n @Prop() canSelectKey: string;\n\n /**\n * Event whenever a row is clicked\n */\n @Event() rowClick: EventEmitter<RowClickEvent>;\n\n /**\n * Event whenever a row is selected\n */\n @Event() rowSelected: EventEmitter<any>;\n\n /**\n * Event whenever a row is deselected\n */\n @Event() rowDeselected: EventEmitter<any>;\n\n /**\n * Event when the table has rendered\n */\n @Event() hasRendered: EventEmitter<number>;\n\n /** START HEADER */\n /**\n * Quick filters to show\n */\n @Prop() quickFilters: QuickFilter[] = [];\n\n /**\n * Active quick filter identifier\n */\n @Prop() activeQuickFilterIdentifier: string;\n\n /**\n * Wether to show the search input\n */\n @Prop() enableSearch: boolean = true;\n\n /**\n * The query to show in the search bar\n */\n @Prop({ mutable: true }) query: string;\n\n /**\n * Wether to show the filter button\n */\n @Prop() enableFilter: boolean = true;\n\n /**\n * The amount of filters being selected\n */\n @Prop() selectedFiltersAmount: number;\n\n /**\n * The template for the filter button text\n */\n @Prop() filterButtonTemplate: templateFunc;\n\n /**\n * Wether to show the edit button\n */\n @Prop() enableEdit: boolean = true;\n\n /**\n * The template for the edit button text\n */\n @Prop() editButtonTemplate: buttonTemplateFunc;\n\n /**\n * Event when one of the quick filters is clicked\n */\n @Event() quickFilter: EventEmitter<QuickFilter>;\n\n /**\n * Event when the query changes\n */\n @Event() queryChange: EventEmitter<string>;\n\n /**\n * Event when the filter button is clicked\n */\n @Event() filter: EventEmitter<null>;\n\n /**\n * Event when the edit button is clicked\n */\n @Event() edit: EventEmitter<null>;\n\n /** START FOOTER */\n\n /**\n * Wether to enable page size select\n */\n @Prop() enablePageSize: boolean = true;\n\n /**\n * Wether to enable pagination\n */\n @Prop() enablePagination: boolean = true;\n\n /**\n * Wether to enable export\n */\n @Prop() enableExport: boolean = true;\n\n /**\n * The current page\n */\n @Prop({ mutable: true, reflect: true }) page: number = 1;\n\n /**\n * The total amount of items\n */\n @Prop() total!: number;\n\n /**\n * Event whenever the page changes\n */\n @Event() pageChange: EventEmitter<number>;\n\n /**\n * The amount of items per page\n */\n @Prop() pageSize: number = defaultSize;\n\n /**\n * The options for the page size\n */\n @Prop() pageSizeOptions: number[] = defaultSizeOptions;\n\n /**\n * Event whenever the page changes\n */\n @Event() pageSizeChange: EventEmitter<number>;\n\n /**\n * Event whenever the page changes\n */\n @Event() export: EventEmitter<number>;\n\n /**\n * Wether to hide when there is only 1 page available\n */\n @Prop() hideOnSinglePage: boolean = true;\n\n /* Empty state start */\n\n @Prop() emptyStateHeader: templateFunc = () =>\n formatTranslation(this._locales.empty_state?.no_filter.header);\n @Prop() emptyStateContent: templateFunc = () =>\n formatTranslation(this._locales.empty_state?.no_filter.content);\n @Prop() emptyStateAction: templateFunc = () =>\n formatTranslation(this._locales.empty_state?.no_filter.action);\n\n @Prop() emptyStateFilteredHeader: templateFunc = () =>\n formatTranslation(this._locales.empty_state.filtered.header);\n @Prop() emptyStateFilteredContent: templateFunc = () =>\n formatTranslation(this._locales.empty_state.filtered.content);\n\n /**\n * Event whenever the empty state is clicked\n */\n @Event() emptyStateActionClick: EventEmitter<null>;\n\n /* Empty state end */\n\n /**\n * The host element\n */\n @Element() private _el: HTMLElement;\n\n /**\n * Locales used for this component\n */\n @State() private _locales: any = {};\n\n @State() private _columns: any[] = [];\n @State() private _items: any[] = [];\n\n private _ctrlDown = false;\n\n componentWillLoad() {\n this._setLocales();\n this._parseItems(this.items);\n this._generateColumns();\n }\n\n componentDidRender() {\n this.hasRendered.emit();\n }\n\n render() {\n return (\n <Host class=\"p-table\">\n <p-table-container>\n <p-table-header\n // quick filters\n quickFilters={this.quickFilters}\n activeQuickFilterIdentifier={\n this.activeQuickFilterIdentifier\n }\n onQuickFilter={({ detail }) =>\n this.quickFilter.emit(detail)\n }\n // search\n enableSearch={this.enableSearch}\n query={this.query}\n onQueryChange={({ detail }) =>\n this.queryChange.emit(detail)\n }\n // filter button\n enableFilter={this.enableFilter}\n selectedFiltersAmount={this.selectedFiltersAmount}\n filterButtonTemplate={this.filterButtonTemplate}\n onFilter={() => this.filter.emit()}\n // edit button\n enableEdit={this.enableEdit}\n canEdit={!!this.selectedRows?.length}\n editButtonTemplate={this.editButtonTemplate}\n onEdit={() => this.edit.emit()}\n itemsSelectedAmount={this.selectedRows?.length}\n //loading\n loading={this.headerLoading}\n ></p-table-header>\n\n {this._getHeader()}\n <div class=\"flex flex-col\">{this._getRows()}</div>\n\n <p-table-footer\n // overall\n hideOnSinglePage={this.hideOnSinglePage}\n // page size select\n enablePageSize={this.enablePageSize}\n pageSize={this.pageSize}\n pageSizeOptions={this.pageSizeOptions}\n onPageSizeChange={({ detail }) =>\n this.pageSizeChange.emit(detail)\n }\n // pagination\n enablePagination={this.enablePagination}\n page={this.page}\n total={this.total}\n onPageChange={({ detail }) =>\n this.pageChange.emit(detail)\n }\n // export\n enableExport={this.enableExport}\n onExport={() => this.export.emit()}\n //loading\n loading={this.footerLoading}\n ></p-table-footer>\n </p-table-container>\n </Host>\n );\n }\n\n @Listen('localeChanged', { target: 'body' })\n private async _setLocales(): Promise<void> {\n this._locales = await getLocaleComponentStrings(this._el);\n }\n\n @Listen('tableDefinitionChanged', { target: 'body' })\n onTableDefinitionUpdated() {\n this._generateColumns();\n }\n\n @Listen('keydown', { target: 'document' })\n keyDown({ key }) {\n if (key !== 'Control' || this._ctrlDown === true) {\n return;\n }\n\n this._ctrlDown = true;\n }\n\n @Listen('keyup', { target: 'document' })\n keyUp({ key }) {\n if (key !== 'Control' || this._ctrlDown === false) {\n return;\n }\n\n this._ctrlDown = false;\n }\n\n @Listen('visibilitychange', { target: 'document' })\n visibilityChange() {\n if (document.visibilityState !== 'hidden' || this._ctrlDown === false) {\n return;\n }\n\n this._ctrlDown = false;\n }\n\n @Watch('items')\n private _parseItems(items: string) {\n if (!items) {\n this._items = [];\n return;\n }\n\n if (Array.isArray(items)) {\n this._items = items;\n return;\n }\n\n this._items = JSON.parse(items);\n }\n\n private _generateColumns() {\n const definitions = this._el.querySelectorAll('p-table-column');\n this._columns = Array.from(definitions);\n }\n\n private _getHeader() {\n return (\n <p-table-row variant=\"header\">\n {this._columns.map((col: TableColumn, index) => (\n <p-table-cell\n definition={col}\n value={col.name}\n variant=\"header\"\n checkbox={this._getCheckbox(index, null, 'header')}\n index={index}\n ></p-table-cell>\n ))}\n </p-table-row>\n );\n }\n\n private _getRows() {\n if (this.loading) {\n return Array.from(\n {\n length: this.amountOfLoadingRows,\n },\n (_, i) => (\n <p-table-row\n enableHover={\n this.enableRowSelection || this.enableRowClick\n }\n >\n {this._getLoadingColumns(i)}\n </p-table-row>\n )\n );\n }\n\n if (!this._items.length) {\n return this._getEmptyState();\n }\n\n return this._items.map((item, index) => (\n <p-table-row\n enableHover={this.enableRowSelection || this.enableRowClick}\n onClick={(ev) => this._rowClick(ev, index)}\n >\n {this._getRowColumns(item, index)}\n </p-table-row>\n ));\n }\n\n private _getRowColumns(item, index) {\n return this._columns.map((col: TableColumn, colIndex) => {\n return (\n <p-table-cell\n definition={col}\n item={item}\n checkbox={this._getCheckbox(colIndex, index)}\n index={colIndex}\n rowIndex={index}\n ></p-table-cell>\n );\n });\n }\n\n private _getLoadingColumns(index) {\n return this._columns.map((col: TableColumn, colIndex) => {\n return (\n <p-table-cell\n definition={col}\n variant=\"loading\"\n checkbox={this._getCheckbox(colIndex, index, 'loading')}\n index={colIndex}\n rowIndex={index}\n ></p-table-cell>\n );\n });\n }\n\n private _getCheckbox(\n index,\n rowIndex,\n variant: 'header' | 'default' | 'loading' = 'default'\n ) {\n if (!this.enableRowSelection || !this.selectionKey || index !== 0) {\n return;\n }\n\n if (variant === 'loading') {\n return <p-loader variant=\"ghost\" class=\"rounded w-6 h-6\" />;\n }\n\n if (variant === 'header') {\n return (\n <input\n class=\"p-input\"\n type=\"checkbox\"\n onChange={(ev) => this._selectAllChange(ev)}\n checked={this._selectionContainsAll()}\n indeterminate={this._selectionIndeterminate()}\n />\n );\n }\n\n const item = this._items[rowIndex];\n\n return (\n <input\n class=\"p-input\"\n type=\"checkbox\"\n onChange={(ev) => this._checkboxChange(ev?.target, rowIndex)}\n disabled={this.canSelectKey && !item[this.canSelectKey]}\n checked={this._selectionContains(item, rowIndex)}\n />\n );\n }\n\n private _getEmptyState() {\n if (this.query?.length || this.selectedFiltersAmount) {\n return (\n <div class=\"flex flex-col items-center text-center py-24 max-w-[20rem] self-center\">\n <p-illustration variant=\"empty-state-search\" class=\"mb-6\" />\n <p class=\"font-semibold text-storm-default\">\n {this.emptyStateFilteredHeader()}\n </p>\n <p class=\"text-sm text-storm-medium mb-14\">\n {this.emptyStateFilteredContent()}\n </p>\n </div>\n );\n }\n\n return (\n <div class=\"flex flex-col items-center text-center py-24 max-w-[20rem] self-center\">\n <p-illustration\n variant=\"empty-state-overview\"\n class=\"cursor-pointer mb-6\"\n onClick={() => this.emptyStateActionClick.emit(null)}\n />\n <p class=\"font-semibold text-storm-default\">\n {this.emptyStateHeader()}\n </p>\n <p class=\"text-sm text-storm-medium mb-6\">\n {this.emptyStateContent()}\n </p>\n <p-button\n variant=\"secondary\"\n icon=\"plus\"\n size=\"small\"\n onClick={() => this.emptyStateActionClick.emit(null)}\n >\n {this.emptyStateAction()}\n </p-button>\n </div>\n );\n }\n\n private _selectAllChange($event: any) {\n if (!this.enableRowSelection) {\n return;\n }\n\n const value = this._getCheckedValue($event.target);\n if (value) {\n const toAdd = [];\n for (let i = 0; i < this._items.length; i++) {\n const row = this._items[i];\n if (this.canSelectKey && !row[this.canSelectKey]) {\n continue;\n }\n\n if (this._selectionContains(row, i)) {\n continue;\n }\n\n toAdd.push(row);\n this.rowSelected.emit(row);\n }\n\n this.selectedRows = [...this.selectedRows, ...toAdd];\n this.selectedRowsChange.emit(this.selectedRows);\n return;\n }\n\n for (let i = 0; i < this.selectedRows.length; i++) {\n const value = this.selectedRows[i];\n const row = this._items.find(\n (d) =>\n this._getSelectionValue(d, i) ===\n this._getSelectionValue(value, i)\n );\n\n if (!row) {\n continue;\n }\n\n this.rowDeselected.emit(row);\n }\n\n this.selectedRows = [];\n this.selectedRowsChange.emit(this.selectedRows);\n }\n\n private _checkboxChange(target: any, index: number) {\n if (!this.enableRowSelection) {\n return;\n }\n\n const row = this._items[index];\n\n if (this.canSelectKey && !row[this.canSelectKey]) {\n target.checked = false;\n return;\n }\n\n const value = this._getCheckedValue(target);\n if (value) {\n this.selectedRows = [...this.selectedRows, row];\n this.selectedRowsChange.emit(this.selectedRows);\n this.rowSelected.emit(row);\n return;\n }\n\n const indexOfToRemove = this._selectionContains(row, index, true);\n\n // we need to do this, because splice does not trigger the selection setter.\n const selection = [...this.selectedRows];\n selection.splice(indexOfToRemove, 1);\n this.selectedRows = selection;\n this.selectedRowsChange.emit(this.selectedRows);\n this.rowDeselected.emit(row);\n }\n\n private _getCheckedValue(target: any) {\n return target?.checked;\n }\n\n private _getSelectionValue(row: any, index: number) {\n return this.selectionKey ? row?.[this.selectionKey] || index : index;\n }\n\n private _selectionContains(row, index, returnIndex = false): any {\n const returnValue = this.selectedRows.findIndex(\n (item) =>\n this._getSelectionValue(row, index) ===\n this._getSelectionValue(item, index)\n );\n return !returnIndex ? returnValue >= 0 : returnValue;\n }\n\n private _selectionContainsAll() {\n let returnValue = true;\n if (!this._items?.length) {\n return false;\n }\n\n for (let i = 0; i < this._items?.length; i++) {\n const item = this._items[i];\n const contains = this._selectionContains(item, i);\n\n if (!contains) {\n returnValue = false;\n break;\n }\n }\n\n return returnValue;\n }\n\n private _selectionIndeterminate() {\n if (!this._items?.length || !this.selectedRows?.length) {\n return false;\n }\n\n let containsCount = 0;\n for (let i = 0; i < this._items?.length; i++) {\n const item = this._items[i];\n const contains = this._selectionContains(item, i);\n\n if (contains) {\n containsCount++;\n }\n }\n\n return containsCount > 0 && containsCount !== this._items.length;\n }\n\n private _rowClick($event, index) {\n const target = $event.target;\n\n if (\n target.tagName.toLowerCase() === 'input' ||\n target.type === 'checkbox'\n ) {\n return;\n }\n\n const row = this._findRow($event.target);\n\n if (this.enableRowClick) {\n const action = this._findRowAction($event.target);\n\n if (action) {\n return;\n }\n\n const item = this._items[index];\n this.rowClick.emit({\n item,\n ctrlDown: this._ctrlDown,\n });\n return;\n }\n\n if (!this.enableRowSelection) {\n return;\n }\n\n const checkbox = row?.querySelector('input[type=\"checkbox\"]');\n\n if (!checkbox) {\n return;\n }\n\n checkbox.checked = !checkbox.checked;\n this._checkboxChange(checkbox, index);\n }\n\n private _findRow(el: HTMLElement) {\n if (!el) {\n return el;\n }\n\n if (el?.tagName?.toLowerCase() === 'p-table-row') {\n return el;\n }\n\n return this._findRow(el?.parentElement);\n }\n\n private _findRowAction(el: HTMLElement) {\n if (!el) {\n return null;\n }\n\n if (\n el.getAttribute('data-is-action') !== null &&\n el.getAttribute('data-is-action') !== 'false'\n ) {\n return el;\n }\n\n if (el?.tagName?.toLowerCase() === 'p-table-row') {\n return null;\n }\n\n return this._findRowAction(el?.parentElement);\n }\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"names":["tableComponentCss","Table","this","_ctrlDown","defaultSize","defaultSizeOptions","_a","formatTranslation","_locales","empty_state","no_filter","header","content","action","filtered","componentWillLoad","_setLocales","_parseItems","items","_generateColumns","componentDidRender","hasRendered","emit","render","h","Host","class","quickFilters","activeQuickFilterIdentifier","onQuickFilter","detail","quickFilter","enableSearch","query","onQueryChange","queryChange","enableFilter","selectedFiltersAmount","filterButtonTemplate","onFilter","filter","enableEdit","canEdit","selectedRows","length","editButtonTemplate","onEdit","edit","itemsSelectedAmount","_b","loading","headerLoading","_getHeader","_getRows","hideOnSinglePage","enablePageSize","pageSize","pageSizeOptions","onPageSizeChange","pageSizeChange","enablePagination","page","total","onPageChange","pageChange","enableExport","onExport","export","footerLoading","async","getLocaleComponentStrings","_el","onTableDefinitionUpdated","keyDown","key","keyUp","visibilityChange","document","visibilityState","_items","Array","isArray","JSON","parse","definitions","querySelectorAll","_columns","from","variant","map","col","index","definition","value","name","checkbox","_getCheckbox","amountOfLoadingRows","_","i","enableHover","enableRowSelection","enableRowClick","_getLoadingColumns","_getEmptyState","item","onClick","ev","_rowClick","_getRowColumns","colIndex","rowIndex","selectionKey","type","onChange","_selectAllChange","checked","_selectionContainsAll","indeterminate","_selectionIndeterminate","_checkboxChange","target","disabled","canSelectKey","_selectionContains","emptyStateFilteredHeader","emptyStateFilteredContent","emptyStateActionClick","emptyStateHeader","emptyStateContent","icon","size","emptyStateAction","$event","_getCheckedValue","toAdd","row","push","rowSelected","selectedRowsChange","find","d","_getSelectionValue","rowDeselected","indexOfToRemove","selection","splice","returnIndex","returnValue","findIndex","contains","containsCount","_c","tagName","toLowerCase","_findRow","_findRowAction","rowClick","ctrlDown","querySelector","el","parentElement","getAttribute"],"sources":["./src/components/organisms/table/table.component.scss?tag=p-table","./src/components/organisms/table/table.component.tsx"],"sourcesContent":["p-table {\n @apply flex flex-col;\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { QuickFilter, RowClickEvent } from '../../../types/table';\nimport { formatTranslation, getLocaleComponentStrings } from '../../../utils';\nimport { TableColumn } from '../../helpers/table-column/table-column.component';\nimport {\n defaultSize,\n defaultSizeOptions,\n} from '../../molecules/page-size-select/constants';\nimport { buttonTemplateFunc } from '../../molecules/table-header/table-header.component';\n\nexport type templateFunc = () => string;\n\n@Component({\n tag: 'p-table',\n styleUrl: 'table.component.scss',\n})\nexport class Table {\n /**\n * The items to be fed to the table\n */\n @Prop() items: string;\n\n /**\n * Wether data is loading\n */\n @Prop() loading: boolean = false;\n\n /**\n * Wether the header should show loading state\n */\n @Prop() headerLoading: boolean = false;\n\n /**\n * Wether the footer should show loading state\n */\n @Prop() footerLoading: boolean = false;\n\n /**\n * The amount of loading rows to show\n */\n @Prop() amountOfLoadingRows: number = 6;\n\n /**\n * Wether to enable selection\n */\n @Prop() enableRowSelection: boolean = true;\n\n /**\n * Wether to enable row clicking\n */\n @Prop() enableRowClick: boolean = true;\n\n /**\n * The current selection of items\n */\n @Prop() selectedRows: any[] = [];\n\n /**\n * Event whenever the current selection changes\n */\n @Event() selectedRowsChange: EventEmitter<any>;\n\n /**\n * The key to determine if a row is selected\n */\n @Prop() selectionKey: string;\n\n /**\n * A key to determine if a row can be selected\n */\n @Prop() canSelectKey: string;\n\n /**\n * Event whenever a row is clicked\n */\n @Event() rowClick: EventEmitter<RowClickEvent>;\n\n /**\n * Event whenever a row is selected\n */\n @Event() rowSelected: EventEmitter<any>;\n\n /**\n * Event whenever a row is deselected\n */\n @Event() rowDeselected: EventEmitter<any>;\n\n /**\n * Event when the table has rendered\n */\n @Event() hasRendered: EventEmitter<number>;\n\n /** START HEADER */\n /**\n * Quick filters to show\n */\n @Prop() quickFilters: QuickFilter[] = [];\n\n /**\n * Active quick filter identifier\n */\n @Prop() activeQuickFilterIdentifier: string;\n\n /**\n * Wether to show the search input\n */\n @Prop() enableSearch: boolean = true;\n\n /**\n * The query to show in the search bar\n */\n @Prop({ mutable: true }) query: string;\n\n /**\n * Wether to show the filter button\n */\n @Prop() enableFilter: boolean = true;\n\n /**\n * The amount of filters being selected\n */\n @Prop() selectedFiltersAmount: number;\n\n /**\n * The template for the filter button text\n */\n @Prop() filterButtonTemplate: templateFunc;\n\n /**\n * Wether to show the edit button\n */\n @Prop() enableEdit: boolean = true;\n\n /**\n * The template for the edit button text\n */\n @Prop() editButtonTemplate: buttonTemplateFunc;\n\n /**\n * Event when one of the quick filters is clicked\n */\n @Event() quickFilter: EventEmitter<QuickFilter>;\n\n /**\n * Event when the query changes\n */\n @Event() queryChange: EventEmitter<string>;\n\n /**\n * Event when the filter button is clicked\n */\n @Event() filter: EventEmitter<null>;\n\n /**\n * Event when the edit button is clicked\n */\n @Event() edit: EventEmitter<null>;\n\n /** START FOOTER */\n\n /**\n * Wether to enable page size select\n */\n @Prop() enablePageSize: boolean = true;\n\n /**\n * Wether to enable pagination\n */\n @Prop() enablePagination: boolean = true;\n\n /**\n * Wether to enable export\n */\n @Prop() enableExport: boolean = true;\n\n /**\n * The current page\n */\n @Prop({ mutable: true, reflect: true }) page: number = 1;\n\n /**\n * The total amount of items\n */\n @Prop() total!: number;\n\n /**\n * Event whenever the page changes\n */\n @Event() pageChange: EventEmitter<number>;\n\n /**\n * The amount of items per page\n */\n @Prop() pageSize: number = defaultSize;\n\n /**\n * The options for the page size\n */\n @Prop() pageSizeOptions: number[] = defaultSizeOptions;\n\n /**\n * Event whenever the page changes\n */\n @Event() pageSizeChange: EventEmitter<number>;\n\n /**\n * Event whenever the page changes\n */\n @Event() export: EventEmitter<number>;\n\n /**\n * Wether to hide when there is only 1 page available\n */\n @Prop() hideOnSinglePage: boolean = true;\n\n /* Empty state start */\n\n @Prop() emptyStateHeader: templateFunc = () =>\n formatTranslation(this._locales.empty_state?.no_filter.header);\n @Prop() emptyStateContent: templateFunc = () =>\n formatTranslation(this._locales.empty_state?.no_filter.content);\n @Prop() emptyStateAction: templateFunc = () =>\n formatTranslation(this._locales.empty_state?.no_filter.action);\n\n @Prop() emptyStateFilteredHeader: templateFunc = () =>\n formatTranslation(this._locales.empty_state.filtered.header);\n @Prop() emptyStateFilteredContent: templateFunc = () =>\n formatTranslation(this._locales.empty_state.filtered.content);\n\n /**\n * Event whenever the empty state is clicked\n */\n @Event() emptyStateActionClick: EventEmitter<null>;\n\n /* Empty state end */\n\n /**\n * The host element\n */\n @Element() private _el: HTMLElement;\n\n /**\n * Locales used for this component\n */\n @State() private _locales: any = {};\n\n @State() private _columns: any[] = [];\n @State() private _items: any[] = [];\n\n private _ctrlDown = false;\n\n componentWillLoad() {\n this._setLocales();\n this._parseItems(this.items);\n this._generateColumns();\n }\n\n componentDidRender() {\n this.hasRendered.emit();\n }\n\n render() {\n return (\n <Host class=\"p-table\">\n <p-table-container>\n <p-table-header\n // quick filters\n quickFilters={this.quickFilters}\n activeQuickFilterIdentifier={\n this.activeQuickFilterIdentifier\n }\n onQuickFilter={({ detail }) =>\n this.quickFilter.emit(detail)\n }\n // search\n enableSearch={this.enableSearch}\n query={this.query}\n onQueryChange={({ detail }) =>\n this.queryChange.emit(detail)\n }\n // filter button\n enableFilter={this.enableFilter}\n selectedFiltersAmount={this.selectedFiltersAmount}\n filterButtonTemplate={this.filterButtonTemplate}\n onFilter={() => this.filter.emit()}\n // edit button\n enableEdit={this.enableEdit}\n canEdit={!!this.selectedRows?.length}\n editButtonTemplate={this.editButtonTemplate}\n onEdit={() => this.edit.emit()}\n itemsSelectedAmount={this.selectedRows?.length}\n //loading\n loading={this.headerLoading}\n ></p-table-header>\n\n {this._getHeader()}\n <div class=\"flex flex-col\">{this._getRows()}</div>\n\n <p-table-footer\n // overall\n hideOnSinglePage={this.hideOnSinglePage}\n // page size select\n enablePageSize={this.enablePageSize}\n pageSize={this.pageSize}\n pageSizeOptions={this.pageSizeOptions}\n onPageSizeChange={({ detail }) =>\n this.pageSizeChange.emit(detail)\n }\n // pagination\n enablePagination={this.enablePagination}\n page={this.page}\n total={this.total}\n onPageChange={({ detail }) =>\n this.pageChange.emit(detail)\n }\n // export\n enableExport={this.enableExport}\n onExport={() => this.export.emit()}\n //loading\n loading={this.footerLoading}\n ></p-table-footer>\n </p-table-container>\n </Host>\n );\n }\n\n @Listen('localeChanged', { target: 'body' })\n private async _setLocales(): Promise<void> {\n this._locales = await getLocaleComponentStrings(this._el);\n }\n\n @Listen('tableDefinitionChanged', { target: 'body' })\n onTableDefinitionUpdated() {\n this._generateColumns();\n }\n\n @Listen('keydown', { target: 'document' })\n keyDown({ key }) {\n if (key !== 'Control' || this._ctrlDown === true) {\n return;\n }\n\n this._ctrlDown = true;\n }\n\n @Listen('keyup', { target: 'document' })\n keyUp({ key }) {\n if (key !== 'Control' || this._ctrlDown === false) {\n return;\n }\n\n this._ctrlDown = false;\n }\n\n @Listen('visibilitychange', { target: 'document' })\n visibilityChange() {\n if (document.visibilityState !== 'hidden' || this._ctrlDown === false) {\n return;\n }\n\n this._ctrlDown = false;\n }\n\n @Watch('items')\n private _parseItems(items: string) {\n if (!items) {\n this._items = [];\n return;\n }\n\n if (Array.isArray(items)) {\n this._items = items;\n return;\n }\n\n this._items = JSON.parse(items);\n }\n\n private _generateColumns() {\n const definitions = this._el.querySelectorAll('p-table-column');\n this._columns = Array.from(definitions);\n }\n\n private _getHeader() {\n return (\n <p-table-row variant=\"header\">\n {this._columns.map((col: TableColumn, index) => (\n <p-table-cell\n definition={col}\n value={col.name}\n variant=\"header\"\n checkbox={this._getCheckbox(index, null, 'header')}\n index={index}\n ></p-table-cell>\n ))}\n </p-table-row>\n );\n }\n\n private _getRows() {\n if (this.loading) {\n return Array.from(\n {\n length: this.amountOfLoadingRows,\n },\n (_, i) => (\n <p-table-row\n enableHover={\n this.enableRowSelection || this.enableRowClick\n }\n >\n {this._getLoadingColumns(i)}\n </p-table-row>\n )\n );\n }\n\n if (!this._items.length) {\n return this._getEmptyState();\n }\n\n return this._items.map((item, index) => (\n <p-table-row\n enableHover={this.enableRowSelection || this.enableRowClick}\n onClick={(ev) => this._rowClick(ev, index)}\n >\n {this._getRowColumns(item, index)}\n </p-table-row>\n ));\n }\n\n private _getRowColumns(item, index) {\n return this._columns.map((col: TableColumn, colIndex) => {\n return (\n <p-table-cell\n definition={col}\n item={item}\n checkbox={this._getCheckbox(colIndex, index)}\n index={colIndex}\n rowIndex={index}\n ></p-table-cell>\n );\n });\n }\n\n private _getLoadingColumns(index) {\n return this._columns.map((col: TableColumn, colIndex) => {\n return (\n <p-table-cell\n definition={col}\n variant=\"loading\"\n checkbox={this._getCheckbox(colIndex, index, 'loading')}\n index={colIndex}\n rowIndex={index}\n ></p-table-cell>\n );\n });\n }\n\n private _getCheckbox(\n index,\n rowIndex,\n variant: 'header' | 'default' | 'loading' = 'default'\n ) {\n if (!this.enableRowSelection || !this.selectionKey || index !== 0) {\n return;\n }\n\n if (variant === 'loading') {\n return <p-loader variant=\"ghost\" class=\"rounded w-6 h-6\" />;\n }\n\n if (variant === 'header') {\n return (\n <input\n class=\"p-input\"\n type=\"checkbox\"\n onChange={(ev) => this._selectAllChange(ev)}\n checked={this._selectionContainsAll()}\n indeterminate={this._selectionIndeterminate()}\n />\n );\n }\n\n const item = this._items[rowIndex];\n\n return (\n <input\n class=\"p-input\"\n type=\"checkbox\"\n onChange={(ev) => this._checkboxChange(ev?.target, rowIndex)}\n disabled={this.canSelectKey && !item[this.canSelectKey]}\n checked={this._selectionContains(item, rowIndex)}\n />\n );\n }\n\n private _getEmptyState() {\n if (this.query?.length || this.selectedFiltersAmount) {\n return (\n <div class=\"flex flex-col items-center text-center py-24 max-w-[20rem] self-center\">\n <p-illustration variant=\"empty-state-search\" class=\"mb-6\" />\n <p class=\"font-semibold text-storm-default\">\n {this.emptyStateFilteredHeader()}\n </p>\n <p class=\"text-sm text-storm-medium mb-14\">\n {this.emptyStateFilteredContent()}\n </p>\n </div>\n );\n }\n\n return (\n <div class=\"flex flex-col items-center text-center py-24 max-w-[20rem] self-center\">\n <p-illustration\n variant=\"empty-state-overview\"\n class=\"cursor-pointer mb-6\"\n onClick={() => this.emptyStateActionClick.emit(null)}\n />\n <p class=\"font-semibold text-storm-default\">\n {this.emptyStateHeader()}\n </p>\n <p class=\"text-sm text-storm-medium mb-6\">\n {this.emptyStateContent()}\n </p>\n <p-button\n variant=\"secondary\"\n icon=\"plus\"\n size=\"small\"\n onClick={() => this.emptyStateActionClick.emit(null)}\n >\n {this.emptyStateAction()}\n </p-button>\n </div>\n );\n }\n\n private _selectAllChange($event: any) {\n if (!this.enableRowSelection) {\n return;\n }\n\n const value = this._getCheckedValue($event.target);\n if (value) {\n const toAdd = [];\n for (let i = 0; i < this._items.length; i++) {\n const row = this._items[i];\n if (this.canSelectKey && !row[this.canSelectKey]) {\n continue;\n }\n\n if (this._selectionContains(row, i)) {\n continue;\n }\n\n toAdd.push(row);\n this.rowSelected.emit(row);\n }\n\n this.selectedRows = [...this.selectedRows, ...toAdd];\n this.selectedRowsChange.emit(this.selectedRows);\n return;\n }\n\n for (let i = 0; i < this.selectedRows.length; i++) {\n const value = this.selectedRows[i];\n const row = this._items.find(\n (d) =>\n this._getSelectionValue(d, i) ===\n this._getSelectionValue(value, i)\n );\n\n if (!row) {\n continue;\n }\n\n this.rowDeselected.emit(row);\n }\n\n this.selectedRows = [];\n this.selectedRowsChange.emit(this.selectedRows);\n }\n\n private _checkboxChange(target: any, index: number) {\n if (!this.enableRowSelection) {\n return;\n }\n\n const row = this._items[index];\n\n if (this.canSelectKey && !row[this.canSelectKey]) {\n target.checked = false;\n return;\n }\n\n const value = this._getCheckedValue(target);\n if (value) {\n this.selectedRows = [...this.selectedRows, row];\n this.selectedRowsChange.emit(this.selectedRows);\n this.rowSelected.emit(row);\n return;\n }\n\n const indexOfToRemove = this._selectionContains(row, index, true);\n\n // we need to do this, because splice does not trigger the selection setter.\n const selection = [...this.selectedRows];\n selection.splice(indexOfToRemove, 1);\n this.selectedRows = selection;\n this.selectedRowsChange.emit(this.selectedRows);\n this.rowDeselected.emit(row);\n }\n\n private _getCheckedValue(target: any) {\n return target?.checked;\n }\n\n private _getSelectionValue(row: any, index: number) {\n return this.selectionKey ? row?.[this.selectionKey] || index : index;\n }\n\n private _selectionContains(row, index, returnIndex = false): any {\n const returnValue = this.selectedRows.findIndex(\n (item) =>\n this._getSelectionValue(row, index) ===\n this._getSelectionValue(item, index)\n );\n return !returnIndex ? returnValue >= 0 : returnValue;\n }\n\n private _selectionContainsAll() {\n let returnValue = true;\n if (!this._items?.length) {\n return false;\n }\n\n for (let i = 0; i < this._items?.length; i++) {\n const item = this._items[i];\n const contains = this._selectionContains(item, i);\n\n if (!contains) {\n returnValue = false;\n break;\n }\n }\n\n return returnValue;\n }\n\n private _selectionIndeterminate() {\n if (!this._items?.length || !this.selectedRows?.length) {\n return false;\n }\n\n let containsCount = 0;\n for (let i = 0; i < this._items?.length; i++) {\n const item = this._items[i];\n const contains = this._selectionContains(item, i);\n\n if (contains) {\n containsCount++;\n }\n }\n\n return containsCount > 0 && containsCount !== this._items.length;\n }\n\n private _rowClick($event, index) {\n const target = $event.target;\n\n if (\n target.tagName.toLowerCase() === 'input' ||\n target.type === 'checkbox'\n ) {\n return;\n }\n\n const row = this._findRow($event.target);\n\n if (this.enableRowClick) {\n const action = this._findRowAction($event.target);\n\n if (action) {\n return;\n }\n\n const item = this._items[index];\n this.rowClick.emit({\n item,\n ctrlDown: this._ctrlDown,\n });\n return;\n }\n\n if (!this.enableRowSelection) {\n return;\n }\n\n const checkbox = row?.querySelector('input[type=\"checkbox\"]');\n\n if (!checkbox) {\n return;\n }\n\n checkbox.checked = !checkbox.checked;\n this._checkboxChange(checkbox, index);\n }\n\n private _findRow(el: HTMLElement) {\n if (!el) {\n return el;\n }\n\n if (el?.tagName?.toLowerCase() === 'p-table-row') {\n return el;\n }\n\n return this._findRow(el?.parentElement);\n }\n\n private _findRowAction(el: HTMLElement) {\n if (!el) {\n return null;\n }\n\n if (\n el.getAttribute('data-is-action') !== null &&\n el.getAttribute('data-is-action') !== 'false'\n ) {\n return el;\n }\n\n if (el?.tagName?.toLowerCase() === 'p-table-row') {\n return null;\n }\n\n return this._findRowAction(el?.parentElement);\n }\n}\n"],"mappings":"sJAAA,MAAMA,EAAoB,w0W,MC2BbC,EAAK,M,gjBAyONC,KAAAC,UAAY,M,kCAhOO,M,mBAKM,M,mBAKA,M,yBAKK,E,wBAKA,K,oBAKJ,K,kBAKJ,G,0EAyCQ,G,6DAUN,K,uCAUA,K,yFAeF,K,sDAgCI,K,sBAKE,K,kBAKJ,K,UAKuB,E,mCAe5BC,E,qBAKSC,E,sBAeA,K,sBAIK,SAAAC,EACrC,OAAAC,GAAkBD,EAAAJ,KAAKM,SAASC,eAAW,MAAAH,SAAA,SAAAA,EAAEI,UAAUC,OAAO,E,uBACxB,SAAAL,EACtC,OAAAC,GAAkBD,EAAAJ,KAAKM,SAASC,eAAW,MAAAH,SAAA,SAAAA,EAAEI,UAAUE,QAAQ,E,sBAC1B,SAAAN,EACrC,OAAAC,GAAkBD,EAAAJ,KAAKM,SAASC,eAAW,MAAAH,SAAA,SAAAA,EAAEI,UAAUG,OAAO,E,8BAEjB,IAC7CN,EAAkBL,KAAKM,SAASC,YAAYK,SAASH,Q,+BACP,IAC9CJ,EAAkBL,KAAKM,SAASC,YAAYK,SAASF,S,cAiBxB,G,cAEE,G,YACF,E,CAIjCG,oBACIb,KAAKc,cACLd,KAAKe,YAAYf,KAAKgB,OACtBhB,KAAKiB,kB,CAGTC,qBACIlB,KAAKmB,YAAYC,M,CAGrBC,S,QACI,OACIC,EAACC,EAAI,CAACC,MAAM,WACRF,EAAA,yBACIA,EAAA,kBAEIG,aAAczB,KAAKyB,aACnBC,4BACI1B,KAAK0B,4BAETC,cAAe,EAAGC,YACd5B,KAAK6B,YAAYT,KAAKQ,GAG1BE,aAAc9B,KAAK8B,aACnBC,MAAO/B,KAAK+B,MACZC,cAAe,EAAGJ,YACd5B,KAAKiC,YAAYb,KAAKQ,GAG1BM,aAAclC,KAAKkC,aACnBC,sBAAuBnC,KAAKmC,sBAC5BC,qBAAsBpC,KAAKoC,qBAC3BC,SAAU,IAAMrC,KAAKsC,OAAOlB,OAE5BmB,WAAYvC,KAAKuC,WACjBC,YAAWpC,EAAAJ,KAAKyC,gBAAY,MAAArC,SAAA,SAAAA,EAAEsC,QAC9BC,mBAAoB3C,KAAK2C,mBACzBC,OAAQ,IAAM5C,KAAK6C,KAAKzB,OACxB0B,qBAAqBC,EAAA/C,KAAKyC,gBAAY,MAAAM,SAAA,SAAAA,EAAEL,OAExCM,QAAShD,KAAKiD,gBAGjBjD,KAAKkD,aACN5B,EAAA,OAAKE,MAAM,iBAAiBxB,KAAKmD,YAEjC7B,EAAA,kBAEI8B,iBAAkBpD,KAAKoD,iBAEvBC,eAAgBrD,KAAKqD,eACrBC,SAAUtD,KAAKsD,SACfC,gBAAiBvD,KAAKuD,gBACtBC,iBAAkB,EAAG5B,YACjB5B,KAAKyD,eAAerC,KAAKQ,GAG7B8B,iBAAkB1D,KAAK0D,iBACvBC,KAAM3D,KAAK2D,KACXC,MAAO5D,KAAK4D,MACZC,aAAc,EAAGjC,YACb5B,KAAK8D,WAAW1C,KAAKQ,GAGzBmC,aAAc/D,KAAK+D,aACnBC,SAAU,IAAMhE,KAAKiE,OAAO7C,OAE5B4B,QAAShD,KAAKkE,iB,CAQ1BC,oBACJnE,KAAKM,eAAiB8D,EAA0BpE,KAAKqE,I,CAIzDC,2BACItE,KAAKiB,kB,CAITsD,SAAQC,IAAEA,IACN,GAAIA,IAAQ,WAAaxE,KAAKC,YAAc,KAAM,CAC9C,M,CAGJD,KAAKC,UAAY,I,CAIrBwE,OAAMD,IAAEA,IACJ,GAAIA,IAAQ,WAAaxE,KAAKC,YAAc,MAAO,CAC/C,M,CAGJD,KAAKC,UAAY,K,CAIrByE,mBACI,GAAIC,SAASC,kBAAoB,UAAY5E,KAAKC,YAAc,MAAO,CACnE,M,CAGJD,KAAKC,UAAY,K,CAIbc,YAAYC,GAChB,IAAKA,EAAO,CACRhB,KAAK6E,OAAS,GACd,M,CAGJ,GAAIC,MAAMC,QAAQ/D,GAAQ,CACtBhB,KAAK6E,OAAS7D,EACd,M,CAGJhB,KAAK6E,OAASG,KAAKC,MAAMjE,E,CAGrBC,mBACJ,MAAMiE,EAAclF,KAAKqE,IAAIc,iBAAiB,kBAC9CnF,KAAKoF,SAAWN,MAAMO,KAAKH,E,CAGvBhC,aACJ,OACI5B,EAAA,eAAagE,QAAQ,UAChBtF,KAAKoF,SAASG,KAAI,CAACC,EAAkBC,IAClCnE,EAAA,gBACIoE,WAAYF,EACZG,MAAOH,EAAII,KACXN,QAAQ,SACRO,SAAU7F,KAAK8F,aAAaL,EAAO,KAAM,UACzCA,MAAOA,M,CAOnBtC,WACJ,GAAInD,KAAKgD,QAAS,CACd,OAAO8B,MAAMO,KACT,CACI3C,OAAQ1C,KAAK+F,sBAEjB,CAACC,EAAGC,IACA3E,EAAA,eACI4E,YACIlG,KAAKmG,oBAAsBnG,KAAKoG,gBAGnCpG,KAAKqG,mBAAmBJ,K,CAMzC,IAAKjG,KAAK6E,OAAOnC,OAAQ,CACrB,OAAO1C,KAAKsG,gB,CAGhB,OAAOtG,KAAK6E,OAAOU,KAAI,CAACgB,EAAMd,IAC1BnE,EAAA,eACI4E,YAAalG,KAAKmG,oBAAsBnG,KAAKoG,eAC7CI,QAAUC,GAAOzG,KAAK0G,UAAUD,EAAIhB,IAEnCzF,KAAK2G,eAAeJ,EAAMd,K,CAK/BkB,eAAeJ,EAAMd,GACzB,OAAOzF,KAAKoF,SAASG,KAAI,CAACC,EAAkBoB,IAEpCtF,EAAA,gBACIoE,WAAYF,EACZe,KAAMA,EACNV,SAAU7F,KAAK8F,aAAac,EAAUnB,GACtCA,MAAOmB,EACPC,SAAUpB,K,CAMlBY,mBAAmBZ,GACvB,OAAOzF,KAAKoF,SAASG,KAAI,CAACC,EAAkBoB,IAEpCtF,EAAA,gBACIoE,WAAYF,EACZF,QAAQ,UACRO,SAAU7F,KAAK8F,aAAac,EAAUnB,EAAO,WAC7CA,MAAOmB,EACPC,SAAUpB,K,CAMlBK,aACJL,EACAoB,EACAvB,EAA4C,WAE5C,IAAKtF,KAAKmG,qBAAuBnG,KAAK8G,cAAgBrB,IAAU,EAAG,CAC/D,M,CAGJ,GAAIH,IAAY,UAAW,CACvB,OAAOhE,EAAA,YAAUgE,QAAQ,QAAQ9D,MAAM,mB,CAG3C,GAAI8D,IAAY,SAAU,CACtB,OACIhE,EAAA,SACIE,MAAM,UACNuF,KAAK,WACLC,SAAWP,GAAOzG,KAAKiH,iBAAiBR,GACxCS,QAASlH,KAAKmH,wBACdC,cAAepH,KAAKqH,2B,CAKhC,MAAMd,EAAOvG,KAAK6E,OAAOgC,GAEzB,OACIvF,EAAA,SACIE,MAAM,UACNuF,KAAK,WACLC,SAAWP,GAAOzG,KAAKsH,gBAAgBb,IAAE,MAAFA,SAAE,SAAFA,EAAIc,OAAQV,GACnDW,SAAUxH,KAAKyH,eAAiBlB,EAAKvG,KAAKyH,cAC1CP,QAASlH,KAAK0H,mBAAmBnB,EAAMM,I,CAK3CP,iB,MACJ,KAAIlG,EAAAJ,KAAK+B,SAAK,MAAA3B,SAAA,SAAAA,EAAEsC,SAAU1C,KAAKmC,sBAAuB,CAClD,OACIb,EAAA,OAAKE,MAAM,0EACPF,EAAA,kBAAgBgE,QAAQ,qBAAqB9D,MAAM,SACnDF,EAAA,KAAGE,MAAM,oCACJxB,KAAK2H,4BAEVrG,EAAA,KAAGE,MAAM,mCACJxB,KAAK4H,6B,CAMtB,OACItG,EAAA,OAAKE,MAAM,0EACPF,EAAA,kBACIgE,QAAQ,uBACR9D,MAAM,sBACNgF,QAAS,IAAMxG,KAAK6H,sBAAsBzG,KAAK,QAEnDE,EAAA,KAAGE,MAAM,oCACJxB,KAAK8H,oBAEVxG,EAAA,KAAGE,MAAM,kCACJxB,KAAK+H,qBAEVzG,EAAA,YACIgE,QAAQ,YACR0C,KAAK,OACLC,KAAK,QACLzB,QAAS,IAAMxG,KAAK6H,sBAAsBzG,KAAK,OAE9CpB,KAAKkI,oB,CAMdjB,iBAAiBkB,GACrB,IAAKnI,KAAKmG,mBAAoB,CAC1B,M,CAGJ,MAAMR,EAAQ3F,KAAKoI,iBAAiBD,EAAOZ,QAC3C,GAAI5B,EAAO,CACP,MAAM0C,EAAQ,GACd,IAAK,IAAIpC,EAAI,EAAGA,EAAIjG,KAAK6E,OAAOnC,OAAQuD,IAAK,CACzC,MAAMqC,EAAMtI,KAAK6E,OAAOoB,GACxB,GAAIjG,KAAKyH,eAAiBa,EAAItI,KAAKyH,cAAe,CAC9C,Q,CAGJ,GAAIzH,KAAK0H,mBAAmBY,EAAKrC,GAAI,CACjC,Q,CAGJoC,EAAME,KAAKD,GACXtI,KAAKwI,YAAYpH,KAAKkH,E,CAG1BtI,KAAKyC,aAAe,IAAIzC,KAAKyC,gBAAiB4F,GAC9CrI,KAAKyI,mBAAmBrH,KAAKpB,KAAKyC,cAClC,M,CAGJ,IAAK,IAAIwD,EAAI,EAAGA,EAAIjG,KAAKyC,aAAaC,OAAQuD,IAAK,CAC/C,MAAMN,EAAQ3F,KAAKyC,aAAawD,GAChC,MAAMqC,EAAMtI,KAAK6E,OAAO6D,MACnBC,GACG3I,KAAK4I,mBAAmBD,EAAG1C,KAC3BjG,KAAK4I,mBAAmBjD,EAAOM,KAGvC,IAAKqC,EAAK,CACN,Q,CAGJtI,KAAK6I,cAAczH,KAAKkH,E,CAG5BtI,KAAKyC,aAAe,GACpBzC,KAAKyI,mBAAmBrH,KAAKpB,KAAKyC,a,CAG9B6E,gBAAgBC,EAAa9B,GACjC,IAAKzF,KAAKmG,mBAAoB,CAC1B,M,CAGJ,MAAMmC,EAAMtI,KAAK6E,OAAOY,GAExB,GAAIzF,KAAKyH,eAAiBa,EAAItI,KAAKyH,cAAe,CAC9CF,EAAOL,QAAU,MACjB,M,CAGJ,MAAMvB,EAAQ3F,KAAKoI,iBAAiBb,GACpC,GAAI5B,EAAO,CACP3F,KAAKyC,aAAe,IAAIzC,KAAKyC,aAAc6F,GAC3CtI,KAAKyI,mBAAmBrH,KAAKpB,KAAKyC,cAClCzC,KAAKwI,YAAYpH,KAAKkH,GACtB,M,CAGJ,MAAMQ,EAAkB9I,KAAK0H,mBAAmBY,EAAK7C,EAAO,MAG5D,MAAMsD,EAAY,IAAI/I,KAAKyC,cAC3BsG,EAAUC,OAAOF,EAAiB,GAClC9I,KAAKyC,aAAesG,EACpB/I,KAAKyI,mBAAmBrH,KAAKpB,KAAKyC,cAClCzC,KAAK6I,cAAczH,KAAKkH,E,CAGpBF,iBAAiBb,GACrB,OAAOA,IAAM,MAANA,SAAM,SAANA,EAAQL,O,CAGX0B,mBAAmBN,EAAU7C,GACjC,OAAOzF,KAAK8G,cAAewB,IAAG,MAAHA,SAAG,SAAHA,EAAMtI,KAAK8G,gBAAiBrB,EAAQA,C,CAG3DiC,mBAAmBY,EAAK7C,EAAOwD,EAAc,OACjD,MAAMC,EAAclJ,KAAKyC,aAAa0G,WACjC5C,GACGvG,KAAK4I,mBAAmBN,EAAK7C,KAC7BzF,KAAK4I,mBAAmBrC,EAAMd,KAEtC,OAAQwD,EAAcC,GAAe,EAAIA,C,CAGrC/B,wB,QACJ,IAAI+B,EAAc,KAClB,MAAK9I,EAAAJ,KAAK6E,UAAM,MAAAzE,SAAA,SAAAA,EAAEsC,QAAQ,CACtB,OAAO,K,CAGX,IAAK,IAAIuD,EAAI,EAAGA,IAAIlD,EAAA/C,KAAK6E,UAAM,MAAA9B,SAAA,SAAAA,EAAEL,QAAQuD,IAAK,CAC1C,MAAMM,EAAOvG,KAAK6E,OAAOoB,GACzB,MAAMmD,EAAWpJ,KAAK0H,mBAAmBnB,EAAMN,GAE/C,IAAKmD,EAAU,CACXF,EAAc,MACd,K,EAIR,OAAOA,C,CAGH7B,0B,UACJ,MAAKjH,EAAAJ,KAAK6E,UAAM,MAAAzE,SAAA,SAAAA,EAAEsC,YAAWK,EAAA/C,KAAKyC,gBAAY,MAAAM,SAAA,SAAAA,EAAEL,QAAQ,CACpD,OAAO,K,CAGX,IAAI2G,EAAgB,EACpB,IAAK,IAAIpD,EAAI,EAAGA,IAAIqD,EAAAtJ,KAAK6E,UAAM,MAAAyE,SAAA,SAAAA,EAAE5G,QAAQuD,IAAK,CAC1C,MAAMM,EAAOvG,KAAK6E,OAAOoB,GACzB,MAAMmD,EAAWpJ,KAAK0H,mBAAmBnB,EAAMN,GAE/C,GAAImD,EAAU,CACVC,G,EAIR,OAAOA,EAAgB,GAAKA,IAAkBrJ,KAAK6E,OAAOnC,M,CAGtDgE,UAAUyB,EAAQ1C,GACtB,MAAM8B,EAASY,EAAOZ,OAEtB,GACIA,EAAOgC,QAAQC,gBAAkB,SACjCjC,EAAOR,OAAS,WAClB,CACE,M,CAGJ,MAAMuB,EAAMtI,KAAKyJ,SAAStB,EAAOZ,QAEjC,GAAIvH,KAAKoG,eAAgB,CACrB,MAAMzF,EAASX,KAAK0J,eAAevB,EAAOZ,QAE1C,GAAI5G,EAAQ,CACR,M,CAGJ,MAAM4F,EAAOvG,KAAK6E,OAAOY,GACzBzF,KAAK2J,SAASvI,KAAK,CACfmF,OACAqD,SAAU5J,KAAKC,YAEnB,M,CAGJ,IAAKD,KAAKmG,mBAAoB,CAC1B,M,CAGJ,MAAMN,EAAWyC,IAAG,MAAHA,SAAG,SAAHA,EAAKuB,cAAc,0BAEpC,IAAKhE,EAAU,CACX,M,CAGJA,EAASqB,SAAWrB,EAASqB,QAC7BlH,KAAKsH,gBAAgBzB,EAAUJ,E,CAG3BgE,SAASK,G,MACb,IAAKA,EAAI,CACL,OAAOA,C,CAGX,KAAI1J,EAAA0J,IAAE,MAAFA,SAAE,SAAFA,EAAIP,WAAO,MAAAnJ,SAAA,SAAAA,EAAEoJ,iBAAkB,cAAe,CAC9C,OAAOM,C,CAGX,OAAO9J,KAAKyJ,SAASK,IAAE,MAAFA,SAAE,SAAFA,EAAIC,c,CAGrBL,eAAeI,G,MACnB,IAAKA,EAAI,CACL,OAAO,I,CAGX,GACIA,EAAGE,aAAa,oBAAsB,MACtCF,EAAGE,aAAa,oBAAsB,QACxC,CACE,OAAOF,C,CAGX,KAAI1J,EAAA0J,IAAE,MAAFA,SAAE,SAAFA,EAAIP,WAAO,MAAAnJ,SAAA,SAAAA,EAAEoJ,iBAAkB,cAAe,CAC9C,OAAO,I,CAGX,OAAOxJ,KAAK0J,eAAeI,IAAE,MAAFA,SAAE,SAAFA,EAAIC,c"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,c as e,h as a,H as r,g as s}from"./p-69d43b9d.js";import{c as i}from"./p-8a6728d5.js";const o=".visible{visibility:visible!important}.static{position:static!important}.absolute{position:absolute!important}.ml-2{margin-left:.5rem!important}.inline{display:inline!important}.flex{display:flex!important}.h-6{height:1.5rem!important}.w-full{width:100%!important}.-rotate-0{--tw-rotate:-0deg!important}.-rotate-0,.-rotate-135{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-135{--tw-rotate:-135deg!important}.-rotate-180{--tw-rotate:-180deg!important}.-rotate-180,.-rotate-225{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-225{--tw-rotate:-225deg!important}.-rotate-25{--tw-rotate:-25deg!important}.-rotate-25,.-rotate-270{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-270{--tw-rotate:-270deg!important}.-rotate-315{--tw-rotate:-315deg!important}.-rotate-315,.-rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-45{--tw-rotate:-45deg!important}.-rotate-90{--tw-rotate:-90deg!important}.-rotate-90,.rotate-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-0{--tw-rotate:0deg!important}.rotate-135{--tw-rotate:135deg!important}.rotate-135,.rotate-180{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-180{--tw-rotate:180deg!important}.rotate-225{--tw-rotate:225deg!important}.rotate-225,.rotate-25{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-25{--tw-rotate:25deg!important}.rotate-270{--tw-rotate:270deg!important}.rotate-270,.rotate-315{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-315{--tw-rotate:315deg!important}.rotate-45{--tw-rotate:45deg!important}.rotate-45,.rotate-90{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-90{--tw-rotate:90deg!important}.scale-x-flip{--tw-scale-x:-1!important}.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.scale-y-flip{--tw-scale-y:-1!important}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.cursor-pointer{cursor:pointer!important}.items-end{align-items:flex-end!important}.justify-center{justify-content:center!important}.justify-between{justify-content:space-between!important}.rounded{border-radius:.25rem!important}.text-2xl{font-size:1.5rem!important;line-height:2rem!important}.text-3xl{font-size:1.875rem!important;line-height:2.25rem!important}.text-4xl{font-size:2.25rem!important;line-height:2.5rem!important}.text-5xl{font-size:3rem!important}.text-5xl,.text-6xl{line-height:1!important}.text-6xl{font-size:3.75rem!important}.text-base{font-size:1rem!important;line-height:1.5rem!important}.text-lg{font-size:1.125rem!important;line-height:1.75rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-xl{font-size:1.25rem!important;line-height:1.75rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.text-xxs{font-size:.6875rem!important}.text-negative{color:rgb(185 30 40/var(--tw-text-opacity))!important}.text-negative,.text-negative-light{--tw-text-opacity:1!important}.text-negative-light{color:rgb(255 204 211/var(--tw-text-opacity))!important}.blur{--tw-blur:blur(8px)!important}.blur,.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}*{box-sizing:border-box}:host{display:flex;flex-direction:column}:host input.read-only{text-overflow:ellipsis}.-rotate-0,.-rotate-135,.-rotate-180,.-rotate-225,.-rotate-25,.-rotate-270,.-rotate-315,.-rotate-45,.-rotate-90,.rotate-0,.rotate-135,.rotate-180,.rotate-225,.rotate-25,.rotate-270,.rotate-315,.rotate-45,.rotate-90,.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.hover\\:text-negative:hover{--tw-text-opacity:1!important;color:rgb(185 30 40/var(--tw-text-opacity))!important}";const n=class{constructor(a){t(this,a);this.queryChange=e(this,"queryChange",7);this.valueChange=e(this,"valueChange",7);this._isAutoCompleting=false;this.items=undefined;this.query=undefined;this.placeholder=undefined;this.autocompletePlaceholder=undefined;this.value=undefined;this.displayKey="text";this.valueKey="value";this.queryKey=undefined;this.autoSelectFirst=true;this.maxDisplayedItems=10;this.enableAutocomplete=true;this.asyncFilter=false;this.loading=false;this.size="medium";this.prefix=undefined;this.label=undefined;this.helper=undefined;this.error=undefined;this.disabled=false;this._showDropdown=false;this._selectedItem=null}get _items(){var t;if(!this.items||this.loading){return[]}let e=typeof this.items==="string"?JSON.parse(this.items):this.items;if(typeof(e===null||e===void 0?void 0:e[0])==="string"){this.displayKey="text";this.valueKey="value";e=e.map((t=>({value:t,text:t})))}if(this._isAutoCompleting&&((t=this.query)===null||t===void 0?void 0:t.length)&&!this.asyncFilter){e=e.filter((t=>{if(this.queryKey){return this._checkvalue(this.queryKey,t)}return this._checkvalue(this.valueKey,t)||this._checkvalue(this.displayKey,t)}))}return e===null||e===void 0?void 0:e.slice(0,this.maxDisplayedItems)}get _displayValue(){var t;if(this._isAutoCompleting){return this.query}return(t=this._selectedItem)===null||t===void 0?void 0:t[this.displayKey]}get _placeholder(){var t;return this._isAutoCompleting&&((t=this.autocompletePlaceholder)===null||t===void 0?void 0:t.length)?this.autocompletePlaceholder:this.placeholder}componentDidLoad(){var t;if(this.value){this._valueChange(this.value);return}if(this.autoSelectFirst){this._selectedItem=(t=this._items)===null||t===void 0?void 0:t[0]}}render(){return a(r,{class:"p-select"},a("p-dropdown",{disableTriggerClick:true,calculateWidth:true,insideClick:true,show:this._showDropdown},a("p-input-group",{slot:"trigger",icon:"chevron",iconPosition:"end",size:this.size,prefix:this.prefix,label:this.label,helper:this.helper,error:this.error,disabled:this.disabled,focused:this._showDropdown},a("input",{slot:"input",type:"text",placeholder:this._placeholder,value:this._displayValue,class:`p-input cursor-pointer ${!this._isAutoCompleting&&"read-only"}`,onFocus:()=>this._onFocus(),onMouseDown:t=>this._onMouseDown(t),onClick:()=>this._onClick(),onInput:t=>this._onChange(t),ref:t=>this._inputRef=t})),a("div",{slot:"items"},this.loading?this._getLoadingItems():this._getItems())))}documentClickHandler({target:t}){if(!this._showDropdown||i(t,this._el)){return}this._showDropdown=false;this._isAutoCompleting=false}_valueChange(t){this._preselectItem(t)}itemChanges(){this._preselectItem()}_preselectItem(t){t=t===undefined?null:t;const e=!!this.value?JSON.stringify(this.value):JSON.stringify(t);if(this._selectedItem&&JSON.stringify(this._selectedItem[this.valueKey])===e){return}const a=this._items.find((t=>JSON.stringify(t===null||t===void 0?void 0:t[this.valueKey])===e));this._selectedItem=a}_selectValue(t){this._selectedItem=t;const e=t[this.valueKey];this.value=e;this.valueChange.emit(this.value);this._onBlur(true)}_onFocus(){if(!this.enableAutocomplete){this._inputRef.blur();if(!this._showDropdown){this._showDropdown=true}return}this._isAutoCompleting=true;this._showDropdown=true}_onMouseDown(t){if(this.enableAutocomplete){return}t.preventDefault()}_onClick(){if(this.enableAutocomplete){return}this._showDropdown=!this._showDropdown}_onBlur(t=false){if(!this.enableAutocomplete&&!t){return}this._isAutoCompleting=false;this._showDropdown=false}_onChange(t){if(!this._isAutoCompleting){return}this.query=t.target.value;this.queryChange.emit(this.query)}_checkvalue(t,e){var a,r,s;return((r=(a=e===null||e===void 0?void 0:e[t])===null||a===void 0?void 0:a.toString())===null||r===void 0?void 0:r.toLowerCase().indexOf((s=this.query)===null||s===void 0?void 0:s.toLowerCase()))>=0}_getItems(){return this._items.map((t=>{var e;return a("p-dropdown-menu-item",{onClick:()=>this._selectValue(t),active:t[this.valueKey]===((e=this._selectedItem)===null||e===void 0?void 0:e[this.valueKey])},t[this.displayKey])}))}_getLoadingItems(){return[0,0,0].map((()=>a("p-dropdown-menu-item",{enableHover:false},a("p-loader",{variant:"ghost",class:"w-full h-6 rounded"}))))}get _el(){return s(this)}static get watchers(){return{value:["_valueChange"],items:["itemChanges"]}}};n.style=o;export{n as p_select};
|
|
2
|
+
//# sourceMappingURL=p-a6313ca8.entry.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["selectComponentCss","Select","this","_isAutoCompleting","_items","items","loading","JSON","parse","displayKey","valueKey","map","str","value","text","_a","query","length","asyncFilter","filter","item","queryKey","_checkvalue","slice","maxDisplayedItems","_displayValue","_selectedItem","_placeholder","autocompletePlaceholder","placeholder","componentDidLoad","_valueChange","autoSelectFirst","render","h","Host","class","disableTriggerClick","calculateWidth","insideClick","show","_showDropdown","slot","icon","iconPosition","size","prefix","label","helper","error","disabled","focused","type","onFocus","_onFocus","onMouseDown","ev","_onMouseDown","onClick","_onClick","onInput","_onChange","ref","_inputRef","_getLoadingItems","_getItems","documentClickHandler","target","childOf","_el","_preselectItem","itemChanges","undefined","parsedValue","stringify","find","i","_selectValue","valueChange","emit","_onBlur","enableAutocomplete","blur","preventDefault","force","queryChange","key","_b","toString","toLowerCase","indexOf","_c","active","enableHover","variant"],"sources":["./src/components/molecules/select/select.component.scss?tag=p-select","./src/components/molecules/select/select.component.tsx"],"sourcesContent":[":host {\n @apply flex flex-col;\n\n input.read-only {\n @apply text-ellipsis;\n }\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { childOf } from '../../../utils';\n\n@Component({\n tag: 'p-select',\n styleUrl: 'select.component.scss',\n shadow: false,\n})\nexport class Select {\n /**\n * The items to show in the dropdown\n */\n @Prop() items: string | any[];\n\n /**\n * The current query\n */\n @Prop() query: string;\n\n /**\n * The placeholder of the input\n */\n @Prop() placeholder: string;\n\n /**\n * The placeholder of the input when auto completing\n */\n @Prop() autocompletePlaceholder: string;\n\n /**\n * The current value\n */\n @Prop() value: any;\n\n /**\n * The key of the object to display\n */\n @Prop() displayKey: string = 'text';\n\n /**\n * The key of the object to return\n */\n @Prop() valueKey: string = 'value';\n\n /**\n * The key of the object to display\n */\n @Prop() queryKey?: string;\n\n /**\n * Wether to automatically select the first item\n */\n @Prop() autoSelectFirst: boolean = true;\n\n /**\n * The maximum amount of items to display\n */\n @Prop() maxDisplayedItems: number = 10;\n\n /**\n * Wether to enable autocomplete\n */\n @Prop() enableAutocomplete: boolean = true;\n\n /**\n * Wether the input uses async filtering\n */\n @Prop() asyncFilter: boolean = false;\n\n /**\n * Wether to show loading items\n */\n @Prop() loading: boolean = false;\n\n /**\n * Event when the query of the autocomplete changes\n */\n @Event() queryChange: EventEmitter<string>;\n\n /**\n * Event when the value changes\n */\n @Event() valueChange: EventEmitter<any>;\n\n /**\n * The size of the input group used by the select\n */\n @Prop() size: 'small' | 'medium' = 'medium';\n\n /**\n * The prefix of the input group used by the select\n */\n @Prop() prefix: string;\n\n /**\n * The label of the input group used by the select\n */\n @Prop() label: string;\n\n /**\n * The helper of the input group used by the select\n */\n @Prop() helper: string;\n\n /**\n * The helper of the input group used by the select\n */\n @Prop({ reflect: true }) error: string;\n\n /**\n * Wether the input group is disabled used by the select\n */\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /**\n * The host element\n */\n @Element() private _el: HTMLElement;\n\n @State() private _showDropdown: any = false;\n @State() private _selectedItem: any = null;\n\n private _isAutoCompleting: boolean = false;\n\n private _inputRef: HTMLInputElement;\n\n get _items() {\n if (!this.items || this.loading) {\n return [];\n }\n\n let items =\n typeof this.items === 'string'\n ? JSON.parse(this.items)\n : this.items;\n\n if (typeof items?.[0] === 'string') {\n this.displayKey = 'text';\n this.valueKey = 'value';\n\n items = items.map((str) => ({\n value: str,\n text: str,\n }));\n }\n\n if (this._isAutoCompleting && this.query?.length && !this.asyncFilter) {\n items = items.filter((item) => {\n if (this.queryKey) {\n return this._checkvalue(this.queryKey, item);\n }\n\n return (\n this._checkvalue(this.valueKey, item) ||\n this._checkvalue(this.displayKey, item)\n );\n });\n }\n\n return items?.slice(0, this.maxDisplayedItems);\n }\n\n get _displayValue() {\n if (this._isAutoCompleting) {\n return this.query;\n }\n\n return this._selectedItem?.[this.displayKey];\n }\n\n get _placeholder() {\n return this._isAutoCompleting && this.autocompletePlaceholder?.length\n ? this.autocompletePlaceholder\n : this.placeholder;\n }\n\n componentDidLoad() {\n if (this.value) {\n this._valueChange(this.value);\n return;\n }\n\n if (this.autoSelectFirst) {\n this._selectedItem = this._items?.[0];\n }\n }\n\n render() {\n return (\n <Host class=\"p-select\">\n <p-dropdown\n disableTriggerClick={true}\n calculateWidth={true}\n insideClick={true}\n show={this._showDropdown}\n >\n <p-input-group\n slot=\"trigger\"\n icon=\"chevron\"\n iconPosition=\"end\"\n size={this.size}\n prefix={this.prefix}\n label={this.label}\n helper={this.helper}\n error={this.error}\n disabled={this.disabled}\n focused={this._showDropdown}\n >\n <input\n slot=\"input\"\n type=\"text\"\n placeholder={this._placeholder}\n value={this._displayValue}\n class={`p-input cursor-pointer ${\n !this._isAutoCompleting && 'read-only'\n }`}\n onFocus={() => this._onFocus()}\n onMouseDown={(ev) => this._onMouseDown(ev)}\n onClick={() => this._onClick()}\n onInput={(ev) => this._onChange(ev)}\n ref={(ref) => (this._inputRef = ref)}\n />\n </p-input-group>\n <div slot=\"items\">\n {this.loading\n ? this._getLoadingItems()\n : this._getItems()}\n </div>\n </p-dropdown>\n </Host>\n );\n }\n\n @Listen('click', { target: 'document', capture: true })\n protected documentClickHandler({ target }) {\n if (!this._showDropdown || childOf(target, this._el)) {\n return;\n }\n\n this._showDropdown = false;\n this._isAutoCompleting = false;\n }\n\n @Watch('value')\n private _valueChange(value: any) {\n this._preselectItem(value);\n }\n\n @Watch('items')\n public itemChanges() {\n this._preselectItem();\n }\n\n private _preselectItem(value?: any) {\n value = value === undefined ? null : value;\n const parsedValue = !!this.value\n ? JSON.stringify(this.value)\n : JSON.stringify(value);\n\n if (\n this._selectedItem &&\n JSON.stringify(this._selectedItem[this.valueKey]) === parsedValue\n ) {\n return;\n }\n\n const item = this._items.find(\n (i) => JSON.stringify(i?.[this.valueKey]) === parsedValue\n );\n\n this._selectedItem = item;\n }\n\n private _selectValue(item) {\n this._selectedItem = item;\n const value = item[this.valueKey];\n\n this.value = value;\n this.valueChange.emit(this.value);\n\n this._onBlur(true);\n }\n\n private _onFocus() {\n if (!this.enableAutocomplete) {\n this._inputRef.blur();\n if (!this._showDropdown) {\n this._showDropdown = true;\n }\n return;\n }\n\n this._isAutoCompleting = true;\n this._showDropdown = true;\n }\n\n private _onMouseDown(ev) {\n if (this.enableAutocomplete) {\n return;\n }\n\n ev.preventDefault();\n }\n\n private _onClick() {\n if (this.enableAutocomplete) {\n return;\n }\n\n this._showDropdown = !this._showDropdown;\n }\n\n private _onBlur(force = false) {\n if (!this.enableAutocomplete && !force) {\n return;\n }\n\n this._isAutoCompleting = false;\n this._showDropdown = false;\n }\n\n private _onChange(ev) {\n if (!this._isAutoCompleting) {\n return;\n }\n\n this.query = ev.target.value;\n this.queryChange.emit(this.query);\n }\n\n private _checkvalue(key, item) {\n return (\n item?.[key]\n ?.toString()\n ?.toLowerCase()\n .indexOf(this.query?.toLowerCase()) >= 0\n );\n }\n\n private _getItems() {\n return this._items.map((item) => (\n <p-dropdown-menu-item\n onClick={() => this._selectValue(item)}\n active={\n item[this.valueKey] === this._selectedItem?.[this.valueKey]\n }\n >\n {item[this.displayKey]}\n </p-dropdown-menu-item>\n ));\n }\n\n private _getLoadingItems() {\n return [0, 0, 0].map(() => (\n <p-dropdown-menu-item enableHover={false}>\n <p-loader variant=\"ghost\" class=\"w-full h-6 rounded\" />\n </p-dropdown-menu-item>\n ));\n }\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"names":["selectComponentCss","Select","this","_isAutoCompleting","_items","items","loading","JSON","parse","displayKey","valueKey","map","str","value","text","_a","query","length","asyncFilter","filter","item","queryKey","_checkvalue","slice","maxDisplayedItems","_displayValue","_selectedItem","_placeholder","autocompletePlaceholder","placeholder","componentDidLoad","_valueChange","autoSelectFirst","render","h","Host","class","disableTriggerClick","calculateWidth","insideClick","show","_showDropdown","slot","icon","iconPosition","size","prefix","label","helper","error","disabled","focused","type","onFocus","_onFocus","onMouseDown","ev","_onMouseDown","onClick","_onClick","onInput","_onChange","ref","_inputRef","_getLoadingItems","_getItems","documentClickHandler","target","childOf","_el","_preselectItem","itemChanges","undefined","parsedValue","stringify","find","i","_selectValue","valueChange","emit","_onBlur","enableAutocomplete","blur","preventDefault","force","queryChange","key","_b","toString","toLowerCase","indexOf","_c","active","enableHover","variant"],"sources":["./src/components/molecules/select/select.component.scss?tag=p-select","./src/components/molecules/select/select.component.tsx"],"sourcesContent":[":host {\n @apply flex flex-col;\n\n input.read-only {\n @apply text-ellipsis;\n }\n}\n","import {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { childOf } from '../../../utils';\n\n@Component({\n tag: 'p-select',\n styleUrl: 'select.component.scss',\n shadow: false,\n})\nexport class Select {\n /**\n * The items to show in the dropdown\n */\n @Prop() items: string | any[];\n\n /**\n * The current query\n */\n @Prop() query: string;\n\n /**\n * The placeholder of the input\n */\n @Prop() placeholder: string;\n\n /**\n * The placeholder of the input when auto completing\n */\n @Prop() autocompletePlaceholder: string;\n\n /**\n * The current value\n */\n @Prop() value: any;\n\n /**\n * The key of the object to display\n */\n @Prop() displayKey: string = 'text';\n\n /**\n * The key of the object to return\n */\n @Prop() valueKey: string = 'value';\n\n /**\n * The key of the object to display\n */\n @Prop() queryKey?: string;\n\n /**\n * Wether to automatically select the first item\n */\n @Prop() autoSelectFirst: boolean = true;\n\n /**\n * The maximum amount of items to display\n */\n @Prop() maxDisplayedItems: number = 10;\n\n /**\n * Wether to enable autocomplete\n */\n @Prop() enableAutocomplete: boolean = true;\n\n /**\n * Wether the input uses async filtering\n */\n @Prop() asyncFilter: boolean = false;\n\n /**\n * Wether to show loading items\n */\n @Prop() loading: boolean = false;\n\n /**\n * Event when the query of the autocomplete changes\n */\n @Event() queryChange: EventEmitter<string>;\n\n /**\n * Event when the value changes\n */\n @Event() valueChange: EventEmitter<any>;\n\n /**\n * The size of the input group used by the select\n */\n @Prop() size: 'small' | 'medium' = 'medium';\n\n /**\n * The prefix of the input group used by the select\n */\n @Prop() prefix: string;\n\n /**\n * The label of the input group used by the select\n */\n @Prop() label: string;\n\n /**\n * The helper of the input group used by the select\n */\n @Prop() helper: string;\n\n /**\n * The helper of the input group used by the select\n */\n @Prop({ reflect: true }) error: string;\n\n /**\n * Wether the input group is disabled used by the select\n */\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /**\n * The host element\n */\n @Element() private _el: HTMLElement;\n\n @State() private _showDropdown: any = false;\n @State() private _selectedItem: any = null;\n\n private _isAutoCompleting: boolean = false;\n\n private _inputRef: HTMLInputElement;\n\n get _items() {\n if (!this.items || this.loading) {\n return [];\n }\n\n let items =\n typeof this.items === 'string'\n ? JSON.parse(this.items)\n : this.items;\n\n if (typeof items?.[0] === 'string') {\n this.displayKey = 'text';\n this.valueKey = 'value';\n\n items = items.map((str) => ({\n value: str,\n text: str,\n }));\n }\n\n if (this._isAutoCompleting && this.query?.length && !this.asyncFilter) {\n items = items.filter((item) => {\n if (this.queryKey) {\n return this._checkvalue(this.queryKey, item);\n }\n\n return (\n this._checkvalue(this.valueKey, item) ||\n this._checkvalue(this.displayKey, item)\n );\n });\n }\n\n return items?.slice(0, this.maxDisplayedItems);\n }\n\n get _displayValue() {\n if (this._isAutoCompleting) {\n return this.query;\n }\n\n return this._selectedItem?.[this.displayKey];\n }\n\n get _placeholder() {\n return this._isAutoCompleting && this.autocompletePlaceholder?.length\n ? this.autocompletePlaceholder\n : this.placeholder;\n }\n\n componentDidLoad() {\n if (this.value) {\n this._valueChange(this.value);\n return;\n }\n\n if (this.autoSelectFirst) {\n this._selectedItem = this._items?.[0];\n }\n }\n\n render() {\n return (\n <Host class=\"p-select\">\n <p-dropdown\n disableTriggerClick={true}\n calculateWidth={true}\n insideClick={true}\n show={this._showDropdown}\n >\n <p-input-group\n slot=\"trigger\"\n icon=\"chevron\"\n iconPosition=\"end\"\n size={this.size}\n prefix={this.prefix}\n label={this.label}\n helper={this.helper}\n error={this.error}\n disabled={this.disabled}\n focused={this._showDropdown}\n >\n <input\n slot=\"input\"\n type=\"text\"\n placeholder={this._placeholder}\n value={this._displayValue}\n class={`p-input cursor-pointer ${\n !this._isAutoCompleting && 'read-only'\n }`}\n onFocus={() => this._onFocus()}\n onMouseDown={(ev) => this._onMouseDown(ev)}\n onClick={() => this._onClick()}\n onInput={(ev) => this._onChange(ev)}\n ref={(ref) => (this._inputRef = ref)}\n />\n </p-input-group>\n <div slot=\"items\">\n {this.loading\n ? this._getLoadingItems()\n : this._getItems()}\n </div>\n </p-dropdown>\n </Host>\n );\n }\n\n @Listen('click', { target: 'document', capture: true })\n protected documentClickHandler({ target }) {\n if (!this._showDropdown || childOf(target, this._el)) {\n return;\n }\n\n this._showDropdown = false;\n this._isAutoCompleting = false;\n }\n\n @Watch('value')\n private _valueChange(value: any) {\n this._preselectItem(value);\n }\n\n @Watch('items')\n public itemChanges() {\n this._preselectItem();\n }\n\n private _preselectItem(value?: any) {\n value = value === undefined ? null : value;\n const parsedValue = !!this.value\n ? JSON.stringify(this.value)\n : JSON.stringify(value);\n\n if (\n this._selectedItem &&\n JSON.stringify(this._selectedItem[this.valueKey]) === parsedValue\n ) {\n return;\n }\n\n const item = this._items.find(\n (i) => JSON.stringify(i?.[this.valueKey]) === parsedValue\n );\n\n this._selectedItem = item;\n }\n\n private _selectValue(item) {\n this._selectedItem = item;\n const value = item[this.valueKey];\n\n this.value = value;\n this.valueChange.emit(this.value);\n\n this._onBlur(true);\n }\n\n private _onFocus() {\n if (!this.enableAutocomplete) {\n this._inputRef.blur();\n if (!this._showDropdown) {\n this._showDropdown = true;\n }\n return;\n }\n\n this._isAutoCompleting = true;\n this._showDropdown = true;\n }\n\n private _onMouseDown(ev) {\n if (this.enableAutocomplete) {\n return;\n }\n\n ev.preventDefault();\n }\n\n private _onClick() {\n if (this.enableAutocomplete) {\n return;\n }\n\n this._showDropdown = !this._showDropdown;\n }\n\n private _onBlur(force = false) {\n if (!this.enableAutocomplete && !force) {\n return;\n }\n\n this._isAutoCompleting = false;\n this._showDropdown = false;\n }\n\n private _onChange(ev) {\n if (!this._isAutoCompleting) {\n return;\n }\n\n this.query = ev.target.value;\n this.queryChange.emit(this.query);\n }\n\n private _checkvalue(key, item) {\n return (\n item?.[key]\n ?.toString()\n ?.toLowerCase()\n .indexOf(this.query?.toLowerCase()) >= 0\n );\n }\n\n private _getItems() {\n return this._items.map((item) => (\n <p-dropdown-menu-item\n onClick={() => this._selectValue(item)}\n active={\n item[this.valueKey] === this._selectedItem?.[this.valueKey]\n }\n >\n {item[this.displayKey]}\n </p-dropdown-menu-item>\n ));\n }\n\n private _getLoadingItems() {\n return [0, 0, 0].map(() => (\n <p-dropdown-menu-item enableHover={false}>\n <p-loader variant=\"ghost\" class=\"w-full h-6 rounded\" />\n </p-dropdown-menu-item>\n ));\n }\n}\n"],"mappings":"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"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,c as a,h as r,H as e,g as o}from"./p-69d43b9d.js";import{c as i}from"./p-8a6728d5.js";import{c as n}from"./p-f86fcdf4.js";const s=".visible{visibility:visible!important}.static{position:static!important}.fixed{position:fixed!important}.absolute{position:absolute!important}.relative{position:relative!important}.bottom-0{bottom:0!important}.left-0{left:0!important}.col-start-1{grid-column-start:1!important}.col-start-2{grid-column-start:2!important}.col-start-3{grid-column-start:3!important}.col-start-4{grid-column-start:4!important}.col-start-5{grid-column-start:5!important}.col-start-6{grid-column-start:6!important}.col-start-7{grid-column-start:7!important}.m-0{margin:0!important}.mb-14{margin-bottom:3.5rem!important}.mb-6{margin-bottom:1.5rem!important}.ml-1{margin-left:.25rem!important}.ml-2{margin-left:.5rem!important}.ml-auto{margin-left:auto!important}.block{display:block!important}.inline{display:inline!important}.flex{display:flex!important}.table{display:table!important}.table-cell{display:table-cell!important}.table-row{display:table-row!important}.hidden{display:none!important}.h-6{height:1.5rem!important}.h-8{height:2rem!important}.w-1{width:.25rem!important}.w-10{width:2.5rem!important}.w-11{width:2.75rem!important}.w-2{width:.5rem!important}.w-3{width:.75rem!important}.w-4{width:1rem!important}.w-5{width:1.25rem!important}.w-6{width:1.5rem!important}.w-7{width:1.75rem!important}.w-8{width:2rem!important}.w-9{width:2.25rem!important}.w-auto{width:auto!important}.w-full{width:100%!important}.min-w-0{min-width:0!important}.flex-1{flex:1 1 0%!important}.-rotate-0{--tw-rotate:-0deg!important}.-rotate-0,.-rotate-135{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-135{--tw-rotate:-135deg!important}.-rotate-180{--tw-rotate:-180deg!important}.-rotate-180,.-rotate-225{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-225{--tw-rotate:-225deg!important}.-rotate-25{--tw-rotate:-25deg!important}.-rotate-25,.-rotate-270{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-270{--tw-rotate:-270deg!important}.-rotate-315{--tw-rotate:-315deg!important}.-rotate-315,.-rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-45{--tw-rotate:-45deg!important}.-rotate-90{--tw-rotate:-90deg!important}.-rotate-90,.rotate-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-0{--tw-rotate:0deg!important}.rotate-135{--tw-rotate:135deg!important}.rotate-135,.rotate-180{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-180{--tw-rotate:180deg!important}.rotate-225{--tw-rotate:225deg!important}.rotate-225,.rotate-25{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-25{--tw-rotate:25deg!important}.rotate-270{--tw-rotate:270deg!important}.rotate-270,.rotate-315{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-315{--tw-rotate:315deg!important}.rotate-45{--tw-rotate:45deg!important}.rotate-45,.rotate-90{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-90{--tw-rotate:90deg!important}.scale-x-flip{--tw-scale-x:-1!important}.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.scale-y-flip{--tw-scale-y:-1!important}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.cursor-pointer{cursor:pointer!important}.flex-col{flex-direction:column!important}.items-end{align-items:flex-end!important}.items-center{align-items:center!important}.justify-start{justify-content:flex-start!important}.justify-end{justify-content:flex-end!important}.justify-center{justify-content:center!important}.justify-between{justify-content:space-between!important}.gap-4{gap:1rem!important}.self-center{align-self:center!important}.justify-self-end{justify-self:end!important}.rounded{border-radius:.25rem!important}.border{border-width:1px!important}.border-solid{border-style:solid!important}.border-transparent{border-color:transparent!important}.border-t-mystic-dark{--tw-border-opacity:1!important;border-top-color:rgb(218 230 240/var(--tw-border-opacity))!important}.bg-white{--tw-bg-opacity:1!important;background-color:rgb(255 255 255/var(--tw-bg-opacity))!important}.p-4{padding:1rem!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.py-24{padding-bottom:6rem!important;padding-top:6rem!important}.text-center{text-align:center!important}.text-2xl{font-size:1.5rem!important;line-height:2rem!important}.text-3xl{font-size:1.875rem!important;line-height:2.25rem!important}.text-4xl{font-size:2.25rem!important;line-height:2.5rem!important}.text-5xl{font-size:3rem!important}.text-5xl,.text-6xl{line-height:1!important}.text-6xl{font-size:3.75rem!important}.text-base{font-size:1rem!important;line-height:1.5rem!important}.text-lg{font-size:1.125rem!important;line-height:1.75rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-xl{font-size:1.25rem!important;line-height:1.75rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.text-xxs{font-size:.6875rem!important}.font-semibold{font-weight:600!important}.text-negative{color:rgb(185 30 40/var(--tw-text-opacity))!important}.text-negative,.text-negative-light{--tw-text-opacity:1!important}.text-negative-light{color:rgb(255 204 211/var(--tw-text-opacity))!important}.text-storm-dark{color:rgb(39 40 56/var(--tw-text-opacity))!important}.text-storm-dark,.text-storm-medium{--tw-text-opacity:1!important}.text-storm-medium{color:rgb(128 130 158/var(--tw-text-opacity))!important}.blur{--tw-blur:blur(8px)!important}.blur,.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}*{box-sizing:border-box}:host{display:block;position:relative}:host .trigger{display:block;height:auto;position:relative;width:auto}:host p-dropdown-menu-container{display:none;z-index:200}:host p-dropdown-menu-container[data-show]{display:flex}.-rotate-0,.-rotate-135,.-rotate-180,.-rotate-225,.-rotate-25,.-rotate-270,.-rotate-315,.-rotate-45,.-rotate-90,.rotate-0,.rotate-135,.rotate-180,.rotate-225,.rotate-25,.rotate-270,.rotate-315,.rotate-45,.rotate-90,.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.hover\\:text-negative:hover{--tw-text-opacity:1!important;color:rgb(185 30 40/var(--tw-text-opacity))!important}.max-w-\\[20rem\\]{max-width:20rem!important}.w-3\\/4{width:75%!important}@media (min-width:64rem){.desktop-xs\\:flex{display:flex!important}.desktop-xs\\:hidden{display:none!important}.desktop-xs\\:w-auto{width:auto!important}.desktop-xs\\:flex-row{flex-direction:row!important}}.w-1\\/12{width:8.333333%!important}.w-10\\/12{width:83.333333%!important}.w-11\\/12{width:91.666667%!important}.w-2\\/12{width:16.666667%!important}.w-3\\/12{width:25%!important}.w-4\\/12{width:33.333333%!important}.w-5\\/12{width:41.666667%!important}.w-6\\/12{width:50%!important}.w-7\\/12{width:58.333333%!important}.w-8\\/12{width:66.666667%!important}.w-9\\/12{width:75%!important}@media (min-width:40rem){.tablet\\:w-1\\/12{width:8.333333%!important}.tablet\\:w-10\\/12{width:83.333333%!important}.tablet\\:w-11\\/12{width:91.666667%!important}.tablet\\:w-2\\/12{width:16.666667%!important}.tablet\\:w-3\\/12{width:25%!important}.tablet\\:w-4\\/12{width:33.333333%!important}.tablet\\:w-5\\/12{width:41.666667%!important}.tablet\\:w-6\\/12{width:50%!important}.tablet\\:w-7\\/12{width:58.333333%!important}.tablet\\:w-8\\/12{width:66.666667%!important}.tablet\\:w-9\\/12{width:75%!important}}@media (min-width:64rem){.desktop-xs\\:w-1\\/12{width:8.333333%!important}.desktop-xs\\:w-10\\/12{width:83.333333%!important}.desktop-xs\\:w-11\\/12{width:91.666667%!important}.desktop-xs\\:w-2\\/12{width:16.666667%!important}.desktop-xs\\:w-3\\/12{width:25%!important}.desktop-xs\\:w-4\\/12{width:33.333333%!important}.desktop-xs\\:w-5\\/12{width:41.666667%!important}.desktop-xs\\:w-6\\/12{width:50%!important}.desktop-xs\\:w-7\\/12{width:58.333333%!important}.desktop-xs\\:w-8\\/12{width:66.666667%!important}.desktop-xs\\:w-9\\/12{width:75%!important}}@media (min-width:80rem){.desktop-sm\\:w-1\\/12{width:8.333333%!important}.desktop-sm\\:w-10\\/12{width:83.333333%!important}.desktop-sm\\:w-11\\/12{width:91.666667%!important}.desktop-sm\\:w-2\\/12{width:16.666667%!important}.desktop-sm\\:w-3\\/12{width:25%!important}.desktop-sm\\:w-4\\/12{width:33.333333%!important}.desktop-sm\\:w-5\\/12{width:41.666667%!important}.desktop-sm\\:w-6\\/12{width:50%!important}.desktop-sm\\:w-7\\/12{width:58.333333%!important}.desktop-sm\\:w-8\\/12{width:66.666667%!important}.desktop-sm\\:w-9\\/12{width:75%!important}}@media (min-width:85.375rem){.desktop\\:w-1\\/12{width:8.333333%!important}.desktop\\:w-10\\/12{width:83.333333%!important}.desktop\\:w-11\\/12{width:91.666667%!important}.desktop\\:w-2\\/12{width:16.666667%!important}.desktop\\:w-3\\/12{width:25%!important}.desktop\\:w-4\\/12{width:33.333333%!important}.desktop\\:w-5\\/12{width:41.666667%!important}.desktop\\:w-6\\/12{width:50%!important}.desktop\\:w-7\\/12{width:58.333333%!important}.desktop\\:w-8\\/12{width:66.666667%!important}.desktop\\:w-9\\/12{width:75%!important}}@media (min-width:90rem){.desktop-lg\\:w-1\\/12{width:8.333333%!important}.desktop-lg\\:w-10\\/12{width:83.333333%!important}.desktop-lg\\:w-11\\/12{width:91.666667%!important}.desktop-lg\\:w-2\\/12{width:16.666667%!important}.desktop-lg\\:w-3\\/12{width:25%!important}.desktop-lg\\:w-4\\/12{width:33.333333%!important}.desktop-lg\\:w-5\\/12{width:41.666667%!important}.desktop-lg\\:w-6\\/12{width:50%!important}.desktop-lg\\:w-7\\/12{width:58.333333%!important}.desktop-lg\\:w-8\\/12{width:66.666667%!important}.desktop-lg\\:w-9\\/12{width:75%!important}}@media (min-width:120rem){.desktop-xl\\:w-1\\/12{width:8.333333%!important}.desktop-xl\\:w-10\\/12{width:83.333333%!important}.desktop-xl\\:w-11\\/12{width:91.666667%!important}.desktop-xl\\:w-2\\/12{width:16.666667%!important}.desktop-xl\\:w-3\\/12{width:25%!important}.desktop-xl\\:w-4\\/12{width:33.333333%!important}.desktop-xl\\:w-5\\/12{width:41.666667%!important}.desktop-xl\\:w-6\\/12{width:50%!important}.desktop-xl\\:w-7\\/12{width:58.333333%!important}.desktop-xl\\:w-8\\/12{width:66.666667%!important}.desktop-xl\\:w-9\\/12{width:75%!important}}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}";const w=class{constructor(r){t(this,r);this.isOpen=a(this,"isOpen",7);this._loaded=false;this.placement="bottom-start";this.strategy="absolute";this.show=false;this.calculateWidth=false;this.applyMaxWidth=true;this.applyFullWidth=true;this.insideClick=false;this.disableTriggerClick=false;this.chevronPosition="end";this.chevronDirection=undefined}componentShouldUpdate(){this._setOptions()}render(){return r(e,{class:"p-dropdown"},r("div",{class:"trigger",ref:t=>this._trigger=t,onClick:()=>this._triggerClickHandler()},r("slot",{onSlotchange:t=>this._checkButton(t),name:"trigger"})),r("p-dropdown-menu-container",{role:"popover",maxWidth:!this.calculateWidth&&this.applyMaxWidth,fullWidth:this.applyFullWidth&&!this.applyMaxWidth,ref:t=>this._load(t),onClick:()=>this._containerClickHandler()},r("slot",{name:"items"})))}_checkButton({target:t}){const a=t;const r=a.assignedElements();for(let t of r){if(t.nodeName==="P-BUTTON"){t.chevronPosition=this.chevronPosition;t.chevron=this.chevronDirection?this.chevronDirection:this.placement.indexOf("top")>=0?"up":"down"}}}onShowChange(t){if(!this._loaded){return}if(!t){this._hide();return}this._show()}documentClickHandler({target:t}){if(!this._menu.hasAttribute("data-show")||i(t,this._el)){return}this._hide()}_containerClickHandler(){if(this.insideClick){return}if(this._menu.hasAttribute("data-show")){this._hide()}}_triggerClickHandler(){if(this.disableTriggerClick){return}if(this._menu.hasAttribute("data-show")){this._hide();return}this._show()}_load(t){this._menu=t;if(t){this._popper=n(this._el,t,{strategy:this.strategy});this._setOptions();this._loaded=true;if(this.show){setTimeout((()=>this._show()),100)}}}_setOptions(){if(!this._popper){return}this._popper.setOptions({placement:this.placement,modifiers:[{name:"offset",options:{offset:[0,8]}}]})}_show(){if(!this._loaded){return}if(this.calculateWidth){this._menu.style.width=`${this._trigger.clientWidth}px`}this._menu.setAttribute("data-show","");this.isOpen.emit(true);this._popper.setOptions((t=>Object.assign(Object.assign({},t),{modifiers:[...t.modifiers,{name:"eventListeners",enabled:true}]})));this._popper.update()}_hide(){if(!this._loaded||this.show){return}this._menu.removeAttribute("data-show");this.isOpen.emit(false);this._popper.setOptions((t=>Object.assign(Object.assign({},t),{modifiers:[...t.modifiers,{name:"eventListeners",enabled:false}]})))}get _el(){return o(this)}static get watchers(){return{show:["onShowChange"]}}};w.style=s;const m=".visible{visibility:visible!important}.static{position:static!important}.fixed{position:fixed!important}.absolute{position:absolute!important}.bottom-0{bottom:0!important}.left-0{left:0!important}.m-0{margin:0!important}.mb-14{margin-bottom:3.5rem!important}.mb-6{margin-bottom:1.5rem!important}.ml-1{margin-left:.25rem!important}.ml-2{margin-left:.5rem!important}.block{display:block!important}.inline{display:inline!important}.flex{display:flex!important}.table{display:table!important}.table-cell{display:table-cell!important}.table-row{display:table-row!important}.hidden{display:none!important}.h-6{height:1.5rem!important}.h-8{height:2rem!important}.w-1{width:.25rem!important}.w-10{width:2.5rem!important}.w-11{width:2.75rem!important}.w-2{width:.5rem!important}.w-3{width:.75rem!important}.w-4{width:1rem!important}.w-5{width:1.25rem!important}.w-6{width:1.5rem!important}.w-7{width:1.75rem!important}.w-8{width:2rem!important}.w-9{width:2.25rem!important}.w-auto{width:auto!important}.w-full{width:100%!important}.flex-1{flex:1 1 0%!important}.-rotate-0{--tw-rotate:-0deg!important}.-rotate-0,.-rotate-135{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-135{--tw-rotate:-135deg!important}.-rotate-180{--tw-rotate:-180deg!important}.-rotate-180,.-rotate-225{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-225{--tw-rotate:-225deg!important}.-rotate-25{--tw-rotate:-25deg!important}.-rotate-25,.-rotate-270{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-270{--tw-rotate:-270deg!important}.-rotate-315{--tw-rotate:-315deg!important}.-rotate-315,.-rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-45{--tw-rotate:-45deg!important}.-rotate-90{--tw-rotate:-90deg!important}.-rotate-90,.rotate-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-0{--tw-rotate:0deg!important}.rotate-135{--tw-rotate:135deg!important}.rotate-135,.rotate-180{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-180{--tw-rotate:180deg!important}.rotate-225{--tw-rotate:225deg!important}.rotate-225,.rotate-25{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-25{--tw-rotate:25deg!important}.rotate-270{--tw-rotate:270deg!important}.rotate-270,.rotate-315{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-315{--tw-rotate:315deg!important}.rotate-45{--tw-rotate:45deg!important}.rotate-45,.rotate-90{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-90{--tw-rotate:90deg!important}.scale-x-flip{--tw-scale-x:-1!important}.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.scale-y-flip{--tw-scale-y:-1!important}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.cursor-pointer{cursor:pointer!important}.flex-col{flex-direction:column!important}.items-end{align-items:flex-end!important}.items-center{align-items:center!important}.justify-start{justify-content:flex-start!important}.justify-end{justify-content:flex-end!important}.justify-center{justify-content:center!important}.justify-between{justify-content:space-between!important}.gap-4{gap:1rem!important}.self-center{align-self:center!important}.justify-self-end{justify-self:end!important}.overflow-hidden{overflow:hidden!important}.text-ellipsis{text-overflow:ellipsis!important}.rounded{border-radius:.25rem!important}.border{border-width:1px!important}.border-solid{border-style:solid!important}.border-transparent{border-color:transparent!important}.border-t-mystic-dark{--tw-border-opacity:1!important;border-top-color:rgb(218 230 240/var(--tw-border-opacity))!important}.bg-white{--tw-bg-opacity:1!important;background-color:rgb(255 255 255/var(--tw-bg-opacity))!important}.p-4{padding:1rem!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.py-24{padding-bottom:6rem!important;padding-top:6rem!important}.text-center{text-align:center!important}.text-2xl{font-size:1.5rem!important;line-height:2rem!important}.text-3xl{font-size:1.875rem!important;line-height:2.25rem!important}.text-4xl{font-size:2.25rem!important;line-height:2.5rem!important}.text-5xl{font-size:3rem!important}.text-5xl,.text-6xl{line-height:1!important}.text-6xl{font-size:3.75rem!important}.text-base{font-size:1rem!important;line-height:1.5rem!important}.text-lg{font-size:1.125rem!important;line-height:1.75rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-xl{font-size:1.25rem!important;line-height:1.75rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.text-xxs{font-size:.6875rem!important}.font-semibold{font-weight:600!important}.text-indigo{color:rgb(82 138 250/var(--tw-text-opacity))!important}.text-indigo,.text-negative{--tw-text-opacity:1!important}.text-negative{color:rgb(185 30 40/var(--tw-text-opacity))!important}.text-negative,.text-negative-light{--tw-text-opacity:1!important}.text-negative-light{color:rgb(255 204 211/var(--tw-text-opacity))!important}.text-storm{color:rgb(81 83 107/var(--tw-text-opacity))!important}.text-storm,.text-storm-dark{--tw-text-opacity:1!important}.text-storm-dark{color:rgb(39 40 56/var(--tw-text-opacity))!important}.text-storm-dark,.text-storm-medium{--tw-text-opacity:1!important}.text-storm-medium{color:rgb(128 130 158/var(--tw-text-opacity))!important}.blur{--tw-blur:blur(8px)!important}.blur,.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}*{box-sizing:border-box}.text-indigo,.text-storm{--tw-text-opacity:1!important}:host{--tw-text-opacity:1;align-items:center;border-radius:.25rem;color:rgb(81 83 107/var(--tw-text-opacity));cursor:pointer;display:flex;font-size:.875rem;font-weight:600;gap:.5rem;height:2rem;line-height:1.25rem;padding-left:.5rem;padding-right:.5rem;width:100%}:host .text-container{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host(.hover:hover){--tw-bg-opacity:1;--tw-text-opacity:1;background-color:rgb(241 246 255/var(--tw-bg-opacity));color:rgb(81 83 107/var(--tw-text-opacity))}:host(.active){--tw-bg-opacity:1;--tw-text-opacity:1;background-color:rgb(241 246 255/var(--tw-bg-opacity));color:rgb(82 138 250/var(--tw-text-opacity))}.-rotate-0,.-rotate-135,.-rotate-180,.-rotate-225,.-rotate-25,.-rotate-270,.-rotate-315,.-rotate-45,.-rotate-90,.rotate-0,.rotate-135,.rotate-180,.rotate-225,.rotate-25,.rotate-270,.rotate-315,.rotate-45,.rotate-90,.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.text-lg,.text-xl{line-height:1.75rem!important}.hover\\:text-negative:hover{--tw-text-opacity:1!important;color:rgb(185 30 40/var(--tw-text-opacity))!important}.max-w-\\[20rem\\]{max-width:20rem!important}.w-3\\/4{width:75%!important}@media (min-width:64rem){.desktop-xs\\:flex{display:flex!important}.desktop-xs\\:hidden{display:none!important}.desktop-xs\\:w-auto{width:auto!important}.desktop-xs\\:flex-row{flex-direction:row!important}}.w-1\\/12{width:8.333333%!important}.w-10\\/12{width:83.333333%!important}.w-11\\/12{width:91.666667%!important}.w-2\\/12{width:16.666667%!important}.w-3\\/12{width:25%!important}.w-4\\/12{width:33.333333%!important}.w-5\\/12{width:41.666667%!important}.w-6\\/12{width:50%!important}.w-7\\/12{width:58.333333%!important}.w-8\\/12{width:66.666667%!important}.w-9\\/12{width:75%!important}@media (min-width:40rem){.tablet\\:w-1\\/12{width:8.333333%!important}.tablet\\:w-10\\/12{width:83.333333%!important}.tablet\\:w-11\\/12{width:91.666667%!important}.tablet\\:w-2\\/12{width:16.666667%!important}.tablet\\:w-3\\/12{width:25%!important}.tablet\\:w-4\\/12{width:33.333333%!important}.tablet\\:w-5\\/12{width:41.666667%!important}.tablet\\:w-6\\/12{width:50%!important}.tablet\\:w-7\\/12{width:58.333333%!important}.tablet\\:w-8\\/12{width:66.666667%!important}.tablet\\:w-9\\/12{width:75%!important}}@media (min-width:64rem){.desktop-xs\\:w-1\\/12{width:8.333333%!important}.desktop-xs\\:w-10\\/12{width:83.333333%!important}.desktop-xs\\:w-11\\/12{width:91.666667%!important}.desktop-xs\\:w-2\\/12{width:16.666667%!important}.desktop-xs\\:w-3\\/12{width:25%!important}.desktop-xs\\:w-4\\/12{width:33.333333%!important}.desktop-xs\\:w-5\\/12{width:41.666667%!important}.desktop-xs\\:w-6\\/12{width:50%!important}.desktop-xs\\:w-7\\/12{width:58.333333%!important}.desktop-xs\\:w-8\\/12{width:66.666667%!important}.desktop-xs\\:w-9\\/12{width:75%!important}}@media (min-width:80rem){.desktop-sm\\:w-1\\/12{width:8.333333%!important}.desktop-sm\\:w-10\\/12{width:83.333333%!important}.desktop-sm\\:w-11\\/12{width:91.666667%!important}.desktop-sm\\:w-2\\/12{width:16.666667%!important}.desktop-sm\\:w-3\\/12{width:25%!important}.desktop-sm\\:w-4\\/12{width:33.333333%!important}.desktop-sm\\:w-5\\/12{width:41.666667%!important}.desktop-sm\\:w-6\\/12{width:50%!important}.desktop-sm\\:w-7\\/12{width:58.333333%!important}.desktop-sm\\:w-8\\/12{width:66.666667%!important}.desktop-sm\\:w-9\\/12{width:75%!important}}@media (min-width:85.375rem){.desktop\\:w-1\\/12{width:8.333333%!important}.desktop\\:w-10\\/12{width:83.333333%!important}.desktop\\:w-11\\/12{width:91.666667%!important}.desktop\\:w-2\\/12{width:16.666667%!important}.desktop\\:w-3\\/12{width:25%!important}.desktop\\:w-4\\/12{width:33.333333%!important}.desktop\\:w-5\\/12{width:41.666667%!important}.desktop\\:w-6\\/12{width:50%!important}.desktop\\:w-7\\/12{width:58.333333%!important}.desktop\\:w-8\\/12{width:66.666667%!important}.desktop\\:w-9\\/12{width:75%!important}}@media (min-width:90rem){.desktop-lg\\:w-1\\/12{width:8.333333%!important}.desktop-lg\\:w-10\\/12{width:83.333333%!important}.desktop-lg\\:w-11\\/12{width:91.666667%!important}.desktop-lg\\:w-2\\/12{width:16.666667%!important}.desktop-lg\\:w-3\\/12{width:25%!important}.desktop-lg\\:w-4\\/12{width:33.333333%!important}.desktop-lg\\:w-5\\/12{width:41.666667%!important}.desktop-lg\\:w-6\\/12{width:50%!important}.desktop-lg\\:w-7\\/12{width:58.333333%!important}.desktop-lg\\:w-8\\/12{width:66.666667%!important}.desktop-lg\\:w-9\\/12{width:75%!important}}@media (min-width:120rem){.desktop-xl\\:w-1\\/12{width:8.333333%!important}.desktop-xl\\:w-10\\/12{width:83.333333%!important}.desktop-xl\\:w-11\\/12{width:91.666667%!important}.desktop-xl\\:w-2\\/12{width:16.666667%!important}.desktop-xl\\:w-3\\/12{width:25%!important}.desktop-xl\\:w-4\\/12{width:33.333333%!important}.desktop-xl\\:w-5\\/12{width:41.666667%!important}.desktop-xl\\:w-6\\/12{width:50%!important}.desktop-xl\\:w-7\\/12{width:58.333333%!important}.desktop-xl\\:w-8\\/12{width:66.666667%!important}.desktop-xl\\:w-9\\/12{width:75%!important}}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)!important}";const p=class{constructor(a){t(this,a);this.active=false;this.enableHover=true;this.icon=undefined}render(){return r(e,{class:`p-dropdown-menu-item ${this.active&&"active"} ${this.enableHover&&"hover"}`},this.icon&&r("p-icon",{variant:this.icon}),r("div",{class:"text-container"},r("slot",null)))}};p.style=m;export{w as p_dropdown,p as p_dropdown_menu_item};
|
|
2
|
+
//# sourceMappingURL=p-ab08ea2e.entry.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["dropdownComponentCss","Dropdown","this","_loaded","componentShouldUpdate","_setOptions","render","h","Host","class","ref","_trigger","onClick","_triggerClickHandler","onSlotchange","ev","_checkButton","name","role","maxWidth","calculateWidth","applyMaxWidth","fullWidth","applyFullWidth","el","_load","_containerClickHandler","target","slot","children","assignedElements","child","nodeName","chevronPosition","chevron","chevronDirection","placement","indexOf","onShowChange","show","_hide","_show","documentClickHandler","_menu","hasAttribute","childOf","_el","insideClick","disableTriggerClick","popover","_popper","createPopper","strategy","setTimeout","setOptions","modifiers","options","offset","style","width","clientWidth","setAttribute","isOpen","emit","Object","assign","enabled","update","removeAttribute","dropdownMenuItemComponentCss","DropdownMenuItem","active","enableHover","icon","variant"],"sources":["./src/components/molecules/dropdown/dropdown.component.scss?tag=p-dropdown&encapsulation=shadow","./src/components/molecules/dropdown/dropdown.component.tsx","./src/components/atoms/dropdown-menu-item/dropdown-menu-item.component.scss?tag=p-dropdown-menu-item&encapsulation=shadow","./src/components/atoms/dropdown-menu-item/dropdown-menu-item.component.tsx"],"sourcesContent":[":host {\n @apply block relative;\n\n .trigger {\n @apply block relative w-auto h-auto;\n }\n\n p-dropdown-menu-container {\n @apply hidden z-dropdown;\n\n &[data-show] {\n @apply flex;\n }\n }\n}\n","import { createPopper, Placement, PositioningStrategy } from '@popperjs/core';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Prop,\n Watch,\n} from '@stencil/core';\nimport { childOf } from '../../../utils/child-of';\n\n@Component({\n tag: 'p-dropdown',\n styleUrl: 'dropdown.component.scss',\n shadow: true,\n})\nexport class Dropdown {\n /**\n * The content of the dropdown menu\n */\n @Prop({ reflect: true }) placement: Placement = 'bottom-start';\n\n /**\n * The strategy of the popover placement\n */\n @Prop() strategy: PositioningStrategy = 'absolute';\n\n /**\n * Wether to show the dropdown menu\n */\n @Prop() show: boolean = false;\n\n /**\n * Wether to automatically calculate the width of the menu based on the trigger\n */\n @Prop() calculateWidth: boolean = false;\n\n /**\n * Wether to apply the max width\n */\n @Prop() applyMaxWidth: boolean = true;\n\n /**\n * Wether to apply the full width\n */\n @Prop() applyFullWidth: boolean = true;\n\n /**\n * Wether to automatically close the dropdown menu after clicking inside\n */\n @Prop() insideClick: boolean = false;\n\n /**\n * Wether to automatically close the dropdown menu after clicking inside\n */\n @Prop() disableTriggerClick: boolean = false;\n\n /**\n * Chevron position\n */\n @Prop() chevronPosition: 'start' | 'end' = 'end';\n\n /**\n * Chevron direction\n */\n @Prop() chevronDirection: 'up' | 'down';\n\n /**\n * The host element\n */\n @Element() private _el: HTMLElement;\n\n /**\n * Open change event\n */\n @Event() isOpen: EventEmitter<boolean>;\n\n private _loaded = false;\n private _popper: any;\n private _trigger: HTMLElement;\n private _menu: HTMLElement;\n\n componentShouldUpdate() {\n this._setOptions();\n }\n\n render() {\n return (\n <Host class=\"p-dropdown\">\n <div\n class=\"trigger\"\n ref={(ref) => (this._trigger = ref)}\n onClick={() => this._triggerClickHandler()}\n >\n <slot\n onSlotchange={(ev) => this._checkButton(ev)}\n name=\"trigger\"\n />\n </div>\n <p-dropdown-menu-container\n role=\"popover\"\n maxWidth={!this.calculateWidth && this.applyMaxWidth}\n fullWidth={this.applyFullWidth && !this.applyMaxWidth}\n ref={(el) => this._load(el)}\n onClick={() => this._containerClickHandler()}\n >\n <slot name=\"items\" />\n </p-dropdown-menu-container>\n </Host>\n );\n }\n\n private _checkButton({ target }: Event) {\n const slot = target as HTMLSlotElement;\n const children = slot.assignedElements();\n\n for (let child of children) {\n if (child.nodeName === 'P-BUTTON') {\n (child as any).chevronPosition = this.chevronPosition;\n (child as any).chevron = this.chevronDirection\n ? this.chevronDirection\n : this.placement.indexOf('top') >= 0\n ? 'up'\n : 'down';\n }\n }\n }\n\n @Watch('show')\n protected onShowChange(show) {\n if (!this._loaded) {\n return;\n }\n\n if (!show) {\n this._hide();\n return;\n }\n\n this._show();\n }\n\n @Listen('click', { target: 'document', capture: true })\n protected documentClickHandler({ target }) {\n if (\n !this._menu.hasAttribute('data-show') ||\n childOf(target, this._el)\n ) {\n return;\n }\n\n this._hide();\n }\n\n private _containerClickHandler() {\n if (this.insideClick) {\n return;\n }\n\n if (this._menu.hasAttribute('data-show')) {\n this._hide();\n }\n }\n\n private _triggerClickHandler() {\n if (this.disableTriggerClick) {\n return;\n }\n\n if (this._menu.hasAttribute('data-show')) {\n this._hide();\n return;\n }\n\n this._show();\n }\n\n private _load(popover: HTMLElement) {\n this._menu = popover;\n if (popover) {\n this._popper = createPopper(this._el, popover, {\n strategy: this.strategy,\n });\n\n this._setOptions();\n this._loaded = true;\n\n if (this.show) {\n setTimeout(() => this._show(), 100);\n }\n }\n }\n\n private _setOptions() {\n if (!this._popper) {\n return;\n }\n\n this._popper.setOptions({\n placement: this.placement,\n modifiers: [\n {\n name: 'offset',\n options: {\n offset: [0, 8],\n },\n },\n ],\n });\n }\n\n private _show() {\n if (!this._loaded) {\n return;\n }\n\n // Make the popover visible\n if (this.calculateWidth) {\n this._menu.style.width = `${this._trigger.clientWidth}px`;\n }\n\n this._menu.setAttribute('data-show', '');\n this.isOpen.emit(true);\n\n // Enable the event listeners\n this._popper.setOptions((options) => ({\n ...options,\n modifiers: [\n ...options.modifiers,\n { name: 'eventListeners', enabled: true },\n ],\n }));\n\n // Update its position\n this._popper.update();\n }\n\n private _hide() {\n if (!this._loaded || this.show) {\n return;\n }\n\n // Hide the popover\n this._menu.removeAttribute('data-show');\n this.isOpen.emit(false);\n\n // Disable the event listeners\n this._popper.setOptions((options) => ({\n ...options,\n modifiers: [\n ...options.modifiers,\n { name: 'eventListeners', enabled: false },\n ],\n }));\n }\n}\n",":host {\n @apply h-8 flex items-center px-2 rounded w-full gap-2;\n @apply text-sm text-storm font-semibold;\n @apply cursor-pointer;\n\n .text-container {\n @apply block overflow-hidden text-ellipsis whitespace-nowrap;\n }\n}\n\n:host(.hover:hover) {\n @apply text-storm bg-indigo-light;\n}\n\n:host(.active) {\n @apply text-indigo bg-indigo-light;\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\nimport { IconVariant } from '../icon/icon.component';\n\n@Component({\n tag: 'p-dropdown-menu-item',\n styleUrl: 'dropdown-menu-item.component.scss',\n shadow: true,\n})\nexport class DropdownMenuItem {\n /**\n * Wether the dropdown menu item is active\n */\n @Prop() active: boolean = false;\n\n /**\n * Wether to enable the hover state\n */\n @Prop() enableHover: boolean = true;\n\n /**\n * Icon of the navigation item\n */\n @Prop() icon: IconVariant;\n\n render() {\n return (\n <Host\n class={`p-dropdown-menu-item ${this.active && 'active'} ${\n this.enableHover && 'hover'\n }`}\n >\n {this.icon && <p-icon variant={this.icon} />}\n\n <div class=\"text-container\">\n <slot />\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"names":["dropdownComponentCss","Dropdown","this","_loaded","componentShouldUpdate","_setOptions","render","h","Host","class","ref","_trigger","onClick","_triggerClickHandler","onSlotchange","ev","_checkButton","name","role","maxWidth","calculateWidth","applyMaxWidth","fullWidth","applyFullWidth","el","_load","_containerClickHandler","target","slot","children","assignedElements","child","nodeName","chevronPosition","chevron","chevronDirection","placement","indexOf","onShowChange","show","_hide","_show","documentClickHandler","_menu","hasAttribute","childOf","_el","insideClick","disableTriggerClick","popover","_popper","createPopper","strategy","setTimeout","setOptions","modifiers","options","offset","style","width","clientWidth","setAttribute","isOpen","emit","Object","assign","enabled","update","removeAttribute","dropdownMenuItemComponentCss","DropdownMenuItem","active","enableHover","icon","variant"],"sources":["./src/components/molecules/dropdown/dropdown.component.scss?tag=p-dropdown&encapsulation=shadow","./src/components/molecules/dropdown/dropdown.component.tsx","./src/components/atoms/dropdown-menu-item/dropdown-menu-item.component.scss?tag=p-dropdown-menu-item&encapsulation=shadow","./src/components/atoms/dropdown-menu-item/dropdown-menu-item.component.tsx"],"sourcesContent":[":host {\n @apply block relative;\n\n .trigger {\n @apply block relative w-auto h-auto;\n }\n\n p-dropdown-menu-container {\n @apply hidden z-dropdown;\n\n &[data-show] {\n @apply flex;\n }\n }\n}\n","import { createPopper, Placement, PositioningStrategy } from '@popperjs/core';\nimport {\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Prop,\n Watch,\n} from '@stencil/core';\nimport { childOf } from '../../../utils/child-of';\n\n@Component({\n tag: 'p-dropdown',\n styleUrl: 'dropdown.component.scss',\n shadow: true,\n})\nexport class Dropdown {\n /**\n * The content of the dropdown menu\n */\n @Prop({ reflect: true }) placement: Placement = 'bottom-start';\n\n /**\n * The strategy of the popover placement\n */\n @Prop() strategy: PositioningStrategy = 'absolute';\n\n /**\n * Wether to show the dropdown menu\n */\n @Prop() show: boolean = false;\n\n /**\n * Wether to automatically calculate the width of the menu based on the trigger\n */\n @Prop() calculateWidth: boolean = false;\n\n /**\n * Wether to apply the max width\n */\n @Prop() applyMaxWidth: boolean = true;\n\n /**\n * Wether to apply the full width\n */\n @Prop() applyFullWidth: boolean = true;\n\n /**\n * Wether to automatically close the dropdown menu after clicking inside\n */\n @Prop() insideClick: boolean = false;\n\n /**\n * Wether to automatically close the dropdown menu after clicking inside\n */\n @Prop() disableTriggerClick: boolean = false;\n\n /**\n * Chevron position\n */\n @Prop() chevronPosition: 'start' | 'end' = 'end';\n\n /**\n * Chevron direction\n */\n @Prop() chevronDirection: 'up' | 'down';\n\n /**\n * The host element\n */\n @Element() private _el: HTMLElement;\n\n /**\n * Open change event\n */\n @Event() isOpen: EventEmitter<boolean>;\n\n private _loaded = false;\n private _popper: any;\n private _trigger: HTMLElement;\n private _menu: HTMLElement;\n\n componentShouldUpdate() {\n this._setOptions();\n }\n\n render() {\n return (\n <Host class=\"p-dropdown\">\n <div\n class=\"trigger\"\n ref={(ref) => (this._trigger = ref)}\n onClick={() => this._triggerClickHandler()}\n >\n <slot\n onSlotchange={(ev) => this._checkButton(ev)}\n name=\"trigger\"\n />\n </div>\n <p-dropdown-menu-container\n role=\"popover\"\n maxWidth={!this.calculateWidth && this.applyMaxWidth}\n fullWidth={this.applyFullWidth && !this.applyMaxWidth}\n ref={(el) => this._load(el)}\n onClick={() => this._containerClickHandler()}\n >\n <slot name=\"items\" />\n </p-dropdown-menu-container>\n </Host>\n );\n }\n\n private _checkButton({ target }: Event) {\n const slot = target as HTMLSlotElement;\n const children = slot.assignedElements();\n\n for (let child of children) {\n if (child.nodeName === 'P-BUTTON') {\n (child as any).chevronPosition = this.chevronPosition;\n (child as any).chevron = this.chevronDirection\n ? this.chevronDirection\n : this.placement.indexOf('top') >= 0\n ? 'up'\n : 'down';\n }\n }\n }\n\n @Watch('show')\n protected onShowChange(show) {\n if (!this._loaded) {\n return;\n }\n\n if (!show) {\n this._hide();\n return;\n }\n\n this._show();\n }\n\n @Listen('click', { target: 'document', capture: true })\n protected documentClickHandler({ target }) {\n if (\n !this._menu.hasAttribute('data-show') ||\n childOf(target, this._el)\n ) {\n return;\n }\n\n this._hide();\n }\n\n private _containerClickHandler() {\n if (this.insideClick) {\n return;\n }\n\n if (this._menu.hasAttribute('data-show')) {\n this._hide();\n }\n }\n\n private _triggerClickHandler() {\n if (this.disableTriggerClick) {\n return;\n }\n\n if (this._menu.hasAttribute('data-show')) {\n this._hide();\n return;\n }\n\n this._show();\n }\n\n private _load(popover: HTMLElement) {\n this._menu = popover;\n if (popover) {\n this._popper = createPopper(this._el, popover, {\n strategy: this.strategy,\n });\n\n this._setOptions();\n this._loaded = true;\n\n if (this.show) {\n setTimeout(() => this._show(), 100);\n }\n }\n }\n\n private _setOptions() {\n if (!this._popper) {\n return;\n }\n\n this._popper.setOptions({\n placement: this.placement,\n modifiers: [\n {\n name: 'offset',\n options: {\n offset: [0, 8],\n },\n },\n ],\n });\n }\n\n private _show() {\n if (!this._loaded) {\n return;\n }\n\n // Make the popover visible\n if (this.calculateWidth) {\n this._menu.style.width = `${this._trigger.clientWidth}px`;\n }\n\n this._menu.setAttribute('data-show', '');\n this.isOpen.emit(true);\n\n // Enable the event listeners\n this._popper.setOptions((options) => ({\n ...options,\n modifiers: [\n ...options.modifiers,\n { name: 'eventListeners', enabled: true },\n ],\n }));\n\n // Update its position\n this._popper.update();\n }\n\n private _hide() {\n if (!this._loaded || this.show) {\n return;\n }\n\n // Hide the popover\n this._menu.removeAttribute('data-show');\n this.isOpen.emit(false);\n\n // Disable the event listeners\n this._popper.setOptions((options) => ({\n ...options,\n modifiers: [\n ...options.modifiers,\n { name: 'eventListeners', enabled: false },\n ],\n }));\n }\n}\n",":host {\n @apply h-8 flex items-center px-2 rounded w-full gap-2;\n @apply text-sm text-storm font-semibold;\n @apply cursor-pointer;\n\n .text-container {\n @apply block overflow-hidden text-ellipsis whitespace-nowrap;\n }\n}\n\n:host(.hover:hover) {\n @apply text-storm bg-indigo-light;\n}\n\n:host(.active) {\n @apply text-indigo bg-indigo-light;\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\nimport { IconVariant } from '../icon/icon.component';\n\n@Component({\n tag: 'p-dropdown-menu-item',\n styleUrl: 'dropdown-menu-item.component.scss',\n shadow: true,\n})\nexport class DropdownMenuItem {\n /**\n * Wether the dropdown menu item is active\n */\n @Prop() active: boolean = false;\n\n /**\n * Wether to enable the hover state\n */\n @Prop() enableHover: boolean = true;\n\n /**\n * Icon of the navigation item\n */\n @Prop() icon: IconVariant;\n\n render() {\n return (\n <Host\n class={`p-dropdown-menu-item ${this.active && 'active'} ${\n this.enableHover && 'hover'\n }`}\n >\n {this.icon && <p-icon variant={this.icon} />}\n\n <div class=\"text-container\">\n <slot />\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"wIAAA,MAAMA,EAAuB,g2X,MCmBhBC,EAAQ,M,wDA6DTC,KAAAC,QAAU,M,eAzD8B,e,cAKR,W,UAKhB,M,oBAKU,M,mBAKD,K,oBAKC,K,iBAKH,M,yBAKQ,M,qBAKI,M,gCAsB3CC,wBACIF,KAAKG,a,CAGTC,SACI,OACIC,EAACC,EAAI,CAACC,MAAM,cACRF,EAAA,OACIE,MAAM,UACNC,IAAMA,GAASR,KAAKS,SAAWD,EAC/BE,QAAS,IAAMV,KAAKW,wBAEpBN,EAAA,QACIO,aAAeC,GAAOb,KAAKc,aAAaD,GACxCE,KAAK,aAGbV,EAAA,6BACIW,KAAK,UACLC,UAAWjB,KAAKkB,gBAAkBlB,KAAKmB,cACvCC,UAAWpB,KAAKqB,iBAAmBrB,KAAKmB,cACxCX,IAAMc,GAAOtB,KAAKuB,MAAMD,GACxBZ,QAAS,IAAMV,KAAKwB,0BAEpBnB,EAAA,QAAMU,KAAK,W,CAMnBD,cAAaW,OAAEA,IACnB,MAAMC,EAAOD,EACb,MAAME,EAAWD,EAAKE,mBAEtB,IAAK,IAAIC,KAASF,EAAU,CACxB,GAAIE,EAAMC,WAAa,WAAY,CAC9BD,EAAcE,gBAAkB/B,KAAK+B,gBACrCF,EAAcG,QAAUhC,KAAKiC,iBACxBjC,KAAKiC,iBACLjC,KAAKkC,UAAUC,QAAQ,QAAU,EACjC,KACA,M,GAMRC,aAAaC,GACnB,IAAKrC,KAAKC,QAAS,CACf,M,CAGJ,IAAKoC,EAAM,CACPrC,KAAKsC,QACL,M,CAGJtC,KAAKuC,O,CAICC,sBAAqBf,OAAEA,IAC7B,IACKzB,KAAKyC,MAAMC,aAAa,cACzBC,EAAQlB,EAAQzB,KAAK4C,KACvB,CACE,M,CAGJ5C,KAAKsC,O,CAGDd,yBACJ,GAAIxB,KAAK6C,YAAa,CAClB,M,CAGJ,GAAI7C,KAAKyC,MAAMC,aAAa,aAAc,CACtC1C,KAAKsC,O,EAIL3B,uBACJ,GAAIX,KAAK8C,oBAAqB,CAC1B,M,CAGJ,GAAI9C,KAAKyC,MAAMC,aAAa,aAAc,CACtC1C,KAAKsC,QACL,M,CAGJtC,KAAKuC,O,CAGDhB,MAAMwB,GACV/C,KAAKyC,MAAQM,EACb,GAAIA,EAAS,CACT/C,KAAKgD,QAAUC,EAAajD,KAAK4C,IAAKG,EAAS,CAC3CG,SAAUlD,KAAKkD,WAGnBlD,KAAKG,cACLH,KAAKC,QAAU,KAEf,GAAID,KAAKqC,KAAM,CACXc,YAAW,IAAMnD,KAAKuC,SAAS,I,GAKnCpC,cACJ,IAAKH,KAAKgD,QAAS,CACf,M,CAGJhD,KAAKgD,QAAQI,WAAW,CACpBlB,UAAWlC,KAAKkC,UAChBmB,UAAW,CACP,CACItC,KAAM,SACNuC,QAAS,CACLC,OAAQ,CAAC,EAAG,O,CAOxBhB,QACJ,IAAKvC,KAAKC,QAAS,CACf,M,CAIJ,GAAID,KAAKkB,eAAgB,CACrBlB,KAAKyC,MAAMe,MAAMC,MAAQ,GAAGzD,KAAKS,SAASiD,e,CAG9C1D,KAAKyC,MAAMkB,aAAa,YAAa,IACrC3D,KAAK4D,OAAOC,KAAK,MAGjB7D,KAAKgD,QAAQI,YAAYE,GAAOQ,OAAAC,OAAAD,OAAAC,OAAA,GACzBT,GAAO,CACVD,UAAW,IACJC,EAAQD,UACX,CAAEtC,KAAM,iBAAkBiD,QAAS,WAK3ChE,KAAKgD,QAAQiB,Q,CAGT3B,QACJ,IAAKtC,KAAKC,SAAWD,KAAKqC,KAAM,CAC5B,M,CAIJrC,KAAKyC,MAAMyB,gBAAgB,aAC3BlE,KAAK4D,OAAOC,KAAK,OAGjB7D,KAAKgD,QAAQI,YAAYE,GAAOQ,OAAAC,OAAAD,OAAAC,OAAA,GACzBT,GAAO,CACVD,UAAW,IACJC,EAAQD,UACX,CAAEtC,KAAM,iBAAkBiD,QAAS,W,0FC9PnD,MAAMG,EAA+B,s0Y,MCQxBC,EAAgB,M,qCAIC,M,iBAKK,K,oBAO/BhE,SACI,OACIC,EAACC,EAAI,CACDC,MAAO,wBAAwBP,KAAKqE,QAAU,YAC1CrE,KAAKsE,aAAe,WAGvBtE,KAAKuE,MAAQlE,EAAA,UAAQmE,QAASxE,KAAKuE,OAEpClE,EAAA,OAAKE,MAAM,kBACPF,EAAA,c"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,h as a,H as r,g as e}from"./p-69d43b9d.js";const o=".static{position:static!important}.absolute{position:absolute!important}.relative{position:relative!important}.right-2{right:.5rem!important}.top-2{top:.5rem!important}.flex{display:flex!important}.w-full{width:100%!important}.-rotate-0{--tw-rotate:-0deg!important}.-rotate-0,.-rotate-135{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-135{--tw-rotate:-135deg!important}.-rotate-180{--tw-rotate:-180deg!important}.-rotate-180,.-rotate-225{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-225{--tw-rotate:-225deg!important}.-rotate-25{--tw-rotate:-25deg!important}.-rotate-25,.-rotate-270{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-270{--tw-rotate:-270deg!important}.-rotate-315{--tw-rotate:-315deg!important}.-rotate-315,.-rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-45{--tw-rotate:-45deg!important}.-rotate-90{--tw-rotate:-90deg!important}.-rotate-90,.rotate-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-0{--tw-rotate:0deg!important}.rotate-135{--tw-rotate:135deg!important}.rotate-135,.rotate-180{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-180{--tw-rotate:180deg!important}.rotate-225{--tw-rotate:225deg!important}.rotate-225,.rotate-25{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-25{--tw-rotate:25deg!important}.rotate-270{--tw-rotate:270deg!important}.rotate-270,.rotate-315{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-315{--tw-rotate:315deg!important}.rotate-45{--tw-rotate:45deg!important}.rotate-45,.rotate-90{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-90{--tw-rotate:90deg!important}.scale-x-flip{--tw-scale-x:-1!important}.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.scale-y-flip{--tw-scale-y:-1!important}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.cursor-pointer{cursor:pointer!important}.flex-col{flex-direction:column!important}.bg-indigo-light{--tw-bg-opacity:1!important;background-color:rgb(241 246 255/var(--tw-bg-opacity))!important}.p-4{padding:1rem!important}.text-2xl{font-size:1.5rem!important;line-height:2rem!important}.text-3xl{font-size:1.875rem!important;line-height:2.25rem!important}.text-4xl{font-size:2.25rem!important;line-height:2.5rem!important}.text-5xl{font-size:3rem!important}.text-5xl,.text-6xl{line-height:1!important}.text-6xl{font-size:3.75rem!important}.text-base{font-size:1rem!important;line-height:1.5rem!important}.text-lg{font-size:1.125rem!important;line-height:1.75rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-xl{font-size:1.25rem!important;line-height:1.75rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.text-xxs{font-size:.6875rem!important}.font-semibold{font-weight:600!important}*{box-sizing:border-box}:host{--tw-bg-opacity:1;background-color:rgb(241 246 255/var(--tw-bg-opacity));border-radius:.375rem;display:flex;flex-direction:column;padding:1rem;position:relative;width:100%}:host .header{--tw-text-opacity:1;color:rgb(39 40 56/var(--tw-text-opacity));font-weight:600}:host .content{font-size:.875rem;line-height:1.25rem}:host .close{--tw-text-opacity:1;color:rgb(152 154 183/var(--tw-text-opacity));cursor:pointer;position:absolute;right:.5rem;top:.5rem}:host(.variant-positive){--tw-bg-opacity:1;background-color:rgb(229 255 242/var(--tw-bg-opacity))}:host(.variant-unbiased){--tw-bg-opacity:1;background-color:rgb(255 246 220/var(--tw-bg-opacity))}:host(.variant-negative){--tw-bg-opacity:1;background-color:rgb(255 204 211/var(--tw-bg-opacity))}:host(.has-close){padding-right:2rem}.-rotate-0,.-rotate-135,.-rotate-180,.-rotate-225,.-rotate-25,.-rotate-270,.-rotate-315,.-rotate-45,.-rotate-90,.rotate-0,.rotate-135,.rotate-180,.rotate-225,.rotate-25,.rotate-270,.rotate-315,.rotate-45,.rotate-90,.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}";const s=class{constructor(a){t(this,a);this.variant="info";this.header=undefined;this.content=undefined;this.closeable=false}render(){return a(r,{class:`p-info-panel variant-${this.variant} ${this.closeable&&"has-close"}`},a("div",{class:"header"},a("slot",{name:"header"})),a("div",{class:"content"},a("slot",{name:"content"})),this.closeable&&a("div",{class:"close",onClick:()=>this._close()},a("p-icon",{variant:"negative"})))}_close(){this._el.remove()}get _el(){return e(this)}};s.style=o;export{s as p_info_panel};
|
|
2
|
+
//# sourceMappingURL=p-b131d8d5.entry.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["infoPanelComponentCss","InfoPanel","render","h","Host","class","this","variant","closeable","name","onClick","_close","_el","remove"],"sources":["./src/components/atoms/info-panel/info-panel.component.scss?tag=p-info-panel&encapsulation=shadow","./src/components/atoms/info-panel/info-panel.component.tsx"],"sourcesContent":[":host {\n @apply flex flex-col w-full relative p-4 bg-indigo-light rounded-large;\n\n .header {\n @apply font-semibold text-storm-dark;\n }\n\n .content {\n @apply text-sm;\n }\n\n .close {\n @apply absolute top-2 right-2 cursor-pointer text-storm-vague;\n }\n}\n\n:host(.variant-positive) {\n @apply bg-positive-light;\n}\n\n:host(.variant-unbiased) {\n @apply bg-unbiased-light;\n}\n\n:host(.variant-negative) {\n @apply bg-negative-light;\n}\n\n:host(.has-close) {\n @apply pr-8;\n}\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'p-info-panel',\n styleUrl: 'info-panel.component.scss',\n shadow: true,\n})\nexport class InfoPanel {\n /**\n * The variant of the info panel\n */\n @Prop() variant: 'info' | 'negative' | 'positive' | 'unbiased' = 'info';\n\n /**\n * The header of the info panel\n */\n @Prop() header: string;\n\n /**\n * The content of the info panel\n */\n @Prop() content: string;\n\n /**\n * Wether the panel can be closed\n */\n @Prop() closeable: boolean = false;\n\n /**\n * The host element\n */\n @Element() private _el: HTMLElement;\n\n render() {\n return (\n <Host class={`p-info-panel variant-${this.variant} ${this.closeable && 'has-close'}`}>\n <div class=\"header\">\n <slot name=\"header\" />\n </div>\n <div class=\"content\">\n <slot name=\"content\" />\n </div>\n\n {this.closeable && (\n <div class=\"close\" onClick={() => this._close()}>\n <p-icon variant=\"negative\" />\n </div>\n )}\n </Host>\n );\n }\n\n private _close() {\n this._el.remove();\n }\n}\n"],"mappings":"yDAAA,MAAMA,EAAwB,
|
|
1
|
+
{"version":3,"names":["infoPanelComponentCss","InfoPanel","render","h","Host","class","this","variant","closeable","name","onClick","_close","_el","remove"],"sources":["./src/components/atoms/info-panel/info-panel.component.scss?tag=p-info-panel&encapsulation=shadow","./src/components/atoms/info-panel/info-panel.component.tsx"],"sourcesContent":[":host {\n @apply flex flex-col w-full relative p-4 bg-indigo-light rounded-large;\n\n .header {\n @apply font-semibold text-storm-dark;\n }\n\n .content {\n @apply text-sm;\n }\n\n .close {\n @apply absolute top-2 right-2 cursor-pointer text-storm-vague;\n }\n}\n\n:host(.variant-positive) {\n @apply bg-positive-light;\n}\n\n:host(.variant-unbiased) {\n @apply bg-unbiased-light;\n}\n\n:host(.variant-negative) {\n @apply bg-negative-light;\n}\n\n:host(.has-close) {\n @apply pr-8;\n}\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n tag: 'p-info-panel',\n styleUrl: 'info-panel.component.scss',\n shadow: true,\n})\nexport class InfoPanel {\n /**\n * The variant of the info panel\n */\n @Prop() variant: 'info' | 'negative' | 'positive' | 'unbiased' = 'info';\n\n /**\n * The header of the info panel\n */\n @Prop() header: string;\n\n /**\n * The content of the info panel\n */\n @Prop() content: string;\n\n /**\n * Wether the panel can be closed\n */\n @Prop() closeable: boolean = false;\n\n /**\n * The host element\n */\n @Element() private _el: HTMLElement;\n\n render() {\n return (\n <Host class={`p-info-panel variant-${this.variant} ${this.closeable && 'has-close'}`}>\n <div class=\"header\">\n <slot name=\"header\" />\n </div>\n <div class=\"content\">\n <slot name=\"content\" />\n </div>\n\n {this.closeable && (\n <div class=\"close\" onClick={() => this._close()}>\n <p-icon variant=\"negative\" />\n </div>\n )}\n </Host>\n );\n }\n\n private _close() {\n this._el.remove();\n }\n}\n"],"mappings":"yDAAA,MAAMA,EAAwB,ukL,MCOjBC,EAAS,M,sCAI6C,O,4DAepC,K,CAO7BC,SACE,OACEC,EAACC,EAAI,CAACC,MAAO,wBAAwBC,KAAKC,WAAWD,KAAKE,WAAa,eACrEL,EAAA,OAAKE,MAAM,UACTF,EAAA,QAAMM,KAAK,YAEbN,EAAA,OAAKE,MAAM,WACTF,EAAA,QAAMM,KAAK,aAGZH,KAAKE,WACJL,EAAA,OAAKE,MAAM,QAAQK,QAAS,IAAMJ,KAAKK,UACrCR,EAAA,UAAQI,QAAQ,c,CAOlBI,SACNL,KAAKM,IAAIC,Q"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,h as a,H as r}from"./p-69d43b9d.js";const e=".static{position:static!important}.inline-block{display:inline-block!important}.flex{display:flex!important}.h-8{height:2rem!important}.w-full{width:100%!important}.-rotate-0{--tw-rotate:-0deg!important}.-rotate-0,.-rotate-135{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-135{--tw-rotate:-135deg!important}.-rotate-180{--tw-rotate:-180deg!important}.-rotate-180,.-rotate-225{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-225{--tw-rotate:-225deg!important}.-rotate-25{--tw-rotate:-25deg!important}.-rotate-25,.-rotate-270{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-270{--tw-rotate:-270deg!important}.-rotate-315{--tw-rotate:-315deg!important}.-rotate-315,.-rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-45{--tw-rotate:-45deg!important}.-rotate-90{--tw-rotate:-90deg!important}.-rotate-90,.rotate-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-0{--tw-rotate:0deg!important}.rotate-135{--tw-rotate:135deg!important}.rotate-135,.rotate-180{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-180{--tw-rotate:180deg!important}.rotate-225{--tw-rotate:225deg!important}.rotate-225,.rotate-25{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-25{--tw-rotate:25deg!important}.rotate-270{--tw-rotate:270deg!important}.rotate-270,.rotate-315{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-315{--tw-rotate:315deg!important}.rotate-45{--tw-rotate:45deg!important}.rotate-45,.rotate-90{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-90{--tw-rotate:90deg!important}.scale-x-flip{--tw-scale-x:-1!important}.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.scale-y-flip{--tw-scale-y:-1!important}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.cursor-pointer{cursor:pointer!important}.items-center{align-items:center!important}.rounded-large{border-radius:.375rem!important}.px-2{padding-left:.5rem!important;padding-right:.5rem!important}.text-2xl{font-size:1.5rem!important;line-height:2rem!important}.text-3xl{font-size:1.875rem!important;line-height:2.25rem!important}.text-4xl{font-size:2.25rem!important;line-height:2.5rem!important}.text-5xl{font-size:3rem!important}.text-5xl,.text-6xl{line-height:1!important}.text-6xl{font-size:3.75rem!important}.text-base{font-size:1rem!important;line-height:1.5rem!important}.text-lg{font-size:1.125rem!important;line-height:1.75rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-xl{font-size:1.25rem!important;line-height:1.75rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.text-xxs{font-size:.6875rem!important}.text-indigo{color:rgb(82 138 250/var(--tw-text-opacity))!important}.text-indigo,.text-storm{--tw-text-opacity:1!important}.text-storm{color:rgb(81 83 107/var(--tw-text-opacity))!important}*{box-sizing:border-box}:host{display:inline-block;margin-bottom:.25rem;width:100%}:host>a{--tw-text-opacity:1;align-items:center;border-radius:.375rem;color:rgb(81 83 107/var(--tw-text-opacity));cursor:pointer;display:flex;font-weight:600;gap:.5rem;height:2rem;padding-left:.5rem;padding-right:.5rem;text-decoration-line:none;width:100%}:host>a:hover{--tw-bg-opacity:1;background-color:rgb(241 246 255/var(--tw-bg-opacity))}:host>a>p-icon{--tw-text-opacity:1;color:rgb(81 83 107/var(--tw-text-opacity))}:host>a>p-counter{margin-left:auto}:host(.active)>a{--tw-bg-opacity:1;--tw-text-opacity:1;background-color:rgb(241 246 255/var(--tw-bg-opacity));color:rgb(82 138 250/var(--tw-text-opacity))}:host(.active)>a>p-icon{--tw-text-opacity:1;color:rgb(82 138 250/var(--tw-text-opacity))}.-rotate-0,.-rotate-135,.-rotate-180,.-rotate-225,.-rotate-25,.-rotate-270,.-rotate-315,.-rotate-45,.-rotate-90,.rotate-0,.rotate-135,.rotate-180,.rotate-225,.rotate-25,.rotate-270,.rotate-315,.rotate-45,.rotate-90,.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}";const o=class{constructor(a){t(this,a);this.active=false;this.icon=undefined;this.counter=undefined;this.href=undefined;this.target=undefined}render(){return a(r,{class:`p-navigation-item ${this.active&&"active"}`},a("a",{href:this.href,target:this.target},this.icon&&a("p-icon",{variant:this.icon}),a("span",{class:this.counter&&"has-counter"},a("slot",null)),this.counter&&a("p-counter",{variant:"negative"},this.counter)))}};o.style=e;export{o as p_navigation_item};
|
|
2
|
+
//# sourceMappingURL=p-b2af2dd2.entry.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["navigationItemComponentCss","NavigationItem","render","h","Host","class","this","active","href","target","icon","variant","counter"],"sources":["./src/components/molecules/navigation-item/navigation-item.component.scss?tag=p-navigation-item&encapsulation=shadow","./src/components/molecules/navigation-item/navigation-item.component.tsx"],"sourcesContent":[":host {\n @apply w-full inline-block mb-1;\n\n > a {\n @apply w-full h-8 px-2 cursor-pointer rounded-large no-underline;\n @apply flex items-center gap-2;\n @apply text-storm font-semibold;\n\n @apply hover:bg-indigo-light;\n\n > p-icon {\n @apply text-storm;\n }\n\n > p-counter {\n @apply ml-auto;\n }\n }\n}\n\n:host(.active) {\n > a {\n @apply text-indigo bg-indigo-light;\n\n > p-icon {\n @apply text-indigo;\n }\n }\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\nimport { IconVariant } from '../../atoms/icon/icon.component';\n\n@Component({\n tag: 'p-navigation-item',\n styleUrl: 'navigation-item.component.scss',\n shadow: true,\n})\nexport class NavigationItem {\n /**\n * Wether the navigation item is active\n */\n @Prop() active: boolean = false;\n\n /**\n * Icon of the navigation item\n */\n @Prop() icon: IconVariant;\n\n /**\n * Icon of the navigation item\n */\n @Prop() counter: number | string;\n\n /**\n * The href of the navigation item\n */\n @Prop() href: string;\n\n /**\n * The target of the navigation item\n */\n @Prop() target: string;\n\n render() {\n return (\n <Host class={`p-navigation-item ${this.active && 'active'}`}>\n <a href={this.href} target={this.target}>\n {this.icon && <p-icon variant={this.icon} />}\n <span class={this.counter && 'has-counter'}>\n <slot />\n </span>\n {this.counter && (\n <p-counter variant=\"negative\">{this.counter}</p-counter>\n )}\n </a>\n </Host>\n );\n }\n}\n"],"mappings":"kDAAA,MAAMA,EAA6B,
|
|
1
|
+
{"version":3,"names":["navigationItemComponentCss","NavigationItem","render","h","Host","class","this","active","href","target","icon","variant","counter"],"sources":["./src/components/molecules/navigation-item/navigation-item.component.scss?tag=p-navigation-item&encapsulation=shadow","./src/components/molecules/navigation-item/navigation-item.component.tsx"],"sourcesContent":[":host {\n @apply w-full inline-block mb-1;\n\n > a {\n @apply w-full h-8 px-2 cursor-pointer rounded-large no-underline;\n @apply flex items-center gap-2;\n @apply text-storm font-semibold;\n\n @apply hover:bg-indigo-light;\n\n > p-icon {\n @apply text-storm;\n }\n\n > p-counter {\n @apply ml-auto;\n }\n }\n}\n\n:host(.active) {\n > a {\n @apply text-indigo bg-indigo-light;\n\n > p-icon {\n @apply text-indigo;\n }\n }\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\nimport { IconVariant } from '../../atoms/icon/icon.component';\n\n@Component({\n tag: 'p-navigation-item',\n styleUrl: 'navigation-item.component.scss',\n shadow: true,\n})\nexport class NavigationItem {\n /**\n * Wether the navigation item is active\n */\n @Prop() active: boolean = false;\n\n /**\n * Icon of the navigation item\n */\n @Prop() icon: IconVariant;\n\n /**\n * Icon of the navigation item\n */\n @Prop() counter: number | string;\n\n /**\n * The href of the navigation item\n */\n @Prop() href: string;\n\n /**\n * The target of the navigation item\n */\n @Prop() target: string;\n\n render() {\n return (\n <Host class={`p-navigation-item ${this.active && 'active'}`}>\n <a href={this.href} target={this.target}>\n {this.icon && <p-icon variant={this.icon} />}\n <span class={this.counter && 'has-counter'}>\n <slot />\n </span>\n {this.counter && (\n <p-counter variant=\"negative\">{this.counter}</p-counter>\n )}\n </a>\n </Host>\n );\n }\n}\n"],"mappings":"kDAAA,MAAMA,EAA6B,smL,MCQtBC,EAAc,M,qCAIG,M,qFAsB1BC,SACI,OACIC,EAACC,EAAI,CAACC,MAAO,qBAAqBC,KAAKC,QAAU,YAC7CJ,EAAA,KAAGK,KAAMF,KAAKE,KAAMC,OAAQH,KAAKG,QAC5BH,KAAKI,MAAQP,EAAA,UAAQQ,QAASL,KAAKI,OACpCP,EAAA,QAAME,MAAOC,KAAKM,SAAW,eACzBT,EAAA,cAEHG,KAAKM,SACFT,EAAA,aAAWQ,QAAQ,YAAYL,KAAKM,U"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r as t,h as e,H as a,g as r}from"./p-69d43b9d.js";const o=".visible{visibility:visible!important}.static{position:static!important}.absolute{position:absolute!important}.ml-auto{margin-left:auto!important}.flex{display:flex!important}.w-full{width:100%!important}.min-w-0{min-width:0!important}.-rotate-0{--tw-rotate:-0deg!important}.-rotate-0,.-rotate-135{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-135{--tw-rotate:-135deg!important}.-rotate-180{--tw-rotate:-180deg!important}.-rotate-180,.-rotate-225{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-225{--tw-rotate:-225deg!important}.-rotate-25{--tw-rotate:-25deg!important}.-rotate-25,.-rotate-270{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-270{--tw-rotate:-270deg!important}.-rotate-315{--tw-rotate:-315deg!important}.-rotate-315,.-rotate-45{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.-rotate-45{--tw-rotate:-45deg!important}.-rotate-90{--tw-rotate:-90deg!important}.-rotate-90,.rotate-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-0{--tw-rotate:0deg!important}.rotate-135{--tw-rotate:135deg!important}.rotate-135,.rotate-180{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-180{--tw-rotate:180deg!important}.rotate-225{--tw-rotate:225deg!important}.rotate-225,.rotate-25{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-25{--tw-rotate:25deg!important}.rotate-270{--tw-rotate:270deg!important}.rotate-270,.rotate-315{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-315{--tw-rotate:315deg!important}.rotate-45{--tw-rotate:45deg!important}.rotate-45,.rotate-90{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.rotate-90{--tw-rotate:90deg!important}.scale-x-flip{--tw-scale-x:-1!important}.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.scale-y-flip{--tw-scale-y:-1!important}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.flex-col{flex-direction:column!important}.items-center{align-items:center!important}.justify-center{justify-content:center!important}.gap-3{gap:.75rem!important}.overflow-hidden{overflow:hidden!important}.text-ellipsis{text-overflow:ellipsis!important}.rounded{border-radius:.25rem!important}.border{border-width:1px!important}.border-solid{border-style:solid!important}.border-mystic-dark{--tw-border-opacity:1!important;border-color:rgb(218 230 240/var(--tw-border-opacity))!important}.p-2{padding:.5rem!important}.text-2xl{font-size:1.5rem!important;line-height:2rem!important}.text-3xl{font-size:1.875rem!important;line-height:2.25rem!important}.text-4xl{font-size:2.25rem!important;line-height:2.5rem!important}.text-5xl{font-size:3rem!important}.text-5xl,.text-6xl{line-height:1!important}.text-6xl{font-size:3.75rem!important}.text-base{font-size:1rem!important;line-height:1.5rem!important}.text-lg{font-size:1.125rem!important;line-height:1.75rem!important}.text-sm{font-size:.875rem!important;line-height:1.25rem!important}.text-xl{font-size:1.25rem!important;line-height:1.75rem!important}.text-xs{font-size:.75rem!important;line-height:1rem!important}.text-xxs{font-size:.6875rem!important}*{box-sizing:border-box}.h-\\[3\\.125rem\\]{height:3.125rem!important}.h-\\[4\\.125rem\\]{height:4.125rem!important}:host{display:flex}:host .content{align-items:center;display:flex;gap:.75rem;width:100%}:host .content .name{display:flex;flex-direction:column;justify-content:center;overflow:hidden}:host .content .name>:first-child{--tw-text-opacity:1;color:rgb(39 40 56/var(--tw-text-opacity));font-size:.875rem;font-weight:600;line-height:1.25rem}:host .content .name>:nth-child(2){--tw-text-opacity:1;color:rgb(152 154 183/var(--tw-text-opacity));font-size:.875rem;line-height:1.25rem}:host .content .name ::slotted(*){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host([size=small]){height:2rem}:host([size=medium]){height:3.125rem}:host([size=large]){height:4rem}:host(.has-dropdown){cursor:pointer}:host(.has-dropdown) .content{--tw-border-opacity:1!important;border-color:rgb(218 230 240/var(--tw-border-opacity))!important;border-radius:.25rem;border-style:solid!important;border-width:1px!important;padding:.5rem}:host(.has-dropdown[size=small]){height:3rem}:host(.has-dropdown[size=medium]){height:4.125rem}:host(.has-dropdown[size=large]){height:5rem}:host(.active) .content,:host(.has-dropdown:hover) .content{--tw-shadow:0px 0.3125rem 1rem rgba(0,24,98,.08),0px 0.0625rem 0.1875rem rgba(0,24,98,.13);--tw-shadow-colored:0px 0.3125rem 1rem var(--tw-shadow-color),0px 0.0625rem 0.1875rem var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}:host(.active) .content p-icon{--tw-text-opacity:1;color:rgb(82 138 250/var(--tw-text-opacity))}.-rotate-0,.-rotate-135,.-rotate-180,.-rotate-225,.-rotate-25,.-rotate-270,.-rotate-315,.-rotate-45,.-rotate-90,.rotate-0,.rotate-135,.rotate-180,.rotate-225,.rotate-25,.rotate-270,.rotate-315,.rotate-45,.rotate-90,.scale-x-flip,.scale-y-flip{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.text-lg,.text-xl{line-height:1.75rem!important}";const s=class{constructor(e){t(this,e);this.variant="user";this.size="small";this._dropdownOpen=false}componentWillRender(){this._updateAvatar()}render(){const t=!!this._el.querySelector(':scope > [slot="dropdown"]');const r=this._getContent(t);return e(a,{class:`p-profile ${t&&"has-dropdown"} ${this._dropdownOpen&&"active"}`},t?e("p-dropdown",{class:"w-full min-w-0",strategy:"absolute",placement:this.variant==="user"?"top-end":"bottom-end",onIsOpen:t=>this._dropdownOpen=t.detail},r,e("div",{slot:"items"},e("slot",{name:"dropdown"}))):r)}_getContent(t){return e("div",{class:"content",slot:"trigger"},e("slot",{name:"avatar"}),e("div",{class:"name"},e("slot",{name:"title"}),e("slot",{name:"subtitle"})),t&&this._getIcon())}_updateAvatar(){var t,e;const a=this._el.querySelector('p-avatar[slot="avatar"]');if(!a){return}a.variant=(t=this.variant)!==null&&t!==void 0?t:a.variant;a.size=(e=this.size)!==null&&e!==void 0?e:a===null||a===void 0?void 0:a.size}_getIcon(){return e("p-icon",{class:"ml-auto",variant:this.variant==="company"?"chevron":"more"})}get _el(){return r(this)}};s.style=o;export{s as p_profile};
|
|
2
|
+
//# sourceMappingURL=p-bd13aa1f.entry.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["profileComponentCss","Profile","componentWillRender","this","_updateAvatar","render","hasDropdownSlot","_el","querySelector","content","_getContent","h","Host","class","_dropdownOpen","strategy","placement","variant","onIsOpen","ev","detail","slot","name","_getIcon","avatar","_a","size","_b"],"sources":["./src/components/molecules/profile/profile.component.scss?tag=p-profile&encapsulation=shadow","./src/components/molecules/profile/profile.component.tsx"],"sourcesContent":[":host {\n @apply flex;\n\n .content {\n @apply flex gap-3 items-center w-full;\n\n .name {\n @apply flex flex-col justify-center overflow-hidden;\n\n > *:nth-child(1) {\n @apply text-sm text-storm-dark;\n @apply font-semibold;\n }\n\n > *:nth-child(2) {\n @apply text-sm text-storm-vague;\n }\n\n ::slotted(*) {\n @apply text-ellipsis overflow-hidden whitespace-nowrap;\n }\n }\n }\n}\n\n:host([size='small']) {\n @apply h-8;\n}\n\n:host([size='medium']) {\n @apply h-[3.125rem];\n}\n\n:host([size='large']) {\n @apply h-16;\n}\n\n:host(.has-dropdown) {\n @apply cursor-pointer;\n\n .content {\n @apply p-2 rounded;\n @apply border border-solid border-mystic-dark #{!important};\n }\n}\n\n:host(.has-dropdown[size='small']) {\n @apply h-12;\n}\n\n:host(.has-dropdown[size='medium']) {\n @apply h-[4.125rem];\n}\n\n:host(.has-dropdown[size='large']) {\n @apply h-20;\n}\n\n:host(.has-dropdown:hover),\n:host(.active) {\n .content {\n @apply shadow-4;\n }\n}\n\n:host(.active) {\n .content {\n p-icon {\n @apply text-indigo;\n }\n }\n}\n","import { Component, Element, h, Host, Prop, State } from '@stencil/core';\n\n@Component({\n tag: 'p-profile',\n styleUrl: 'profile.component.scss',\n shadow: true,\n})\nexport class Profile {\n /**\n * The variant of the profile\n */\n @Prop() variant: 'company' | 'user' = 'user';\n\n /**\n * The size of the profile avatar\n */\n @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'small';\n\n /**\n * The host element\n */\n @Element() private _el: HTMLElement;\n\n @State() private _dropdownOpen = false;\n\n componentWillRender() {\n this._updateAvatar();\n }\n\n render() {\n const hasDropdownSlot = !!this._el.querySelector(\n ':scope > [slot=\"dropdown\"]'\n );\n const content = this._getContent(hasDropdownSlot);\n return (\n <Host\n class={`p-profile ${hasDropdownSlot && 'has-dropdown'} ${\n this._dropdownOpen && 'active'\n }`}\n >\n {hasDropdownSlot ? (\n <p-dropdown\n class=\"w-full min-w-0\"\n strategy=\"absolute\"\n placement={\n this.variant === 'user' ? 'top-end' : 'bottom-end'\n }\n onIsOpen={(ev) => (this._dropdownOpen = ev.detail)}\n >\n {content}\n <div slot=\"items\">\n <slot name=\"dropdown\" />\n </div>\n </p-dropdown>\n ) : (\n content\n )}\n </Host>\n );\n }\n\n private _getContent(hasDropdownSlot) {\n return (\n <div class=\"content\" slot=\"trigger\">\n <slot name=\"avatar\" />\n <div class=\"name\">\n <slot name=\"title\" />\n <slot name=\"subtitle\" />\n </div>\n\n {hasDropdownSlot && this._getIcon()}\n </div>\n );\n }\n\n private _updateAvatar() {\n const avatar = this._el.querySelector(\n 'p-avatar[slot=\"avatar\"]'\n ) as HTMLPAvatarElement;\n\n if (!avatar) {\n return;\n }\n\n avatar.variant = this.variant ?? avatar.variant;\n avatar.size = this.size ?? avatar?.size;\n }\n\n private _getIcon() {\n return (\n <p-icon\n class=\"ml-auto\"\n variant={this.variant === 'company' ? 'chevron' : 'more'}\n />\n );\n }\n}\n"],"mappings":"yDAAA,MAAMA,EAAsB,
|
|
1
|
+
{"version":3,"names":["profileComponentCss","Profile","componentWillRender","this","_updateAvatar","render","hasDropdownSlot","_el","querySelector","content","_getContent","h","Host","class","_dropdownOpen","strategy","placement","variant","onIsOpen","ev","detail","slot","name","_getIcon","avatar","_a","size","_b"],"sources":["./src/components/molecules/profile/profile.component.scss?tag=p-profile&encapsulation=shadow","./src/components/molecules/profile/profile.component.tsx"],"sourcesContent":[":host {\n @apply flex;\n\n .content {\n @apply flex gap-3 items-center w-full;\n\n .name {\n @apply flex flex-col justify-center overflow-hidden;\n\n > *:nth-child(1) {\n @apply text-sm text-storm-dark;\n @apply font-semibold;\n }\n\n > *:nth-child(2) {\n @apply text-sm text-storm-vague;\n }\n\n ::slotted(*) {\n @apply text-ellipsis overflow-hidden whitespace-nowrap;\n }\n }\n }\n}\n\n:host([size='small']) {\n @apply h-8;\n}\n\n:host([size='medium']) {\n @apply h-[3.125rem];\n}\n\n:host([size='large']) {\n @apply h-16;\n}\n\n:host(.has-dropdown) {\n @apply cursor-pointer;\n\n .content {\n @apply p-2 rounded;\n @apply border border-solid border-mystic-dark #{!important};\n }\n}\n\n:host(.has-dropdown[size='small']) {\n @apply h-12;\n}\n\n:host(.has-dropdown[size='medium']) {\n @apply h-[4.125rem];\n}\n\n:host(.has-dropdown[size='large']) {\n @apply h-20;\n}\n\n:host(.has-dropdown:hover),\n:host(.active) {\n .content {\n @apply shadow-4;\n }\n}\n\n:host(.active) {\n .content {\n p-icon {\n @apply text-indigo;\n }\n }\n}\n","import { Component, Element, h, Host, Prop, State } from '@stencil/core';\n\n@Component({\n tag: 'p-profile',\n styleUrl: 'profile.component.scss',\n shadow: true,\n})\nexport class Profile {\n /**\n * The variant of the profile\n */\n @Prop() variant: 'company' | 'user' = 'user';\n\n /**\n * The size of the profile avatar\n */\n @Prop({ reflect: true }) size: 'small' | 'medium' | 'large' = 'small';\n\n /**\n * The host element\n */\n @Element() private _el: HTMLElement;\n\n @State() private _dropdownOpen = false;\n\n componentWillRender() {\n this._updateAvatar();\n }\n\n render() {\n const hasDropdownSlot = !!this._el.querySelector(\n ':scope > [slot=\"dropdown\"]'\n );\n const content = this._getContent(hasDropdownSlot);\n return (\n <Host\n class={`p-profile ${hasDropdownSlot && 'has-dropdown'} ${\n this._dropdownOpen && 'active'\n }`}\n >\n {hasDropdownSlot ? (\n <p-dropdown\n class=\"w-full min-w-0\"\n strategy=\"absolute\"\n placement={\n this.variant === 'user' ? 'top-end' : 'bottom-end'\n }\n onIsOpen={(ev) => (this._dropdownOpen = ev.detail)}\n >\n {content}\n <div slot=\"items\">\n <slot name=\"dropdown\" />\n </div>\n </p-dropdown>\n ) : (\n content\n )}\n </Host>\n );\n }\n\n private _getContent(hasDropdownSlot) {\n return (\n <div class=\"content\" slot=\"trigger\">\n <slot name=\"avatar\" />\n <div class=\"name\">\n <slot name=\"title\" />\n <slot name=\"subtitle\" />\n </div>\n\n {hasDropdownSlot && this._getIcon()}\n </div>\n );\n }\n\n private _updateAvatar() {\n const avatar = this._el.querySelector(\n 'p-avatar[slot=\"avatar\"]'\n ) as HTMLPAvatarElement;\n\n if (!avatar) {\n return;\n }\n\n avatar.variant = this.variant ?? avatar.variant;\n avatar.size = this.size ?? avatar?.size;\n }\n\n private _getIcon() {\n return (\n <p-icon\n class=\"ml-auto\"\n variant={this.variant === 'company' ? 'chevron' : 'more'}\n />\n );\n }\n}\n"],"mappings":"yDAAA,MAAMA,EAAsB,irN,MCOfC,EAAO,M,sCAIsB,O,UAKwB,Q,mBAO7B,K,CAEjCC,sBACIC,KAAKC,e,CAGTC,SACI,MAAMC,IAAoBH,KAAKI,IAAIC,cAC/B,8BAEJ,MAAMC,EAAUN,KAAKO,YAAYJ,GACjC,OACIK,EAACC,EAAI,CACDC,MAAO,aAAaP,GAAmB,kBACnCH,KAAKW,eAAiB,YAGzBR,EACGK,EAAA,cACIE,MAAM,iBACNE,SAAS,WACTC,UACIb,KAAKc,UAAY,OAAS,UAAY,aAE1CC,SAAWC,GAAQhB,KAAKW,cAAgBK,EAAGC,QAE1CX,EACDE,EAAA,OAAKU,KAAK,SACNV,EAAA,QAAMW,KAAK,eAEN,E,CAQrBZ,YAAYJ,GAChB,OACIK,EAAA,OAAKE,MAAM,UAAUQ,KAAK,WACtBV,EAAA,QAAMW,KAAK,WACXX,EAAA,OAAKE,MAAM,QACPF,EAAA,QAAMW,KAAK,UACXX,EAAA,QAAMW,KAAK,cAGdhB,GAAmBH,KAAKoB,W,CAK7BnB,gB,QACJ,MAAMoB,EAASrB,KAAKI,IAAIC,cACpB,2BAGJ,IAAKgB,EAAQ,CACT,M,CAGJA,EAAOP,SAAUQ,EAAAtB,KAAKc,WAAO,MAAAQ,SAAA,EAAAA,EAAID,EAAOP,QACxCO,EAAOE,MAAOC,EAAAxB,KAAKuB,QAAI,MAAAC,SAAA,EAAAA,EAAIH,IAAM,MAANA,SAAM,SAANA,EAAQE,I,CAG/BH,WACJ,OACIZ,EAAA,UACIE,MAAM,UACNI,QAASd,KAAKc,UAAY,UAAY,UAAY,Q"}
|