admins-components 9.0.85 → 9.0.87
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/admins-components103.js +123 -118
- package/dist/admins-components103.js.map +1 -1
- package/dist/admins-components105.js.map +1 -1
- package/dist/admins-components60.js +1 -0
- package/dist/admins-components60.js.map +1 -1
- package/dist/admins-components68.js +7 -4
- package/dist/admins-components68.js.map +1 -1
- package/dist/admins-components70.js.map +1 -1
- package/dist/admins-components71.js +5 -2
- package/dist/admins-components71.js.map +1 -1
- package/dist/admins-components73.js.map +1 -1
- package/dist/admins-components75.js +103 -77
- package/dist/admins-components75.js.map +1 -1
- package/dist/admins-components77.js.map +1 -1
- package/dist/admins-components80.js +49 -48
- package/dist/admins-components80.js.map +1 -1
- package/dist/admins-components82.js.map +1 -1
- package/dist/src/components/data-table/DataCards.vue.d.ts +4 -4
- package/dist/src/components/data-table/DataList.vue.d.ts +4 -0
- package/dist/src/components/data-table/DataPaginator.vue.d.ts +3 -0
- package/dist/src/components/data-table/DataTable.vue.d.ts +4 -4
- package/dist/src/types/data-list.d.ts +2 -1
- package/dist/styles/components/data-table/data-cards.scss_vue_type_style_index_0_src_true_lang.css +1 -1
- package/dist/styles/components/data-table/data-list-options.scss_vue_type_style_index_0_src_true_lang.css +1 -1
- package/dist/styles/components/data-table/data-list.scss_vue_type_style_index_0_src_true_lang.css +1 -1
- package/dist/styles/components/data-table/data-paginator.scss_vue_type_style_index_0_src_true_lang.css +1 -1
- package/dist/styles/components/data-table/data-table.scss_vue_type_style_index_0_src_true_lang.css +1 -1
- package/dist/test.html +162 -162
- package/dist/test81.html +160 -160
- package/dist/widget.css +1 -1
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { DataListConfig,
|
|
1
|
+
import { DataListConfig, DataListSettings } from '../../types/data-list';
|
|
2
2
|
export type { LayoutMode, DataListConfig, DataListSettings, DataTableSettings, DataCardsSettings, Column, Sort, Action, ActionGroup, FilterConfig, FilterValue, } from '../../types/data-list';
|
|
3
3
|
export { dataTableSettingsDefaults, dataCardsSettingsDefaults, dataListSettingsDefaults, } from '../../types/data-list';
|
|
4
4
|
declare const _default: typeof __VLS_export;
|
|
@@ -6,7 +6,7 @@ export default _default;
|
|
|
6
6
|
declare const __VLS_export: __VLS_WithSlots<import('vue').DefineComponent<{
|
|
7
7
|
config: DataListConfig;
|
|
8
8
|
items: Record<string, unknown>[];
|
|
9
|
-
settings?:
|
|
9
|
+
settings?: Partial<DataListSettings>;
|
|
10
10
|
loading?: boolean;
|
|
11
11
|
initialSort?: {
|
|
12
12
|
key: string;
|
|
@@ -21,7 +21,7 @@ declare const __VLS_export: __VLS_WithSlots<import('vue').DefineComponent<{
|
|
|
21
21
|
}, string, import('vue').PublicProps, Readonly<{
|
|
22
22
|
config: DataListConfig;
|
|
23
23
|
items: Record<string, unknown>[];
|
|
24
|
-
settings?:
|
|
24
|
+
settings?: Partial<DataListSettings>;
|
|
25
25
|
loading?: boolean;
|
|
26
26
|
initialSort?: {
|
|
27
27
|
key: string;
|
|
@@ -35,7 +35,7 @@ declare const __VLS_export: __VLS_WithSlots<import('vue').DefineComponent<{
|
|
|
35
35
|
}) => any) | undefined;
|
|
36
36
|
}>, {
|
|
37
37
|
loading: boolean;
|
|
38
|
-
settings:
|
|
38
|
+
settings: Partial<DataListSettings>;
|
|
39
39
|
initialSort: {
|
|
40
40
|
key: string;
|
|
41
41
|
direction: "desc" | "asc";
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { DropdownOption } from '../components/DropdownSelect.vue';
|
|
2
|
-
import { PickedDate, PickedUtcRange } from './types';
|
|
2
|
+
import { ControlSize, PickedDate, PickedUtcRange } from './types';
|
|
3
3
|
import { ButtonType } from '../components/Button.vue';
|
|
4
4
|
import { ConfirmModalProps } from '../components/ConfirmModal.vue';
|
|
5
5
|
export type FilterValue = string | PickedDate | PickedUtcRange | string[] | null | undefined;
|
|
@@ -24,6 +24,7 @@ export interface DataListSettings extends DataTableSettings, DataCardsSettings {
|
|
|
24
24
|
columnOrder: string[];
|
|
25
25
|
cardHeaderOrder: string[];
|
|
26
26
|
filtersEager: boolean;
|
|
27
|
+
fontSize: ControlSize;
|
|
27
28
|
}
|
|
28
29
|
export interface PageSettings {
|
|
29
30
|
page: number;
|
package/dist/styles/components/data-table/data-cards.scss_vue_type_style_index_0_src_true_lang.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.ac-component .c-cards-wrapper,.ac-component.c-cards-wrapper{max-height:var(--data-list-max-height,75dvh);-webkit-overflow-scrolling:touch;position:relative;overflow:auto}.c-data-list--fill-height>.ac-component .c-cards-wrapper,.c-data-list--fill-height>.ac-component.c-cards-wrapper{flex:auto;height:auto;min-height:0;max-height:none}.ac-component .c-cards-wrapper.is-loading,.ac-component.c-cards-wrapper.is-loading{touch-action:none;overflow:hidden}.ac-component .c-cards-wrapper.is-loading .c-cards,.ac-component.c-cards-wrapper.is-loading .c-cards{opacity:.45;transition:opacity .15s ease-out}.ac-component .c-cards-wrapper .c-cards,.ac-component.c-cards-wrapper .c-cards{border-top:2px solid var(--neutral-200);border-bottom:2px solid var(--neutral-200);flex-direction:column;gap:.5rem;padding:.5rem 0;font-size:1rem;display:flex}.ac-component .c-cards-wrapper .c-cards button,.ac-component.c-cards-wrapper .c-cards button{font-size:inherit}.ac-component .c-cards-wrapper .c-cards.is-compact,.ac-component.c-cards-wrapper .c-cards.is-compact{gap:.25rem
|
|
1
|
+
.ac-component .c-cards-wrapper,.ac-component.c-cards-wrapper{max-height:var(--data-list-max-height,75dvh);-webkit-overflow-scrolling:touch;position:relative;overflow:auto}.c-data-list--fill-height>.ac-component .c-cards-wrapper,.c-data-list--fill-height>.ac-component.c-cards-wrapper{flex:auto;height:auto;min-height:0;max-height:none}.ac-component .c-cards-wrapper.is-loading,.ac-component.c-cards-wrapper.is-loading{touch-action:none;overflow:hidden}.ac-component .c-cards-wrapper.is-loading .c-cards,.ac-component.c-cards-wrapper.is-loading .c-cards{opacity:.45;transition:opacity .15s ease-out}.ac-component .c-cards-wrapper.is-font-small .c-cards,.ac-component.c-cards-wrapper.is-font-small .c-cards{font-size:.875rem}.ac-component .c-cards-wrapper.is-font-normal .c-cards,.ac-component.c-cards-wrapper.is-font-normal .c-cards{font-size:1rem}.ac-component .c-cards-wrapper.is-font-large .c-cards,.ac-component.c-cards-wrapper.is-font-large .c-cards{font-size:1.125rem}.ac-component .c-cards-wrapper .c-cards,.ac-component.c-cards-wrapper .c-cards{border-top:2px solid var(--neutral-200);border-bottom:2px solid var(--neutral-200);flex-direction:column;gap:.5rem;padding:.5rem 0;font-size:1rem;display:flex}.ac-component .c-cards-wrapper .c-cards button,.ac-component.c-cards-wrapper .c-cards button{font-size:inherit}.ac-component .c-cards-wrapper .c-cards.is-compact,.ac-component.c-cards-wrapper .c-cards.is-compact{gap:.25rem}.ac-component .c-cards-wrapper .c-cards.is-compact .c-card__header,.ac-component.c-cards-wrapper .c-cards.is-compact .c-card__header{--header-padding-y:.375rem}.ac-component .c-cards-wrapper .c-cards.is-compact .c-card__label,.ac-component.c-cards-wrapper .c-cards.is-compact .c-card__label{font-size:.675rem}.ac-component .c-cards-wrapper .c-cards.is-compact .c-card__title,.ac-component.c-cards-wrapper .c-cards.is-compact .c-card__title{font-size:inherit}.ac-component .c-cards-wrapper .c-cards.is-compact .c-card__field,.ac-component.c-cards-wrapper .c-cards.is-compact .c-card__field{min-height:unset;padding-top:.5rem;padding-bottom:.375rem}.ac-component .c-cards-wrapper .c-cards.is-compact .c-card__body,.ac-component.c-cards-wrapper .c-cards.is-compact .c-card__body{row-gap:.5rem;padding-bottom:.5rem}.ac-component .c-cards-wrapper .c-cards.is-compact .c-card__actions,.ac-component.c-cards-wrapper .c-cards.is-compact .c-card__actions{padding-top:0}.ac-component .c-cards-wrapper .c-cards__loading-wrap,.ac-component.c-cards-wrapper .c-cards__loading-wrap{border-top:2px solid var(--neutral-200);border-bottom:2px solid var(--neutral-200);justify-content:center;align-items:center;width:100%;padding:2rem;display:flex}.ac-component .c-cards-wrapper .c-cards__backdrop,.ac-component.c-cards-wrapper .c-cards__backdrop{z-index:1;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);pointer-events:none;background:#fff9;justify-content:center;align-items:center;animation:.15s ease-out c-cards-backdrop-in;display:flex;position:absolute;inset:0}.ac-component .c-cards-wrapper .c-card,.ac-component.c-cards-wrapper .c-card{border:1px solid var(--neutral-200);background:var(--neutral-0);border-radius:.75rem;transition:border-color .15s,box-shadow .15s}.ac-component .c-cards-wrapper .c-card.is-open,.ac-component.c-cards-wrapper .c-card.is-open{border-color:var(--premium-500)}.ac-component .c-cards-wrapper .c-card.is-open .c-card__header,.ac-component.c-cards-wrapper .c-card.is-open .c-card__header{background:var(--premium-50)}.ac-component .c-cards-wrapper .c-card.is-open .c-card__header:hover,.ac-component.c-cards-wrapper .c-card.is-open .c-card__header:hover{background:var(--premium-100)}.ac-component .c-cards-wrapper .c-card.is-open .c-card__icon,.ac-component.c-cards-wrapper .c-card.is-open .c-card__icon{transform:rotate(180deg)}.ac-component .c-cards-wrapper .c-card.is-selected,.ac-component.c-cards-wrapper .c-card.is-selected{border-color:var(--premium-400);box-shadow:0 0 0 1px var(--premium-200)}.ac-component .c-cards-wrapper .c-card.is-selected .c-card__header,.ac-component.c-cards-wrapper .c-card.is-selected .c-card__header{background:var(--site-100)}.ac-component .c-cards-wrapper .c-card.is-selected .c-card__header:hover,.ac-component.c-cards-wrapper .c-card.is-selected .c-card__header:hover{background:var(--site-200)}.ac-component .c-cards-wrapper .c-card__header,.ac-component.c-cards-wrapper .c-card__header{--header-padding-y:.75rem;--header-padding-x:.75rem;width:100%;padding:var(--header-padding-y) var(--header-padding-x);border-radius:inherit;background:var(--neutral-50);color:inherit;text-align:left;cursor:pointer;border:0;align-items:center;gap:.5rem;line-height:1.2;transition:background-color .15s;display:flex}.ac-component .c-cards-wrapper .c-card__header:hover,.ac-component.c-cards-wrapper .c-card__header:hover{background:var(--premium-100)}.ac-component .c-cards-wrapper .c-card__check-zone,.ac-component.c-cards-wrapper .c-card__check-zone{padding:0 .5rem 0 var(--header-padding-x);margin:calc(-1 * var(--header-padding-y)) -.5rem calc(-1 * var(--header-padding-y)) calc(-1 * var(--header-padding-x));align-self:stretch;align-items:center;display:flex}.ac-component .c-cards-wrapper .c-card__check-zone .c-checkbox,.ac-component.c-cards-wrapper .c-card__check-zone .c-checkbox{width:1.25rem;height:1.25rem}.ac-component .c-cards-wrapper .c-card__heading,.ac-component.c-cards-wrapper .c-card__heading{flex-direction:row;flex:auto;gap:.5rem;min-width:0;display:flex}.ac-component .c-cards-wrapper .c-card__heading-item,.ac-component.c-cards-wrapper .c-card__heading-item{flex-direction:column;flex:1 1 0;min-width:0;display:flex}.ac-component .c-cards-wrapper .c-card__heading-item.primary,.ac-component.c-cards-wrapper .c-card__heading-item.primary{flex:2 1 0}.ac-component .c-cards-wrapper .c-card__label,.ac-component.c-cards-wrapper .c-card__label{color:var(--neutral-600);text-transform:uppercase;letter-spacing:.03em;font-size:.75rem;font-weight:700}.ac-component .c-cards-wrapper .c-card__title,.ac-component.c-cards-wrapper .c-card__title{color:var(--neutral-800);font-weight:600}.ac-component .c-cards-wrapper .c-card__icon,.ac-component.c-cards-wrapper .c-card__icon{margin:calc(-1 * var(--header-padding-y)) calc(-1 * var(--header-padding-x)) calc(-1 * var(--header-padding-y)) 0;color:var(--neutral-700);cursor:pointer;justify-content:center;align-self:stretch;align-items:center;padding:0 .75rem;transition:transform .2s;display:flex}.ac-component .c-cards-wrapper .c-card__body,.ac-component.c-cards-wrapper .c-card__body{--field-gap-x:.375rem;gap:.75rem var(--field-gap-x);flex-wrap:wrap;padding:.625rem;display:flex;container-type:inline-size}.ac-component .c-cards-wrapper .c-card__field,.ac-component.c-cards-wrapper .c-card__field{flex:1 1 calc(50% - .5 * var(--field-gap-x));border:1px solid var(--neutral-200);border-radius:8px;align-items:center;min-height:2.5rem;padding:.5rem;display:flex;position:relative}.ac-component .c-cards-wrapper .c-card__field:hover .c-copy-btn,.ac-component.c-cards-wrapper .c-card__field:hover .c-copy-btn{opacity:1}.ac-component .c-cards-wrapper .c-card__field-value,.ac-component.c-cards-wrapper .c-card__field-value{overflow-wrap:break-word;word-break:break-word;flex:1}.ac-component .c-cards-wrapper .c-card__field-label,.ac-component.c-cards-wrapper .c-card__field-label{letter-spacing:.02em;background:var(--neutral-0);color:var(--neutral-600);padding:0 .125rem;font-weight:700;position:absolute;top:-.5lh;left:.5rem}.ac-component .c-cards-wrapper .c-card__field .c-copy-btn,.ac-component.c-cards-wrapper .c-card__field .c-copy-btn{opacity:0}.ac-component .c-cards-wrapper .c-card__field-copy,.ac-component.c-cards-wrapper .c-card__field-copy{background:var(--neutral-0);padding:.125rem;position:absolute;top:-.625lh;right:.375rem}.ac-component .c-cards-wrapper .c-card__field-copy:hover,.ac-component.c-cards-wrapper .c-card__field-copy:hover{color:var(--premium-600);background:var(--background-100)}@media (hover:none),(pointer:coarse){.ac-component .c-cards-wrapper .c-card__field:focus-within,.ac-component .c-cards-wrapper .c-card__field:hover,.ac-component.c-cards-wrapper .c-card__field:focus-within,.ac-component.c-cards-wrapper .c-card__field:hover{border-color:var(--neutral-300)}.ac-component .c-cards-wrapper .c-card__field:focus-within .c-card__field-copy,.ac-component .c-cards-wrapper .c-card__field:hover .c-card__field-copy,.ac-component.c-cards-wrapper .c-card__field:focus-within .c-card__field-copy,.ac-component.c-cards-wrapper .c-card__field:hover .c-card__field-copy{opacity:1}}.ac-component .c-cards-wrapper .c-card__actions,.ac-component.c-cards-wrapper .c-card__actions{flex-wrap:wrap;flex:100%;justify-content:space-around;align-items:center;gap:.5rem;padding-top:.25rem;display:flex}@keyframes c-cards-backdrop-in{0%{opacity:0}to{opacity:1}}@container (width<=526px){.ac-component .c-cards-wrapper .c-card__field,.ac-component.c-cards-wrapper .c-card__field{flex-basis:100%}}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.ac-component .list-options{grid-template-columns:1fr 1fr;gap:1rem;display:grid}.ac-component .list-options__col{min-width:0}.ac-component .list-options__title{text-transform:uppercase;letter-spacing:.03em;color:var(--neutral-600);margin:0 0 .25rem;font-size:.8rem;font-weight:600}.ac-component .list-options__title-value{text-transform:none;letter-spacing:0;color:var(--neutral-500);font-weight:400}.ac-component .list-options__list{flex-direction:column;gap:0;margin:0;padding:0;list-style:none;display:flex}.ac-component .list-options__item{cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:3px;align-items:center;gap:.4rem;padding:.2rem .25rem;font-size:.85rem;display:flex}.ac-component .list-options__item:hover{background:var(--neutral-100)}.ac-component .list-options__item--disabled{opacity:.5;cursor:not-allowed}.ac-component .list-options__item--disabled .c-checkbox{pointer-events:none}.ac-component .list-options__item--selected{background:var(--premium-100);border-radius:4px}.ac-component .list-options__item--dragging{opacity:.4}.ac-component .list-options__drag-handle{cursor:grab;color:#aaa;font-size:.7rem}.ac-component .list-options__drag-handle:active{cursor:grabbing}.ac-component .list-options__toggle{cursor:pointer;flex:1;align-items:center;gap:.5rem;min-width:0;padding:.25rem 0;display:flex}.ac-component .list-options__move-actions{gap:.5rem;margin-top:.5rem;display:flex}.ac-component .list-options__move-btn{border:1px solid var(--neutral-200);background:var(--neutral-0);width:2.5rem;height:2.5rem;color:var(--neutral-700);cursor:pointer;border-radius:8px;justify-content:center;align-items:center;font-size:1rem;transition:background-color .15s,color .15s;display:flex}.ac-component .list-options__move-btn:hover:not(:disabled){background:var(--premium-100);color:var(--premium-600)}.ac-component .list-options__move-btn:disabled{opacity:.3;cursor:not-allowed}.ac-component .list-options .layout-switch{border:1px solid var(--neutral-200);border-radius:6px;margin-top:.25rem;display:inline-flex;position:relative}.ac-component .list-options .layout-switch__btn{background:var(--background-50);color:var(--neutral-600);cursor:pointer;border:none;justify-content:center;align-items:center;padding:.
|
|
1
|
+
.ac-component .list-options{grid-template-columns:1fr 1fr;gap:1rem;display:grid}.ac-component .list-options__col{min-width:0}.ac-component .list-options__col--full{grid-column:1/-1;width:100%}.ac-component .list-options__title{text-transform:uppercase;letter-spacing:.03em;color:var(--neutral-600);margin:0 0 .25rem;font-size:.8rem;font-weight:600}.ac-component .list-options__title-value{text-transform:none;letter-spacing:0;color:var(--neutral-500);font-weight:400}.ac-component .list-options__list{flex-direction:column;gap:0;margin:0;padding:0;list-style:none;display:flex}.ac-component .list-options__item{cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:3px;align-items:center;gap:.4rem;padding:.2rem .25rem;font-size:.85rem;display:flex}.ac-component .list-options__item:hover{background:var(--neutral-100)}.ac-component .list-options__item--disabled{opacity:.5;cursor:not-allowed}.ac-component .list-options__item--disabled .c-checkbox{pointer-events:none}.ac-component .list-options__item--selected{background:var(--premium-100);border-radius:4px}.ac-component .list-options__item--dragging{opacity:.4}.ac-component .list-options__drag-handle{cursor:grab;color:#aaa;font-size:.7rem}.ac-component .list-options__drag-handle:active{cursor:grabbing}.ac-component .list-options__toggle{cursor:pointer;flex:1;align-items:center;gap:.5rem;min-width:0;padding:.25rem 0;display:flex}.ac-component .list-options__move-actions{gap:.5rem;margin-top:.5rem;display:flex}.ac-component .list-options__move-btn{border:1px solid var(--neutral-200);background:var(--neutral-0);width:2.5rem;height:2.5rem;color:var(--neutral-700);cursor:pointer;border-radius:8px;justify-content:center;align-items:center;font-size:1rem;transition:background-color .15s,color .15s;display:flex}.ac-component .list-options__move-btn:hover:not(:disabled){background:var(--premium-100);color:var(--premium-600)}.ac-component .list-options__move-btn:disabled{opacity:.3;cursor:not-allowed}.ac-component .list-options .layout-switch{border:1px solid var(--neutral-200);border-radius:6px;margin-top:.25rem;display:inline-flex;position:relative}.ac-component .list-options .layout-switch__btn{background:var(--background-50);color:var(--neutral-600);cursor:pointer;border:none;justify-content:center;align-items:center;padding:.45rem .75rem;font-size:.85rem;transition:all .15s;display:flex}.ac-component .list-options .layout-switch__btn:first-child{border-radius:5px 0 0 5px}.ac-component .list-options .layout-switch__btn:last-child{border-radius:0 5px 5px 0}.ac-component .list-options .layout-switch__btn:not(:last-child){border-right:1px solid var(--neutral-200)}.ac-component .list-options .layout-switch__btn:hover:not(.ac-component .list-options .layout-switch__btn--active){background:var(--neutral-100);color:var(--neutral-700)}.ac-component .list-options .layout-switch__btn--active{background:var(--ac-color-primary);color:var(--neutral-0)}.ac-component .list-options-footer{justify-content:space-between;align-items:center;display:flex}
|
package/dist/styles/components/data-table/data-list.scss_vue_type_style_index_0_src_true_lang.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.ac-component .c-data-list{width:100%;min-width:0
|
|
1
|
+
.ac-component .c-data-list{width:100%;min-width:0}.ac-component .c-data-list--fill-height{--data-list-max-height:none;flex-direction:column;flex:auto;min-height:0;display:flex}.ac-component .c-data-list--fill-height>.c-table-wrapper{flex:auto;height:auto;min-height:0;max-height:none}.ac-component .c-data-list__toolbar{padding-inline:.5rem;align-items:center;gap:.5rem;margin-bottom:.5rem;padding-top:.5rem;display:flex}@media (width<=1024px){.ac-component .c-data-list__toolbar{flex-wrap:wrap;padding-inline:.25rem}.ac-component .c-data-list__toolbar .flex-center-wrap-on-mobile{flex-basis:100%;order:99}}.ac-component .c-data-list__toolbar .settings-btn .fa-gear{margin-inline:-1px}.ac-component .c-data-list__toolbar__right{white-space:nowrap;align-items:center;gap:.5rem;margin-left:auto;display:flex}@media (width<=1280px){.ac-component .c-data-list__toolbar__right{gap:.25rem}}.ac-component .c-data-list .dc-datetime{white-space:normal;display:inline}.ac-component .c-data-list .dc-datetime__part{white-space:nowrap}.ac-component .c-data-list .dc-datetime__sep{white-space:normal;width:.25em;display:inline-block}.ac-component .c-data-list .dc-loading{pointer-events:none;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.c-paginator-wrapper{padding-top:.25rem;container:paginator/inline-size}.c-paginator{background:var(--neutral-50);grid-template-columns:1fr auto 1fr;grid-template-areas:"info nav size";align-items:center;gap:.5rem;padding:.375rem;
|
|
1
|
+
.c-paginator-wrapper{padding-top:.25rem;container:paginator/inline-size}.c-paginator-wrapper.is-font-small{font-size:.875rem}.c-paginator-wrapper.is-font-normal{font-size:1rem}.c-paginator-wrapper.is-font-large{font-size:1.125rem}.c-paginator-wrapper .c-paginator,.c-paginator-wrapper .c-paginator__info,.c-paginator-wrapper .c-paginator__range,.c-paginator-wrapper .c-paginator__total,.c-paginator-wrapper .c-paginator__nav,.c-paginator-wrapper .c-paginator__page,.c-paginator-wrapper .c-paginator__ellipsis,.c-paginator-wrapper .c-paginator__size,.c-paginator-wrapper .c-paginator__select{font-size:inherit}.c-paginator-wrapper.is-font-small .c-paginator__page,.c-paginator-wrapper.is-font-small .c-paginator__select{min-width:1.75rem;height:1.75rem;padding:0 .3125rem}.c-paginator-wrapper.is-font-small .c-paginator__select{padding:.3125rem 1.75rem .3125rem .5rem}.c-paginator-wrapper.is-font-large .c-paginator__page,.c-paginator-wrapper.is-font-large .c-paginator__select{min-width:2.25rem;height:2.25rem;padding:0 .4375rem}.c-paginator-wrapper.is-font-large .c-paginator__select{padding:.4375rem 2.25rem .4375rem .75rem}.c-paginator{background:var(--neutral-50);grid-template-columns:1fr auto 1fr;grid-template-areas:"info nav size";align-items:center;gap:.5rem;padding:.375rem;display:grid;box-shadow:0 -2px 5px -1px #32325d40,0 -1px 3px -1px #0000004d}.c-paginator__info{color:var(--neutral-600);white-space:nowrap;grid-area:info;justify-self:start}.c-paginator__range{color:var(--neutral-800);font-weight:600}.c-paginator__nav{grid-area:nav;justify-self:center;align-items:center;gap:.25rem;display:flex}.c-paginator__page{min-width:2rem;height:2rem;color:var(--neutral-700);cursor:pointer;background:0 0;border:1px solid #0000;border-radius:.375rem;justify-content:center;align-items:center;padding:0 .375rem;font-weight:500;transition:background-color .15s,border-color .15s,color .15s;display:inline-flex}.c-paginator__page:hover{background:var(--neutral-150);border-color:var(--neutral-200)}.c-paginator__page.is-active{background:var(--ac-color-info);color:var(--neutral-0);border-color:var(--ac-color-info);cursor:default}.c-paginator__ellipsis{min-width:2rem;height:2rem;color:var(--neutral-400);-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;display:inline-flex}.c-paginator__size{grid-area:size;justify-self:end;align-items:center;display:flex}.c-paginator__select{appearance:none;border:1px solid var(--neutral-200);background:var(--neutral-0) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%234a5759'/%3E%3C/svg%3E") no-repeat right .625rem center;color:var(--neutral-800);cursor:pointer;background-size:.625rem;border-radius:.375rem;padding:.375rem 2rem .375rem .625rem;transition:border-color .15s}.c-paginator__select:hover{border-color:var(--neutral-300)}.c-paginator__select:focus{border-color:var(--ac-color-info);outline:none;box-shadow:0 0 0 2px #f265221f}@container paginator (width<=640px){.c-paginator{grid-template-columns:1fr 1fr;grid-template-areas:"nav nav""info size"}.c-paginator__nav{justify-self:center;width:max-content;max-width:100%}.c-paginator__info{text-align:left;white-space:nowrap;justify-self:start}.c-paginator__size{justify-content:flex-end;justify-self:end;display:flex}}@container paginator (width<=420px){.c-paginator .is-hidden-sm{display:none}}
|
package/dist/styles/components/data-table/data-table.scss_vue_type_style_index_0_src_true_lang.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.c-table-wrapper{--table-col-max-width:clamp(12rem, 10vw, 22rem);--table-primary-col-min-width:clamp(14rem, 33vw, 20rem);--table-primary-col-max-width:clamp(14rem, 28vw, 28rem);max-height:var(--data-list-max-height,75dvh);-webkit-overflow-scrolling:touch;position:relative;overflow:auto}.c-table-wrapper .c-table{--cell-padding:.375rem;border-collapse:collapse;width:100%;min-width:48rem;font-size:1rem}.c-table-wrapper .c-table thead{z-index:2;background-color:var(--neutral-150);position:sticky;top:0;box-shadow:0 2px 5px -1px #32325d40,0 1px 3px -1px #0000004d}.c-table-wrapper .c-table th,.c-table-wrapper .c-table td{padding:var(--cell-padding);text-align:left;border-bottom:1px solid var(--neutral-200);overflow-wrap:break-word}.c-table-wrapper .c-table .primary-col{min-width:var(--table-primary-col-min-width);max-width:var(--table-primary-col-max-width);overflow-wrap:anywhere;word-break:break-word}.c-table-wrapper .c-table th.c-sortable{cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap}.c-table-wrapper .c-table th.c-sortable--sorted{color:var(--premium-500)}.c-table-wrapper .c-table th.c-sortable:hover{color:#1e2627}.c-table-wrapper .c-table th .c-sort-icon{color:var(--neutral-400);margin-left:.25rem;transition:color .15s}.c-table-wrapper .c-table th .c-sort-icon--active{color:var(--premium-500)}.c-table-wrapper .c-table td{max-width:var(--table-col-max-width)}.c-table-wrapper .c-table td.is-nowrap{white-space:nowrap}.c-table-wrapper .c-table.is-compact
|
|
1
|
+
.c-table-wrapper{--table-col-max-width:clamp(12rem, 10vw, 22rem);--table-primary-col-min-width:clamp(14rem, 33vw, 20rem);--table-primary-col-max-width:clamp(14rem, 28vw, 28rem);max-height:var(--data-list-max-height,75dvh);-webkit-overflow-scrolling:touch;position:relative;overflow:auto}.c-table-wrapper.is-font-small .c-table{font-size:.875rem}.c-table-wrapper.is-font-normal .c-table{font-size:1rem}.c-table-wrapper.is-font-large .c-table{font-size:1.125rem}.c-table-wrapper .c-table{--cell-padding:.375rem;border-collapse:collapse;width:100%;min-width:48rem;font-size:1rem}.c-table-wrapper .c-table thead{z-index:2;background-color:var(--neutral-150);position:sticky;top:0;box-shadow:0 2px 5px -1px #32325d40,0 1px 3px -1px #0000004d}.c-table-wrapper .c-table th,.c-table-wrapper .c-table td{padding:var(--cell-padding);text-align:left;border-bottom:1px solid var(--neutral-200);overflow-wrap:break-word}.c-table-wrapper .c-table .primary-col{min-width:var(--table-primary-col-min-width);max-width:var(--table-primary-col-max-width);overflow-wrap:anywhere;word-break:break-word}.c-table-wrapper .c-table th.c-sortable{cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap}.c-table-wrapper .c-table th.c-sortable--sorted{color:var(--premium-500)}.c-table-wrapper .c-table th.c-sortable:hover{color:#1e2627}.c-table-wrapper .c-table th .c-sort-icon{color:var(--neutral-400);margin-left:.25rem;transition:color .15s}.c-table-wrapper .c-table th .c-sort-icon--active{color:var(--premium-500)}.c-table-wrapper .c-table td{max-width:var(--table-col-max-width)}.c-table-wrapper .c-table td.is-nowrap{white-space:nowrap}.c-table-wrapper .c-table.is-compact th,.c-table-wrapper .c-table.is-compact td{padding-block:.25rem}.c-table-wrapper .c-table tbody tr.is-striped{background-color:var(--neutral-50)}.c-table-wrapper .c-table tbody tr.is-selected,.c-table-wrapper .c-table tbody tr.is-striped.is-selected{background-color:var(--premium-200)}.c-table-wrapper .c-table tbody .c-table__loading-row,.c-table-wrapper .c-table tbody .c-table__loading-row:hover{background-color:#0000}.c-table-wrapper .c-table tbody .c-table__loading-cell{text-align:center;border-bottom:1px solid var(--neutral-200);padding:2rem}.c-table-wrapper .c-table tbody .c-table__loading-wrap{justify-content:center;align-items:center;width:100%;display:flex}@media (hover:hover) and (pointer:fine){.c-table-wrapper .c-table th.c-sortable:hover .c-sort-icon{color:var(--neutral-700)}.c-table-wrapper .c-table tbody tr:hover,.c-table-wrapper .c-table tbody tr.is-striped:hover{background-color:var(--premium-100)}.c-table-wrapper .c-table tbody tr:hover td,.c-table-wrapper .c-table tbody tr.is-striped:hover td{border-color:var(--premium-400)}.c-table-wrapper .c-table tbody tr.is-selected:hover,.c-table-wrapper .c-table tbody tr.is-striped.is-selected:hover{background-color:var(--premium-300)}}.c-table-wrapper .c-table .c-actions-header{text-align:center}.c-table-wrapper .c-table .c-actions-cell .c-actions-wrap{flex-wrap:wrap;justify-content:center;align-items:baseline;gap:.25rem;width:fit-content;max-width:100%;margin-inline:auto;display:flex}.c-table-wrapper .c-table__cell{position:relative}@media (hover:none),(pointer:coarse){.c-table-wrapper .c-table__cell{transition:background-color .15s}.c-table-wrapper .c-table__cell:focus-within,.c-table-wrapper .c-table__cell:hover{background-color:#dfefef80}}.c-table-wrapper .c-table__cell .c-copy-btn{opacity:0;position:absolute;top:0;right:0}.c-table-wrapper .c-table__cell:hover .c-copy-btn,.c-table-wrapper .c-table__cell:focus-within .c-copy-btn{opacity:1}.c-table-wrapper .c-table__backdrop{z-index:1;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);pointer-events:none;background:#fff9;justify-content:center;align-items:center;padding-top:3rem;animation:.15s ease-out c-table-backdrop-in;display:flex;position:absolute;inset:0}.c-table-wrapper.is-loading{touch-action:none;overflow:hidden}.c-table-wrapper.is-loading .c-table tbody{opacity:.45;transition:opacity .15s ease-out}@keyframes c-table-backdrop-in{0%{opacity:0}to{opacity:1}}
|
package/dist/test.html
CHANGED
|
@@ -1,163 +1,163 @@
|
|
|
1
|
-
<!DOCTYPE html>
|
|
2
|
-
<html lang="hu">
|
|
3
|
-
<head>
|
|
4
|
-
<meta charset="UTF-8" />
|
|
5
|
-
<title>search-posts-widget standalone test</title>
|
|
6
|
-
<style>
|
|
7
|
-
body { font-family: system-ui, sans-serif; margin: 2rem; }
|
|
8
|
-
#log {
|
|
9
|
-
margin-top: 1rem;
|
|
10
|
-
padding: 1rem;
|
|
11
|
-
background: #f4f4f4;
|
|
12
|
-
border: 1px solid #ddd;
|
|
13
|
-
font-family: monospace;
|
|
14
|
-
white-space: pre-wrap;
|
|
15
|
-
font-size: 12px;
|
|
16
|
-
max-height: 300px;
|
|
17
|
-
overflow-y: auto;
|
|
18
|
-
}
|
|
19
|
-
dialog {
|
|
20
|
-
padding: 0;
|
|
21
|
-
border: 1px solid #999;
|
|
22
|
-
border-radius: 8px;
|
|
23
|
-
width: 90vw;
|
|
24
|
-
height: 80vh;
|
|
25
|
-
}
|
|
26
|
-
dialog::backdrop { background: rgba(0,0,0,0.4); }
|
|
27
|
-
</style>
|
|
28
|
-
</head>
|
|
29
|
-
<body>
|
|
30
|
-
<h1>search-posts-widget standalone test</h1>
|
|
31
|
-
|
|
32
|
-
<p>
|
|
33
|
-
Bundle:
|
|
34
|
-
<select id="bundle-version">
|
|
35
|
-
<option value="1.0.181">1.0.181</option>
|
|
36
|
-
<option value="1.0.188" selected>1.0.188</option>
|
|
37
|
-
</select>
|
|
38
|
-
<button id="reload">Reload bundle</button>
|
|
39
|
-
</p>
|
|
40
|
-
|
|
41
|
-
<p>
|
|
42
|
-
<strong>apiurl:</strong>
|
|
43
|
-
<input id="apiurl" style="width: 360px" value="http://172.22.0.15:8080" />
|
|
44
|
-
<br />
|
|
45
|
-
<strong>environment:</strong>
|
|
46
|
-
<input id="environment" value="dev" />
|
|
47
|
-
<br />
|
|
48
|
-
<strong>id (causationid):</strong>
|
|
49
|
-
<input id="causationid" value="test-1" />
|
|
50
|
-
<br />
|
|
51
|
-
<strong>searchurl:</strong>
|
|
52
|
-
<input id="searchurl" style="width: 360px" value="" />
|
|
53
|
-
</p>
|
|
54
|
-
|
|
55
|
-
<button id="open-selector">Open selector</button>
|
|
56
|
-
<button id="open-non-selector">Open non-selector</button>
|
|
57
|
-
|
|
58
|
-
<dialog id="dialog">
|
|
59
|
-
<search-posts-widget
|
|
60
|
-
id="widget"
|
|
61
|
-
selector="true"
|
|
62
|
-
environment="dev"
|
|
63
|
-
id="causationid"
|
|
64
|
-
apiurl="http://172.22.0.15:8080"
|
|
65
|
-
searchurl=""
|
|
66
|
-
></search-posts-widget>
|
|
67
|
-
</dialog>
|
|
68
|
-
|
|
69
|
-
<h3>Console log</h3>
|
|
70
|
-
<div id="log"></div>
|
|
71
|
-
|
|
72
|
-
<script>
|
|
73
|
-
const log = (msg, data) => {
|
|
74
|
-
const el = document.getElementById('log')
|
|
75
|
-
const line = document.createElement('div')
|
|
76
|
-
line.textContent = `[${new Date().toISOString()}] ${msg}` +
|
|
77
|
-
(data !== undefined ? ' ' + JSON.stringify(data) : '')
|
|
78
|
-
el.appendChild(line)
|
|
79
|
-
console.log(msg, data ?? '')
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
window.addEventListener('error', (e) => log('ERROR', { msg: e.message, file: e.filename, line: e.lineno }))
|
|
83
|
-
window.addEventListener('unhandledrejection', (e) => log('UNHANDLED REJECTION', { reason: String(e.reason) }))
|
|
84
|
-
|
|
85
|
-
const widgetScriptId = 'search-posts-widget-script'
|
|
86
|
-
const CDN_BASE = 'https://cdn.hvg.hu/search-posts-widget'
|
|
87
|
-
|
|
88
|
-
function loadBundle(version) {
|
|
89
|
-
return new Promise((resolve, reject) => {
|
|
90
|
-
const existing = document.getElementById(widgetScriptId)
|
|
91
|
-
if (existing) existing.remove()
|
|
92
|
-
if (customElements.get('search-posts-widget')) {
|
|
93
|
-
// Force re-registration by re-defining on a new class
|
|
94
|
-
// (customElements.define cannot be called twice for the same name,
|
|
95
|
-
// but since the script reassigns via const, we just reload.)
|
|
96
|
-
}
|
|
97
|
-
const s = document.createElement('script')
|
|
98
|
-
s.id = widgetScriptId
|
|
99
|
-
//s.src = `${CDN_BASE}/${version}/search-posts-widget.umd.js`
|
|
100
|
-
s.src = '/widget/dist/search-posts-widget.umd.js'
|
|
101
|
-
s.onload = () => resolve(version)
|
|
102
|
-
s.onerror = () => reject(new Error(`Failed to load ${version}`))
|
|
103
|
-
document.head.appendChild(s)
|
|
104
|
-
})
|
|
105
|
-
}
|
|
106
|
-
|
|
107
|
-
function applyAttrs() {
|
|
108
|
-
const w = document.getElementById('widget')
|
|
109
|
-
w.setAttribute('apiurl', document.getElementById('apiurl').value)
|
|
110
|
-
w.setAttribute('environment', document.getElementById('environment').value)
|
|
111
|
-
w.setAttribute('id', document.getElementById('causationid').value)
|
|
112
|
-
w.setAttribute('searchurl', document.getElementById('searchurl').value)
|
|
113
|
-
log('widget attrs', {
|
|
114
|
-
apiurl: w.getAttribute('apiurl'),
|
|
115
|
-
environment: w.getAttribute('environment'),
|
|
116
|
-
id: w.getAttribute('id'),
|
|
117
|
-
searchurl: w.getAttribute('searchurl'),
|
|
118
|
-
selector: w.getAttribute('selector'),
|
|
119
|
-
})
|
|
120
|
-
}
|
|
121
|
-
|
|
122
|
-
function openWidget(selector) {
|
|
123
|
-
const w = document.getElementById('widget')
|
|
124
|
-
w.setAttribute('selector', selector ? 'true' : 'false')
|
|
125
|
-
applyAttrs()
|
|
126
|
-
// Re-create the element so the new selector prop takes effect
|
|
127
|
-
const fresh = w.cloneNode(true)
|
|
128
|
-
w.replaceWith(fresh)
|
|
129
|
-
document.getElementById('dialog').showModal()
|
|
130
|
-
// v1.0.188 needs open() to display selector content
|
|
131
|
-
try {
|
|
132
|
-
console.log('fresh element before open:', fresh)
|
|
133
|
-
fresh.open?.()
|
|
134
|
-
log('called open()', { hasOpen: typeof fresh.open === 'function' })
|
|
135
|
-
} catch (e) {
|
|
136
|
-
log('open() threw', { error: String(e) })
|
|
137
|
-
}
|
|
138
|
-
}
|
|
139
|
-
|
|
140
|
-
document.getElementById('reload').addEventListener('click', async () => {
|
|
141
|
-
const v = document.getElementById('bundle-version').value
|
|
142
|
-
try {
|
|
143
|
-
await loadBundle(v)
|
|
144
|
-
log('bundle loaded', { version: v, defined: !!customElements.get('search-posts-widget') })
|
|
145
|
-
} catch (e) {
|
|
146
|
-
log('bundle load failed', { error: String(e) })
|
|
147
|
-
}
|
|
148
|
-
})
|
|
149
|
-
|
|
150
|
-
document.getElementById('open-selector').addEventListener('click', () => openWidget(true))
|
|
151
|
-
document.getElementById('open-non-selector').addEventListener('click', () => openWidget(false))
|
|
152
|
-
|
|
153
|
-
window.addEventListener('search_posts_selected', (e) => {
|
|
154
|
-
log('search_posts_selected', e.detail)
|
|
155
|
-
})
|
|
156
|
-
|
|
157
|
-
// Initial load of selected version
|
|
158
|
-
loadBundle(document.getElementById('bundle-version').value)
|
|
159
|
-
.then((v) => log('initial bundle loaded', { version: v, defined: !!customElements.get('search-posts-widget') }))
|
|
160
|
-
.catch((e) => log('initial bundle failed', { error: String(e) }))
|
|
161
|
-
</script>
|
|
162
|
-
</body>
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="hu">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8" />
|
|
5
|
+
<title>search-posts-widget standalone test</title>
|
|
6
|
+
<style>
|
|
7
|
+
body { font-family: system-ui, sans-serif; margin: 2rem; }
|
|
8
|
+
#log {
|
|
9
|
+
margin-top: 1rem;
|
|
10
|
+
padding: 1rem;
|
|
11
|
+
background: #f4f4f4;
|
|
12
|
+
border: 1px solid #ddd;
|
|
13
|
+
font-family: monospace;
|
|
14
|
+
white-space: pre-wrap;
|
|
15
|
+
font-size: 12px;
|
|
16
|
+
max-height: 300px;
|
|
17
|
+
overflow-y: auto;
|
|
18
|
+
}
|
|
19
|
+
dialog {
|
|
20
|
+
padding: 0;
|
|
21
|
+
border: 1px solid #999;
|
|
22
|
+
border-radius: 8px;
|
|
23
|
+
width: 90vw;
|
|
24
|
+
height: 80vh;
|
|
25
|
+
}
|
|
26
|
+
dialog::backdrop { background: rgba(0,0,0,0.4); }
|
|
27
|
+
</style>
|
|
28
|
+
</head>
|
|
29
|
+
<body>
|
|
30
|
+
<h1>search-posts-widget standalone test</h1>
|
|
31
|
+
|
|
32
|
+
<p>
|
|
33
|
+
Bundle:
|
|
34
|
+
<select id="bundle-version">
|
|
35
|
+
<option value="1.0.181">1.0.181</option>
|
|
36
|
+
<option value="1.0.188" selected>1.0.188</option>
|
|
37
|
+
</select>
|
|
38
|
+
<button id="reload">Reload bundle</button>
|
|
39
|
+
</p>
|
|
40
|
+
|
|
41
|
+
<p>
|
|
42
|
+
<strong>apiurl:</strong>
|
|
43
|
+
<input id="apiurl" style="width: 360px" value="http://172.22.0.15:8080" />
|
|
44
|
+
<br />
|
|
45
|
+
<strong>environment:</strong>
|
|
46
|
+
<input id="environment" value="dev" />
|
|
47
|
+
<br />
|
|
48
|
+
<strong>id (causationid):</strong>
|
|
49
|
+
<input id="causationid" value="test-1" />
|
|
50
|
+
<br />
|
|
51
|
+
<strong>searchurl:</strong>
|
|
52
|
+
<input id="searchurl" style="width: 360px" value="" />
|
|
53
|
+
</p>
|
|
54
|
+
|
|
55
|
+
<button id="open-selector">Open selector</button>
|
|
56
|
+
<button id="open-non-selector">Open non-selector</button>
|
|
57
|
+
|
|
58
|
+
<dialog id="dialog">
|
|
59
|
+
<search-posts-widget
|
|
60
|
+
id="widget"
|
|
61
|
+
selector="true"
|
|
62
|
+
environment="dev"
|
|
63
|
+
id="causationid"
|
|
64
|
+
apiurl="http://172.22.0.15:8080"
|
|
65
|
+
searchurl=""
|
|
66
|
+
></search-posts-widget>
|
|
67
|
+
</dialog>
|
|
68
|
+
|
|
69
|
+
<h3>Console log</h3>
|
|
70
|
+
<div id="log"></div>
|
|
71
|
+
|
|
72
|
+
<script>
|
|
73
|
+
const log = (msg, data) => {
|
|
74
|
+
const el = document.getElementById('log')
|
|
75
|
+
const line = document.createElement('div')
|
|
76
|
+
line.textContent = `[${new Date().toISOString()}] ${msg}` +
|
|
77
|
+
(data !== undefined ? ' ' + JSON.stringify(data) : '')
|
|
78
|
+
el.appendChild(line)
|
|
79
|
+
console.log(msg, data ?? '')
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
window.addEventListener('error', (e) => log('ERROR', { msg: e.message, file: e.filename, line: e.lineno }))
|
|
83
|
+
window.addEventListener('unhandledrejection', (e) => log('UNHANDLED REJECTION', { reason: String(e.reason) }))
|
|
84
|
+
|
|
85
|
+
const widgetScriptId = 'search-posts-widget-script'
|
|
86
|
+
const CDN_BASE = 'https://cdn.hvg.hu/search-posts-widget'
|
|
87
|
+
|
|
88
|
+
function loadBundle(version) {
|
|
89
|
+
return new Promise((resolve, reject) => {
|
|
90
|
+
const existing = document.getElementById(widgetScriptId)
|
|
91
|
+
if (existing) existing.remove()
|
|
92
|
+
if (customElements.get('search-posts-widget')) {
|
|
93
|
+
// Force re-registration by re-defining on a new class
|
|
94
|
+
// (customElements.define cannot be called twice for the same name,
|
|
95
|
+
// but since the script reassigns via const, we just reload.)
|
|
96
|
+
}
|
|
97
|
+
const s = document.createElement('script')
|
|
98
|
+
s.id = widgetScriptId
|
|
99
|
+
//s.src = `${CDN_BASE}/${version}/search-posts-widget.umd.js`
|
|
100
|
+
s.src = '/widget/dist/search-posts-widget.umd.js'
|
|
101
|
+
s.onload = () => resolve(version)
|
|
102
|
+
s.onerror = () => reject(new Error(`Failed to load ${version}`))
|
|
103
|
+
document.head.appendChild(s)
|
|
104
|
+
})
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
function applyAttrs() {
|
|
108
|
+
const w = document.getElementById('widget')
|
|
109
|
+
w.setAttribute('apiurl', document.getElementById('apiurl').value)
|
|
110
|
+
w.setAttribute('environment', document.getElementById('environment').value)
|
|
111
|
+
w.setAttribute('id', document.getElementById('causationid').value)
|
|
112
|
+
w.setAttribute('searchurl', document.getElementById('searchurl').value)
|
|
113
|
+
log('widget attrs', {
|
|
114
|
+
apiurl: w.getAttribute('apiurl'),
|
|
115
|
+
environment: w.getAttribute('environment'),
|
|
116
|
+
id: w.getAttribute('id'),
|
|
117
|
+
searchurl: w.getAttribute('searchurl'),
|
|
118
|
+
selector: w.getAttribute('selector'),
|
|
119
|
+
})
|
|
120
|
+
}
|
|
121
|
+
|
|
122
|
+
function openWidget(selector) {
|
|
123
|
+
const w = document.getElementById('widget')
|
|
124
|
+
w.setAttribute('selector', selector ? 'true' : 'false')
|
|
125
|
+
applyAttrs()
|
|
126
|
+
// Re-create the element so the new selector prop takes effect
|
|
127
|
+
const fresh = w.cloneNode(true)
|
|
128
|
+
w.replaceWith(fresh)
|
|
129
|
+
document.getElementById('dialog').showModal()
|
|
130
|
+
// v1.0.188 needs open() to display selector content
|
|
131
|
+
try {
|
|
132
|
+
console.log('fresh element before open:', fresh)
|
|
133
|
+
fresh.open?.()
|
|
134
|
+
log('called open()', { hasOpen: typeof fresh.open === 'function' })
|
|
135
|
+
} catch (e) {
|
|
136
|
+
log('open() threw', { error: String(e) })
|
|
137
|
+
}
|
|
138
|
+
}
|
|
139
|
+
|
|
140
|
+
document.getElementById('reload').addEventListener('click', async () => {
|
|
141
|
+
const v = document.getElementById('bundle-version').value
|
|
142
|
+
try {
|
|
143
|
+
await loadBundle(v)
|
|
144
|
+
log('bundle loaded', { version: v, defined: !!customElements.get('search-posts-widget') })
|
|
145
|
+
} catch (e) {
|
|
146
|
+
log('bundle load failed', { error: String(e) })
|
|
147
|
+
}
|
|
148
|
+
})
|
|
149
|
+
|
|
150
|
+
document.getElementById('open-selector').addEventListener('click', () => openWidget(true))
|
|
151
|
+
document.getElementById('open-non-selector').addEventListener('click', () => openWidget(false))
|
|
152
|
+
|
|
153
|
+
window.addEventListener('search_posts_selected', (e) => {
|
|
154
|
+
log('search_posts_selected', e.detail)
|
|
155
|
+
})
|
|
156
|
+
|
|
157
|
+
// Initial load of selected version
|
|
158
|
+
loadBundle(document.getElementById('bundle-version').value)
|
|
159
|
+
.then((v) => log('initial bundle loaded', { version: v, defined: !!customElements.get('search-posts-widget') }))
|
|
160
|
+
.catch((e) => log('initial bundle failed', { error: String(e) }))
|
|
161
|
+
</script>
|
|
162
|
+
</body>
|
|
163
163
|
</html>
|