globuswebcomponents 2.4.4 → 2.4.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/gb-avatar-label-group_2.cjs.entry.js +1 -1
- package/dist/cjs/{gb-avatar_30.cjs.entry.js → gb-avatar_35.cjs.entry.js} +288 -13
- package/dist/cjs/gb-avatar_35.cjs.entry.js.map +1 -0
- package/dist/cjs/gb-featured-icon_3.cjs.entry.js +2 -2
- package/dist/cjs/gb-slider-control-handle.cjs.entry.js +1 -1
- package/dist/cjs/gb-slider.cjs.entry.js +1 -1
- package/dist/cjs/gb-stepper-horizontal-icons-centered.cjs.entry.js +1 -1
- package/dist/cjs/gb-stepper-horizontal-icons-connected.cjs.entry.js +1 -1
- package/dist/cjs/gb-stepper-horizontal-line-with-text.cjs.entry.js +1 -1
- package/dist/cjs/gb-stepper-horizontal-minimal-icons.cjs.entry.js +1 -1
- package/dist/cjs/gb-stepper-vertical-icons-with-text.cjs.entry.js +1 -1
- package/dist/cjs/gb-tab-button-base.cjs.entry.js +3 -3
- package/dist/cjs/gb-table-cell.cjs.entry.js +1 -1
- package/dist/cjs/gb-table-header.cjs.entry.js +1 -1
- package/dist/cjs/gb-textarea-input-field.cjs.entry.js +4 -4
- package/dist/cjs/gb-toggle-base.cjs.entry.js +2 -2
- package/dist/cjs/gb-toggle.cjs.entry.js +1 -1
- package/dist/cjs/gb-token-field-compressed.cjs.entry.js +2 -2
- package/dist/cjs/gb-top-bar-sidemenu.cjs.entry.js +1 -1
- package/dist/cjs/gb-vertical-tabs.cjs.entry.js +1 -1
- package/dist/cjs/gb-wysiwyg-editor-icon.cjs.entry.js +1 -1
- package/dist/cjs/gb-wysiwyg-tooltip.cjs.entry.js +1 -1
- package/dist/cjs/globuscomponents.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/test-input-tag.cjs.entry.js +2 -2
- package/dist/collection/components/gb-sidebar/gb-sidebar.js +31 -6
- package/dist/collection/components/gb-sidebar/gb-sidebar.js.map +1 -1
- package/dist/collection/components/gb-simple-side-bar-item/gb-simple-side-bar-item.css +12 -2
- package/dist/collection/components/gb-simple-side-bar-item/gb-simple-side-bar-item.js +1 -3
- package/dist/collection/components/gb-simple-side-bar-item/gb-simple-side-bar-item.js.map +1 -1
- package/dist/collection/components/gb-slider/gb-slider.js +1 -1
- package/dist/collection/components/gb-slider-control-handle/gb-slider-control-handle.js +1 -1
- package/dist/collection/components/gb-status-indicator/gb-status-indicator.js +1 -1
- package/dist/collection/components/gb-step-base/gb-step-base.js +1 -1
- package/dist/collection/components/gb-step-icon-base/gb-step-icon-base.js +1 -1
- package/dist/collection/components/gb-stepper-horizontal-icons-centered/gb-stepper-horizontal-icons-centered.js +1 -1
- package/dist/collection/components/gb-stepper-horizontal-icons-connected/gb-stepper-horizontal-icons-connected.js +1 -1
- package/dist/collection/components/gb-stepper-horizontal-line-with-text/gb-stepper-horizontal-line-with-text.js +1 -1
- package/dist/collection/components/gb-stepper-horizontal-minimal-icons/gb-stepper-horizontal-minimal-icons.js +1 -1
- package/dist/collection/components/gb-stepper-vertical-icons-with-text/gb-stepper-vertical-icons-with-text.js +1 -1
- package/dist/collection/components/gb-tab-button-base/gb-tab-button-base.js +3 -3
- package/dist/collection/components/gb-table-cell/gb-table-cell.js +1 -1
- package/dist/collection/components/gb-table-header/gb-table-header.js +1 -1
- package/dist/collection/components/gb-tag/gb-tag.js +1 -1
- package/dist/collection/components/gb-tag-checkbox/gb-tag-checkbox.js +1 -1
- package/dist/collection/components/gb-tag-close/gb-tag-close.js +1 -1
- package/dist/collection/components/gb-tag-count/gb-tag-count.js +1 -1
- package/dist/collection/components/gb-textarea-input-field/gb-textarea-input-field.js +4 -4
- package/dist/collection/components/gb-theme-tab/gb-theme-tab.js +1 -1
- package/dist/collection/components/gb-toast/gb-toast.js +1 -1
- package/dist/collection/components/gb-toast-button/gb-toast-button.js +1 -1
- package/dist/collection/components/gb-toggle/gb-toggle.js +1 -1
- package/dist/collection/components/gb-toggle-base/gb-toggle-base.js +2 -2
- package/dist/collection/components/gb-token-field-compact/gb-token-field-compact.js +1 -1
- package/dist/collection/components/gb-token-field-compressed/gb-token-field-compressed.js +2 -2
- package/dist/collection/components/gb-tooltip/gb-tooltip.js +1 -1
- package/dist/collection/components/gb-top-bar/gb-top-bar.js +1 -1
- package/dist/collection/components/gb-top-bar-item/gb-top-bar-item.js +1 -1
- package/dist/collection/components/gb-top-bar-sidemenu/gb-top-bar-sidemenu.js +1 -1
- package/dist/collection/components/gb-vertical-tabs/gb-vertical-tabs.js +1 -1
- package/dist/collection/components/gb-wysiwyg-editor-icon/gb-wysiwyg-editor-icon.js +1 -1
- package/dist/collection/components/gb-wysiwyg-tooltip/gb-wysiwyg-tooltip.js +1 -1
- package/dist/collection/components/test-input-tag/test-input-tag.js +2 -2
- package/dist/components/gb-avatar-add-button.js +1 -1
- package/dist/components/gb-avatar-dropdown.js +7 -7
- package/dist/components/gb-avatar-group.js +4 -4
- package/dist/components/gb-avatar-label-group.js +1 -1
- package/dist/components/gb-avatar-profile-photo.js +2 -2
- package/dist/components/gb-avatar.js +1 -1
- package/dist/components/gb-badge.js +1 -1
- package/dist/components/gb-checkbox-group-item.js +1 -1
- package/dist/components/gb-checkbox-group.js +3 -3
- package/dist/components/gb-collapse-button.js +1 -1
- package/dist/components/gb-complex-primary-side-bar-item.js +1 -1
- package/dist/components/gb-complex-secondary-side-bar-item.js +1 -1
- package/dist/components/gb-detail-cell.js +4 -4
- package/dist/components/gb-file-upload-item-base.js +1 -1
- package/dist/components/gb-file-upload.js +3 -3
- package/dist/components/gb-filter-button.js +1 -1
- package/dist/components/gb-header.js +2 -2
- package/dist/components/gb-help-tooltip.js +1 -1
- package/dist/components/gb-horizontal-tabs.js +4 -4
- package/dist/components/gb-icon-button-base.js +1 -1
- package/dist/components/gb-input-dropdown-menu-item.js +1 -1
- package/dist/components/gb-input-dropdown.js +1 -1
- package/dist/components/gb-input-field.js +1 -1
- package/dist/components/gb-metric-card.js +3 -3
- package/dist/components/gb-pagination.js +11 -11
- package/dist/components/gb-progress-bar.js +1 -1
- package/dist/components/gb-sidebar.js +20 -14
- package/dist/components/gb-sidebar.js.map +1 -1
- package/dist/components/gb-simple-side-bar-item.js +1 -1
- package/dist/components/gb-slider-control-handle.js +1 -1
- package/dist/components/gb-slider.js +3 -3
- package/dist/components/gb-status-indicator.js +1 -1
- package/dist/components/gb-step-base.js +1 -1
- package/dist/components/gb-step-icon-base.js +1 -1
- package/dist/components/gb-stepper-horizontal-icons-centered.js +3 -3
- package/dist/components/gb-stepper-horizontal-icons-connected.js +1 -1
- package/dist/components/gb-stepper-horizontal-line-with-text.js +3 -3
- package/dist/components/gb-stepper-horizontal-minimal-icons.js +2 -2
- package/dist/components/gb-stepper-vertical-icons-with-text.js +3 -3
- package/dist/components/gb-tab-button-base.js +1 -1
- package/dist/components/gb-table-cell.js +1 -1
- package/dist/components/gb-table-header.js +13 -13
- package/dist/components/gb-tag-checkbox.js +1 -1
- package/dist/components/gb-tag-close.js +1 -1
- package/dist/components/gb-tag-count.js +1 -1
- package/dist/components/gb-tag.js +1 -1
- package/dist/components/gb-textarea-input-field.js +11 -11
- package/dist/components/gb-theme-tab.js +1 -1
- package/dist/components/gb-toast-button.js +1 -1
- package/dist/components/gb-toast.js +2 -2
- package/dist/components/gb-toggle-base.js +1 -1
- package/dist/components/gb-toggle.js +2 -2
- package/dist/components/gb-token-field-compact.js +1 -1
- package/dist/components/gb-token-field-compressed.js +2 -2
- package/dist/components/gb-tooltip.js +1 -1
- package/dist/components/gb-top-bar-item.js +1 -1
- package/dist/components/gb-top-bar-sidemenu.js +6 -6
- package/dist/components/gb-top-bar.js +3 -3
- package/dist/components/gb-vertical-tabs.js +1 -1
- package/dist/components/gb-wysiwyg-editor-icon.js +1 -1
- package/dist/components/gb-wysiwyg-tooltip.js +2 -2
- package/dist/components/{p-Dy7FOfda.js → p-9-6qFgbA.js} +3 -3
- package/dist/components/{p-Dy7FOfda.js.map → p-9-6qFgbA.js.map} +1 -1
- package/dist/components/{p-CF7KZH-2.js → p-ATdU51KT.js} +3 -3
- package/dist/components/{p-CF7KZH-2.js.map → p-ATdU51KT.js.map} +1 -1
- package/dist/components/{p-B7QvU5pe.js → p-B2NcY90B.js} +11 -11
- package/dist/components/{p-B7QvU5pe.js.map → p-B2NcY90B.js.map} +1 -1
- package/dist/components/{p-BzzbkdEH.js → p-B3WWeEXF.js} +4 -4
- package/dist/components/{p-BzzbkdEH.js.map → p-B3WWeEXF.js.map} +1 -1
- package/dist/components/{p-CHhaSgr9.js → p-B4ohTuDv.js} +8 -8
- package/dist/components/{p-CHhaSgr9.js.map → p-B4ohTuDv.js.map} +1 -1
- package/dist/components/{p-ClFAt11G.js → p-B72h81jq.js} +3 -3
- package/dist/components/{p-ClFAt11G.js.map → p-B72h81jq.js.map} +1 -1
- package/dist/components/{p-CMieCjMB.js → p-BDjYFfWd.js} +3 -3
- package/dist/components/{p-CMieCjMB.js.map → p-BDjYFfWd.js.map} +1 -1
- package/dist/components/{p-WZji2Vld.js → p-BLX_b4kE.js} +4 -4
- package/dist/components/{p-WZji2Vld.js.map → p-BLX_b4kE.js.map} +1 -1
- package/dist/components/{p-DTXCcQIh.js → p-BZtQAStz.js} +3 -3
- package/dist/components/{p-DTXCcQIh.js.map → p-BZtQAStz.js.map} +1 -1
- package/dist/components/{p-BEQ_CtL9.js → p-Bb7SSBdV.js} +3 -3
- package/dist/components/{p-BEQ_CtL9.js.map → p-Bb7SSBdV.js.map} +1 -1
- package/dist/components/{p-C0SnZTg-.js → p-Bd45Hj76.js} +3 -3
- package/dist/components/{p-C0SnZTg-.js.map → p-Bd45Hj76.js.map} +1 -1
- package/dist/components/{p-BSFUWicV.js → p-Be3JjrY-.js} +4 -4
- package/dist/components/{p-BSFUWicV.js.map → p-Be3JjrY-.js.map} +1 -1
- package/dist/components/{p-DaOuWAJh.js → p-BeEWv2L7.js} +3 -3
- package/dist/components/{p-DaOuWAJh.js.map → p-BeEWv2L7.js.map} +1 -1
- package/dist/components/{p-BW4ltdpB.js → p-BiAMvVmf.js} +4 -4
- package/dist/components/{p-BW4ltdpB.js.map → p-BiAMvVmf.js.map} +1 -1
- package/dist/components/{p-C6MkjMvR.js → p-BjHLH0Bf.js} +4 -4
- package/dist/components/{p-C6MkjMvR.js.map → p-BjHLH0Bf.js.map} +1 -1
- package/dist/components/{p-Bhc1uZgU.js → p-CF3kgMtQ.js} +8 -8
- package/dist/components/{p-Bhc1uZgU.js.map → p-CF3kgMtQ.js.map} +1 -1
- package/dist/components/{p-CTpgDIeq.js → p-CV9FrKEb.js} +12 -12
- package/dist/components/{p-CTpgDIeq.js.map → p-CV9FrKEb.js.map} +1 -1
- package/dist/components/{p-Dp3-lgjy.js → p-CW4w89XL.js} +4 -4
- package/dist/components/{p-Dp3-lgjy.js.map → p-CW4w89XL.js.map} +1 -1
- package/dist/components/{p-C0IxISjA.js → p-CoFmT0fk.js} +8 -10
- package/dist/components/p-CoFmT0fk.js.map +1 -0
- package/dist/components/{p-CUd4oFbp.js → p-D04UkJ6j.js} +3 -3
- package/dist/components/{p-CUd4oFbp.js.map → p-D04UkJ6j.js.map} +1 -1
- package/dist/components/{p-DqEqG_1m.js → p-DCSSE0wF.js} +7 -7
- package/dist/components/{p-DqEqG_1m.js.map → p-DCSSE0wF.js.map} +1 -1
- package/dist/components/{p-CEn8Hk1K.js → p-DFPyZFte.js} +4 -4
- package/dist/components/{p-CEn8Hk1K.js.map → p-DFPyZFte.js.map} +1 -1
- package/dist/components/{p-Cnowvkdt.js → p-DJhbIus4.js} +5 -5
- package/dist/components/{p-Cnowvkdt.js.map → p-DJhbIus4.js.map} +1 -1
- package/dist/components/{p-BhJSGibU.js → p-D_WtHKQI.js} +3 -3
- package/dist/components/{p-BhJSGibU.js.map → p-D_WtHKQI.js.map} +1 -1
- package/dist/components/{p-BRnSOFLy.js → p-Dj9RYN7o.js} +3 -3
- package/dist/components/{p-BRnSOFLy.js.map → p-Dj9RYN7o.js.map} +1 -1
- package/dist/components/{p-z18wHkwb.js → p-DksiC7vr.js} +4 -4
- package/dist/components/{p-z18wHkwb.js.map → p-DksiC7vr.js.map} +1 -1
- package/dist/components/{p-C8XR10Iv.js → p-DmM0iRV2.js} +3 -3
- package/dist/components/{p-C8XR10Iv.js.map → p-DmM0iRV2.js.map} +1 -1
- package/dist/components/{p-C6e5E_lG.js → p-Dyrp3g4e.js} +3 -3
- package/dist/components/{p-C6e5E_lG.js.map → p-Dyrp3g4e.js.map} +1 -1
- package/dist/components/{p-D__3sjwt.js → p-Qq8u7UuS.js} +3 -3
- package/dist/components/{p-D__3sjwt.js.map → p-Qq8u7UuS.js.map} +1 -1
- package/dist/components/{p-CJ8ikf4o.js → p-YSJKLnqP.js} +5 -5
- package/dist/components/{p-CJ8ikf4o.js.map → p-YSJKLnqP.js.map} +1 -1
- package/dist/components/{p-SycI1NwI.js → p-hcGRe3F4.js} +3 -3
- package/dist/components/{p-SycI1NwI.js.map → p-hcGRe3F4.js.map} +1 -1
- package/dist/components/{p--0KAHqjy.js → p-oiaZYTG5.js} +3 -3
- package/dist/components/{p--0KAHqjy.js.map → p-oiaZYTG5.js.map} +1 -1
- package/dist/components/{p-CigMS3GR.js → p-ysrkKU2F.js} +4 -4
- package/dist/components/{p-CigMS3GR.js.map → p-ysrkKU2F.js.map} +1 -1
- package/dist/components/test-input-tag.js +9 -9
- package/dist/docs.json +34 -1
- package/dist/esm/gb-avatar-label-group_2.entry.js +1 -1
- package/dist/esm/{gb-avatar_30.entry.js → gb-avatar_35.entry.js} +284 -14
- package/dist/esm/gb-avatar_35.entry.js.map +1 -0
- package/dist/esm/gb-featured-icon_3.entry.js +2 -2
- package/dist/esm/gb-slider-control-handle.entry.js +1 -1
- package/dist/esm/gb-slider.entry.js +1 -1
- package/dist/esm/gb-stepper-horizontal-icons-centered.entry.js +1 -1
- package/dist/esm/gb-stepper-horizontal-icons-connected.entry.js +1 -1
- package/dist/esm/gb-stepper-horizontal-line-with-text.entry.js +1 -1
- package/dist/esm/gb-stepper-horizontal-minimal-icons.entry.js +1 -1
- package/dist/esm/gb-stepper-vertical-icons-with-text.entry.js +1 -1
- package/dist/esm/gb-tab-button-base.entry.js +3 -3
- package/dist/esm/gb-table-cell.entry.js +1 -1
- package/dist/esm/gb-table-header.entry.js +1 -1
- package/dist/esm/gb-textarea-input-field.entry.js +4 -4
- package/dist/esm/gb-toggle-base.entry.js +2 -2
- package/dist/esm/gb-toggle.entry.js +1 -1
- package/dist/esm/gb-token-field-compressed.entry.js +2 -2
- package/dist/esm/gb-top-bar-sidemenu.entry.js +1 -1
- package/dist/esm/gb-vertical-tabs.entry.js +1 -1
- package/dist/esm/gb-wysiwyg-editor-icon.entry.js +1 -1
- package/dist/esm/gb-wysiwyg-tooltip.entry.js +1 -1
- package/dist/esm/globuscomponents.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/test-input-tag.entry.js +2 -2
- package/dist/globuscomponents/globuscomponents.esm.js +1 -1
- package/dist/globuscomponents/{p-76cb6f7d.entry.js → p-06709ec2.entry.js} +2 -2
- package/dist/globuscomponents/{p-a0eec6e8.entry.js → p-07450a22.entry.js} +2 -2
- package/dist/globuscomponents/p-12578ba6.entry.js +2 -0
- package/dist/globuscomponents/{p-57480a54.entry.js → p-285c9d9a.entry.js} +2 -2
- package/dist/globuscomponents/{p-f91a6ee7.entry.js → p-43ff700e.entry.js} +2 -2
- package/dist/globuscomponents/p-4a82da85.entry.js +2 -0
- package/dist/globuscomponents/{p-a0391841.entry.js → p-559fae6c.entry.js} +2 -2
- package/dist/globuscomponents/{p-b0eb4937.entry.js → p-5716c464.entry.js} +2 -2
- package/dist/globuscomponents/{p-148588ba.entry.js → p-5b1ff539.entry.js} +2 -2
- package/dist/globuscomponents/{p-c1bc705f.entry.js → p-68ca322c.entry.js} +2 -2
- package/dist/globuscomponents/p-7d704241.entry.js +2 -0
- package/dist/globuscomponents/p-7d704241.entry.js.map +1 -0
- package/dist/globuscomponents/{p-936df013.entry.js → p-92503339.entry.js} +2 -2
- package/dist/globuscomponents/{p-e908bb59.entry.js → p-93131a4b.entry.js} +2 -2
- package/dist/globuscomponents/{p-f28f024c.entry.js → p-96abcfa3.entry.js} +2 -2
- package/dist/globuscomponents/{p-a3b30253.entry.js → p-a3e5fbc0.entry.js} +2 -2
- package/dist/globuscomponents/p-a917ca53.entry.js +2 -0
- package/dist/globuscomponents/{p-4e758f17.entry.js → p-b8a77bfa.entry.js} +2 -2
- package/dist/globuscomponents/p-c848f437.entry.js +2 -0
- package/dist/globuscomponents/{p-534f9ab8.entry.js → p-cfbae136.entry.js} +2 -2
- package/dist/globuscomponents/{p-75ff36b4.entry.js → p-d0ca25ff.entry.js} +2 -2
- package/dist/globuscomponents/{p-ce551663.entry.js → p-dc1410d8.entry.js} +2 -2
- package/dist/globuscomponents/{p-50d10b8a.entry.js → p-ea08b893.entry.js} +2 -2
- package/dist/types/components/gb-sidebar/gb-sidebar.d.ts +1 -0
- package/dist/types/components.d.ts +2 -0
- package/package.json +1 -1
- package/dist/cjs/gb-avatar_30.cjs.entry.js.map +0 -1
- package/dist/cjs/gb-collapse-button.gb-complex-primary-side-bar-item.gb-complex-secondary-side-bar-item.gb-simple-side-bar-item.entry.cjs.js.map +0 -1
- package/dist/cjs/gb-collapse-button_4.cjs.entry.js +0 -157
- package/dist/cjs/gb-collapse-button_4.cjs.entry.js.map +0 -1
- package/dist/cjs/gb-sidebar.cjs.entry.js +0 -129
- package/dist/cjs/gb-sidebar.cjs.entry.js.map +0 -1
- package/dist/cjs/gb-sidebar.entry.cjs.js.map +0 -1
- package/dist/components/p-C0IxISjA.js.map +0 -1
- package/dist/esm/gb-avatar_30.entry.js.map +0 -1
- package/dist/esm/gb-collapse-button.gb-complex-primary-side-bar-item.gb-complex-secondary-side-bar-item.gb-simple-side-bar-item.entry.js.map +0 -1
- package/dist/esm/gb-collapse-button_4.entry.js +0 -152
- package/dist/esm/gb-collapse-button_4.entry.js.map +0 -1
- package/dist/esm/gb-sidebar.entry.js +0 -127
- package/dist/esm/gb-sidebar.entry.js.map +0 -1
- package/dist/globuscomponents/gb-collapse-button.gb-complex-primary-side-bar-item.gb-complex-secondary-side-bar-item.gb-simple-side-bar-item.entry.esm.js.map +0 -1
- package/dist/globuscomponents/gb-sidebar.entry.esm.js.map +0 -1
- package/dist/globuscomponents/p-24117e03.entry.js +0 -2
- package/dist/globuscomponents/p-27b547b7.entry.js +0 -2
- package/dist/globuscomponents/p-27b547b7.entry.js.map +0 -1
- package/dist/globuscomponents/p-853bf7fb.entry.js +0 -2
- package/dist/globuscomponents/p-b673d7c6.entry.js +0 -2
- package/dist/globuscomponents/p-b673d7c6.entry.js.map +0 -1
- package/dist/globuscomponents/p-d6e65f7e.entry.js +0 -2
- package/dist/globuscomponents/p-e28f8755.entry.js +0 -2
- package/dist/globuscomponents/p-e28f8755.entry.js.map +0 -1
- package/dist/globuscomponents/p-fe705159.entry.js +0 -2
- /package/dist/globuscomponents/{p-76cb6f7d.entry.js.map → p-06709ec2.entry.js.map} +0 -0
- /package/dist/globuscomponents/{p-a0eec6e8.entry.js.map → p-07450a22.entry.js.map} +0 -0
- /package/dist/globuscomponents/{p-853bf7fb.entry.js.map → p-12578ba6.entry.js.map} +0 -0
- /package/dist/globuscomponents/{p-57480a54.entry.js.map → p-285c9d9a.entry.js.map} +0 -0
- /package/dist/globuscomponents/{p-f91a6ee7.entry.js.map → p-43ff700e.entry.js.map} +0 -0
- /package/dist/globuscomponents/{p-d6e65f7e.entry.js.map → p-4a82da85.entry.js.map} +0 -0
- /package/dist/globuscomponents/{p-a0391841.entry.js.map → p-559fae6c.entry.js.map} +0 -0
- /package/dist/globuscomponents/{p-b0eb4937.entry.js.map → p-5716c464.entry.js.map} +0 -0
- /package/dist/globuscomponents/{p-148588ba.entry.js.map → p-5b1ff539.entry.js.map} +0 -0
- /package/dist/globuscomponents/{p-c1bc705f.entry.js.map → p-68ca322c.entry.js.map} +0 -0
- /package/dist/globuscomponents/{p-936df013.entry.js.map → p-92503339.entry.js.map} +0 -0
- /package/dist/globuscomponents/{p-e908bb59.entry.js.map → p-93131a4b.entry.js.map} +0 -0
- /package/dist/globuscomponents/{p-f28f024c.entry.js.map → p-96abcfa3.entry.js.map} +0 -0
- /package/dist/globuscomponents/{p-a3b30253.entry.js.map → p-a3e5fbc0.entry.js.map} +0 -0
- /package/dist/globuscomponents/{p-fe705159.entry.js.map → p-a917ca53.entry.js.map} +0 -0
- /package/dist/globuscomponents/{p-4e758f17.entry.js.map → p-b8a77bfa.entry.js.map} +0 -0
- /package/dist/globuscomponents/{p-24117e03.entry.js.map → p-c848f437.entry.js.map} +0 -0
- /package/dist/globuscomponents/{p-534f9ab8.entry.js.map → p-cfbae136.entry.js.map} +0 -0
- /package/dist/globuscomponents/{p-75ff36b4.entry.js.map → p-d0ca25ff.entry.js.map} +0 -0
- /package/dist/globuscomponents/{p-ce551663.entry.js.map → p-dc1410d8.entry.js.map} +0 -0
- /package/dist/globuscomponents/{p-50d10b8a.entry.js.map → p-ea08b893.entry.js.map} +0 -0
|
@@ -3,8 +3,8 @@ import { S as StateEnum } from './p-cHn6O-Kf.js';
|
|
|
3
3
|
import { d as defineCustomElement$5 } from './p-hHfYvjNw.js';
|
|
4
4
|
import { d as defineCustomElement$4 } from './p-CeDRmFfD.js';
|
|
5
5
|
import { d as defineCustomElement$3 } from './p-CGM0rU1M.js';
|
|
6
|
-
import { d as defineCustomElement$2 } from './p-
|
|
7
|
-
import { d as defineCustomElement$1 } from './p-
|
|
6
|
+
import { d as defineCustomElement$2 } from './p-D_WtHKQI.js';
|
|
7
|
+
import { d as defineCustomElement$1 } from './p-BZtQAStz.js';
|
|
8
8
|
|
|
9
9
|
const gbFileUploadItemBaseCss = "/* @import 'tailwind.css'; */\r\n\r\n:root {\r\n /* --------------------------------------Primary Colors--------------------------------------------- */\r\n /* base color palette */\r\n --base-white: #fff;\r\n --base-black: #000;\r\n\r\n /* gray color palette */\r\n --gray-25: #f9fafb;\r\n --gray-50: #f6f8fa;\r\n --gray-100: #eef2f6;\r\n --gray-200: #e3e8ef;\r\n --gray-300: #cdd5df;\r\n --gray-400: #808c9e;\r\n --gray-500: #697586;\r\n --gray-600: #4b5565;\r\n --gray-700: #364152;\r\n --gray-800: #202939;\r\n --gray-900: #121926;\r\n --gray-950: #0d121c;\r\n\r\n /* brand dark blue color palette */\r\n --brandDarkBlue-25: #f9f9fb;\r\n --brandDarkBlue-50: #edeef3;\r\n --brandDarkBlue-100: #d3d5e0;\r\n --brandDarkBlue-200: #b5b9cc;\r\n --brandDarkBlue-300: #9095b2;\r\n --brandDarkBlue-400: #464f7f;\r\n --brandDarkBlue-500: #212c65;\r\n --brandDarkBlue-600: #1e285c;\r\n --brandDarkBlue-700: #1c2554;\r\n --brandDarkBlue-800: #161d43;\r\n --brandDarkBlue-900: #0b0f22;\r\n --brandDarkBlue-950: #070914;\r\n\r\n /* brand red color palette */\r\n --brandRed-25: #fffbfa;\r\n --brandRed-50: #fef1f2;\r\n --brandRed-100: #fde3e5;\r\n --brandRed-200: #f9b4ba;\r\n --brandRed-300: #f68e98;\r\n --brandRed-400: #f36976;\r\n --brandRed-500: #e21b2e;\r\n --brandRed-600: #cc1a2a;\r\n --brandRed-700: #b51726;\r\n --brandRed-800: #8c121d;\r\n --brandRed-900: #680d16;\r\n --brandRed-950: #3f080d;\r\n\r\n /* warning color palette */\r\n --warning-25: #fffcf5;\r\n --warning-50: #fffaeb;\r\n --warning-100: #fef0c7;\r\n --warning-200: #fedf89;\r\n --warning-300: #fec84b;\r\n --warning-400: #fdb022;\r\n --warning-500: #f79009;\r\n --warning-600: #dc6803;\r\n --warning-700: #b54708;\r\n --warning-800: #93370d;\r\n --warning-900: #7a2e0e;\r\n --warning-950: #4e1d09;\r\n\r\n /* success color palette */\r\n --success-25: #f6fef9;\r\n --success-50: #ecfdf3;\r\n --success-100: #dcfaeb;\r\n --success-200: #a9efc5;\r\n --success-300: #75e0a7;\r\n --success-400: #47cd89;\r\n --success-500: #17b26a;\r\n --success-600: #079455;\r\n --success-700: #067647;\r\n --success-800: #085d3a;\r\n --success-900: #074d31;\r\n --success-950: #053321;\r\n\r\n /* ------------------------------------------opacity color palette-------------------------------------- */\r\n /* 0% opacity */\r\n /* White */\r\n --white-opacity0: rgba(255, 255, 255, 0);\r\n\r\n /* Gray */\r\n --gray25-opacity0: rgba(249, 250, 251, 0);\r\n --gray900-opacity0: rgba(18, 25, 38, 0);\r\n --gray950-opacity0: rgba(13, 18, 28, 0);\r\n\r\n /* 20% opacity */\r\n /* White */\r\n --white-opacity20: rgba(255, 255, 255, 0.2);\r\n\r\n /* Dark Blue */\r\n --darkBlue200-opacity20: rgba(181, 185, 204, 0.2);\r\n --darkBlue500-opacity20: rgba(33, 44, 101, 0.2);\r\n\r\n /* Gray */\r\n --gray25-opacity20: rgba(249, 250, 251, 0.2);\r\n --gray900-opacity20: rgba(18, 25, 38, 0.2);\r\n --gray950-opacity20: rgba(13, 18, 28, 0.2);\r\n\r\n /* 30% opacity */\r\n --darkBlue200-opacity30: rgba(181, 185, 204, 0.3);\r\n --darkBlue500-opacity30: rgba(33, 44, 101, 0.3);\r\n\r\n /* 40% opacity */\r\n --darkBlue200-opacity40: rgba(181, 185, 204, 0.4);\r\n --darkBlue500-opacity40: rgba(33, 44, 101, 0.4);\r\n\r\n /* 50% opacity */\r\n /* White */\r\n --white-opacity50: rgba(255, 255, 255, 0.5);\r\n\r\n /* Gray */\r\n --gray25-opacity50: rgba(249, 250, 251, 0.5);\r\n --gray900-opacity50: rgba(18, 25, 38, 0.5);\r\n --gray950-opacity50: rgba(13, 18, 28, 0.5);\r\n\r\n /* ------------------------------------------Secondary Color------------------------------------------- */\r\n /* blueLight color palete */\r\n --lightBlue-25: #f5fbff;\r\n --lightBlue-50: #f0f9ff;\r\n --lightBlue-100: #e0f2fe;\r\n --lightBlue-200: #b9e6fe;\r\n --lightBlue-300: #7cd4fd;\r\n --lightBlue-400: #7cd4fd;\r\n --lightBlue-500: #0ba5ec;\r\n --lightBlue-600: #0086c9;\r\n --lightBlue-700: #026aa2;\r\n --lightBlue-800: #065986;\r\n --lightBlue-900: #0b4a6f;\r\n --lightBlue-950: #062c41;\r\n\r\n /* blue color palette */\r\n --blue-25: #ecf5fe;\r\n --blue-50: #e4f0fc;\r\n --blue-100: #c8e0f9;\r\n --blue-200: #9ac7f4;\r\n --blue-300: #6aa9e7;\r\n --blue-400: #378fe6;\r\n --blue-500: #075db2;\r\n --blue-600: #064e94;\r\n --blue-700: #053e77;\r\n --blue-800: #042f59;\r\n --blue-900: #022445;\r\n --blue-950: #021d37;\r\n\r\n /* Purple color palete */\r\n --purple-25: #fafaff;\r\n --purple-50: #f4f3ff;\r\n --purple-100: #ebe9fe;\r\n --purple-200: #d9d6fe;\r\n --purple-300: #bdb4fe;\r\n --purple-400: #9b8afb;\r\n --purple-500: #7a5af8;\r\n --purple-600: #6938ef;\r\n --purple-700: #5925dc;\r\n --purple-800: #4a1fb8;\r\n --purple-900: #3e1c96;\r\n --purple-950: #27115f;\r\n\r\n /* pink color palette */\r\n --pink-25: #fef6fb;\r\n --pink-50: #fdf2fa;\r\n --pink-100: #fce7f6;\r\n --pink-200: #fcceee;\r\n --pink-300: #faa7e0;\r\n --pink-400: #f670c7;\r\n --pink-500: #ee46bc;\r\n --pink-600: #dd2590;\r\n --pink-700: #c11574;\r\n --pink-800: #9e165f;\r\n --pink-900: #851651;\r\n --pink-950: #4e0d30;\r\n\r\n /* -------------------------------------------------Token---------------------------------------------- */\r\n\r\n /* -----------Text Color----------- */\r\n\r\n [data-theme='light'] {\r\n --color-text-bold: var(--gray-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-bold: var(--gray-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text: var(--gray-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text: var(--gray-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text-subtle: var(--gray-500);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-subtle: var(--gray-400);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text-disabled: var(--gray-400);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-disabled: var(--gray-500);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text-inverse: var(--base-white);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-inverse: var(--base-black);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text-brandDarkBlue: var(--brandDarkBlue-500);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-brandDarkBlue: var(--brandDarkBlue-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text-brandRed: var(--brandRed-500);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-brandRed: var(--brandRed-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text-selected: var(--blue-500);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-selected: var(--blue-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text-danger-bold: var(--brandRed-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-danger-bold: var(--brandRed-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text-danger: var(--brandRed-700);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-danger: var(--brandRed-200);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text-danger-subtle: var(--brandRed-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-danger-subtle: var(--brandRed-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text-danger-inverse: var(--base-white);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-danger-inverse: var(--brandRed-950);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text-warning-bold: var(--warning-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-warning-bold: var(--warning-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text-warning: var(--warning-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-warning: var(--warning-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text-warning-subtle: var(--warning-500);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-warning-subtle: var(--warning-400);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text-success-bold: var(--success-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-success-bold: var(--success-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text-success: var(--success-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-success: var(--success-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text-success-subtle: var(--success-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-success-subtle: var(--success-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text-discovery-bold: var(--lightBlue-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-discovery-bold: var(--lightBlue-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text-discovery: var(--lightBlue-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-discovery: var(--lightBlue-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text-discovery-subtle: var(--lightBlue-400);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-discovery-subtle: var(--lightBlue-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text-information-bold: var(--blue-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-information-bold: var(--blue-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text-information: var(--blue-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-information: var(--blue-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text-information-subtle: var(--blue-500);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-information-subtle: var(--blue-400);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text-purple-bold: var(--purple-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-purple-bold: var(--purple-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text-purple: var(--purple-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-purple: var(--purple-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text-purple-subtle: var(--purple-500);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-purple-subtle: var(--purple-400);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text-pink-bold: var(--pink-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-pink-bold: var(--pink-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text-pink: var(--pink-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-pink: var(--pink-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-text-pink-subtle: var(--pink-500);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-text-pink-subtle: var(--pink-400);\r\n }\r\n\r\n /* --------------Link color--------------- */\r\n\r\n [data-theme='light'] {\r\n --color-link: var(--blue-500);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-link: var(--blue-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-link-pressed: var(--blue-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-link-pressed: var(--blue-600);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-link-visited: var(--lightBlue-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-link-visited: var(--lightBlue-300);\r\n }\r\n\r\n /* --------------Icon color--------------- */\r\n\r\n [data-theme='light'] {\r\n --color-icon-bold: var(--gray-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-icon-bold: var(--gray-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-icon: var(--gray-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-icon: var(--gray-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-icon-subtle: var(--gray-500);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-icon-subtle: var(--gray-400);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-icon-disabled: var(--gray-400);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-icon-disabled: var(--gray-500);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-icon-inverse: var(--base-white);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-icon-inverse: var(--gray-800);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-icon-brandDarkBlue: var(--brandDarkBlue-500);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-icon-brandDarkBlue: var(--brandDarkBlue-200);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-icon-brandRed: var(--brandRed-500);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-icon-brandRed: var(--brandRed-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-icon-selected: var(--blue-500);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-icon-selected: var(--blue-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-icon-danger-bold: var(--brandRed-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-icon-danger-bold: var(--brandRed-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-icon-danger: var(--brandRed-700);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-icon-danger: var(--brandRed-200);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-icon-danger-inverse: var(--base-white);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-icon-danger-inverse: var(--brandRed-950);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-icon-warning-bold: var(--warning-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-icon-warning-bold: var(--warning-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-icon-warning: var(--warning-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-icon-warning: var(--warning-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-icon-success-bold: var(--success-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-icon-success-bold: var(--success-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-icon-success: var(--success-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-icon-success: var(--success-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-icon-discovery-bold: var(--lightBlue-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-icon-discovery-bold: var(--lightBlue-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-icon-discovery: var(--lightBlue-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-icon-discovery: var(--lightBlue-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-icon-information-bold: var(--blue-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-icon-information-bold: var(--blue-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-icon-information: var(--blue-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-icon-information: var(--blue-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-icon-purple-bold: var(--purple-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-icon-purple-bold: var(--purple-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-icon-purple: var(--purple-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-icon-purple: var(--purple-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-icon-pink-bold: var(--pink-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-icon-pink-bold: var(--pink-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-icon-pink: var(--pink-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-icon-pink: var(--pink-300);\r\n }\r\n\r\n /* ----------------Border Color --------------- */\r\n\r\n [data-theme='light'] {\r\n --color-border-bold: var(--gray-500);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-bold: var(--gray-400);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border: var(--gray-400);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border: var(--gray-500);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-subtle: var(--gray-300);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-subtle: var(--gray-700);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-subtler: var(--gray-200);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-subtler: var(--gray-800);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-disabled: var(--gray-200);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-disabled: var(--gray-700);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-inverse: var(--base-white);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-inverse: var(--gray-800);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-input: var(--gray-300);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-input: var(--gray-600);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-focus: var(--gray-400);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-focus: var(--blue-200);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-selected: var(--blue-500);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-selected: var(--blue-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-brandDarkBlue: var(--brandDarkBlue-500);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-brandDarkBlue: var(--brandDarkBlue-200);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-brandRed: var(--brandRed-500);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-brandRed: var(--brandRed-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-danger-bold: var(--brandRed-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-danger-bold: var(--brandRed-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-danger: var(--brandRed-700);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-danger: var(--brandRed-200);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-danger-subtle: var(--brandRed-200);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-danger-subtle: var(--brandRed-800);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-danger-subtler: var(--brandRed-100);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-danger-subtler: var(--brandRed-900);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-warning-bold: var(--warning-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-warning-bold: var(--warning-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-warning: var(--warning-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-warning: var(--warning-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-warning-subtle: var(--warning-200);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-warning-subtle: var(--warning-800);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-warning-subtler: var(--warning-100);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-warning-subtler: var(--warning-900);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-success-bold: var(--success-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-success-bold: var(--success-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-success: var(--success-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-success: var(--success-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-success-subtle: var(--success-200);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-success-subtle: var(--success-800);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-success-subtler: var(--success-100);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-success-subtler: var(--success-900);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-discovery-bold: var(--lightBlue-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-discovery-bold: var(--lightBlue-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-discovery: var(--lightBlue-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-discovery: var(--lightBlue-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-discovery-subtle: var(--lightBlue-200);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-discovery-subtle: var(--lightBlue-800);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-discovery-subtler: var(--lightBlue-100);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-discovery-subtler: var(--lightBlue-900);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-information-bold: var(--blue-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-information-bold: var(--blue-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-information: var(--blue-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-information: var(--blue-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-information-subtle: var(--blue-200);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-information-subtle: var(--blue-800);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-information-subtler: var(--blue-100);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-information-subtler: var(--blue-900);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-purple-bold: var(--purple-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-purple-bold: var(--purple-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-purple: var(--purple-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-purple: var(--purple-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-purple-subtle: var(--purple-200);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-purple-subtle: var(--purple-800);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-purple-subtler: var(--purple-100);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-purple-subtler: var(--purple-900);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-pink-bold: var(--pink-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-pink-bold: var(--pink-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-pink: var(--pink-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-pink: var(--pink-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-pink-subtle: var(--pink-200);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-pink-subtle: var(--pink-800);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-border-pink-subtler: var(--pink-100);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-border-pink-subtler: var(--pink-900);\r\n }\r\n\r\n /* Emmanuel Kadiri starts from background color */\r\n\r\n /* ----------------Background Color --------------- */\r\n\r\n [data-theme='light'] {\r\n --color-background-card-bold: var(--gray-100);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-card-bold: var(--gray-800);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-card: var(--base-white);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-card: var(--gray-900);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-input: var(--gray-400);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-input: var(--gray-950);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-disabled: var(--gray-50);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-disabled: var(--gray-800);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-btn-disabled: var(--gray-100);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-btn-disabled: var(--gray-700);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-selected: var(--blue-500);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-selected: var(--blue-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-brandDarkblue: var(--brandDarkBlue-500);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-brandDarkblue: var(--brandDarkBlue-200);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-brandRed: var(--brandRed-500);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-brandRed: var(--brandRed-300);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-brandRed-hover: var(--brandRed-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-brandRed-hover: var(--brandRed-200);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-brandRed-pressed: var(--brandRed-700);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-brandRed-pressed: var(--brandRed-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-gray-bold: var(--gray-400);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-gray-bold: var(--gray-500);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-gray: var(--gray-300);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-gray: var(--gray-600);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-gray-subtle: var(--gray-200);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-gray-subtle: var(--gray-700);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-gray-subtler: var(--gray-100);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-gray-subtler: var(--gray-800);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-gray-subtlest: var(--gray-50);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-gray-subtlest: var(--gray-950);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-danger-bold: var(--brandRed-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-danger-bold: var(--brandRed-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-danger: var(--brandRed-700);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-danger: var(--brandRed-200);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-danger-subtle: var(--brandRed-200);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-danger-subtle: var(--brandRed-800);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-danger-subtler: var(--brandRed-100);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-danger-subtler: var(--brandRed-900);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-danger-subtlest: var(--brandRed-50);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-danger-subtlest: var(--brandRed-950);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-warning-bold: var(--warning-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-warning-bold: var(--warning-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-warning: var(--warning-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-warning: var(--warning-200);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-warning-subtle: var(--warning-200);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-warning-subtle: var(--warning-800);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-warning-subtler: var(--warning-100);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-warning-subtler: var(--warning-900);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-warning-subtlest: var(--warning-50);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-warning-subtlest: var(--warning-950);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-success-bold: var(--success-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-success-bold: var(--success-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-success: var(--success-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-success: var(--success-200);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-success-subtle: var(--success-200);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-success-subtle: var(--success-800);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-success-subtler: var(--success-100);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-success-subtler: var(--success-900);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-success-subtlest: var(--success-50);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-success-subtlest: var(--success-950);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-discovery-bold: var(--lightBlue-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-discovery-bold: var(--lightBlue-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-discovery: var(--lightBlue-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-discovery: var(--lightBlue-200);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-discovery-subtle: var(--lightBlue-200);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-discovery-subtle: var(--lightBlue-800);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-discovery-subtler: var(--lightBlue-100);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-discovery-subtler: var(--lightBlue-900);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-discovery-subtlest: var(--lightBlue-50);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-discovery-subtlest: var(--lightBlue-950);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-information-bold: var(--blue-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-information-bold: var(--blue-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-information: var(--blue-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-information: var(--blue-200);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-information-subtle: var(--blue-200);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-information-subtle: var(--blue-800);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-information-subtler: var(--blue-100);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-information-subtler: var(--blue-900);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-information-subtlest: var(--blue-50);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-information-subtlest: var(--blue-950);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-purple-bold: var(--purple-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-purple-bold: var(--blue-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-purple: var(--purple-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-purple: var(--blue-200);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-purple-subtle: var(--purple-200);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-purple-subtle: var(--purple-800);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-purple-subtler: var(--purple-100);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-purple-subtler: var(--purple-900);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-purple-subtlest: var(--purple-50);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-purple-subtlest: var(--purple-950);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-pink-bold: var(--pink-800);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-pink-bold: var(--pink-100);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-pink: var(--pink-600);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-pink: var(--pink-200);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-pink-subtle: var(--pink-200);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-pink-subtle: var(--pink-800);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-pink-subtler: var(--pink-100);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-pink-subtler: var(--pink-900);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-background-pink-subtlest: var(--purple-50);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-background-pink-subtlest: var(--pink-950);\r\n }\r\n\r\n /* ----------------Blanket Color --------------- */\r\n [data-theme='light'] {\r\n --color-blanket: var(--darkBlue500-opacity20);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-blanket: var(--darkBlue200-opacity20);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-blanket-subtle: var(--darkBlue500-opacity30);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-blanket-subtle: var(--darkBlue200-opacity30);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-blanket-subtler: var(--darkBlue500-opacity40);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-blanket-subtler: var(--darkBlue200-opacity40);\r\n }\r\n\r\n /* ----------------Skeleton Color --------------- */\r\n [data-theme='light'] {\r\n --color-skeleton: var(--gray-200);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-skeleton: var(--gray-800);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-skeleton-bold: var(--gray-300);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-skeleton-bold: var(--gray-700);\r\n }\r\n\r\n /* ----------------Surface Color --------------- */\r\n [data-theme='light'] {\r\n --color-surface-bold: var(--gray-50);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-surface-bold: var(--gray-950);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-surface: var(--base-white);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-surface: var(--gray-900);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-surface-hovered: var(--gray-100);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-surface-hovered: var(--gray-800);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-surface-pressed: var(--gray-200);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-surface-pressed: var(--gray-700);\r\n }\r\n\r\n /* ----------------Transparent Color --------------- */\r\n [data-theme='light'] {\r\n --color-surface-transparent50: var(--white-opacity50);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-surface-transparent50: var(--gray900-opacity50);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-surface-transparent20: var(--white-opacity20);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-surface-transparent20: var(--gray900-opacity20);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-surface-transparent-full: var(--white-opacity0);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-surface-transparent-full: var(--gray900-opacity0);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-surface-bold-transparent50: var(--gray25-opacity50);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-surface-bold-transparent50: var(--gray950-opacity50);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-surface-bold-transparent20: var(--gray25-opacity20);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-surface-bold-transparent20: var(--gray950-opacity20);\r\n }\r\n\r\n [data-theme='light'] {\r\n --color-surface-bold-transparent-full: var(--gray25-opacity0);\r\n }\r\n\r\n [data-theme='dark'] {\r\n --color-surface-bold-transparent-full: var(--gray950-opacity0);\r\n }\r\n}\r\n\r\n/* -----------------Shadow and Blur----------------- */\r\n:root {\r\n --shadow-xs: 0px 1px 2px 0px rgba(16, 24, 40, 0.05);\r\n --shadow-sm: 0px 1px 3px 0px rgba(16, 24, 40, 0.1), 0px 1px 2px 0px rgba(16, 24, 40, 0.06);\r\n --shadow-md: 0px 4px 8px -2px rgba(16, 24, 40, 0.1), 0px 2px 4px -2px rgba(16, 24, 40, 0.06);\r\n --shadow-lg: 0px 12px 16px -4px rgba(16, 24, 40, 0.08), 0px 4px 6px -2px rgba(16, 24, 40, 0.03);\r\n --shadow-xl: 0px 20px 24px -4px rgba(16, 24, 40, 0.08), 0px 8px 8px -4px rgba(16, 24, 40, 0.03);\r\n --shadow-2xl: 0px 24px 48px -12px rgba(16, 24, 40, 0.18);\r\n --shadow-3xl: 0px 32px 64px -12px rgba(16, 24, 40, 0.14);\r\n\r\n --blur-sm: blur(4px);\r\n --blur-md: blur(8px);\r\n --blur-lg: blur(12px);\r\n --blur-xl: blur(20px);\r\n}\r\n\r\n.shadow-xs {\r\n box-shadow: var(--shadow-xs);\r\n}\r\n\r\n.shadow-sm {\r\n box-shadow: var(--shadow-sm);\r\n}\r\n\r\n.shadow-md {\r\n box-shadow: var(--shadow-md);\r\n}\r\n\r\n.shadow-lg {\r\n box-shadow: var(--shadow-lg);\r\n}\r\n\r\n.shadow-xl {\r\n box-shadow: var(--shadow-xl);\r\n}\r\n\r\n.shadow-2xl {\r\n box-shadow: var(--shadow-2xl);\r\n}\r\n\r\n.shadow-3xl {\r\n box-shadow: var(--shadow-3xl);\r\n}\r\n\r\n.blur-sm {\r\n backdrop-filter: var(--blur-sm);\r\n}\r\n\r\n.blur-md {\r\n backdrop-filter: var(--blur-md);\r\n}\r\n\r\n.blur-lg {\r\n backdrop-filter: var(--blur-lg);\r\n}\r\n\r\n.blur-xl {\r\n backdrop-filter: var(--blur-xl);\r\n}\r\n\r\n/* -----------------Gradients----------------- */\r\n:root {\r\n /* Gray Gradients */\r\n /* --gray-gradient-600: linear-gradient(); */\r\n --gradient-gray-600-to-500-90d: linear-gradient(90deg, var(--gray-600), var(--gray-500));\r\n --gradient-gray-700-to-600-45d: linear-gradient(45deg, var(--gray-700), var(--gray-600));\r\n --gradient-gray-800-to-600-45d: linear-gradient(45deg, var(--gray-800), var(--gray-600));\r\n --gradient-gray-800-to-600-90d: linear-gradient(90deg, var(--gray-800), var(--gray-600));\r\n --gradient-gray-800-to-700265-d: linear-gradient(26.5deg, var(--gray-800), var(--gray-700));\r\n --gradient-gray-900-to-600-45d: linear-gradient(45deg, var(--gray-900), var(--gray-600));\r\n\r\n /* Brand Dark Blue Gradients */\r\n --gradient-darkBlue-500-to-400-90d: linear-gradient(90deg, var(--brandDarkBlue-500), var(--brandDarkBlue-400));\r\n --gradient-darkBlue-700-to-500-45d: linear-gradient(45deg, var(--brandDarkBlue-700), var(--brandDarkBlue-500));\r\n --gradient-darkBlue-700-to-400-45d: linear-gradient(45deg, var(--brandDarkBlue-700), var(--brandDarkBlue-400));\r\n --gradient-darkBlue-800-to-500-90d: linear-gradient(90deg, var(--brandDarkBlue-800), var(--brandDarkBlue-500));\r\n --gradient-darkBlue-800-to-600265-d: linear-gradient(26.5deg, var(--brandDarkBlue-800), var(--brandDarkBlue-600));\r\n --gradient-darkBlue-900-to-600-45d: linear-gradient(45deg, var(--brandDarkBlue-900), var(--brandDarkBlue-600));\r\n\r\n /* Brand Red Gradients */\r\n --gradient-red-500-to-400-90d: linear-gradient(90deg, var(--brandRed-600), var(--brandRed-400));\r\n --gradient-red-700-to-500-45d: linear-gradient(45deg, var(--brandRed-700), var(--brandRed-500));\r\n --gradient-red-700-to-400-45d: linear-gradient(45deg, var(--brandRed-700), var(--brandRed-400));\r\n --gradient-red-800-to-500-90d: linear-gradient(90deg, var(--brandRed-800), var(--brandRed-500));\r\n --gradient-red-800-to-600265-d: linear-gradient(26.5deg, var(--brandRed-800), var(--brandRed-600));\r\n --gradient-red-900-to-600-45d: linear-gradient(45deg, var(--brandRed-900), var(--brandRed-600));\r\n\r\n /* Blue Gradients */\r\n --gradient-blue-500-to-400-90d: linear-gradient(90deg, var(--blue-500), var(--blue-400));\r\n --gradient-blue-700-to-500-45d: linear-gradient(45deg, var(--blue-700), var(--blue-500));\r\n --gradient-blue-700-to-400-45d: linear-gradient(45deg, var(--blue-700), var(--blue-400));\r\n --gradient-blue-800-to-500-90d: linear-gradient(90deg, var(--blue-800), var(--blue-500));\r\n --gradient-blue-800-to-600265-d: linear-gradient(26.5deg, var(--blue-800), var(--blue-600));\r\n --gradient-blue-900-to-600-45d: linear-gradient(45deg, var(--blue-900), var(--blue-600));\r\n}\r\n\r\n.gradient-gray-600-to-500-90d {\r\n background: var(--gradient-gray-600-to-500-90d);\r\n}\r\n\r\n.gradient-gray-700-to-600-45d {\r\n background: var(--gradient-gray-700-to-600-45d);\r\n}\r\n\r\n.gradient-gray-800-to-600-45d {\r\n background: var(--gradient-gray-800-to-600-45d);\r\n}\r\n\r\n.gradient-gray-800-to-600-90d {\r\n background: var(--gradient-gray-800-to-600-90d);\r\n}\r\n\r\n.gradient-gray-800-to-700265-d {\r\n background: var(--gradient-gray-800-to-700265-d);\r\n}\r\n\r\n.gradient-gray-900-to-600-45d {\r\n background: var(--gradient-gray-900-to-600-45d);\r\n}\r\n\r\n.gradient-darkBlue-500-to-400-90d {\r\n background: var(--gradient-darkBlue-500-to-400-90d);\r\n}\r\n\r\n.gradient-darkBlue-700-to-500-45d {\r\n background: var(--gradient-darkBlue-700-to-500-45d);\r\n}\r\n\r\n.gradient-darkBlue-700-to-400-45d {\r\n background: var(--gradient-darkBlue-700-to-400-45d);\r\n}\r\n\r\n.gradient-darkBlue-800-to-500-90d {\r\n background: var(--gradient-darkBlue-800-to-500-90d);\r\n}\r\n\r\n.gradient-darkBlue-800-to-600265-d {\r\n background: var(--gradient-darkBlue-800-to-600265-d);\r\n}\r\n\r\n.gradient-darkBlue-900-to-600-45d {\r\n background: var(--gradient-darkBlue-900-to-600-45d);\r\n}\r\n\r\n.gradient-red-500-to-400-90d {\r\n background: var(--gradient-red-500-to-400-90d);\r\n}\r\n\r\n.gradient-red-700-to-500-45d {\r\n background: var(--gradient-red-700-to-500-45d);\r\n}\r\n\r\n.gradient-red-700-to-400-45d {\r\n background: var(--gradient-red-700-to-400-45d);\r\n}\r\n\r\n.gradient-red-800-to-500-90d {\r\n background: var(--gradient-red-800-to-500-90d);\r\n}\r\n\r\n.gradient-red-800-to-600265-d {\r\n background: var(--gradient-red-800-to-600265-d);\r\n}\r\n\r\n.gradient-red-900-to-600-45d {\r\n background: var(--gradient-red-900-to-600-45d);\r\n}\r\n\r\n.gradient-blue-500-to-400-90d {\r\n background: var(--gradient-blue-500-to-400-90d);\r\n}\r\n\r\n.gradient-blue-700-to-500-45d {\r\n background: var(--gradient-blue-700-to-500-45d);\r\n}\r\n\r\n.gradient-blue-700-to-400-45d {\r\n background: var(--gradient-blue-700-to-400-45d);\r\n}\r\n\r\n.gradient-blue-800-to-500-90d {\r\n background: var(--gradient-blue-800-to-500-90d);\r\n}\r\n\r\n.gradient-blue-800-to-600265-d {\r\n background: var(--gradient-blue-800-to-600265-d);\r\n}\r\n\r\n.gradient-blue-900-to-600-45d {\r\n background: var(--gradient-blue-900-to-600-45d);\r\n}\r\n\r\n/* Spacing Styles */\r\n:root {\r\n /* Positive spacing */\r\n --spacing-none: 0rem;\r\n --spacing-half: 0.125rem;\r\n --spacing-1: 0.25rem;\r\n --spacing-2: 0.5rem;\r\n --spacing-3: 0.75rem;\r\n --spacing-4: 1rem;\r\n --spacing-5: 1.25rem;\r\n --spacing-6: 1.5rem;\r\n --spacing-7: 2rem;\r\n --spacing-8: 2.5rem;\r\n --spacing-12: 3rem;\r\n --spacing-16: 4rem;\r\n --spacing-20: 5rem;\r\n --spacing-24: 6rem;\r\n --spacing-32: 8rem;\r\n --spacing-40: 10rem;\r\n --spacing-48: 12rem;\r\n --spacing-56: 14rem;\r\n --spacing-64: 16rem;\r\n\r\n /* Negative spacing */\r\n\r\n --spacing-negative-half: -0.125rem;\r\n --spacing-negative-1: -0.25rem;\r\n --spacing-negative-2: -0.5rem;\r\n --spacing-negative-3: -0.75rem;\r\n --spacing-negative-4: -1rem;\r\n --spacing-negative-5: -1.25rem;\r\n --spacing-negative-6: -1.5rem;\r\n --spacing-negative-7: -2rem;\r\n\r\n /* Radius */\r\n --rounded-none: 0rem;\r\n --rounded-xs: 0.25rem;\r\n --rounded-sm: 0.5rem;\r\n --rounded-md: 0.75rem;\r\n --rounded-lg: 1rem;\r\n --rounded-xl: 1.5rem;\r\n --rounded-2xl: 2rem;\r\n --rounded-full: 62.438rem;\r\n}\r\n\r\n/* Typography Styles */\r\n@import url('https://fonts.googleapis.com/css2?family=Sora&display=swap');\r\n\r\n:root {\r\n /* Font Sizes */\r\n --font-size-d-2xl: 4.5rem;\r\n --font-size-d-xl: 3.75rem;\r\n --font-size-d-lg: 3rem;\r\n --font-size-d-md: 2.25rem;\r\n --font-size-d-sm: 1.875rem;\r\n --font-size-d-xs: 1.5rem;\r\n --font-size-t-xl: 1.25rem;\r\n --font-size-t-lg: 1.125rem;\r\n --font-size-t-md: 1rem;\r\n --font-size-t-sm: 0.875rem;\r\n --font-size-t-xs: 0.75rem;\r\n --font-size-t-xxs: 0.625rem;\r\n\r\n /* Font Weights */\r\n --font-weight-bold: 700;\r\n --font-weight-semi-bold: 600;\r\n --font-weight-medium: 500;\r\n --font-weight-regular: 400;\r\n\r\n /* Line Heights */\r\n --font-line-height-d-2xl: 5rem;\r\n --font-line-height-d-xl: 4.25rem;\r\n --font-line-height-d-lg: 3.75rem;\r\n --font-line-height-d-md: 2.75rem;\r\n --font-line-height-d-sm: 2.375rem;\r\n --font-line-height-d-xs: 2rem;\r\n --font-line-height-t-xl: 2rem;\r\n --font-line-height-t-lg: 1.875rem;\r\n --font-line-height-t-md: 1.688rem;\r\n --font-line-height-t-sm: 1.5rem;\r\n --font-line-height-t-xs: 1.25rem;\r\n --font-line-height-t-xxs: 1.125rem;\r\n\r\n /* Letter Spacings */\r\n --font-letter-spacing-d-2xl: -0.09rem;\r\n --font-letter-spacing-d-xl: -0.075rem;\r\n --font-letter-spacing-d-lg: -0.075rem;\r\n --font-letter-spacing-d-md: -0.045rem;\r\n --font-letter-spacing-d-sm: 0;\r\n --font-letter-spacing-d-xs: 0;\r\n --font-letter-spacing-d-xxs: 0;\r\n\r\n /* Font Families */\r\n --font-family-title: 'Sora';\r\n --font-family-body: 'Sora';\r\n}\r\n\r\n/* Media queries for medium screens (tablet) */\r\n@media (max-width: 1199px) {\r\n :root {\r\n /* Font Sizes */\r\n --font-size-d-2xl: 3.75rem;\r\n --font-size-d-xl: 3.5rem;\r\n --font-size-d-lg: 2.75rem;\r\n --font-size-d-md: 2.25rem;\r\n --font-size-d-sm: 1.875rem;\r\n --font-size-d-xs: 1.5rem;\r\n\r\n /* Line Heights */\r\n --font-line-height-d-2xl: 4.25rem;\r\n --font-line-height-d-xl: 3.75rem;\r\n --font-line-height-d-lg: 2.4375rem;\r\n --font-line-height-d-md: 2.75rem;\r\n --font-line-height-d-sm: 2.375rem;\r\n --font-line-height-d-xs: 2rem;\r\n\r\n /* Letter Spacings */\r\n --font-letter-spacing-2xl: -0.075rem;\r\n --font-letter-spacing-xl: -0.065rem;\r\n --font-letter-spacing-lg: -0.045rem;\r\n --font-letter-spacing-md: -0.045rem;\r\n --font-letter-spacing-sm: 0rem;\r\n --font-letter-spacing-xs: 0rem;\r\n }\r\n}\r\n\r\n/* Media queries for smaller screens (mobile) */\r\n@media (max-width: 743px) {\r\n :root {\r\n /* Font Sizes */\r\n --font-size-d-2xl: 3rem;\r\n --font-size-d-xl: 2.5rem;\r\n --font-size-d-lg: 2rem;\r\n --font-size-d-md: 1.75rem;\r\n --font-size-d-sm: 1.5rem;\r\n --font-size-d-xs: 1.25rem;\r\n\r\n /* Line Heights */\r\n --font-line-height-d-2xl: 3.375rem;\r\n --font-line-height-d-xl: 2.875rem;\r\n --font-line-height-d-lg: 2.5rem;\r\n --font-line-height-d-md: 2.1375rem;\r\n --font-line-height-d-sm: 2rem;\r\n --font-line-height-d-xs: 1.75rem;\r\n\r\n /* Letter Spacings */\r\n --font-letter-spacing-2xl: -0.06rem;\r\n --font-letter-spacing-xl: -0.05rem;\r\n --font-letter-spacing-lg: -0.045rem;\r\n --font-letter-spacing-md: 0rem;\r\n --font-letter-spacing-sm: 0rem;\r\n --font-letter-spacing-xs: 0rem;\r\n }\r\n}\r\n\r\n.display-2xl-bold {\r\n font-family: var(--font-family-title);\r\n font-size: var(--font-size-d-2xl);\r\n font-weight: var(--font-weight-bold);\r\n line-height: var(--font-line-height-d-2xl);\r\n letter-spacing: var(--font-letter-spacing-d-2xl);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.display-2xl-bold::before,\r\n.display-2xl-bold::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.display-2xl-bold::before {\r\n margin-bottom: -0.135em;\r\n}\r\n\r\n.display-2xl-bold::after {\r\n margin-top: -0.205em;\r\n}\r\n\r\n.display-2xl-semi-bold {\r\n font-family: var(--font-family-title);\r\n font-size: var(--font-size-d-2xl);\r\n font-weight: var(--font-weight-semi-bold);\r\n line-height: var(--font-line-height-d-2xl);\r\n letter-spacing: var(--font-letter-spacing-d-2xl);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.display-2xl-semi-bold::before,\r\n.display-2xl-semi-bold::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.display-2xl-semi-bold::before {\r\n margin-bottom: -0.135em;\r\n}\r\n\r\n.display-2xl-semi-bold::after {\r\n margin-top: -0.205em;\r\n}\r\n\r\n.display-xl-bold {\r\n font-family: var(--font-family-title);\r\n font-size: var(--font-size-d-xl);\r\n font-weight: var(--font-weight-bold);\r\n line-height: var(--font-line-height-d-xl);\r\n letter-spacing: var(--font-letter-spacing-d-xl);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.display-xl-bold::before,\r\n.display-xl-bold::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.display-xl-bold::before {\r\n margin-bottom: -0.145em;\r\n}\r\n\r\n.display-xl-bold::after {\r\n margin-top: -0.215em;\r\n}\r\n\r\n.display-xl-semi-bold {\r\n font-family: var(--font-family-title);\r\n font-size: var(--font-size-d-xl);\r\n font-weight: var(--font-weight-semi-bold);\r\n line-height: var(--font-line-height-d-xl);\r\n letter-spacing: var(--font-letter-spacing-d-xl);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.display-xl-semi-bold::before,\r\n.display-xl-semi-bold::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.display-xl-semi-bold::before {\r\n margin-bottom: -0.145em;\r\n}\r\n\r\n.display-xl-semi-bold::after {\r\n margin-top: -0.215em;\r\n}\r\n\r\n.display-lg-bold {\r\n font-family: var(--font-family-title);\r\n font-size: var(--font-size-d-lg);\r\n font-weight: var(--font-weight-bold);\r\n line-height: var(--font-line-height-d-lg);\r\n letter-spacing: var(--font-letter-spacing-d-lg);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.display-lg-bold::before,\r\n.display-lg-bold::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.display-lg-bold::before {\r\n margin-bottom: -0.015em;\r\n}\r\n\r\n.display-lg-bold::after {\r\n margin-top: -0.095em;\r\n}\r\n\r\n.display-lg-semi-bold {\r\n font-family: var(--font-family-title);\r\n font-size: var(--font-size-d-lg);\r\n font-weight: var(--font-weight-semi-bold);\r\n line-height: var(--font-line-height-d-lg);\r\n letter-spacing: var(--font-letter-spacing-d-lg);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.display-lg-semi-bold::before,\r\n.display-lg-semi-bold::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.display-lg-semi-bold::before {\r\n margin-bottom: -0.015em;\r\n}\r\n\r\n.display-lg-semi-bold::after {\r\n margin-top: -0.095em;\r\n}\r\n\r\n.display-md-bold {\r\n font-family: var(--font-family-title);\r\n font-size: var(--font-size-d-md);\r\n font-weight: var(--font-weight-bold);\r\n line-height: var(--font-line-height-d-md);\r\n letter-spacing: var(--font-letter-spacing-d-md);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.display-md-bold::before,\r\n.display-md-bold::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.display-md-bold::before {\r\n margin-bottom: -0.195em;\r\n}\r\n\r\n.display-md-bold::after {\r\n margin-top: -0.255em;\r\n}\r\n\r\n.display-md-semi-bold {\r\n font-family: var(--font-family-title);\r\n font-size: var(--font-size-d-md);\r\n font-weight: var(--font-weight-semi-bold);\r\n line-height: var(--font-line-height-d-md);\r\n letter-spacing: var(--font-letter-spacing-d-md);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.display-md-semi-bold::before,\r\n.display-md-semi-bold::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.display-md-semi-bold::before {\r\n margin-bottom: -0.195em;\r\n}\r\n\r\n.display-md-semi-bold::after {\r\n margin-top: -0.255em;\r\n}\r\n\r\n.display-sm-bold {\r\n font-family: var(--font-family-title);\r\n font-size: var(--font-size-d-sm);\r\n font-weight: var(--font-weight-bold);\r\n line-height: var(--font-line-height-d-sm);\r\n letter-spacing: var(--font-letter-spacing-d-sm);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.display-sm-bold::before,\r\n.display-sm-bold::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.display-sm-bold::before {\r\n margin-bottom: -0.195em;\r\n}\r\n\r\n.display-sm-bold::after {\r\n margin-top: -0.255em;\r\n}\r\n\r\n.display-sm-semi-bold {\r\n font-family: var(--font-family-title);\r\n font-size: var(--font-size-d-sm);\r\n font-weight: var(--font-weight-semi-bold);\r\n line-height: var(--font-line-height-d-sm);\r\n letter-spacing: var(--font-letter-spacing-d-sm);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.display-sm-semi-bold::before,\r\n.display-sm-semi-bold::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.display-sm-semi-bold::before {\r\n margin-bottom: -0.195em;\r\n}\r\n\r\n.display-sm-semi-bold::after {\r\n margin-top: -0.255em;\r\n}\r\n\r\n.display-xs-bold {\r\n font-family: var(--font-family-title);\r\n font-size: var(--font-size-d-xs);\r\n font-weight: var(--font-weight-bold);\r\n line-height: var(--font-line-height-d-xs);\r\n letter-spacing: var(--font-letter-spacing-d-xs);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.display-xs-bold::before,\r\n.display-xs-bold::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.display-xs-bold::before {\r\n margin-bottom: -0.199em;\r\n}\r\n\r\n.display-xs-bold::after {\r\n margin-top: -0.195em; /* Continue from here */\r\n}\r\n\r\n.display-xs-semi-bold {\r\n font-family: var(--font-family-title);\r\n font-size: var(--font-size-d-xs);\r\n font-weight: var(--font-weight-semi-bold);\r\n line-height: var(--font-line-height-d-xs);\r\n letter-spacing: var(--font-letter-spacing-d-xs);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.display-xs-semi-bold::before,\r\n.display-xs-semi-bold::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.display-xs-semi-bold::before {\r\n margin-bottom: -0.259em;\r\n}\r\n\r\n.display-xs-semi-bold::after {\r\n margin-top: -0.295em;\r\n}\r\n\r\n.text-xl-bold {\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-xl);\r\n font-weight: var(--font-weight-bold);\r\n line-height: var(--font-line-height-t-xl);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-xl-bold::before,\r\n.text-xl-bold::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.text-xl-bold::before {\r\n margin-bottom: -0.329em;\r\n}\r\n\r\n.text-xl-bold::after {\r\n margin-top: -0.359em;\r\n}\r\n\r\n.text-xl-semi-bold {\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-xl);\r\n font-weight: var(--font-weight-semi-bold);\r\n line-height: var(--font-line-height-t-xl);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-xl-semi-bold::before,\r\n.text-xl-semi-bold::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.text-xl-semi-bold::before {\r\n margin-bottom: -0.329em;\r\n}\r\n\r\n.text-xl-semi-bold::after {\r\n margin-top: -0.359em;\r\n}\r\n\r\n.text-xl-medium {\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-xl);\r\n font-weight: var(--font-weight-medium);\r\n line-height: var(--font-line-height-t-xl);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-xl-medium::before,\r\n.text-xl-medium::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.text-xl-medium::before {\r\n margin-bottom: -0.339em;\r\n}\r\n\r\n.text-xl-medium::after {\r\n margin-top: -0.399em;\r\n}\r\n\r\n.text-xl-regular {\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-xl);\r\n font-weight: var(--font-weight-regular);\r\n line-height: var(--font-line-height-t-xl);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-xl-regular::before,\r\n.text-xl-regular::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.text-xl-regular::before {\r\n margin-bottom: -0.339em;\r\n}\r\n\r\n.text-xl-regular::after {\r\n margin-top: -0.399em;\r\n}\r\n\r\n.text-lg-bold {\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-lg);\r\n font-weight: var(--font-weight-bold);\r\n line-height: var(--font-line-height-t-lg);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-lg-bold::before,\r\n.text-lg-bold::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.text-lg-bold::before {\r\n margin-bottom: -0.339em;\r\n}\r\n\r\n.text-lg-bold::after {\r\n margin-top: -0.399em;\r\n}\r\n\r\n.text-lg-semi-bold {\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-lg);\r\n font-weight: var(--font-weight-semi-bold);\r\n line-height: var(--font-line-height-t-lg);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-lg-semi-bold::before,\r\n.text-lg-semi-bold::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.text-lg-semi-bold::before {\r\n margin-bottom: -0.339em;\r\n}\r\n\r\n.text-lg-semi-bold::after {\r\n margin-top: -0.399em;\r\n}\r\n\r\n.text-lg-medium {\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-lg);\r\n font-weight: var(--font-weight-medium);\r\n line-height: var(--font-line-height-t-lg);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-lg-medium::before,\r\n.text-lg-medium::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.text-lg-medium::before {\r\n margin-bottom: -0.349em;\r\n}\r\n\r\n.text-lg-medium::after {\r\n margin-top: -0.389em;\r\n}\r\n\r\n.text-lg-regular {\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-lg);\r\n font-weight: var(--font-weight-regular);\r\n line-height: var(--font-line-height-t-lg);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-lg-regular::before,\r\n.text-lg-regular::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.text-lg-regular::before {\r\n margin-bottom: -0.349em;\r\n}\r\n\r\n.text-lg-regular::after {\r\n margin-top: -0.389em;\r\n}\r\n\r\n.text-md-bold {\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-md);\r\n font-weight: var(--font-weight-bold);\r\n line-height: var(--font-line-height-t-md);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-md-bold::before,\r\n.text-md-bold::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.text-md-bold::before {\r\n margin-bottom: -0.349em;\r\n}\r\n\r\n.text-md-bold::after {\r\n margin-top: -0.389em;\r\n}\r\n\r\n.text-md-semi-bold {\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-md);\r\n font-weight: var(--font-weight-semi-bold);\r\n line-height: var(--font-line-height-t-md);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-md-semi-bold::before,\r\n.text-md-semi-bold::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.text-md-semi-bold::before {\r\n margin-bottom: -0.349em;\r\n}\r\n\r\n.text-md-semi-bold::after {\r\n margin-top: -0.389em;\r\n}\r\n\r\n.text-md-medium {\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-md);\r\n font-weight: var(--font-weight-medium);\r\n line-height: var(--font-line-height-t-md);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-md-medium::before,\r\n.text-md-medium::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.text-md-medium::before {\r\n margin-bottom: -0.349em;\r\n}\r\n\r\n.text-md-medium::after {\r\n margin-top: -0.389em;\r\n}\r\n\r\n.text-md-regular {\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-md);\r\n font-weight: var(--font-weight-regular);\r\n line-height: var(--font-line-height-t-md);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-md-regular::before,\r\n.text-md-regular::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.text-md-regular::before {\r\n margin-bottom: -0.349em;\r\n}\r\n\r\n.text-md-regular::after {\r\n margin-top: -0.389em;\r\n}\r\n\r\n.text-sm-bold {\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-sm);\r\n font-weight: var(--font-weight-bold);\r\n line-height: var(--font-line-height-t-sm);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-sm-bold::before,\r\n.text-sm-bold::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.text-sm-bold::before {\r\n margin-bottom: -0.299em;\r\n}\r\n\r\n.text-sm-bold::after {\r\n margin-top: -0.349em;\r\n}\r\n\r\n.text-sm-semi-bold {\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-sm);\r\n font-weight: var(--font-weight-semi-bold);\r\n line-height: var(--font-line-height-t-sm);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-sm-semi-bold::before,\r\n.text-sm-semi-bold::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.text-sm-semi-bold::before {\r\n margin-bottom: -0.299em;\r\n}\r\n\r\n.text-sm-semi-bold::after {\r\n margin-top: -0.349em;\r\n}\r\n\r\n.text-sm-medium {\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-sm);\r\n font-weight: var(--font-weight-medium);\r\n line-height: var(--font-line-height-t-sm);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n position: relative;\r\n display: inline-block;\r\n}\r\n\r\n.text-sm-medium::before,\r\n.text-sm-medium::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.text-sm-medium::before {\r\n margin-bottom: -0.299em;\r\n}\r\n\r\n.text-sm-medium::after {\r\n margin-top: -0.299em;\r\n}\r\n\r\n.text-sm-regular {\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-sm);\r\n font-weight: var(--font-weight-regular);\r\n line-height: var(--font-line-height-t-sm);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n position: relative;\r\n display: inline-block;\r\n}\r\n\r\n.text-sm-regular::before,\r\n.text-sm-regular::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.text-sm-regular::before {\r\n margin-bottom: -0.299em;\r\n}\r\n\r\n.text-sm-regular::after {\r\n margin-top: -0.299em;\r\n}\r\n\r\n.text-xs-bold {\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-xs);\r\n font-weight: var(--font-weight-bold);\r\n line-height: var(--font-line-height-t-xs);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-xs-bold::before,\r\n.text-xs-bold::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.text-xs-bold::before {\r\n margin-bottom: -0.291em;\r\n}\r\n\r\n.text-xs-bold::after {\r\n margin-top: -0.416em;\r\n}\r\n\r\n.text-xs-semi-bold {\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-xs);\r\n font-weight: var(--font-weight-semi-bold);\r\n line-height: var(--font-line-height-t-xs);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-xs-semi-bold::before,\r\n.text-xs-semi-bold::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.text-xs-semi-bold::before {\r\n margin-bottom: -0.321em;\r\n}\r\n\r\n.text-xs-semi-bold::after {\r\n margin-top: -0.416em;\r\n}\r\n\r\n.text-xs-medium {\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-xs);\r\n font-weight: var(--font-weight-medium);\r\n line-height: var(--font-line-height-t-xs);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-xs-medium::before,\r\n.text-xs-medium::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.text-xs-medium::before {\r\n margin-bottom: -0.285em;\r\n}\r\n\r\n.text-xs-medium::after {\r\n margin-top: -0.396em;\r\n}\r\n\r\n.text-xs-regular {\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-xs);\r\n font-weight: var(--font-weight-regular);\r\n line-height: var(--font-line-height-t-xs);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-xs-regular::before,\r\n.text-xs-regular::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.text-xs-regular::before {\r\n margin-bottom: -0.291em;\r\n}\r\n\r\n.text-xs-regular::after {\r\n margin-top: -0.396em;\r\n}\r\n\r\n.text-xxs-bold {\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-xxs);\r\n font-weight: var(--font-weight-bold);\r\n line-height: var(--font-line-height-t-xxs);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-xxs-bold::before,\r\n.text-xxs-bold::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.text-xxs-bold::before {\r\n margin-bottom: -0.291em;\r\n}\r\n\r\n.text-xxs-bold::after {\r\n margin-top: -0.416em;\r\n}\r\n\r\n.text-xxs-semi-bold {\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-xxs);\r\n font-weight: var(--font-weight-semi-bold);\r\n line-height: var(--font-line-height-t-xxs);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-xxs-semi-bold::before,\r\n.text-xxs-semi-bold::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.text-xxs-semi-bold::before {\r\n margin-bottom: -0.291em;\r\n}\r\n\r\n.text-xxs-semi-bold::after {\r\n margin-top: -0.416em;\r\n}\r\n\r\n.text-xxs-medium {\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-xxs);\r\n font-weight: var(--font-weight-medium);\r\n line-height: var(--font-line-height-t-xxs);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-xxs-medium::before,\r\n.text-xxs-medium::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.text-xxs-medium::before {\r\n margin-bottom: -0.291em;\r\n}\r\n\r\n.text-xxs-medium::after {\r\n margin-top: -0.416em;\r\n}\r\n\r\n.text-xxs-regular {\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-xxs);\r\n font-weight: var(--font-weight-regular);\r\n line-height: var(--font-line-height-t-xxs);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-xxs-regular::before,\r\n.text-xxs-regular::after {\r\n content: '';\r\n display: table;\r\n}\r\n\r\n.text-xxs-regular::before {\r\n margin-bottom: -0.291em;\r\n}\r\n\r\n.text-xxs-regular::after {\r\n margin-top: -0.416em;\r\n}\r\n\r\n\r\n.overall_container{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-2);\r\n}\r\n\r\n/* .file_upload_item_base_div{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-2);\r\n} */\r\n\r\n.file_upload_item_base_container {\r\n display: flex;\r\n border-radius: var(--rounded-sm);\r\n background-color: var(--color-background-card, #ffffff);\r\n border: 1px solid var(--color-border-subtler, #e3e8ef);\r\n position: relative;\r\n cursor: pointer;\r\n}\r\n\r\n.file_upload_item_base_container.default:hover{\r\n border-color: var(--color-border-selected, #075DB2);\r\n}\r\n\r\n.file_upload_item_base_container.disabled{\r\n background-color: var(--color-background-disabled, #F6F8FA);\r\n border-color: var(--color-border-disabled, #E3E8EF);\r\n}\r\n\r\n.file_upload_item_base_container.md{\r\n flex-direction: row;\r\n padding: var(--spacing-4);\r\n}\r\n\r\n.file_upload_item_base_container.lg{\r\n flex-direction: column;\r\n padding: var(--spacing-6);\r\n}\r\n\r\n.close_button {\r\n position: absolute;\r\n top: var(--spacing-4);\r\n right: var(--spacing-4);\r\n}\r\n\r\n.label_text{\r\n color: var(--color-text, #4B5565);\r\n}\r\n\r\n.file_type_text{\r\n color: var(--color-text-subtle, #697586);\r\n}\r\n\r\n.progress_bar{\r\n margin-top: 0.5rem;\r\n}\r\n\r\n.file_type_text.in_progress,\r\n.file_type_text.complete{\r\n color: var(--color-text, #4B5565);\r\n}\r\n\r\n.file_type_text.error,\r\n.file_size_text.error{\r\n color: var(--color-background-danger, #B51726);\r\n}\r\n\r\n.file_size_text.in_progress,\r\n.file_size_text.complete{\r\n color: var(--color-text-subtle, #697586);\r\n}\r\n\r\n.in_progress_div.md,\r\n.error.md,\r\n.complete.md{\r\n display: flex;\r\n align-items: center;\r\n gap: var(--spacing-1);\r\n}\r\n\r\n.in_progress_div.lg,\r\n.error.lg,\r\n.complete.lg{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-3);\r\n}\r\n\r\n/* Default Styles */\r\n.file_upload_icon{\r\n background-color: var(--color-background-gray-subtler, #EEF2F6);\r\n border-radius: var(--rounded-full);\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n padding: var(--spacing-3);\r\n}\r\n\r\n.file_upload_icon svg{\r\n width: var(--spacing-6);\r\n height: var(--spacing-6);\r\n}\r\n\r\n.default.md{\r\n display: flex;\r\n gap: var(--spacing-3);\r\n align-items: center;\r\n}\r\n\r\n.default.lg{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-3);\r\n align-items: center;\r\n justify-content: center;\r\n}\r\n\r\n.default_content{\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: center;\r\n gap: var(--spacing-2);\r\n}\r\n\r\n.default_content.lg{\r\n align-items: center;\r\n}\r\n\r\n.upload_text{\r\n color: var(--color-text);\r\n}\r\n\r\n/* In Progress Styles */\r\n.in_progress_div.md{\r\n width: 100%;\r\n}\r\n\r\n.in_progress_div.lg{\r\n text-align: center;\r\n}\r\n\r\n.in_progress_content{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-2);\r\n width: 100%;\r\n}\r\n\r\n.upload_btn_md{\r\n position: absolute;\r\n top: 45%;\r\n right: 1.5rem;\r\n}\r\n\r\n.upload_btn_lg{\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\n/* Complete Styles */\r\n.complete{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-3);\r\n}\r\n\r\n.complete.md{\r\n flex-direction: row;\r\n gap: var(--spacing-1);\r\n}\r\n\r\n.complete.lg{\r\n align-items: center;\r\n text-align: center;\r\n}\r\n\r\n.complete_content{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-2);\r\n}\r\n\r\n.complete_content.md{\r\n justify-content: center;\r\n}\r\n\r\n.complete_content.lg{\r\n align-items: center;\r\n}\r\n\r\n.delete_button{\r\n position: absolute;\r\n top: 30%;\r\n right: 1rem;\r\n}\r\n\r\n.delete_btn{\r\n position: absolute;\r\n top: 35%;\r\n right: 1.5rem;\r\n}\r\n\r\n/* Error Styles */\r\n.error{\r\n background-color: var(--color-background-danger-subtlest, #FEF1F2);\r\n border-color: var(--color-border-danger-subtle, #F9B4BA);\r\n}\r\n\r\n.error.lg{\r\n text-align: center;\r\n}\r\n\r\n.error_content{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-3);\r\n}\r\n\r\n.error_content_text{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-2);\r\n}\r\n\r\n.btns{\r\n display: flex;\r\n justify-content: center;\r\n gap: var(--spacing-6);\r\n}\r\n\r\n.btn{\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\n.try_again_btn{\r\n display: flex;\r\n width: 100%;\r\n}\r\n\r\n/* Text Styles*/\r\n.text-sm-semi-bold{\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-sm);\r\n font-weight: var(--font-weight-semi-bold);\r\n line-height: var(--font-line-height-t-sm);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-sm-semi-bold::before,\r\n.text-sm-semi-bold::after{\r\n content: \"\";\r\n display: table;\r\n}\r\n\r\n.text-sm-semi-bold::before{\r\n margin-bottom: -0.299em;\r\n}\r\n\r\n.text-sm-semi-bold::after{\r\n margin-top: -0.349em;\r\n}\r\n\r\n.text-sm-medium{\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-sm);\r\n font-weight: var(--font-weight-medium);\r\n line-height: var(--font-line-height-t-sm);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n position: relative;\r\n display: inline-block;\r\n}\r\n\r\n.text-sm-medium::before,\r\n.text-sm-medium::after{\r\n content: \"\";\r\n display: table;\r\n}\r\n\r\n.text-sm-medium::before{\r\n margin-bottom: -0.299em;\r\n}\r\n\r\n.text-sm-medium::after{\r\n margin-top: -0.299em;\r\n}\r\n\r\n.text-sm-regular{\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-sm);\r\n font-weight: var(--font-weight-regular);\r\n line-height: var(--font-line-height-t-sm);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n position: relative;\r\n display: inline-block;\r\n}\r\n\r\n.text-sm-regular::before,\r\n.text-sm-regular::after{\r\n content: \"\";\r\n display: table;\r\n}\r\n\r\n.text-sm-regular::before{\r\n margin-bottom: -0.299em;\r\n}\r\n\r\n.text-sm-regular::after{\r\n margin-top: -0.299em;\r\n}\r\n\r\n.text-xs-regular{\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-xs);\r\n font-weight: var(--font-weight-regular);\r\n line-height: var(--font-line-height-t-xs);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-xs-regular::before,\r\n.text-xs-regular::after{\r\n content: \"\";\r\n display: table;\r\n}\r\n\r\n.text-xs-regular::before{\r\n margin-bottom: -0.291em;\r\n}\r\n\r\n.text-xs-regular::after{\r\n margin-top: -0.396em;\r\n}\r\n\r\np.lg{\r\n display: flex;\r\n gap: var(--spacing-1);\r\n}";
|
|
10
10
|
|
|
@@ -127,6 +127,6 @@ function defineCustomElement() {
|
|
|
127
127
|
defineCustomElement();
|
|
128
128
|
|
|
129
129
|
export { GbFileUploadItemBase as G, defineCustomElement as d };
|
|
130
|
-
//# sourceMappingURL=p-
|
|
130
|
+
//# sourceMappingURL=p-DksiC7vr.js.map
|
|
131
131
|
|
|
132
|
-
//# sourceMappingURL=p-
|
|
132
|
+
//# sourceMappingURL=p-DksiC7vr.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"p-z18wHkwb.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/gb-file-upload-item-base/gb-file-upload-item-base.css?tag=gb-file-upload-item-base&encapsulation=shadow","src/components/gb-file-upload-item-base/gb-file-upload-item-base.tsx"],"sourcesContent":["@import './../../global/global.css';\r\n\r\n.overall_container{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-2);\r\n}\r\n\r\n/* .file_upload_item_base_div{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-2);\r\n} */\r\n\r\n.file_upload_item_base_container {\r\n display: flex;\r\n border-radius: var(--rounded-sm);\r\n background-color: var(--color-background-card, #ffffff);\r\n border: 1px solid var(--color-border-subtler, #e3e8ef);\r\n position: relative;\r\n cursor: pointer;\r\n}\r\n\r\n.file_upload_item_base_container.default:hover{\r\n border-color: var(--color-border-selected, #075DB2);\r\n}\r\n\r\n.file_upload_item_base_container.disabled{\r\n background-color: var(--color-background-disabled, #F6F8FA);\r\n border-color: var(--color-border-disabled, #E3E8EF);\r\n}\r\n\r\n.file_upload_item_base_container.md{\r\n flex-direction: row;\r\n padding: var(--spacing-4);\r\n}\r\n\r\n.file_upload_item_base_container.lg{\r\n flex-direction: column;\r\n padding: var(--spacing-6);\r\n}\r\n\r\n.close_button {\r\n position: absolute;\r\n top: var(--spacing-4);\r\n right: var(--spacing-4);\r\n}\r\n\r\n.label_text{\r\n color: var(--color-text, #4B5565);\r\n}\r\n\r\n.file_type_text{\r\n color: var(--color-text-subtle, #697586);\r\n}\r\n\r\n.progress_bar{\r\n margin-top: 0.5rem;\r\n}\r\n\r\n.file_type_text.in_progress,\r\n.file_type_text.complete{\r\n color: var(--color-text, #4B5565);\r\n}\r\n\r\n.file_type_text.error,\r\n.file_size_text.error{\r\n color: var(--color-background-danger, #B51726);\r\n}\r\n\r\n.file_size_text.in_progress,\r\n.file_size_text.complete{\r\n color: var(--color-text-subtle, #697586);\r\n}\r\n\r\n.in_progress_div.md,\r\n.error.md,\r\n.complete.md{\r\n display: flex;\r\n align-items: center;\r\n gap: var(--spacing-1);\r\n}\r\n\r\n.in_progress_div.lg,\r\n.error.lg,\r\n.complete.lg{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-3);\r\n}\r\n\r\n/* Default Styles */\r\n.file_upload_icon{\r\n background-color: var(--color-background-gray-subtler, #EEF2F6);\r\n border-radius: var(--rounded-full);\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n padding: var(--spacing-3);\r\n}\r\n\r\n.file_upload_icon svg{\r\n width: var(--spacing-6);\r\n height: var(--spacing-6);\r\n}\r\n\r\n.default.md{\r\n display: flex;\r\n gap: var(--spacing-3);\r\n align-items: center;\r\n}\r\n\r\n.default.lg{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-3);\r\n align-items: center;\r\n justify-content: center;\r\n}\r\n\r\n.default_content{\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: center;\r\n gap: var(--spacing-2);\r\n}\r\n\r\n.default_content.lg{\r\n align-items: center;\r\n}\r\n\r\n.upload_text{\r\n color: var(--color-text);\r\n}\r\n\r\n/* In Progress Styles */\r\n.in_progress_div.md{\r\n width: 100%;\r\n}\r\n\r\n.in_progress_div.lg{\r\n text-align: center;\r\n}\r\n\r\n.in_progress_content{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-2);\r\n width: 100%;\r\n}\r\n\r\n.upload_btn_md{\r\n position: absolute;\r\n top: 45%;\r\n right: 1.5rem;\r\n}\r\n\r\n.upload_btn_lg{\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\n/* Complete Styles */\r\n.complete{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-3);\r\n}\r\n\r\n.complete.md{\r\n flex-direction: row;\r\n gap: var(--spacing-1);\r\n}\r\n\r\n.complete.lg{\r\n align-items: center;\r\n text-align: center;\r\n}\r\n\r\n.complete_content{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-2);\r\n}\r\n\r\n.complete_content.md{\r\n justify-content: center;\r\n}\r\n\r\n.complete_content.lg{\r\n align-items: center;\r\n}\r\n\r\n.delete_button{\r\n position: absolute;\r\n top: 30%;\r\n right: 1rem;\r\n}\r\n\r\n.delete_btn{\r\n position: absolute;\r\n top: 35%;\r\n right: 1.5rem;\r\n}\r\n\r\n/* Error Styles */\r\n.error{\r\n background-color: var(--color-background-danger-subtlest, #FEF1F2);\r\n border-color: var(--color-border-danger-subtle, #F9B4BA);\r\n}\r\n\r\n.error.lg{\r\n text-align: center;\r\n}\r\n\r\n.error_content{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-3);\r\n}\r\n\r\n.error_content_text{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-2);\r\n}\r\n\r\n.btns{\r\n display: flex;\r\n justify-content: center;\r\n gap: var(--spacing-6);\r\n}\r\n\r\n.btn{\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\n.try_again_btn{\r\n display: flex;\r\n width: 100%;\r\n}\r\n\r\n/* Text Styles*/\r\n.text-sm-semi-bold{\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-sm);\r\n font-weight: var(--font-weight-semi-bold);\r\n line-height: var(--font-line-height-t-sm);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-sm-semi-bold::before,\r\n.text-sm-semi-bold::after{\r\n content: \"\";\r\n display: table;\r\n}\r\n\r\n.text-sm-semi-bold::before{\r\n margin-bottom: -0.299em;\r\n}\r\n\r\n.text-sm-semi-bold::after{\r\n margin-top: -0.349em;\r\n}\r\n\r\n.text-sm-medium{\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-sm);\r\n font-weight: var(--font-weight-medium);\r\n line-height: var(--font-line-height-t-sm);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n position: relative;\r\n display: inline-block;\r\n}\r\n\r\n.text-sm-medium::before,\r\n.text-sm-medium::after{\r\n content: \"\";\r\n display: table;\r\n}\r\n\r\n.text-sm-medium::before{\r\n margin-bottom: -0.299em;\r\n}\r\n\r\n.text-sm-medium::after{\r\n margin-top: -0.299em;\r\n}\r\n\r\n.text-sm-regular{\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-sm);\r\n font-weight: var(--font-weight-regular);\r\n line-height: var(--font-line-height-t-sm);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n position: relative;\r\n display: inline-block;\r\n}\r\n\r\n.text-sm-regular::before,\r\n.text-sm-regular::after{\r\n content: \"\";\r\n display: table;\r\n}\r\n\r\n.text-sm-regular::before{\r\n margin-bottom: -0.299em;\r\n}\r\n\r\n.text-sm-regular::after{\r\n margin-top: -0.299em;\r\n}\r\n\r\n.text-xs-regular{\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-xs);\r\n font-weight: var(--font-weight-regular);\r\n line-height: var(--font-line-height-t-xs);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-xs-regular::before,\r\n.text-xs-regular::after{\r\n content: \"\";\r\n display: table;\r\n}\r\n\r\n.text-xs-regular::before{\r\n margin-bottom: -0.291em;\r\n}\r\n\r\n.text-xs-regular::after{\r\n margin-top: -0.396em;\r\n}\r\n\r\np.lg{\r\n display: flex;\r\n gap: var(--spacing-1);\r\n}","import { Component, h, Prop, Fragment, Event, EventEmitter, State, Watch } from '@stencil/core';\r\nimport { FileIconTypes, FileUploadIconType, FileUploadStates, GeneralSizes, StateEnum } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-file-upload-item-base',\r\n styleUrl: 'gb-file-upload-item-base.css',\r\n shadow: true,\r\n})\r\nexport class GbFileUploadItemBase {\r\n @Prop() icon: FileUploadIconType;\r\n @Prop() label: string = '';\r\n @Prop() showLabel: boolean = false;\r\n @Prop() state: FileUploadStates;\r\n @Prop() heightSize: GeneralSizes = 'md';\r\n @Prop() fileType: FileIconTypes;\r\n @Prop() progress: number = 0;\r\n @Prop() fileSize: number;\r\n @Prop() fileName: string;\r\n @Prop() allowedType: string;\r\n @State() internalState: FileUploadStates;\r\n @State() internalProgress: number = 0;\r\n @Event() uploadButtonClicked: EventEmitter<void>;\r\n @Event() cancelUpload: EventEmitter<void>;\r\n @Event() tryAgainClicked: EventEmitter<void>;\r\n @Event() deleteFileUpload: EventEmitter<void>;\r\n\r\n @Watch('state')\r\n onStateChange(newValue: FileUploadStates, _oldValue: FileUploadStates) {\r\n // console.log('state changed from', oldValue, 'to', newValue);\r\n this.internalState = newValue;\r\n }\r\n\r\n @Watch('progress')\r\n onProgressChange(newValue: number, _oldValue: number) {\r\n // console.log('progress changed from', oldValue, 'to', newValue);\r\n this.internalProgress = newValue;\r\n }\r\n\r\n componentWillLoad() {\r\n this.internalState = this.state;\r\n this.internalProgress = this.progress;\r\n }\r\n\r\n onUploadButtonClicked() {\r\n this.uploadButtonClicked.emit();\r\n }\r\n\r\n onCancelButtonClicked() {\r\n this.cancelUpload.emit();\r\n }\r\n\r\n onTryAgainClicked() {\r\n this.tryAgainClicked.emit();\r\n }\r\n\r\n onDeleteFileUploadClicked() {\r\n this.deleteFileUpload.emit();\r\n }\r\n\r\n getReadableFileSize(): string {\r\n if (this.fileSize === 0) return '0 Bytes';\r\n const k = 1024;\r\n const sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB'];\r\n const i = Math.floor(Math.log(this.fileSize) / Math.log(k));\r\n const size = parseFloat((this.fileSize / Math.pow(k, i)).toFixed(2));\r\n return `${size} ${sizes[i]}`;\r\n }\r\n\r\n render() {\r\n return (\r\n <div class=\"overall_container\">\r\n {this.showLabel && <p class=\"label_text text-sm-semi-bold\">{this.label}</p>}\r\n <div class={`file_upload_item_base_container ${this.state} ${this.heightSize}`}>\r\n {this.state === 'default' && (\r\n <>\r\n {this.heightSize === 'md' && [\r\n <div class={`default ${this.heightSize}`}>\r\n <div class=\"file_upload_icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <path\r\n d=\"M17.5 9.01101V8.261L17.4981 8.26101L17.5 9.01101ZM9.54945 9.61023C9.8804 9.85933 10.3506 9.79298 10.5997 9.46204C10.8488 9.1311 10.7825 8.66088 10.4515 8.41178L9.54945 9.61023ZM15.6641 11.5394C15.4006 11.8591 15.4462 12.3317 15.7658 12.5952C16.0854 12.8587 16.5581 12.8132 16.8216 12.4936L15.6641 11.5394ZM17.9174 17.2546C17.5057 17.3002 17.209 17.6709 17.2546 18.0826C17.3002 18.4943 17.6709 18.791 18.0826 18.7454L17.9174 17.2546ZM5.85054 18.6623C6.25644 18.7448 6.65241 18.4827 6.73496 18.0768C6.8175 17.6709 6.55537 17.2749 6.14946 17.1924L5.85054 18.6623ZM12 13V12.25V13ZM11.25 21C11.25 21.4142 11.5858 21.75 12 21.75C12.4142 21.75 12.75 21.4142 12.75 21H11.25ZM8.96219 14.9773C8.67349 15.2743 8.68023 15.7491 8.97726 16.0378C9.27428 16.3265 9.74911 16.3198 10.0378 16.0227L8.96219 14.9773ZM13.9622 16.0227C14.2509 16.3198 14.7257 16.3265 15.0227 16.0378C15.3198 15.7491 15.3265 15.2743 15.0378 14.9773L13.9622 16.0227ZM12 3.75C14.6221 3.75 16.75 5.87987 16.75 8.51009H18.25C18.25 5.05403 15.4531 2.25 12 2.25V3.75ZM17.5 9.76101C19.5698 9.76101 21.25 11.4423 21.25 13.5193H22.75C22.75 10.6165 20.4008 8.26101 17.5 8.26101V9.76101ZM17.4794 9.76106L17.5019 9.761L17.4981 8.26101L17.4757 8.26106L17.4794 9.76106ZM16.75 8.51009C16.75 8.6565 16.7434 8.80117 16.7306 8.94386L18.2246 9.07826C18.2414 8.89095 18.25 8.70143 18.25 8.51009H16.75ZM2.75 13.0183C2.75 10.8031 4.43748 8.98389 6.5916 8.77853L6.44924 7.2853C3.53048 7.56356 1.25 10.0247 1.25 13.0183H2.75ZM6.5916 8.77853C6.72581 8.76574 6.86203 8.75917 7 8.75917V7.25917C6.81443 7.25917 6.6307 7.268 6.44924 7.2853L6.5916 8.77853ZM7.26768 8.09603C7.47668 5.66023 9.51709 3.75 12 3.75V2.25C8.72939 2.25 6.04797 4.76511 5.77317 7.9678L7.26768 8.09603ZM7 8.75917C7.95746 8.75917 8.83914 9.07557 9.54945 9.61023L10.4515 8.41178C9.49035 7.68831 8.29419 7.25917 7 7.25917V8.75917ZM16.7306 8.94386C16.6423 9.92517 16.2569 10.8203 15.6641 11.5394L16.8216 12.4936C17.6003 11.5489 18.1084 10.37 18.2246 9.07826L16.7306 8.94386ZM21.25 13.5193C21.25 15.4544 19.7906 17.0471 17.9174 17.2546L18.0826 18.7454C20.7093 18.4545 22.75 16.2252 22.75 13.5193H21.25ZM6.14946 17.1924C4.21067 16.7981 2.75 15.079 2.75 13.0183H1.25C1.25 15.8044 3.22485 18.1283 5.85054 18.6623L6.14946 17.1924ZM11.25 13V21H12.75V13H11.25ZM12 12.25C11.7417 12.25 11.5193 12.339 11.3578 12.4254C11.1904 12.515 11.0348 12.631 10.8968 12.7485C10.6213 12.9832 10.3457 13.285 10.0995 13.5755C9.85056 13.8693 9.60952 14.1784 9.40971 14.4328C9.19651 14.7042 9.05089 14.886 8.96219 14.9773L10.0378 16.0227C10.1949 15.8612 10.3971 15.604 10.5893 15.3593C10.7949 15.0975 11.0169 14.8132 11.2439 14.5452C11.4738 14.274 11.6873 14.0456 11.8694 13.8905C11.9601 13.8132 12.0255 13.7694 12.0656 13.7479C12.1116 13.7233 12.0832 13.75 12 13.75V12.25ZM15.0378 14.9773C14.9491 14.886 14.8035 14.7042 14.5903 14.4328C14.3905 14.1784 14.1494 13.8693 13.9005 13.5755C13.6543 13.285 13.3787 12.9832 13.1032 12.7485C12.9652 12.631 12.8096 12.515 12.6422 12.4254C12.4807 12.339 12.2583 12.25 12 12.25V13.75C11.9168 13.75 11.8884 13.7233 11.9344 13.7479C11.9745 13.7694 12.0399 13.8132 12.1306 13.8905C12.3127 14.0456 12.5262 14.274 12.7561 14.5452C12.9831 14.8132 13.2051 15.0975 13.4107 15.3593C13.6029 15.604 13.8051 15.8612 13.9622 16.0227L15.0378 14.9773Z\"\r\n fill=\"var(--color-icon, #4B5565)\"\r\n />\r\n </svg>\r\n </div>\r\n <div class=\"default_content\">\r\n <p class=\"upload_text text-sm-semi-bold\">Tap to upload</p>\r\n <p class=\"file_type_text text-xs-regular\">{this.allowedType}</p>\r\n </div>\r\n </div>,\r\n <gb-button size=\"sm\" hierarchy=\"link_color\" icon=\"default\" class=\"upload_btn_md\" icon-leading={true} onClick={() => this.onUploadButtonClicked()}>\r\n <p>Upload</p>\r\n </gb-button>,\r\n ]}\r\n {this.heightSize === 'lg' && [\r\n <div class={`default ${this.heightSize}`}>\r\n <div class=\"file_upload_icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <path\r\n d=\"M17.5 9.01101V8.261L17.4981 8.26101L17.5 9.01101ZM9.54945 9.61023C9.8804 9.85933 10.3506 9.79298 10.5997 9.46204C10.8488 9.1311 10.7825 8.66088 10.4515 8.41178L9.54945 9.61023ZM15.6641 11.5394C15.4006 11.8591 15.4462 12.3317 15.7658 12.5952C16.0854 12.8587 16.5581 12.8132 16.8216 12.4936L15.6641 11.5394ZM17.9174 17.2546C17.5057 17.3002 17.209 17.6709 17.2546 18.0826C17.3002 18.4943 17.6709 18.791 18.0826 18.7454L17.9174 17.2546ZM5.85054 18.6623C6.25644 18.7448 6.65241 18.4827 6.73496 18.0768C6.8175 17.6709 6.55537 17.2749 6.14946 17.1924L5.85054 18.6623ZM12 13V12.25V13ZM11.25 21C11.25 21.4142 11.5858 21.75 12 21.75C12.4142 21.75 12.75 21.4142 12.75 21H11.25ZM8.96219 14.9773C8.67349 15.2743 8.68023 15.7491 8.97726 16.0378C9.27428 16.3265 9.74911 16.3198 10.0378 16.0227L8.96219 14.9773ZM13.9622 16.0227C14.2509 16.3198 14.7257 16.3265 15.0227 16.0378C15.3198 15.7491 15.3265 15.2743 15.0378 14.9773L13.9622 16.0227ZM12 3.75C14.6221 3.75 16.75 5.87987 16.75 8.51009H18.25C18.25 5.05403 15.4531 2.25 12 2.25V3.75ZM17.5 9.76101C19.5698 9.76101 21.25 11.4423 21.25 13.5193H22.75C22.75 10.6165 20.4008 8.26101 17.5 8.26101V9.76101ZM17.4794 9.76106L17.5019 9.761L17.4981 8.26101L17.4757 8.26106L17.4794 9.76106ZM16.75 8.51009C16.75 8.6565 16.7434 8.80117 16.7306 8.94386L18.2246 9.07826C18.2414 8.89095 18.25 8.70143 18.25 8.51009H16.75ZM2.75 13.0183C2.75 10.8031 4.43748 8.98389 6.5916 8.77853L6.44924 7.2853C3.53048 7.56356 1.25 10.0247 1.25 13.0183H2.75ZM6.5916 8.77853C6.72581 8.76574 6.86203 8.75917 7 8.75917V7.25917C6.81443 7.25917 6.6307 7.268 6.44924 7.2853L6.5916 8.77853ZM7.26768 8.09603C7.47668 5.66023 9.51709 3.75 12 3.75V2.25C8.72939 2.25 6.04797 4.76511 5.77317 7.9678L7.26768 8.09603ZM7 8.75917C7.95746 8.75917 8.83914 9.07557 9.54945 9.61023L10.4515 8.41178C9.49035 7.68831 8.29419 7.25917 7 7.25917V8.75917ZM16.7306 8.94386C16.6423 9.92517 16.2569 10.8203 15.6641 11.5394L16.8216 12.4936C17.6003 11.5489 18.1084 10.37 18.2246 9.07826L16.7306 8.94386ZM21.25 13.5193C21.25 15.4544 19.7906 17.0471 17.9174 17.2546L18.0826 18.7454C20.7093 18.4545 22.75 16.2252 22.75 13.5193H21.25ZM6.14946 17.1924C4.21067 16.7981 2.75 15.079 2.75 13.0183H1.25C1.25 15.8044 3.22485 18.1283 5.85054 18.6623L6.14946 17.1924ZM11.25 13V21H12.75V13H11.25ZM12 12.25C11.7417 12.25 11.5193 12.339 11.3578 12.4254C11.1904 12.515 11.0348 12.631 10.8968 12.7485C10.6213 12.9832 10.3457 13.285 10.0995 13.5755C9.85056 13.8693 9.60952 14.1784 9.40971 14.4328C9.19651 14.7042 9.05089 14.886 8.96219 14.9773L10.0378 16.0227C10.1949 15.8612 10.3971 15.604 10.5893 15.3593C10.7949 15.0975 11.0169 14.8132 11.2439 14.5452C11.4738 14.274 11.6873 14.0456 11.8694 13.8905C11.9601 13.8132 12.0255 13.7694 12.0656 13.7479C12.1116 13.7233 12.0832 13.75 12 13.75V12.25ZM15.0378 14.9773C14.9491 14.886 14.8035 14.7042 14.5903 14.4328C14.3905 14.1784 14.1494 13.8693 13.9005 13.5755C13.6543 13.285 13.3787 12.9832 13.1032 12.7485C12.9652 12.631 12.8096 12.515 12.6422 12.4254C12.4807 12.339 12.2583 12.25 12 12.25V13.75C11.9168 13.75 11.8884 13.7233 11.9344 13.7479C11.9745 13.7694 12.0399 13.8132 12.1306 13.8905C12.3127 14.0456 12.5262 14.274 12.7561 14.5452C12.9831 14.8132 13.2051 15.0975 13.4107 15.3593C13.6029 15.604 13.8051 15.8612 13.9622 16.0227L15.0378 14.9773Z\"\r\n fill=\"var(--color-icon, #4B5565)\"\r\n />\r\n </svg>\r\n </div>\r\n <div class={`default_content ${this.heightSize}`}>\r\n <p class={`upload_text text-sm-regular ${this.heightSize}`}>\r\n <gb-button size=\"sm\" hierarchy=\"link_color\" icon=\"default\" onClick={() => this.onUploadButtonClicked()}>\r\n <p>Click to upload</p>\r\n </gb-button>\r\n or drag and drop\r\n </p>\r\n <p class=\"file_type_text text-xs-regular\">{this.allowedType}</p>\r\n </div>\r\n </div>,\r\n ]}\r\n </>\r\n )}\r\n {this.state === 'in_progress' && (\r\n <div class={`in_progress_div ${this.heightSize}`}>\r\n <div class=\"file_icon\">\r\n <gb-file-type-icon file-style={this.icon === 'outline' ? 'default' : this.icon === 'solid' ? 'solid' : null} file-type={this.fileType}></gb-file-type-icon>\r\n </div>\r\n <div class=\"in_progress_content\">\r\n {this.heightSize === 'md' && (\r\n <>\r\n <p class={`file_type_text ${this.state} text-sm-medium`}>\r\n {this.fileName}.{this.fileType}\r\n </p>\r\n <p class={`file_size_text ${this.state} text-sm-regular`}>{this.getReadableFileSize()}</p>\r\n <gb-progress-bar progress={this.internalProgress} show-label={true} label-position=\"right\" class=\"progress_bar\"></gb-progress-bar>\r\n <gb-button-close size=\"sm\" color=\"gray\" class=\"close_button\" onClick={() => this.onCancelButtonClicked()}></gb-button-close>\r\n </>\r\n )}\r\n {this.heightSize === 'lg' && (\r\n <>\r\n <p class={`file_type_text ${this.state} text-sm-medium`}>\r\n {this.fileName}.{this.fileType}\r\n </p>\r\n <p class={`file_size_text ${this.state} text-sm-regular`}>{this.getReadableFileSize()}</p>\r\n <gb-progress-bar progress={this.internalProgress} show-label={true} label-position=\"right\" class=\"progress_bar\"></gb-progress-bar>\r\n <gb-button-close size=\"sm\" color=\"gray\" class=\"close_button\" onClick={() => this.onCancelButtonClicked()}></gb-button-close>\r\n </>\r\n )}\r\n </div>\r\n </div>\r\n )}\r\n {this.state === 'complete' && (\r\n <div class={`complete ${this.heightSize}`}>\r\n <div class=\"file_icon\">\r\n <gb-file-type-icon file-style={this.icon === 'outline' ? 'default' : this.icon === 'solid' ? 'solid' : null} file-type={this.fileType}></gb-file-type-icon>\r\n </div>\r\n <div class={`complete_content ${this.heightSize}`}>\r\n {this.heightSize === 'md' && (\r\n <>\r\n <p class={`file_type_text ${this.state} text-sm-medium`}>\r\n {this.fileName}.{this.fileType}\r\n </p>\r\n <p class={`file_size_text ${this.state} text-sm-regular`}>\r\n {`${this.getReadableFileSize()}`} – {`${this.internalProgress}`}% uploaded\r\n </p>\r\n <gb-button\r\n size=\"sm\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"only\"\r\n icon-leading={true}\r\n icon-leading-swap=\"assets/delete-02.svg\"\r\n class=\"delete_button\"\r\n onClick={() => this.onDeleteFileUploadClicked()}\r\n ></gb-button>\r\n </>\r\n )}\r\n {this.heightSize === 'lg' && (\r\n <>\r\n <p class={`file_type_text ${this.state} text-sm-medium`}>\r\n {this.fileName}.{this.fileType}\r\n </p>\r\n <p class={`file_size_text ${this.state} text-sm-regular`}>\r\n {this.getReadableFileSize()} – {`${this.internalProgress}`} % uploaded\r\n </p>\r\n <gb-button\r\n size=\"sm\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"default\"\r\n icon-leading={true}\r\n icon-leading-swap=\"assets/delete-02.svg\"\r\n onClick={() => this.onDeleteFileUploadClicked()}\r\n >\r\n <p>Clear</p>\r\n </gb-button>\r\n </>\r\n )}\r\n </div>\r\n </div>\r\n )}\r\n {this.state === 'error' && (\r\n <div class={`error ${this.heightSize}`}>\r\n <div class=\"file_icon\">\r\n <gb-file-type-icon file-style={this.icon === 'outline' ? 'default' : this.icon === 'solid' ? 'solid' : null} file-type={this.fileType}></gb-file-type-icon>\r\n </div>\r\n <div class=\"error_content\">\r\n {this.heightSize === 'md' && (\r\n <>\r\n <div class=\"error_content_text\">\r\n <p class={`file_type_text ${this.state} text-sm-medium`}>\r\n {this.fileName}.{this.fileType}\r\n </p>\r\n <p class={`file_size_text ${this.state} text-sm-regular`}>Upload failed, please try again</p>\r\n </div>\r\n <div class=\"try_again_btn\">\r\n <gb-button size=\"sm\" hierarchy=\"link_color\" icon=\"default\" destructive={true} onClick={() => this.onTryAgainClicked()}>\r\n <p>Try again</p>\r\n </gb-button>\r\n </div>\r\n <gb-button\r\n size=\"sm\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"only\"\r\n destructive={true}\r\n icon-leading={true}\r\n icon-leading-swap=\"assets/delete-02.svg\"\r\n class=\"delete_button\"\r\n onClick={() => this.onDeleteFileUploadClicked()}\r\n ></gb-button>\r\n </>\r\n )}\r\n {this.heightSize === 'lg' && (\r\n <>\r\n <p class={`file_type_text ${this.state} text-sm-medium`}>\r\n {this.fileName}.{this.fileType}\r\n </p>\r\n <p class={`file_size_text ${this.state} text-sm-regular`}>\r\n {this.getReadableFileSize()} – {`${this.internalProgress}`}% uploaded\r\n </p>\r\n <div class=\"btns\">\r\n <gb-button\r\n size=\"sm\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"default\"\r\n destructive={true}\r\n icon-leading={true}\r\n icon-leading-swap=\"assets/delete-02.svg\"\r\n onClick={() => this.onDeleteFileUploadClicked()}\r\n >\r\n <p>Clear</p>\r\n </gb-button>\r\n <div class=\"btn\">\r\n <gb-button size=\"sm\" hierarchy=\"link_color\" icon={StateEnum.Default} destructive={true} class=\"btn\" onClick={() => this.onTryAgainClicked()}>\r\n <p>Try again</p>\r\n </gb-button>\r\n </div>\r\n </div>\r\n </>\r\n )}\r\n </div>\r\n </div>\r\n )}\r\n </div>\r\n </div>\r\n );\r\n }\r\n}\r\n"],"version":3}
|
|
1
|
+
{"file":"p-DksiC7vr.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/gb-file-upload-item-base/gb-file-upload-item-base.css?tag=gb-file-upload-item-base&encapsulation=shadow","src/components/gb-file-upload-item-base/gb-file-upload-item-base.tsx"],"sourcesContent":["@import './../../global/global.css';\r\n\r\n.overall_container{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-2);\r\n}\r\n\r\n/* .file_upload_item_base_div{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-2);\r\n} */\r\n\r\n.file_upload_item_base_container {\r\n display: flex;\r\n border-radius: var(--rounded-sm);\r\n background-color: var(--color-background-card, #ffffff);\r\n border: 1px solid var(--color-border-subtler, #e3e8ef);\r\n position: relative;\r\n cursor: pointer;\r\n}\r\n\r\n.file_upload_item_base_container.default:hover{\r\n border-color: var(--color-border-selected, #075DB2);\r\n}\r\n\r\n.file_upload_item_base_container.disabled{\r\n background-color: var(--color-background-disabled, #F6F8FA);\r\n border-color: var(--color-border-disabled, #E3E8EF);\r\n}\r\n\r\n.file_upload_item_base_container.md{\r\n flex-direction: row;\r\n padding: var(--spacing-4);\r\n}\r\n\r\n.file_upload_item_base_container.lg{\r\n flex-direction: column;\r\n padding: var(--spacing-6);\r\n}\r\n\r\n.close_button {\r\n position: absolute;\r\n top: var(--spacing-4);\r\n right: var(--spacing-4);\r\n}\r\n\r\n.label_text{\r\n color: var(--color-text, #4B5565);\r\n}\r\n\r\n.file_type_text{\r\n color: var(--color-text-subtle, #697586);\r\n}\r\n\r\n.progress_bar{\r\n margin-top: 0.5rem;\r\n}\r\n\r\n.file_type_text.in_progress,\r\n.file_type_text.complete{\r\n color: var(--color-text, #4B5565);\r\n}\r\n\r\n.file_type_text.error,\r\n.file_size_text.error{\r\n color: var(--color-background-danger, #B51726);\r\n}\r\n\r\n.file_size_text.in_progress,\r\n.file_size_text.complete{\r\n color: var(--color-text-subtle, #697586);\r\n}\r\n\r\n.in_progress_div.md,\r\n.error.md,\r\n.complete.md{\r\n display: flex;\r\n align-items: center;\r\n gap: var(--spacing-1);\r\n}\r\n\r\n.in_progress_div.lg,\r\n.error.lg,\r\n.complete.lg{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-3);\r\n}\r\n\r\n/* Default Styles */\r\n.file_upload_icon{\r\n background-color: var(--color-background-gray-subtler, #EEF2F6);\r\n border-radius: var(--rounded-full);\r\n display: flex;\r\n justify-content: center;\r\n align-items: center;\r\n padding: var(--spacing-3);\r\n}\r\n\r\n.file_upload_icon svg{\r\n width: var(--spacing-6);\r\n height: var(--spacing-6);\r\n}\r\n\r\n.default.md{\r\n display: flex;\r\n gap: var(--spacing-3);\r\n align-items: center;\r\n}\r\n\r\n.default.lg{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-3);\r\n align-items: center;\r\n justify-content: center;\r\n}\r\n\r\n.default_content{\r\n display: flex;\r\n flex-direction: column;\r\n justify-content: center;\r\n gap: var(--spacing-2);\r\n}\r\n\r\n.default_content.lg{\r\n align-items: center;\r\n}\r\n\r\n.upload_text{\r\n color: var(--color-text);\r\n}\r\n\r\n/* In Progress Styles */\r\n.in_progress_div.md{\r\n width: 100%;\r\n}\r\n\r\n.in_progress_div.lg{\r\n text-align: center;\r\n}\r\n\r\n.in_progress_content{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-2);\r\n width: 100%;\r\n}\r\n\r\n.upload_btn_md{\r\n position: absolute;\r\n top: 45%;\r\n right: 1.5rem;\r\n}\r\n\r\n.upload_btn_lg{\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\n/* Complete Styles */\r\n.complete{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-3);\r\n}\r\n\r\n.complete.md{\r\n flex-direction: row;\r\n gap: var(--spacing-1);\r\n}\r\n\r\n.complete.lg{\r\n align-items: center;\r\n text-align: center;\r\n}\r\n\r\n.complete_content{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-2);\r\n}\r\n\r\n.complete_content.md{\r\n justify-content: center;\r\n}\r\n\r\n.complete_content.lg{\r\n align-items: center;\r\n}\r\n\r\n.delete_button{\r\n position: absolute;\r\n top: 30%;\r\n right: 1rem;\r\n}\r\n\r\n.delete_btn{\r\n position: absolute;\r\n top: 35%;\r\n right: 1.5rem;\r\n}\r\n\r\n/* Error Styles */\r\n.error{\r\n background-color: var(--color-background-danger-subtlest, #FEF1F2);\r\n border-color: var(--color-border-danger-subtle, #F9B4BA);\r\n}\r\n\r\n.error.lg{\r\n text-align: center;\r\n}\r\n\r\n.error_content{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-3);\r\n}\r\n\r\n.error_content_text{\r\n display: flex;\r\n flex-direction: column;\r\n gap: var(--spacing-2);\r\n}\r\n\r\n.btns{\r\n display: flex;\r\n justify-content: center;\r\n gap: var(--spacing-6);\r\n}\r\n\r\n.btn{\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\n.try_again_btn{\r\n display: flex;\r\n width: 100%;\r\n}\r\n\r\n/* Text Styles*/\r\n.text-sm-semi-bold{\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-sm);\r\n font-weight: var(--font-weight-semi-bold);\r\n line-height: var(--font-line-height-t-sm);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-sm-semi-bold::before,\r\n.text-sm-semi-bold::after{\r\n content: \"\";\r\n display: table;\r\n}\r\n\r\n.text-sm-semi-bold::before{\r\n margin-bottom: -0.299em;\r\n}\r\n\r\n.text-sm-semi-bold::after{\r\n margin-top: -0.349em;\r\n}\r\n\r\n.text-sm-medium{\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-sm);\r\n font-weight: var(--font-weight-medium);\r\n line-height: var(--font-line-height-t-sm);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n position: relative;\r\n display: inline-block;\r\n}\r\n\r\n.text-sm-medium::before,\r\n.text-sm-medium::after{\r\n content: \"\";\r\n display: table;\r\n}\r\n\r\n.text-sm-medium::before{\r\n margin-bottom: -0.299em;\r\n}\r\n\r\n.text-sm-medium::after{\r\n margin-top: -0.299em;\r\n}\r\n\r\n.text-sm-regular{\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-sm);\r\n font-weight: var(--font-weight-regular);\r\n line-height: var(--font-line-height-t-sm);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n position: relative;\r\n display: inline-block;\r\n}\r\n\r\n.text-sm-regular::before,\r\n.text-sm-regular::after{\r\n content: \"\";\r\n display: table;\r\n}\r\n\r\n.text-sm-regular::before{\r\n margin-bottom: -0.299em;\r\n}\r\n\r\n.text-sm-regular::after{\r\n margin-top: -0.299em;\r\n}\r\n\r\n.text-xs-regular{\r\n font-family: var(--font-family-body);\r\n font-size: var(--font-size-t-xs);\r\n font-weight: var(--font-weight-regular);\r\n line-height: var(--font-line-height-t-xs);\r\n margin: var(--spacing-none);\r\n padding: var(--spacing-none);\r\n display: inline-block;\r\n position: relative;\r\n}\r\n\r\n.text-xs-regular::before,\r\n.text-xs-regular::after{\r\n content: \"\";\r\n display: table;\r\n}\r\n\r\n.text-xs-regular::before{\r\n margin-bottom: -0.291em;\r\n}\r\n\r\n.text-xs-regular::after{\r\n margin-top: -0.396em;\r\n}\r\n\r\np.lg{\r\n display: flex;\r\n gap: var(--spacing-1);\r\n}","import { Component, h, Prop, Fragment, Event, EventEmitter, State, Watch } from '@stencil/core';\r\nimport { FileIconTypes, FileUploadIconType, FileUploadStates, GeneralSizes, StateEnum } from '../../models/reusableModels';\r\n\r\n@Component({\r\n tag: 'gb-file-upload-item-base',\r\n styleUrl: 'gb-file-upload-item-base.css',\r\n shadow: true,\r\n})\r\nexport class GbFileUploadItemBase {\r\n @Prop() icon: FileUploadIconType;\r\n @Prop() label: string = '';\r\n @Prop() showLabel: boolean = false;\r\n @Prop() state: FileUploadStates;\r\n @Prop() heightSize: GeneralSizes = 'md';\r\n @Prop() fileType: FileIconTypes;\r\n @Prop() progress: number = 0;\r\n @Prop() fileSize: number;\r\n @Prop() fileName: string;\r\n @Prop() allowedType: string;\r\n @State() internalState: FileUploadStates;\r\n @State() internalProgress: number = 0;\r\n @Event() uploadButtonClicked: EventEmitter<void>;\r\n @Event() cancelUpload: EventEmitter<void>;\r\n @Event() tryAgainClicked: EventEmitter<void>;\r\n @Event() deleteFileUpload: EventEmitter<void>;\r\n\r\n @Watch('state')\r\n onStateChange(newValue: FileUploadStates, _oldValue: FileUploadStates) {\r\n // console.log('state changed from', oldValue, 'to', newValue);\r\n this.internalState = newValue;\r\n }\r\n\r\n @Watch('progress')\r\n onProgressChange(newValue: number, _oldValue: number) {\r\n // console.log('progress changed from', oldValue, 'to', newValue);\r\n this.internalProgress = newValue;\r\n }\r\n\r\n componentWillLoad() {\r\n this.internalState = this.state;\r\n this.internalProgress = this.progress;\r\n }\r\n\r\n onUploadButtonClicked() {\r\n this.uploadButtonClicked.emit();\r\n }\r\n\r\n onCancelButtonClicked() {\r\n this.cancelUpload.emit();\r\n }\r\n\r\n onTryAgainClicked() {\r\n this.tryAgainClicked.emit();\r\n }\r\n\r\n onDeleteFileUploadClicked() {\r\n this.deleteFileUpload.emit();\r\n }\r\n\r\n getReadableFileSize(): string {\r\n if (this.fileSize === 0) return '0 Bytes';\r\n const k = 1024;\r\n const sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB'];\r\n const i = Math.floor(Math.log(this.fileSize) / Math.log(k));\r\n const size = parseFloat((this.fileSize / Math.pow(k, i)).toFixed(2));\r\n return `${size} ${sizes[i]}`;\r\n }\r\n\r\n render() {\r\n return (\r\n <div class=\"overall_container\">\r\n {this.showLabel && <p class=\"label_text text-sm-semi-bold\">{this.label}</p>}\r\n <div class={`file_upload_item_base_container ${this.state} ${this.heightSize}`}>\r\n {this.state === 'default' && (\r\n <>\r\n {this.heightSize === 'md' && [\r\n <div class={`default ${this.heightSize}`}>\r\n <div class=\"file_upload_icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <path\r\n d=\"M17.5 9.01101V8.261L17.4981 8.26101L17.5 9.01101ZM9.54945 9.61023C9.8804 9.85933 10.3506 9.79298 10.5997 9.46204C10.8488 9.1311 10.7825 8.66088 10.4515 8.41178L9.54945 9.61023ZM15.6641 11.5394C15.4006 11.8591 15.4462 12.3317 15.7658 12.5952C16.0854 12.8587 16.5581 12.8132 16.8216 12.4936L15.6641 11.5394ZM17.9174 17.2546C17.5057 17.3002 17.209 17.6709 17.2546 18.0826C17.3002 18.4943 17.6709 18.791 18.0826 18.7454L17.9174 17.2546ZM5.85054 18.6623C6.25644 18.7448 6.65241 18.4827 6.73496 18.0768C6.8175 17.6709 6.55537 17.2749 6.14946 17.1924L5.85054 18.6623ZM12 13V12.25V13ZM11.25 21C11.25 21.4142 11.5858 21.75 12 21.75C12.4142 21.75 12.75 21.4142 12.75 21H11.25ZM8.96219 14.9773C8.67349 15.2743 8.68023 15.7491 8.97726 16.0378C9.27428 16.3265 9.74911 16.3198 10.0378 16.0227L8.96219 14.9773ZM13.9622 16.0227C14.2509 16.3198 14.7257 16.3265 15.0227 16.0378C15.3198 15.7491 15.3265 15.2743 15.0378 14.9773L13.9622 16.0227ZM12 3.75C14.6221 3.75 16.75 5.87987 16.75 8.51009H18.25C18.25 5.05403 15.4531 2.25 12 2.25V3.75ZM17.5 9.76101C19.5698 9.76101 21.25 11.4423 21.25 13.5193H22.75C22.75 10.6165 20.4008 8.26101 17.5 8.26101V9.76101ZM17.4794 9.76106L17.5019 9.761L17.4981 8.26101L17.4757 8.26106L17.4794 9.76106ZM16.75 8.51009C16.75 8.6565 16.7434 8.80117 16.7306 8.94386L18.2246 9.07826C18.2414 8.89095 18.25 8.70143 18.25 8.51009H16.75ZM2.75 13.0183C2.75 10.8031 4.43748 8.98389 6.5916 8.77853L6.44924 7.2853C3.53048 7.56356 1.25 10.0247 1.25 13.0183H2.75ZM6.5916 8.77853C6.72581 8.76574 6.86203 8.75917 7 8.75917V7.25917C6.81443 7.25917 6.6307 7.268 6.44924 7.2853L6.5916 8.77853ZM7.26768 8.09603C7.47668 5.66023 9.51709 3.75 12 3.75V2.25C8.72939 2.25 6.04797 4.76511 5.77317 7.9678L7.26768 8.09603ZM7 8.75917C7.95746 8.75917 8.83914 9.07557 9.54945 9.61023L10.4515 8.41178C9.49035 7.68831 8.29419 7.25917 7 7.25917V8.75917ZM16.7306 8.94386C16.6423 9.92517 16.2569 10.8203 15.6641 11.5394L16.8216 12.4936C17.6003 11.5489 18.1084 10.37 18.2246 9.07826L16.7306 8.94386ZM21.25 13.5193C21.25 15.4544 19.7906 17.0471 17.9174 17.2546L18.0826 18.7454C20.7093 18.4545 22.75 16.2252 22.75 13.5193H21.25ZM6.14946 17.1924C4.21067 16.7981 2.75 15.079 2.75 13.0183H1.25C1.25 15.8044 3.22485 18.1283 5.85054 18.6623L6.14946 17.1924ZM11.25 13V21H12.75V13H11.25ZM12 12.25C11.7417 12.25 11.5193 12.339 11.3578 12.4254C11.1904 12.515 11.0348 12.631 10.8968 12.7485C10.6213 12.9832 10.3457 13.285 10.0995 13.5755C9.85056 13.8693 9.60952 14.1784 9.40971 14.4328C9.19651 14.7042 9.05089 14.886 8.96219 14.9773L10.0378 16.0227C10.1949 15.8612 10.3971 15.604 10.5893 15.3593C10.7949 15.0975 11.0169 14.8132 11.2439 14.5452C11.4738 14.274 11.6873 14.0456 11.8694 13.8905C11.9601 13.8132 12.0255 13.7694 12.0656 13.7479C12.1116 13.7233 12.0832 13.75 12 13.75V12.25ZM15.0378 14.9773C14.9491 14.886 14.8035 14.7042 14.5903 14.4328C14.3905 14.1784 14.1494 13.8693 13.9005 13.5755C13.6543 13.285 13.3787 12.9832 13.1032 12.7485C12.9652 12.631 12.8096 12.515 12.6422 12.4254C12.4807 12.339 12.2583 12.25 12 12.25V13.75C11.9168 13.75 11.8884 13.7233 11.9344 13.7479C11.9745 13.7694 12.0399 13.8132 12.1306 13.8905C12.3127 14.0456 12.5262 14.274 12.7561 14.5452C12.9831 14.8132 13.2051 15.0975 13.4107 15.3593C13.6029 15.604 13.8051 15.8612 13.9622 16.0227L15.0378 14.9773Z\"\r\n fill=\"var(--color-icon, #4B5565)\"\r\n />\r\n </svg>\r\n </div>\r\n <div class=\"default_content\">\r\n <p class=\"upload_text text-sm-semi-bold\">Tap to upload</p>\r\n <p class=\"file_type_text text-xs-regular\">{this.allowedType}</p>\r\n </div>\r\n </div>,\r\n <gb-button size=\"sm\" hierarchy=\"link_color\" icon=\"default\" class=\"upload_btn_md\" icon-leading={true} onClick={() => this.onUploadButtonClicked()}>\r\n <p>Upload</p>\r\n </gb-button>,\r\n ]}\r\n {this.heightSize === 'lg' && [\r\n <div class={`default ${this.heightSize}`}>\r\n <div class=\"file_upload_icon\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n <path\r\n d=\"M17.5 9.01101V8.261L17.4981 8.26101L17.5 9.01101ZM9.54945 9.61023C9.8804 9.85933 10.3506 9.79298 10.5997 9.46204C10.8488 9.1311 10.7825 8.66088 10.4515 8.41178L9.54945 9.61023ZM15.6641 11.5394C15.4006 11.8591 15.4462 12.3317 15.7658 12.5952C16.0854 12.8587 16.5581 12.8132 16.8216 12.4936L15.6641 11.5394ZM17.9174 17.2546C17.5057 17.3002 17.209 17.6709 17.2546 18.0826C17.3002 18.4943 17.6709 18.791 18.0826 18.7454L17.9174 17.2546ZM5.85054 18.6623C6.25644 18.7448 6.65241 18.4827 6.73496 18.0768C6.8175 17.6709 6.55537 17.2749 6.14946 17.1924L5.85054 18.6623ZM12 13V12.25V13ZM11.25 21C11.25 21.4142 11.5858 21.75 12 21.75C12.4142 21.75 12.75 21.4142 12.75 21H11.25ZM8.96219 14.9773C8.67349 15.2743 8.68023 15.7491 8.97726 16.0378C9.27428 16.3265 9.74911 16.3198 10.0378 16.0227L8.96219 14.9773ZM13.9622 16.0227C14.2509 16.3198 14.7257 16.3265 15.0227 16.0378C15.3198 15.7491 15.3265 15.2743 15.0378 14.9773L13.9622 16.0227ZM12 3.75C14.6221 3.75 16.75 5.87987 16.75 8.51009H18.25C18.25 5.05403 15.4531 2.25 12 2.25V3.75ZM17.5 9.76101C19.5698 9.76101 21.25 11.4423 21.25 13.5193H22.75C22.75 10.6165 20.4008 8.26101 17.5 8.26101V9.76101ZM17.4794 9.76106L17.5019 9.761L17.4981 8.26101L17.4757 8.26106L17.4794 9.76106ZM16.75 8.51009C16.75 8.6565 16.7434 8.80117 16.7306 8.94386L18.2246 9.07826C18.2414 8.89095 18.25 8.70143 18.25 8.51009H16.75ZM2.75 13.0183C2.75 10.8031 4.43748 8.98389 6.5916 8.77853L6.44924 7.2853C3.53048 7.56356 1.25 10.0247 1.25 13.0183H2.75ZM6.5916 8.77853C6.72581 8.76574 6.86203 8.75917 7 8.75917V7.25917C6.81443 7.25917 6.6307 7.268 6.44924 7.2853L6.5916 8.77853ZM7.26768 8.09603C7.47668 5.66023 9.51709 3.75 12 3.75V2.25C8.72939 2.25 6.04797 4.76511 5.77317 7.9678L7.26768 8.09603ZM7 8.75917C7.95746 8.75917 8.83914 9.07557 9.54945 9.61023L10.4515 8.41178C9.49035 7.68831 8.29419 7.25917 7 7.25917V8.75917ZM16.7306 8.94386C16.6423 9.92517 16.2569 10.8203 15.6641 11.5394L16.8216 12.4936C17.6003 11.5489 18.1084 10.37 18.2246 9.07826L16.7306 8.94386ZM21.25 13.5193C21.25 15.4544 19.7906 17.0471 17.9174 17.2546L18.0826 18.7454C20.7093 18.4545 22.75 16.2252 22.75 13.5193H21.25ZM6.14946 17.1924C4.21067 16.7981 2.75 15.079 2.75 13.0183H1.25C1.25 15.8044 3.22485 18.1283 5.85054 18.6623L6.14946 17.1924ZM11.25 13V21H12.75V13H11.25ZM12 12.25C11.7417 12.25 11.5193 12.339 11.3578 12.4254C11.1904 12.515 11.0348 12.631 10.8968 12.7485C10.6213 12.9832 10.3457 13.285 10.0995 13.5755C9.85056 13.8693 9.60952 14.1784 9.40971 14.4328C9.19651 14.7042 9.05089 14.886 8.96219 14.9773L10.0378 16.0227C10.1949 15.8612 10.3971 15.604 10.5893 15.3593C10.7949 15.0975 11.0169 14.8132 11.2439 14.5452C11.4738 14.274 11.6873 14.0456 11.8694 13.8905C11.9601 13.8132 12.0255 13.7694 12.0656 13.7479C12.1116 13.7233 12.0832 13.75 12 13.75V12.25ZM15.0378 14.9773C14.9491 14.886 14.8035 14.7042 14.5903 14.4328C14.3905 14.1784 14.1494 13.8693 13.9005 13.5755C13.6543 13.285 13.3787 12.9832 13.1032 12.7485C12.9652 12.631 12.8096 12.515 12.6422 12.4254C12.4807 12.339 12.2583 12.25 12 12.25V13.75C11.9168 13.75 11.8884 13.7233 11.9344 13.7479C11.9745 13.7694 12.0399 13.8132 12.1306 13.8905C12.3127 14.0456 12.5262 14.274 12.7561 14.5452C12.9831 14.8132 13.2051 15.0975 13.4107 15.3593C13.6029 15.604 13.8051 15.8612 13.9622 16.0227L15.0378 14.9773Z\"\r\n fill=\"var(--color-icon, #4B5565)\"\r\n />\r\n </svg>\r\n </div>\r\n <div class={`default_content ${this.heightSize}`}>\r\n <p class={`upload_text text-sm-regular ${this.heightSize}`}>\r\n <gb-button size=\"sm\" hierarchy=\"link_color\" icon=\"default\" onClick={() => this.onUploadButtonClicked()}>\r\n <p>Click to upload</p>\r\n </gb-button>\r\n or drag and drop\r\n </p>\r\n <p class=\"file_type_text text-xs-regular\">{this.allowedType}</p>\r\n </div>\r\n </div>,\r\n ]}\r\n </>\r\n )}\r\n {this.state === 'in_progress' && (\r\n <div class={`in_progress_div ${this.heightSize}`}>\r\n <div class=\"file_icon\">\r\n <gb-file-type-icon file-style={this.icon === 'outline' ? 'default' : this.icon === 'solid' ? 'solid' : null} file-type={this.fileType}></gb-file-type-icon>\r\n </div>\r\n <div class=\"in_progress_content\">\r\n {this.heightSize === 'md' && (\r\n <>\r\n <p class={`file_type_text ${this.state} text-sm-medium`}>\r\n {this.fileName}.{this.fileType}\r\n </p>\r\n <p class={`file_size_text ${this.state} text-sm-regular`}>{this.getReadableFileSize()}</p>\r\n <gb-progress-bar progress={this.internalProgress} show-label={true} label-position=\"right\" class=\"progress_bar\"></gb-progress-bar>\r\n <gb-button-close size=\"sm\" color=\"gray\" class=\"close_button\" onClick={() => this.onCancelButtonClicked()}></gb-button-close>\r\n </>\r\n )}\r\n {this.heightSize === 'lg' && (\r\n <>\r\n <p class={`file_type_text ${this.state} text-sm-medium`}>\r\n {this.fileName}.{this.fileType}\r\n </p>\r\n <p class={`file_size_text ${this.state} text-sm-regular`}>{this.getReadableFileSize()}</p>\r\n <gb-progress-bar progress={this.internalProgress} show-label={true} label-position=\"right\" class=\"progress_bar\"></gb-progress-bar>\r\n <gb-button-close size=\"sm\" color=\"gray\" class=\"close_button\" onClick={() => this.onCancelButtonClicked()}></gb-button-close>\r\n </>\r\n )}\r\n </div>\r\n </div>\r\n )}\r\n {this.state === 'complete' && (\r\n <div class={`complete ${this.heightSize}`}>\r\n <div class=\"file_icon\">\r\n <gb-file-type-icon file-style={this.icon === 'outline' ? 'default' : this.icon === 'solid' ? 'solid' : null} file-type={this.fileType}></gb-file-type-icon>\r\n </div>\r\n <div class={`complete_content ${this.heightSize}`}>\r\n {this.heightSize === 'md' && (\r\n <>\r\n <p class={`file_type_text ${this.state} text-sm-medium`}>\r\n {this.fileName}.{this.fileType}\r\n </p>\r\n <p class={`file_size_text ${this.state} text-sm-regular`}>\r\n {`${this.getReadableFileSize()}`} – {`${this.internalProgress}`}% uploaded\r\n </p>\r\n <gb-button\r\n size=\"sm\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"only\"\r\n icon-leading={true}\r\n icon-leading-swap=\"assets/delete-02.svg\"\r\n class=\"delete_button\"\r\n onClick={() => this.onDeleteFileUploadClicked()}\r\n ></gb-button>\r\n </>\r\n )}\r\n {this.heightSize === 'lg' && (\r\n <>\r\n <p class={`file_type_text ${this.state} text-sm-medium`}>\r\n {this.fileName}.{this.fileType}\r\n </p>\r\n <p class={`file_size_text ${this.state} text-sm-regular`}>\r\n {this.getReadableFileSize()} – {`${this.internalProgress}`} % uploaded\r\n </p>\r\n <gb-button\r\n size=\"sm\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"default\"\r\n icon-leading={true}\r\n icon-leading-swap=\"assets/delete-02.svg\"\r\n onClick={() => this.onDeleteFileUploadClicked()}\r\n >\r\n <p>Clear</p>\r\n </gb-button>\r\n </>\r\n )}\r\n </div>\r\n </div>\r\n )}\r\n {this.state === 'error' && (\r\n <div class={`error ${this.heightSize}`}>\r\n <div class=\"file_icon\">\r\n <gb-file-type-icon file-style={this.icon === 'outline' ? 'default' : this.icon === 'solid' ? 'solid' : null} file-type={this.fileType}></gb-file-type-icon>\r\n </div>\r\n <div class=\"error_content\">\r\n {this.heightSize === 'md' && (\r\n <>\r\n <div class=\"error_content_text\">\r\n <p class={`file_type_text ${this.state} text-sm-medium`}>\r\n {this.fileName}.{this.fileType}\r\n </p>\r\n <p class={`file_size_text ${this.state} text-sm-regular`}>Upload failed, please try again</p>\r\n </div>\r\n <div class=\"try_again_btn\">\r\n <gb-button size=\"sm\" hierarchy=\"link_color\" icon=\"default\" destructive={true} onClick={() => this.onTryAgainClicked()}>\r\n <p>Try again</p>\r\n </gb-button>\r\n </div>\r\n <gb-button\r\n size=\"sm\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"only\"\r\n destructive={true}\r\n icon-leading={true}\r\n icon-leading-swap=\"assets/delete-02.svg\"\r\n class=\"delete_button\"\r\n onClick={() => this.onDeleteFileUploadClicked()}\r\n ></gb-button>\r\n </>\r\n )}\r\n {this.heightSize === 'lg' && (\r\n <>\r\n <p class={`file_type_text ${this.state} text-sm-medium`}>\r\n {this.fileName}.{this.fileType}\r\n </p>\r\n <p class={`file_size_text ${this.state} text-sm-regular`}>\r\n {this.getReadableFileSize()} – {`${this.internalProgress}`}% uploaded\r\n </p>\r\n <div class=\"btns\">\r\n <gb-button\r\n size=\"sm\"\r\n hierarchy=\"tertiary_gray\"\r\n icon=\"default\"\r\n destructive={true}\r\n icon-leading={true}\r\n icon-leading-swap=\"assets/delete-02.svg\"\r\n onClick={() => this.onDeleteFileUploadClicked()}\r\n >\r\n <p>Clear</p>\r\n </gb-button>\r\n <div class=\"btn\">\r\n <gb-button size=\"sm\" hierarchy=\"link_color\" icon={StateEnum.Default} destructive={true} class=\"btn\" onClick={() => this.onTryAgainClicked()}>\r\n <p>Try again</p>\r\n </gb-button>\r\n </div>\r\n </div>\r\n </>\r\n )}\r\n </div>\r\n </div>\r\n )}\r\n </div>\r\n </div>\r\n );\r\n }\r\n}\r\n"],"version":3}
|
|
@@ -14,7 +14,7 @@ const GbStatusIndicator = /*@__PURE__*/ proxyCustomElement(class GbStatusIndicat
|
|
|
14
14
|
}
|
|
15
15
|
render() {
|
|
16
16
|
return [
|
|
17
|
-
h("div", { key: '
|
|
17
|
+
h("div", { key: 'b954e05bb4e5e23d74ebbc8f519200337c79e868' }, this.statusIcon === 'online_indicator' && h("div", { key: '3543f5aeb48815368c415a01a332a6647373914a', class: `online_icon ${this.size} ${this.indicatorStateClass}` }), this.statusIcon === 'verified' && (h("svg", { key: 'a1d55e593786264a8225d5ef05ad5843d4eb48ee', xmlns: "http://www.w3.org/2000/svg", width: "32", height: "32", viewBox: "0 0 32 32", fill: "none", class: `verified ${this.size}` }, h("g", { key: 'd80ae6e0ea589851e4f05e21d3e9fb0ac9d09db8', "clip-path": "url(#clip0_0_21453)" }, h("path", { key: '570c671f526d7e6c570c8f66c807918758e1bafd', d: "M24.7109 5.66715C25.0148 6.40217 25.5982 6.98642 26.3328 7.29145L28.9086 8.35837C29.6436 8.66285 30.2277 9.24688 30.5321 9.98196C30.8366 10.717 30.8366 11.543 30.5321 12.2781L29.466 14.852C29.1614 15.5874 29.1609 16.4142 29.467 17.1492L30.5313 19.7224C30.6822 20.0865 30.7599 20.4767 30.76 20.8708C30.7601 21.265 30.6825 21.6553 30.5316 22.0194C30.3808 22.3835 30.1597 22.7143 29.881 22.993C29.6022 23.2716 29.2713 23.4926 28.9072 23.6433L26.3332 24.7095C25.5982 25.0134 25.0139 25.5968 24.7089 26.3314L23.642 28.9071C23.3375 29.6422 22.7535 30.2262 22.0184 30.5307C21.2833 30.8352 20.4574 30.8352 19.7223 30.5307L17.1484 29.4646C16.4133 29.1608 15.5876 29.1614 14.853 29.4663L12.2772 30.5317C11.5425 30.8355 10.7173 30.8352 9.98284 30.531C9.24835 30.2267 8.66466 29.6434 8.35997 28.9091L7.29273 26.3326C6.98881 25.5975 6.40543 25.0133 5.67087 24.7083L3.09509 23.6413C2.36033 23.337 1.77648 22.7533 1.47188 22.0187C1.16729 21.284 1.16688 20.4585 1.47073 19.7235L2.53689 17.1496C2.84062 16.4145 2.84 15.5888 2.53517 14.8542L1.47054 12.2766C1.3196 11.9125 1.24188 11.5222 1.24181 11.1281C1.24175 10.734 1.31935 10.3437 1.47017 9.97956C1.621 9.61544 1.8421 9.2846 2.12083 9.00595C2.39957 8.72731 2.73047 8.50632 3.09465 8.35561L5.66858 7.28945C6.40297 6.98579 6.98687 6.40316 7.29212 5.66944L8.35904 3.09366C8.66352 2.35857 9.24754 1.77455 9.98263 1.47007C10.7177 1.16559 11.5436 1.16559 12.2787 1.47007L14.8527 2.53623C15.5878 2.83996 16.4134 2.83934 17.148 2.5345L19.7249 1.47172C20.4599 1.16741 21.2856 1.16748 22.0206 1.4719C22.7555 1.77632 23.3395 2.36017 23.644 3.09507L24.7112 5.67161L24.7109 5.66715Z", fill: "#0086C9" }), h("path", { key: 'fdbe5f1f2dbf80f5e265a00c98c36927983a2386', d: "M10 18.1818C10 18.1818 11.2857 18.1818 13 22C13 22 17.7647 12 22 10", stroke: "white", "stroke-width": "2.5", "stroke-linecap": "round", "stroke-linejoin": "round" })), h("defs", { key: 'e5761fb8cb8ebe92c7017cbdb20b835893f4e24b' }, h("clipPath", { key: 'c8ca7aae11fab558915805d9d4220ecbb1f325c6', id: "clip0_0_21453" }, h("rect", { key: 'cd021f429d80227189e4e5cde3971f1a416ac9cb', width: "32", height: "32", fill: "white" }))))), this.statusIcon === 'company' && (h("svg", { key: '7237d2ae3146195b65abbc0c46bd472a50305bd3', xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", class: `company ${this.size}` }, h("path", { key: '3148f97077d4422c4bfb2787b41c8dc04412c9af', d: "M18.8322 3.70039C16.9123 2.11995 14.5039 1.25399 12.0172 1.25001C10.6041 1.24776 9.20439 1.52413 7.89818 2.06333C6.59198 2.60252 5.4049 3.39397 4.40485 4.39237C2.64504 6.1493 1.54876 8.462 1.30275 10.9365C1.05674 13.411 1.67622 15.8943 3.05566 17.9633C4.43511 20.0323 6.48919 21.5591 8.86802 22.2836C11.2469 23.0081 13.8033 22.8855 16.1019 21.9367C18.4004 20.9878 20.299 19.2715 21.474 17.0799C22.6491 14.8884 23.0281 12.3572 22.5464 9.91759C22.0647 7.47798 20.7521 5.28082 18.8322 3.70039Z", fill: "#FF0033", stroke: "white", "stroke-width": "1.5" }), h("path", { key: 'f99c8ad31ba5a7905baf5bc0c7ac70e7e95b0961', "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M12.8942 13.7488V11.865L15.2835 11.8807C15.5231 11.8822 15.7598 11.9336 15.9785 12.0314C16.1973 12.1293 16.3933 12.2715 16.5541 12.449C16.715 12.6266 16.8373 12.8357 16.9131 13.063C16.989 13.2903 17.0168 13.5308 16.9948 13.7694C16.9948 16.4275 12.901 16.9969 12.8973 13.7488M12.8973 8.75316C17.3054 6.44066 17.6942 11.5213 15.0323 11.2788H12.886L12.8973 8.75316ZM16.7385 11.5113C19.8985 10.3013 17.2573 5.5894 12.0854 8.5044C11.5544 8.07132 10.9218 7.78073 10.2473 7.66004C8.96979 7.40066 7.25604 7.62628 6.29479 8.52378L6.75917 8.97941C7.2569 8.55053 7.86627 8.27194 8.51626 8.17611C9.16625 8.08028 9.83009 8.17117 10.4304 8.43816C10.6321 8.53335 10.8098 8.67262 10.9505 8.8457C11.0911 9.01879 11.191 9.22127 11.2429 9.43817L11.266 13.7669C11.0785 16.7738 7.20354 16.5413 7.20354 13.7669V11.8682H10.2492V11.295H5.59729V13.1644C5.60917 16.7175 9.93104 17.315 12.0717 15.5863C12.9471 16.2353 14.0184 16.5649 15.1073 16.52C18.9442 16.4938 19.7323 12.3563 16.7273 11.5144L16.7385 11.5113Z", fill: "white" })))),
|
|
18
18
|
];
|
|
19
19
|
}
|
|
20
20
|
static get style() { return gbStatusIndicatorCss; }
|
|
@@ -40,6 +40,6 @@ function defineCustomElement() {
|
|
|
40
40
|
defineCustomElement();
|
|
41
41
|
|
|
42
42
|
export { GbStatusIndicator as G, defineCustomElement as d };
|
|
43
|
-
//# sourceMappingURL=p-
|
|
43
|
+
//# sourceMappingURL=p-DmM0iRV2.js.map
|
|
44
44
|
|
|
45
|
-
//# sourceMappingURL=p-
|
|
45
|
+
//# sourceMappingURL=p-DmM0iRV2.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"p-C8XR10Iv.js","mappings":";;;AAAA,MAAM,oBAAoB,GAAG,+mqEAA+mqE;;MCS/nqE,iBAAiB,iBAAAA,kBAAA,CAAA,MAAA,iBAAA,SAAAC,CAAA,CAAA;AAN9B,IAAA,WAAA,GAAA;;;;AAOY,QAAA,IAAU,CAAA,UAAA,GAAW,EAAE;AAEvB,QAAA,IAAA,CAAA,KAAK,GAA0B,qBAAqB,CAAC,OAAO;AAC5D,QAAA,IAAA,CAAA,mBAAmB,GAAW,IAAI,CAAC,KAAK;AAyCnD;IAvCG,MAAM,GAAA;QACF,OAAO;AACL,YAAA,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACG,IAAI,CAAC,UAAU,KAAK,kBAAkB,IAAI,4DAAK,KAAK,EAAE,CAAA,YAAA,EAAe,IAAI,CAAC,IAAI,CAAI,CAAA,EAAA,IAAI,CAAC,mBAAmB,CAAA,CAAE,EAAQ,CAAA,EACpH,IAAI,CAAC,UAAU,KAAK,UAAU,KAC7B,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,4BAA4B,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAE,CAAA,SAAA,EAAY,IAAI,CAAC,IAAI,CAAE,CAAA,EAAA,EAC3H,CAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,WAAA,EAAa,qBAAqB,EAAA,EAChC,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,CAAC,EAAC,ukDAAukD,EACzkD,IAAI,EAAC,SAAS,EACd,CAAA,EACF,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,CAAC,EAAC,qEAAqE,EAAC,MAAM,EAAC,OAAO,EAAc,cAAA,EAAA,KAAK,EAAgB,gBAAA,EAAA,OAAO,EAAiB,iBAAA,EAAA,OAAO,GAAG,CAC/J,EACJ,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACE,CAAU,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAE,EAAC,eAAe,EAAA,EAC1B,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,IAAI,EAAC,OAAO,EAAA,CAAG,CACnC,CACN,CACH,CACP,EACA,IAAI,CAAC,UAAU,KAAK,SAAS,KAC5B,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,4BAA4B,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAE,CAAW,QAAA,EAAA,IAAI,CAAC,IAAI,EAAE,EAAA,EAC1H,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,CAAC,EAAC,4eAA4e,EAC9e,IAAI,EAAC,SAAS,EACd,MAAM,EAAC,OAAO,EAAA,cAAA,EACD,KAAK,EAClB,CAAA,EACF,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,WAAA,EACY,SAAS,EAAA,WAAA,EACT,SAAS,EACnB,CAAC,EAAC,29BAA29B,EAC79B,IAAI,EAAC,OAAO,EACZ,CAAA,CACE,CACP,CACG;SACP;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/gb-status-indicator/gb-status-indicator.css?tag=gb-status-indicator&encapsulation=shadow","src/components/gb-status-indicator/gb-status-indicator.tsx"],"sourcesContent":["@import './../../global/global.css';\r\n\r\n.online_icon{\r\n border: 1.5px solid var(--color-boarder-inverse, #FFFFFF);\r\n border-radius: var(--rounded-full);\r\n}\r\n\r\n/* Online Indicator States */\r\n.online_icon.offline{\r\n background-color: var(--color-background-gray, #CDD5DF);\r\n}\r\n\r\n.online_icon.online{\r\n background-color: var(--color-icon-success, #079455);\r\n}\r\n\r\n/* Online Indicator Sizes */\r\n.online_icon.xxs{\r\n width: 0.25rem;\r\n height: 0.25rem;\r\n}\r\n\r\n.online_icon.xs{\r\n width: 0.375rem;\r\n height: 0.375rem;\r\n}\r\n\r\n.online_icon.sm{\r\n width: var(--spacing-2);\r\n height: var(--spacing-2);\r\n}\r\n\r\n.online_icon.md{\r\n width: 0.625rem;\r\n height: 0.625rem;\r\n}\r\n\r\n.online_icon.lg{\r\n width: var(--spacing-3);\r\n height: var(--spacing-3);\r\n}\r\n\r\n.online_icon.xl{\r\n width: 0.875rem;\r\n height: 0.875rem;\r\n}\r\n\r\n.online_icon.xl2{\r\n width: var(--spacing-4);\r\n height: var(--spacing-4);\r\n}\r\n\r\n/* Verified Tick Sizes */\r\n.verified.xxs{\r\n width: 0.375rem;\r\n height: 0.375rem;\r\n}\r\n\r\n.verified.xs{\r\n width: 0.625rem;\r\n height: 0.625rem;\r\n}\r\n\r\n.verified.sm{\r\n width: var(--spacing-3);\r\n height: var(--spacing-3);\r\n}\r\n\r\n.verified.md{\r\n width: 0.875rem;\r\n height: 0.875rem;\r\n}\r\n\r\n.verified.lg{\r\n width: var(--spacing-4);\r\n height: var(--spacing-4);\r\n}\r\n\r\n.verified.xl{\r\n width: 1.125rem;\r\n height: 1.125rem;\r\n}\r\n\r\n.verified.xl2{\r\n width: var(--spacing-5);\r\n height: var(--spacing-5);\r\n}\r\n\r\n.verified.xl3{\r\n width: var(--spacing-6);\r\n height: var(--spacing-6);\r\n}\r\n\r\n.verified.xl4{\r\n width: var(--spacing-7);\r\n height: var(--spacing-7);\r\n}\r\n\r\n.verified.profile_sm{\r\n width: var(--spacing-5);\r\n height: var(--spacing-5);\r\n position: absolute;\r\n bottom: 0.15rem;\r\n right: 0.01rem;\r\n}\r\n\r\n.verified.profile_md{\r\n width: var(--spacing-6);\r\n height: var(--spacing-6);\r\n position: absolute;\r\n bottom: 0.25rem;\r\n right: 0.2rem;\r\n}\r\n\r\n.verified.profile_lg{\r\n width: var(--spacing-7);\r\n height: var(--spacing-7);\r\n position: absolute;\r\n bottom: 0.5rem;\r\n right: 0.2rem;\r\n}\r\n\r\n/* Company Icon Sizes */\r\n.company.xs{\r\n width: 0.25rem;\r\n height: 0.25rem;\r\n}\r\n\r\n.company.xs{\r\n width: 0.625rem;\r\n height: 0.625rem;\r\n}\r\n\r\n.company.sm{\r\n width: 0.75rem;\r\n height: var(--spacing-3);\r\n}\r\n\r\n.company.md{\r\n width: 0.875rem;\r\n height: 0.875rem;\r\n}\r\n\r\n.company.lg{\r\n width: 1rem;\r\n height: var(--spacing-4);\r\n}\r\n\r\n.company.xl{\r\n width: 1.125rem;\r\n height: 1.125rem;\r\n}\r\n\r\n.company.xl2{\r\n width: 1.25rem;\r\n height: var(--spacing-5);\r\n}","import { Component, h, Prop } from \"@stencil/core\";\r\nimport { GeneralSizes, OnlineIndicatorStates } from \"../../models/reusableModels\";\r\n\r\n@Component({\r\n tag: 'gb-status-indicator',\r\n styleUrl: 'gb-status-indicator.css',\r\n shadow: true\r\n})\r\n\r\nexport class GbStatusIndicator {\r\n @Prop() statusIcon: string = '';\r\n @Prop() size: GeneralSizes;\r\n @Prop() state: OnlineIndicatorStates = OnlineIndicatorStates.Offline;\r\n @Prop() indicatorStateClass: string = this.state;\r\n\r\n render() {\r\n return [\r\n <div>\r\n {this.statusIcon === 'online_indicator' && <div class={`online_icon ${this.size} ${this.indicatorStateClass}`}></div>}\r\n {this.statusIcon === 'verified' && (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\" class={`verified ${this.size}`}>\r\n <g clip-path=\"url(#clip0_0_21453)\">\r\n <path\r\n d=\"M24.7109 5.66715C25.0148 6.40217 25.5982 6.98642 26.3328 7.29145L28.9086 8.35837C29.6436 8.66285 30.2277 9.24688 30.5321 9.98196C30.8366 10.717 30.8366 11.543 30.5321 12.2781L29.466 14.852C29.1614 15.5874 29.1609 16.4142 29.467 17.1492L30.5313 19.7224C30.6822 20.0865 30.7599 20.4767 30.76 20.8708C30.7601 21.265 30.6825 21.6553 30.5316 22.0194C30.3808 22.3835 30.1597 22.7143 29.881 22.993C29.6022 23.2716 29.2713 23.4926 28.9072 23.6433L26.3332 24.7095C25.5982 25.0134 25.0139 25.5968 24.7089 26.3314L23.642 28.9071C23.3375 29.6422 22.7535 30.2262 22.0184 30.5307C21.2833 30.8352 20.4574 30.8352 19.7223 30.5307L17.1484 29.4646C16.4133 29.1608 15.5876 29.1614 14.853 29.4663L12.2772 30.5317C11.5425 30.8355 10.7173 30.8352 9.98284 30.531C9.24835 30.2267 8.66466 29.6434 8.35997 28.9091L7.29273 26.3326C6.98881 25.5975 6.40543 25.0133 5.67087 24.7083L3.09509 23.6413C2.36033 23.337 1.77648 22.7533 1.47188 22.0187C1.16729 21.284 1.16688 20.4585 1.47073 19.7235L2.53689 17.1496C2.84062 16.4145 2.84 15.5888 2.53517 14.8542L1.47054 12.2766C1.3196 11.9125 1.24188 11.5222 1.24181 11.1281C1.24175 10.734 1.31935 10.3437 1.47017 9.97956C1.621 9.61544 1.8421 9.2846 2.12083 9.00595C2.39957 8.72731 2.73047 8.50632 3.09465 8.35561L5.66858 7.28945C6.40297 6.98579 6.98687 6.40316 7.29212 5.66944L8.35904 3.09366C8.66352 2.35857 9.24754 1.77455 9.98263 1.47007C10.7177 1.16559 11.5436 1.16559 12.2787 1.47007L14.8527 2.53623C15.5878 2.83996 16.4134 2.83934 17.148 2.5345L19.7249 1.47172C20.4599 1.16741 21.2856 1.16748 22.0206 1.4719C22.7555 1.77632 23.3395 2.36017 23.644 3.09507L24.7112 5.67161L24.7109 5.66715Z\"\r\n fill=\"#0086C9\"\r\n />\r\n <path d=\"M10 18.1818C10 18.1818 11.2857 18.1818 13 22C13 22 17.7647 12 22 10\" stroke=\"white\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_0_21453\">\r\n <rect width=\"32\" height=\"32\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n )}\r\n {this.statusIcon === 'company' && (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" class={`company ${this.size}`}>\r\n <path\r\n d=\"M18.8322 3.70039C16.9123 2.11995 14.5039 1.25399 12.0172 1.25001C10.6041 1.24776 9.20439 1.52413 7.89818 2.06333C6.59198 2.60252 5.4049 3.39397 4.40485 4.39237C2.64504 6.1493 1.54876 8.462 1.30275 10.9365C1.05674 13.411 1.67622 15.8943 3.05566 17.9633C4.43511 20.0323 6.48919 21.5591 8.86802 22.2836C11.2469 23.0081 13.8033 22.8855 16.1019 21.9367C18.4004 20.9878 20.299 19.2715 21.474 17.0799C22.6491 14.8884 23.0281 12.3572 22.5464 9.91759C22.0647 7.47798 20.7521 5.28082 18.8322 3.70039Z\"\r\n fill=\"#FF0033\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n />\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M12.8942 13.7488V11.865L15.2835 11.8807C15.5231 11.8822 15.7598 11.9336 15.9785 12.0314C16.1973 12.1293 16.3933 12.2715 16.5541 12.449C16.715 12.6266 16.8373 12.8357 16.9131 13.063C16.989 13.2903 17.0168 13.5308 16.9948 13.7694C16.9948 16.4275 12.901 16.9969 12.8973 13.7488M12.8973 8.75316C17.3054 6.44066 17.6942 11.5213 15.0323 11.2788H12.886L12.8973 8.75316ZM16.7385 11.5113C19.8985 10.3013 17.2573 5.5894 12.0854 8.5044C11.5544 8.07132 10.9218 7.78073 10.2473 7.66004C8.96979 7.40066 7.25604 7.62628 6.29479 8.52378L6.75917 8.97941C7.2569 8.55053 7.86627 8.27194 8.51626 8.17611C9.16625 8.08028 9.83009 8.17117 10.4304 8.43816C10.6321 8.53335 10.8098 8.67262 10.9505 8.8457C11.0911 9.01879 11.191 9.22127 11.2429 9.43817L11.266 13.7669C11.0785 16.7738 7.20354 16.5413 7.20354 13.7669V11.8682H10.2492V11.295H5.59729V13.1644C5.60917 16.7175 9.93104 17.315 12.0717 15.5863C12.9471 16.2353 14.0184 16.5649 15.1073 16.52C18.9442 16.4938 19.7323 12.3563 16.7273 11.5144L16.7385 11.5113Z\"\r\n fill=\"white\"\r\n />\r\n </svg>\r\n )}\r\n </div>,\r\n ];\r\n }\r\n}"],"version":3}
|
|
1
|
+
{"file":"p-DmM0iRV2.js","mappings":";;;AAAA,MAAM,oBAAoB,GAAG,+mqEAA+mqE;;MCS/nqE,iBAAiB,iBAAAA,kBAAA,CAAA,MAAA,iBAAA,SAAAC,CAAA,CAAA;AAN9B,IAAA,WAAA,GAAA;;;;AAOY,QAAA,IAAU,CAAA,UAAA,GAAW,EAAE;AAEvB,QAAA,IAAA,CAAA,KAAK,GAA0B,qBAAqB,CAAC,OAAO;AAC5D,QAAA,IAAA,CAAA,mBAAmB,GAAW,IAAI,CAAC,KAAK;AAyCnD;IAvCG,MAAM,GAAA;QACF,OAAO;AACL,YAAA,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACG,IAAI,CAAC,UAAU,KAAK,kBAAkB,IAAI,4DAAK,KAAK,EAAE,CAAA,YAAA,EAAe,IAAI,CAAC,IAAI,CAAI,CAAA,EAAA,IAAI,CAAC,mBAAmB,CAAA,CAAE,EAAQ,CAAA,EACpH,IAAI,CAAC,UAAU,KAAK,UAAU,KAC7B,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,4BAA4B,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAE,CAAA,SAAA,EAAY,IAAI,CAAC,IAAI,CAAE,CAAA,EAAA,EAC3H,CAAA,CAAA,GAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,WAAA,EAAa,qBAAqB,EAAA,EAChC,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,CAAC,EAAC,ukDAAukD,EACzkD,IAAI,EAAC,SAAS,EACd,CAAA,EACF,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,CAAC,EAAC,qEAAqE,EAAC,MAAM,EAAC,OAAO,EAAc,cAAA,EAAA,KAAK,EAAgB,gBAAA,EAAA,OAAO,EAAiB,iBAAA,EAAA,OAAO,GAAG,CAC/J,EACJ,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACE,CAAU,CAAA,UAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EAAE,EAAC,eAAe,EAAA,EAC1B,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAM,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,IAAI,EAAC,OAAO,EAAA,CAAG,CACnC,CACN,CACH,CACP,EACA,IAAI,CAAC,UAAU,KAAK,SAAS,KAC5B,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,4BAA4B,EAAC,KAAK,EAAC,IAAI,EAAC,MAAM,EAAC,IAAI,EAAC,OAAO,EAAC,WAAW,EAAC,IAAI,EAAC,MAAM,EAAC,KAAK,EAAE,CAAW,QAAA,EAAA,IAAI,CAAC,IAAI,EAAE,EAAA,EAC1H,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,CAAC,EAAC,4eAA4e,EAC9e,IAAI,EAAC,SAAS,EACd,MAAM,EAAC,OAAO,EAAA,cAAA,EACD,KAAK,EAClB,CAAA,EACF,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,WAAA,EACY,SAAS,EAAA,WAAA,EACT,SAAS,EACnB,CAAC,EAAC,29BAA29B,EAC79B,IAAI,EAAC,OAAO,EACZ,CAAA,CACE,CACP,CACG;SACP;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/gb-status-indicator/gb-status-indicator.css?tag=gb-status-indicator&encapsulation=shadow","src/components/gb-status-indicator/gb-status-indicator.tsx"],"sourcesContent":["@import './../../global/global.css';\r\n\r\n.online_icon{\r\n border: 1.5px solid var(--color-boarder-inverse, #FFFFFF);\r\n border-radius: var(--rounded-full);\r\n}\r\n\r\n/* Online Indicator States */\r\n.online_icon.offline{\r\n background-color: var(--color-background-gray, #CDD5DF);\r\n}\r\n\r\n.online_icon.online{\r\n background-color: var(--color-icon-success, #079455);\r\n}\r\n\r\n/* Online Indicator Sizes */\r\n.online_icon.xxs{\r\n width: 0.25rem;\r\n height: 0.25rem;\r\n}\r\n\r\n.online_icon.xs{\r\n width: 0.375rem;\r\n height: 0.375rem;\r\n}\r\n\r\n.online_icon.sm{\r\n width: var(--spacing-2);\r\n height: var(--spacing-2);\r\n}\r\n\r\n.online_icon.md{\r\n width: 0.625rem;\r\n height: 0.625rem;\r\n}\r\n\r\n.online_icon.lg{\r\n width: var(--spacing-3);\r\n height: var(--spacing-3);\r\n}\r\n\r\n.online_icon.xl{\r\n width: 0.875rem;\r\n height: 0.875rem;\r\n}\r\n\r\n.online_icon.xl2{\r\n width: var(--spacing-4);\r\n height: var(--spacing-4);\r\n}\r\n\r\n/* Verified Tick Sizes */\r\n.verified.xxs{\r\n width: 0.375rem;\r\n height: 0.375rem;\r\n}\r\n\r\n.verified.xs{\r\n width: 0.625rem;\r\n height: 0.625rem;\r\n}\r\n\r\n.verified.sm{\r\n width: var(--spacing-3);\r\n height: var(--spacing-3);\r\n}\r\n\r\n.verified.md{\r\n width: 0.875rem;\r\n height: 0.875rem;\r\n}\r\n\r\n.verified.lg{\r\n width: var(--spacing-4);\r\n height: var(--spacing-4);\r\n}\r\n\r\n.verified.xl{\r\n width: 1.125rem;\r\n height: 1.125rem;\r\n}\r\n\r\n.verified.xl2{\r\n width: var(--spacing-5);\r\n height: var(--spacing-5);\r\n}\r\n\r\n.verified.xl3{\r\n width: var(--spacing-6);\r\n height: var(--spacing-6);\r\n}\r\n\r\n.verified.xl4{\r\n width: var(--spacing-7);\r\n height: var(--spacing-7);\r\n}\r\n\r\n.verified.profile_sm{\r\n width: var(--spacing-5);\r\n height: var(--spacing-5);\r\n position: absolute;\r\n bottom: 0.15rem;\r\n right: 0.01rem;\r\n}\r\n\r\n.verified.profile_md{\r\n width: var(--spacing-6);\r\n height: var(--spacing-6);\r\n position: absolute;\r\n bottom: 0.25rem;\r\n right: 0.2rem;\r\n}\r\n\r\n.verified.profile_lg{\r\n width: var(--spacing-7);\r\n height: var(--spacing-7);\r\n position: absolute;\r\n bottom: 0.5rem;\r\n right: 0.2rem;\r\n}\r\n\r\n/* Company Icon Sizes */\r\n.company.xs{\r\n width: 0.25rem;\r\n height: 0.25rem;\r\n}\r\n\r\n.company.xs{\r\n width: 0.625rem;\r\n height: 0.625rem;\r\n}\r\n\r\n.company.sm{\r\n width: 0.75rem;\r\n height: var(--spacing-3);\r\n}\r\n\r\n.company.md{\r\n width: 0.875rem;\r\n height: 0.875rem;\r\n}\r\n\r\n.company.lg{\r\n width: 1rem;\r\n height: var(--spacing-4);\r\n}\r\n\r\n.company.xl{\r\n width: 1.125rem;\r\n height: 1.125rem;\r\n}\r\n\r\n.company.xl2{\r\n width: 1.25rem;\r\n height: var(--spacing-5);\r\n}","import { Component, h, Prop } from \"@stencil/core\";\r\nimport { GeneralSizes, OnlineIndicatorStates } from \"../../models/reusableModels\";\r\n\r\n@Component({\r\n tag: 'gb-status-indicator',\r\n styleUrl: 'gb-status-indicator.css',\r\n shadow: true\r\n})\r\n\r\nexport class GbStatusIndicator {\r\n @Prop() statusIcon: string = '';\r\n @Prop() size: GeneralSizes;\r\n @Prop() state: OnlineIndicatorStates = OnlineIndicatorStates.Offline;\r\n @Prop() indicatorStateClass: string = this.state;\r\n\r\n render() {\r\n return [\r\n <div>\r\n {this.statusIcon === 'online_indicator' && <div class={`online_icon ${this.size} ${this.indicatorStateClass}`}></div>}\r\n {this.statusIcon === 'verified' && (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"32\" height=\"32\" viewBox=\"0 0 32 32\" fill=\"none\" class={`verified ${this.size}`}>\r\n <g clip-path=\"url(#clip0_0_21453)\">\r\n <path\r\n d=\"M24.7109 5.66715C25.0148 6.40217 25.5982 6.98642 26.3328 7.29145L28.9086 8.35837C29.6436 8.66285 30.2277 9.24688 30.5321 9.98196C30.8366 10.717 30.8366 11.543 30.5321 12.2781L29.466 14.852C29.1614 15.5874 29.1609 16.4142 29.467 17.1492L30.5313 19.7224C30.6822 20.0865 30.7599 20.4767 30.76 20.8708C30.7601 21.265 30.6825 21.6553 30.5316 22.0194C30.3808 22.3835 30.1597 22.7143 29.881 22.993C29.6022 23.2716 29.2713 23.4926 28.9072 23.6433L26.3332 24.7095C25.5982 25.0134 25.0139 25.5968 24.7089 26.3314L23.642 28.9071C23.3375 29.6422 22.7535 30.2262 22.0184 30.5307C21.2833 30.8352 20.4574 30.8352 19.7223 30.5307L17.1484 29.4646C16.4133 29.1608 15.5876 29.1614 14.853 29.4663L12.2772 30.5317C11.5425 30.8355 10.7173 30.8352 9.98284 30.531C9.24835 30.2267 8.66466 29.6434 8.35997 28.9091L7.29273 26.3326C6.98881 25.5975 6.40543 25.0133 5.67087 24.7083L3.09509 23.6413C2.36033 23.337 1.77648 22.7533 1.47188 22.0187C1.16729 21.284 1.16688 20.4585 1.47073 19.7235L2.53689 17.1496C2.84062 16.4145 2.84 15.5888 2.53517 14.8542L1.47054 12.2766C1.3196 11.9125 1.24188 11.5222 1.24181 11.1281C1.24175 10.734 1.31935 10.3437 1.47017 9.97956C1.621 9.61544 1.8421 9.2846 2.12083 9.00595C2.39957 8.72731 2.73047 8.50632 3.09465 8.35561L5.66858 7.28945C6.40297 6.98579 6.98687 6.40316 7.29212 5.66944L8.35904 3.09366C8.66352 2.35857 9.24754 1.77455 9.98263 1.47007C10.7177 1.16559 11.5436 1.16559 12.2787 1.47007L14.8527 2.53623C15.5878 2.83996 16.4134 2.83934 17.148 2.5345L19.7249 1.47172C20.4599 1.16741 21.2856 1.16748 22.0206 1.4719C22.7555 1.77632 23.3395 2.36017 23.644 3.09507L24.7112 5.67161L24.7109 5.66715Z\"\r\n fill=\"#0086C9\"\r\n />\r\n <path d=\"M10 18.1818C10 18.1818 11.2857 18.1818 13 22C13 22 17.7647 12 22 10\" stroke=\"white\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\" />\r\n </g>\r\n <defs>\r\n <clipPath id=\"clip0_0_21453\">\r\n <rect width=\"32\" height=\"32\" fill=\"white\" />\r\n </clipPath>\r\n </defs>\r\n </svg>\r\n )}\r\n {this.statusIcon === 'company' && (\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewBox=\"0 0 24 24\" fill=\"none\" class={`company ${this.size}`}>\r\n <path\r\n d=\"M18.8322 3.70039C16.9123 2.11995 14.5039 1.25399 12.0172 1.25001C10.6041 1.24776 9.20439 1.52413 7.89818 2.06333C6.59198 2.60252 5.4049 3.39397 4.40485 4.39237C2.64504 6.1493 1.54876 8.462 1.30275 10.9365C1.05674 13.411 1.67622 15.8943 3.05566 17.9633C4.43511 20.0323 6.48919 21.5591 8.86802 22.2836C11.2469 23.0081 13.8033 22.8855 16.1019 21.9367C18.4004 20.9878 20.299 19.2715 21.474 17.0799C22.6491 14.8884 23.0281 12.3572 22.5464 9.91759C22.0647 7.47798 20.7521 5.28082 18.8322 3.70039Z\"\r\n fill=\"#FF0033\"\r\n stroke=\"white\"\r\n stroke-width=\"1.5\"\r\n />\r\n <path\r\n fill-rule=\"evenodd\"\r\n clip-rule=\"evenodd\"\r\n d=\"M12.8942 13.7488V11.865L15.2835 11.8807C15.5231 11.8822 15.7598 11.9336 15.9785 12.0314C16.1973 12.1293 16.3933 12.2715 16.5541 12.449C16.715 12.6266 16.8373 12.8357 16.9131 13.063C16.989 13.2903 17.0168 13.5308 16.9948 13.7694C16.9948 16.4275 12.901 16.9969 12.8973 13.7488M12.8973 8.75316C17.3054 6.44066 17.6942 11.5213 15.0323 11.2788H12.886L12.8973 8.75316ZM16.7385 11.5113C19.8985 10.3013 17.2573 5.5894 12.0854 8.5044C11.5544 8.07132 10.9218 7.78073 10.2473 7.66004C8.96979 7.40066 7.25604 7.62628 6.29479 8.52378L6.75917 8.97941C7.2569 8.55053 7.86627 8.27194 8.51626 8.17611C9.16625 8.08028 9.83009 8.17117 10.4304 8.43816C10.6321 8.53335 10.8098 8.67262 10.9505 8.8457C11.0911 9.01879 11.191 9.22127 11.2429 9.43817L11.266 13.7669C11.0785 16.7738 7.20354 16.5413 7.20354 13.7669V11.8682H10.2492V11.295H5.59729V13.1644C5.60917 16.7175 9.93104 17.315 12.0717 15.5863C12.9471 16.2353 14.0184 16.5649 15.1073 16.52C18.9442 16.4938 19.7323 12.3563 16.7273 11.5144L16.7385 11.5113Z\"\r\n fill=\"white\"\r\n />\r\n </svg>\r\n )}\r\n </div>,\r\n ];\r\n }\r\n}"],"version":3}
|