@cloudparker/moldex.js 0.0.67 → 0.0.68

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.
@@ -1,5 +1,6 @@
1
1
  import { type DialogProps, type InputFieldProps } from '../../views';
2
2
  import { type CropperDialogPropsType } from '../../views/core/dialog/components/cropper-dialog/cropper-dialog.svelte';
3
+ import type { PickerDialogProps } from '../../views/core/dialog/components/picker-dialog/picker-dialog.svelte';
3
4
  export type PickerDialogPropsType = {
4
5
  items?: any[];
5
6
  itemTitle?: string;
@@ -25,7 +26,7 @@ export declare function openAlertDialog(params?: DialogProps & {
25
26
  export declare function openDeleteConfirmDialog(params?: DialogProps & {
26
27
  msg?: string;
27
28
  }): Promise<unknown>;
28
- export declare function openListPickerDialog<R>({ items, itemTitle, itemSubtitle, hasArrow, hasCheck, okButtonClassName, okButtonLabel, closeButtonClassName, closeButtonLabel, multiple, identity, value, search, ...params }?: DialogProps & PickerDialogPropsType): Promise<R>;
29
+ export declare function openPickerDialog<R>({ items, value, multiple, hasCheckbox, hasArrow, ...params }: DialogProps & PickerDialogProps): Promise<R>;
29
30
  export declare function openTextFieldDialog({ title, value, label, name, maxlength, fieldClassName, autofocus, required, appearance, size, floatingLabel, ...params }?: DialogProps & InputFieldProps & {
30
31
  fieldClassName?: string;
31
32
  }): Promise<unknown>;
@@ -46,9 +47,11 @@ export declare function openLoadingDialog({ msg, loadingDialogContainerClassName
46
47
  setOkEnabled: (value: boolean) => void;
47
48
  setOkSpinner: (value: boolean) => void;
48
49
  setOnData: (listener: (data: any) => void) => void;
49
- setOnOkClick: (onclick: (event: MouseEvent | TouchEvent, options: import("../../views").DialogExportsType) => void) => void;
50
+ setOnOkClick: (onclick: (event: MouseEvent | TouchEvent, options: import("../../views").DialogExports) => void) => void;
50
51
  setOnCloseClick: (onclick: (ev: MouseEvent | TouchEvent) => Promise<boolean>) => void;
51
52
  postData: (data: any) => void;
53
+ setHeaderSnippet: (snippet: import("svelte").Snippet) => void;
54
+ setFooterSnippet: (snippet: import("svelte").Snippet) => void;
52
55
  } & {
53
56
  $set?: any;
54
57
  $on?: any;
@@ -1,13 +1,13 @@
1
1
  import { Dialog } from '../../views';
2
- import ListDialog from '../../views/core/dialog/components/list-dialog/list-picker-dialog.svelte';
3
2
  import LoadingDialog from '../../views/core/dialog/components/loading-dialog/loading-dialog.svelte';
4
3
  import MsgDialog from '../../views/core/dialog/components/msg-dialog/msg-dialog.svelte';
5
4
  import TextFieldDialog from '../../views/core/dialog/components/text-field-dialog/text-field-dialog.svelte';
6
5
  import TextareaFieldDialog from '../../views/core/dialog/components/textarea-field-dialog/textarea-field-dialog.svelte';
7
- import { mount, } from 'svelte';
6
+ import { createRawSnippet, mount, } from 'svelte';
8
7
  import { isMobileScreen } from '../screen/screen-service';
9
8
  import CropperDialog, {} from '../../views/core/dialog/components/cropper-dialog/cropper-dialog.svelte';
10
9
  import { processImageFile } from '../utils/image-service';
10
+ import PickerDialog from '../../views/core/dialog/components/picker-dialog/picker-dialog.svelte';
11
11
  function addDialog(props) {
12
12
  const dialog = mount(Dialog, { target: document.getElementsByTagName('body')[0], props });
13
13
  return dialog;
@@ -70,25 +70,30 @@ export async function openDeleteConfirmDialog(params = {}) {
70
70
  footerOkButtonClassName: 'bg-red-500 hover:bg-red-700 focus:bg-red-700'
71
71
  });
72
72
  }
73
- export async function openListPickerDialog({ items, itemTitle, itemSubtitle, hasArrow, hasCheck, okButtonClassName, okButtonLabel, closeButtonClassName, closeButtonLabel, multiple, identity, value, search, ...params } = {}) {
73
+ export async function openPickerDialog({ items, value, multiple, hasCheckbox = true, hasArrow, ...params }) {
74
+ if (hasArrow) {
75
+ multiple = false;
76
+ hasCheckbox = false;
77
+ }
74
78
  return await openDialog({
75
- component: ListDialog,
79
+ bodyComponent: PickerDialog,
76
80
  props: {
77
81
  items,
78
- itemTitle,
79
- itemSubtitle,
80
- hasArrow,
81
- hasCheck,
82
- okButtonClassName,
83
- okButtonLabel,
84
- closeButtonClassName,
85
- closeButtonLabel,
86
- multiple,
87
- identity,
88
82
  value,
89
- search
83
+ multiple,
84
+ hasCheckbox,
85
+ hasArrow,
90
86
  },
91
- ...params
87
+ hasHeader: true,
88
+ hasHeaderBack: isMobileScreen(),
89
+ hasHeaderClose: !isMobileScreen(),
90
+ footerOkButtonLable: 'Select',
91
+ footerClassName: 'border-t',
92
+ title: 'Picker',
93
+ ...params,
94
+ hasFooter: multiple,
95
+ hasFooterOkButton: multiple,
96
+ hasFooterCloseButton: multiple,
92
97
  });
93
98
  }
94
99
  export async function openTextFieldDialog({ title, value, label, name, maxlength, fieldClassName, autofocus, required, appearance, size, floatingLabel, ...params } = {}) {
package/dist/tailwind.css CHANGED
@@ -1,3 +1,3 @@
1
1
  :root{--color-primary-50:#f0f9ff;--color-primary-100:#e0f2fe;--color-primary-200:#bae6fd;--color-primary-300:#7dd3fc;--color-primary-400:#38bdf8;--color-primary-500:#0ea5e9;--color-primary-600:#0284c7;--color-primary-700:#0369a1;--color-primary-800:#075985;--color-primary-900:#0c4a6e;--color-primary-950:#082f49;--color-base-50:#f8fafc;--color-base-100:#f1f5f9;--color-base-200:#e2e8f0;--color-base-300:#cbd5e1;--color-base-400:#94a3b8;--color-base-500:#64748b;--color-base-600:#475569;--color-base-700:#334155;--color-base-800:#1e293b;--color-base-900:#0f172a;--color-base-950:#020617}
2
2
 
3
- /*! tailwindcss v3.4.10 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}[multiple],[type=date],[type=datetime-local],[type=email],[type=month],[type=number],[type=password],[type=search],[type=tel],[type=text],[type=time],[type=url],[type=week],input:where(:not([type])),select,textarea{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#fff;border-color:#6b7280;border-width:1px;border-radius:0;padding:.5rem .75rem;font-size:1rem;line-height:1.5rem;--tw-shadow:0 0 #0000}[multiple]:focus,[type=date]:focus,[type=datetime-local]:focus,[type=email]:focus,[type=month]:focus,[type=number]:focus,[type=password]:focus,[type=search]:focus,[type=tel]:focus,[type=text]:focus,[type=time]:focus,[type=url]:focus,[type=week]:focus,input:where(:not([type])):focus,select:focus,textarea:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-inset:var(--tw-empty,/*!*/ /*!*/);--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#2563eb;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);border-color:#2563eb}input::-moz-placeholder,textarea::-moz-placeholder{color:#6b7280;opacity:1}input::placeholder,textarea::placeholder{color:#6b7280;opacity:1}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-date-and-time-value{min-height:1.5em;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-meridiem-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-year-field{padding-top:0;padding-bottom:0}select{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3E%3C/svg%3E");background-position:right .5rem center;background-repeat:no-repeat;background-size:1.5em 1.5em;padding-right:2.5rem;-webkit-print-color-adjust:exact;print-color-adjust:exact}[multiple],[size]:where(select:not([size="1"])){background-image:none;background-position:0 0;background-repeat:unset;background-size:initial;padding-right:.75rem;-webkit-print-color-adjust:unset;print-color-adjust:unset}[type=checkbox],[type=radio]{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0;-webkit-print-color-adjust:exact;print-color-adjust:exact;display:inline-block;vertical-align:middle;background-origin:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;flex-shrink:0;height:1rem;width:1rem;color:#2563eb;background-color:#fff;border-color:#6b7280;border-width:1px;--tw-shadow:0 0 #0000}[type=checkbox]{border-radius:0}[type=radio]{border-radius:100%}[type=checkbox]:focus,[type=radio]:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-inset:var(--tw-empty,/*!*/ /*!*/);--tw-ring-offset-width:2px;--tw-ring-offset-color:#fff;--tw-ring-color:#2563eb;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}[type=checkbox]:checked,[type=radio]:checked{border-color:transparent;background-color:currentColor;background-size:100% 100%;background-position:50%;background-repeat:no-repeat}[type=checkbox]:checked{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3E%3Cpath d='M12.207 4.793a1 1 0 0 1 0 1.414l-5 5a1 1 0 0 1-1.414 0l-2-2a1 1 0 0 1 1.414-1.414L6.5 9.086l4.293-4.293a1 1 0 0 1 1.414 0'/%3E%3C/svg%3E")}@media (forced-colors:active) {[type=checkbox]:checked{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto}}[type=radio]:checked{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='3'/%3E%3C/svg%3E")}@media (forced-colors:active) {[type=radio]:checked{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto}}[type=checkbox]:checked:focus,[type=checkbox]:checked:hover,[type=radio]:checked:focus,[type=radio]:checked:hover{border-color:transparent;background-color:currentColor}[type=checkbox]:indeterminate{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3E%3C/svg%3E");border-color:transparent;background-color:currentColor;background-size:100% 100%;background-position:50%;background-repeat:no-repeat}@media (forced-colors:active) {[type=checkbox]:indeterminate{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto}}[type=checkbox]:indeterminate:focus,[type=checkbox]:indeterminate:hover{border-color:transparent;background-color:currentColor}[type=file]{background:unset;border-color:inherit;border-width:0;border-radius:0;padding:0;font-size:unset;line-height:inherit}[type=file]:focus{outline:1px solid ButtonText;outline:1px auto -webkit-focus-ring-color}*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }.pointer-events-none{pointer-events:none}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.inset-0{inset:0}.bottom-20{bottom:5rem}.left-1\/2{left:50%}.right-0{right:0}.start-1{inset-inline-start:.25rem}.top-0{top:0}.z-10{z-index:10}.z-20{z-index:20}.z-30{z-index:30}.mx-1{margin-left:.25rem;margin-right:.25rem}.mx-3{margin-left:.75rem;margin-right:.75rem}.mx-4{margin-left:1rem;margin-right:1rem}.my-1{margin-top:.25rem;margin-bottom:.25rem}.-mb-2{margin-bottom:-.5rem}.mb-1{margin-bottom:.25rem}.ml-4{margin-left:1rem}.ms-1{margin-inline-start:.25rem}.mt-1{margin-top:.25rem}.mt-6{margin-top:1.5rem}.block{display:block}.flex{display:flex}.inline-flex{display:inline-flex}.inline-grid{display:inline-grid}.contents{display:contents}.hidden{display:none}.\!h-4{height:1rem!important}.\!h-5{height:1.25rem!important}.\!h-6{height:1.5rem!important}.\!h-7{height:1.75rem!important}.h-1{height:.25rem}.h-10{height:2.5rem}.h-12{height:3rem}.h-16{height:4rem}.h-2{height:.5rem}.h-3{height:.75rem}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-full{height:100%}.h-screen{height:100vh}.max-h-1\/2vh{max-height:50vh}.max-h-80{max-height:20rem}.max-h-full{max-height:100%}.max-h-screen{max-height:100vh}.min-h-full{min-height:100%}.\!w-4{width:1rem!important}.\!w-5{width:1.25rem!important}.\!w-6{width:1.5rem!important}.\!w-7{width:1.75rem!important}.w-1\/2{width:50%}.w-1\/3{width:33.333333%}.w-10{width:2.5rem}.w-12{width:3rem}.w-16{width:4rem}.w-20{width:5rem}.w-3{width:.75rem}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-64{width:16rem}.w-7\/10{width:70%}.w-72{width:18rem}.w-8{width:2rem}.w-96{width:24rem}.w-full{width:100%}.w-max{width:-moz-max-content;width:max-content}.w-screen{width:100vw}.min-w-40{min-width:10rem}.min-w-52{min-width:13rem}.max-w-full{max-width:100%}.max-w-min{max-width:-moz-min-content;max-width:min-content}.shrink-0{flex-shrink:0}.flex-grow,.grow{flex-grow:1}.origin-top{transform-origin:top}.-translate-x-1\/2{--tw-translate-x:-50%}.-translate-x-1\/2,.-translate-x-full{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-x-full{--tw-translate-x:-100%}.-translate-y-1\/2{--tw-translate-y:-50%}.-translate-y-1\/2,.-translate-y-full{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-full{--tw-translate-y:-100%}.translate-x-0{--tw-translate-x:0px}.translate-x-0,.translate-x-1\/2{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-x-1\/2{--tw-translate-x:50%}.translate-x-full{--tw-translate-x:100%}.translate-x-full,.translate-y-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-y-0{--tw-translate-y:0px}.translate-y-4{--tw-translate-y:1rem}.translate-y-4,.translate-y-full{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-y-full{--tw-translate-y:100%}.scale-100{--tw-scale-x:1;--tw-scale-y:1}.scale-100,.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes ping{75%,to{transform:scale(2);opacity:0}}.animate-ping{animation:ping 1s cubic-bezier(0,0,.2,1) infinite}@keyframes spin{to{transform:rotate(1turn)}}.animate-spin{animation:spin 1s linear infinite}.cursor-auto{cursor:auto}.cursor-default{cursor:default}.cursor-pointer{cursor:pointer}.select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}.appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}.flex-row{flex-direction:row}.flex-row-reverse{flex-direction:row-reverse}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.flex-wrap{flex-wrap:wrap}.flex-nowrap{flex-wrap:nowrap}.place-items-center{place-items:center}.items-start{align-items:flex-start}.items-center{align-items:center}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.gap-0{gap:0}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.space-x-6>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(1.5rem*var(--tw-space-x-reverse));margin-left:calc(1.5rem*(1 - var(--tw-space-x-reverse)))}.space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem*var(--tw-space-y-reverse))}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.text-ellipsis{text-overflow:ellipsis}.text-nowrap{text-wrap:nowrap}.rounded{border-radius:.25rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.rounded-md{border-radius:.375rem}.rounded-none{border-radius:0}.rounded-bl-lg{border-bottom-left-radius:.5rem}.rounded-br-lg{border-bottom-right-radius:.5rem}.rounded-tl-lg{border-top-left-radius:.5rem}.rounded-tr-lg{border-top-right-radius:.5rem}.border{border-width:1px}.border-0{border-width:0}.border-2{border-width:2px}.border-b{border-bottom-width:1px}.border-b-2{border-bottom-width:2px}.border-t{border-top-width:1px}.border-base{border-color:var(--color-base-500)}.border-base-100{border-color:var(--color-base-100)}.border-base-200{border-color:var(--color-base-200)}.border-base-300{border-color:var(--color-base-300)}.border-primary{border-color:var(--color-primary-500)}.bg-base-100{background-color:var(--color-base-100)}.bg-base-200{background-color:var(--color-base-200)}.bg-base-50{background-color:var(--color-base-50)}.bg-gray-100{--tw-bg-opacity:1;background-color:rgb(243 244 246/var(--tw-bg-opacity))}.bg-gray-200{--tw-bg-opacity:1;background-color:rgb(229 231 235/var(--tw-bg-opacity))}.bg-gray-500\/20{background-color:hsla(220,9%,46%,.2)}.bg-indigo-600{--tw-bg-opacity:1;background-color:rgb(79 70 229/var(--tw-bg-opacity))}.bg-primary-600{background-color:var(--color-primary-600)}.bg-red-500{--tw-bg-opacity:1;background-color:rgb(239 68 68/var(--tw-bg-opacity))}.bg-sky-400{--tw-bg-opacity:1;background-color:rgb(56 189 248/var(--tw-bg-opacity))}.bg-sky-500{--tw-bg-opacity:1;background-color:rgb(14 165 233/var(--tw-bg-opacity))}.bg-transparent{background-color:transparent}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}.p-1{padding:.25rem}.p-2{padding:.5rem}.p-2\.5{padding:.625rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-6{padding:1.5rem}.px-0{padding-left:0;padding-right:0}.px-1{padding-left:.25rem;padding-right:.25rem}.px-10{padding-left:2.5rem;padding-right:2.5rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.px-8{padding-left:2rem;padding-right:2rem}.py-0{padding-top:0;padding-bottom:0}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.pb-1{padding-bottom:.25rem}.pl-12{padding-left:3rem}.pl-16{padding-left:4rem}.pr-14{padding-right:3.5rem}.pr-8{padding-right:2rem}.pt-1{padding-top:.25rem}.pt-16{padding-top:4rem}.text-left{text-align:left}.text-center{text-align:center}.text-start{text-align:start}.align-middle{vertical-align:middle}.text-2xl{font-size:1.5rem;line-height:2rem}.text-3xs{font-size:8px}.text-base{font-size:1rem;line-height:1.5rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs{font-size:.75rem;line-height:1rem}.font-bold{font-weight:700}.font-light{font-weight:300}.font-medium{font-weight:500}.font-semibold{font-weight:600}.lowercase{text-transform:lowercase}.leading-6{line-height:1.5rem}.text-base{color:var(--color-base-500)}.text-base-400{color:var(--color-base-400)}.text-base-500{color:var(--color-base-500)}.text-base-600{color:var(--color-base-600)}.text-base-700{color:var(--color-base-700)}.text-base-800{color:var(--color-base-800)}.text-base-900{color:var(--color-base-900)}.text-base-950{color:var(--color-base-950)}.text-gray-400{--tw-text-opacity:1;color:rgb(156 163 175/var(--tw-text-opacity))}.text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128/var(--tw-text-opacity))}.text-gray-600{--tw-text-opacity:1;color:rgb(75 85 99/var(--tw-text-opacity))}.text-gray-700{--tw-text-opacity:1;color:rgb(55 65 81/var(--tw-text-opacity))}.text-gray-900{--tw-text-opacity:1;color:rgb(17 24 39/var(--tw-text-opacity))}.text-indigo-600{--tw-text-opacity:1;color:rgb(79 70 229/var(--tw-text-opacity))}.text-primary{color:var(--color-primary-500)}.text-primary-100{color:var(--color-primary-100)}.text-transparent{color:transparent}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.underline{text-decoration-line:underline}.opacity-0{opacity:0}.opacity-100{opacity:1}.opacity-25{opacity:.25}.opacity-75{opacity:.75}.shadow-lg{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color)}.shadow-lg,.shadow-sm{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color)}.shadow-xl{--tw-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1);--tw-shadow-colored:0 20px 25px -5px var(--tw-shadow-color),0 8px 10px -6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.outline-none{outline:2px solid transparent;outline-offset:2px}.outline-primary{outline-color:var(--color-primary-500)}.ring-0{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color)}.ring-0,.ring-1{box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.ring-1{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color)}.ring-black{--tw-ring-opacity:1;--tw-ring-color:rgb(0 0 0/var(--tw-ring-opacity))}.ring-opacity-5{--tw-ring-opacity:0.05}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-100{transition-duration:.1s}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.ease-in{transition-timing-function:cubic-bezier(.4,0,1,1)}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.ease-linear{transition-timing-function:linear}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}@keyframes ripple-effect{0%{transform:scale(0);opacity:1}to{transform:scale(4);opacity:0}}.ripple{position:absolute;border-radius:9999px;background-color:currentColor;transform:scale(0);animation:ripple-effect .5s linear;background-color:var(--ripple-color)}.checked\:bg-primary:checked{background-color:var(--color-primary-500)}.hover\:border-base-300:hover{border-color:var(--color-base-300)}.hover\:border-primary-500:hover{border-color:var(--color-primary-500)}.hover\:bg-base-100:hover{background-color:var(--color-base-100)}.hover\:bg-base-300:hover{background-color:var(--color-base-300)}.hover\:bg-base-50:hover{background-color:var(--color-base-50)}.hover\:bg-gray-100:hover{--tw-bg-opacity:1;background-color:rgb(243 244 246/var(--tw-bg-opacity))}.hover\:bg-primary-500:hover{background-color:var(--color-primary-500)}.hover\:bg-red-700:hover{--tw-bg-opacity:1;background-color:rgb(185 28 28/var(--tw-bg-opacity))}.hover\:text-base-600:hover{color:var(--color-base-600)}.hover\:text-base-900:hover{color:var(--color-base-900)}.hover\:text-gray-700:hover{--tw-text-opacity:1;color:rgb(55 65 81/var(--tw-text-opacity))}.hover\:text-primary-50:hover{color:var(--color-primary-50)}.hover\:text-primary-500:hover{color:var(--color-primary-500)}.checked\:hover\:bg-primary:hover:checked{background-color:var(--color-primary-500)}.focus\:border-primary-500:focus{border-color:var(--color-primary-500)}.focus\:bg-base-100:focus{background-color:var(--color-base-100)}.focus\:bg-base-50:focus{background-color:var(--color-base-50)}.focus\:bg-gray-200:focus{--tw-bg-opacity:1;background-color:rgb(229 231 235/var(--tw-bg-opacity))}.focus\:bg-indigo-700:focus{--tw-bg-opacity:1;background-color:rgb(67 56 202/var(--tw-bg-opacity))}.focus\:bg-red-700:focus{--tw-bg-opacity:1;background-color:rgb(185 28 28/var(--tw-bg-opacity))}.focus\:shadow-primary:focus{--tw-shadow-color:var(--color-primary-500);--tw-shadow:var(--tw-shadow-colored)}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\:outline-primary:focus{outline-color:var(--color-primary-500)}.focus\:ring-0:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus\:ring-primary-500:focus,.focus\:ring-primary:focus{--tw-ring-color:var(--color-primary-500)}.checked\:focus\:bg-primary:focus:checked{background-color:var(--color-primary-500)}.disabled\:bg-base-200:disabled{background-color:var(--color-base-200)}.disabled\:bg-white:disabled{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}.disabled\:text-base-400:disabled{color:var(--color-base-400)}.disabled\:text-gray-400:disabled{--tw-text-opacity:1;color:rgb(156 163 175/var(--tw-text-opacity))}.disabled\:hover\:bg-base-200:hover:disabled{background-color:var(--color-base-200)}.peer:-moz-placeholder-shown~.peer-placeholder-shown\:start-0{inset-inline-start:0}.peer:placeholder-shown~.peer-placeholder-shown\:start-0{inset-inline-start:0}.peer:-moz-placeholder-shown~.peer-placeholder-shown\:top-1\/2{top:50%}.peer:placeholder-shown~.peer-placeholder-shown\:top-1\/2{top:50%}.peer:-moz-placeholder-shown~.peer-placeholder-shown\:bg-transparent{background-color:transparent}.peer:placeholder-shown~.peer-placeholder-shown\:bg-transparent{background-color:transparent}.peer:-moz-placeholder-shown~.peer-placeholder-shown\:px-1{padding-left:.25rem;padding-right:.25rem}.peer:placeholder-shown~.peer-placeholder-shown\:px-1{padding-left:.25rem;padding-right:.25rem}.peer:-moz-placeholder-shown~.peer-placeholder-shown\:px-2{padding-left:.5rem;padding-right:.5rem}.peer:placeholder-shown~.peer-placeholder-shown\:px-2{padding-left:.5rem;padding-right:.5rem}.peer:-moz-placeholder-shown~.peer-placeholder-shown\:px-2\.5{padding-left:.625rem;padding-right:.625rem}.peer:placeholder-shown~.peer-placeholder-shown\:px-2\.5{padding-left:.625rem;padding-right:.625rem}.peer:-moz-placeholder-shown~.peer-placeholder-shown\:px-4{padding-left:1rem;padding-right:1rem}.peer:placeholder-shown~.peer-placeholder-shown\:px-4{padding-left:1rem;padding-right:1rem}.peer:-moz-placeholder-shown~.peer-placeholder-shown\:ps-16{padding-inline-start:4rem}.peer:placeholder-shown~.peer-placeholder-shown\:ps-16{padding-inline-start:4rem}.peer:focus~.peer-focus\:start-1{inset-inline-start:.25rem}.peer:focus~.peer-focus\:top-0{top:0}.peer:focus~.peer-focus\:bg-base-800{background-color:var(--color-base-800)}.peer:focus~.peer-focus\:bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}.peer:focus~.peer-focus\:px-0{padding-left:0;padding-right:0}.peer:focus~.peer-focus\:px-1{padding-left:.25rem;padding-right:.25rem}@media (min-width:640px){.sm\:fixed{position:fixed}.sm\:inset-y-0{top:0;bottom:0}.sm\:flex{display:flex}.sm\:w-72{width:18rem}.sm\:translate-y-0{--tw-translate-y:0px}.sm\:scale-100,.sm\:translate-y-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.sm\:scale-100{--tw-scale-x:1;--tw-scale-y:1}.sm\:scale-95{--tw-scale-x:.95;--tw-scale-y:.95;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.sm\:flex-col{flex-direction:column}.sm\:pl-72{padding-left:18rem}.sm\:pr-72{padding-right:18rem}.sm\:text-sm{font-size:.875rem;line-height:1.25rem}}@media (min-width:768px){.md\:fixed{position:fixed}.md\:inset-y-0{top:0;bottom:0}.md\:flex{display:flex}.md\:w-72{width:18rem}.md\:flex-col{flex-direction:column}.md\:pl-72{padding-left:18rem}.md\:pr-72{padding-right:18rem}}@media (min-width:1024px){.lg\:fixed{position:fixed}.lg\:inset-y-0{top:0;bottom:0}.lg\:flex{display:flex}.lg\:w-72{width:18rem}.lg\:w-px{width:1px}.lg\:flex-col{flex-direction:column}.lg\:bg-gray-200{--tw-bg-opacity:1;background-color:rgb(229 231 235/var(--tw-bg-opacity))}.lg\:pl-72{padding-left:18rem}.lg\:pr-72{padding-right:18rem}}@media (min-width:1280px){.xl\:fixed{position:fixed}.xl\:inset-y-0{top:0;bottom:0}.xl\:flex{display:flex}.xl\:w-72{width:18rem}.xl\:flex-col{flex-direction:column}.xl\:pl-72{padding-left:18rem}.xl\:pr-72{padding-right:18rem}}@media (min-width:1536px){.\32xl\:fixed{position:fixed}.\32xl\:inset-y-0{top:0;bottom:0}.\32xl\:flex{display:flex}.\32xl\:w-72{width:18rem}.\32xl\:flex-col{flex-direction:column}.\32xl\:pl-72{padding-left:18rem}.\32xl\:pr-72{padding-right:18rem}}@media (prefers-color-scheme:dark){.dark\:border-base-500{border-color:var(--color-base-500)}.dark\:border-base-600{border-color:var(--color-base-600)}.dark\:border-base-700{border-color:var(--color-base-700)}.dark\:border-primary-600{border-color:var(--color-primary-600)}.dark\:bg-base-700{background-color:var(--color-base-700)}.dark\:bg-base-800{background-color:var(--color-base-800)}.dark\:bg-gray-700{--tw-bg-opacity:1;background-color:rgb(55 65 81/var(--tw-bg-opacity))}.dark\:bg-gray-900\/30{background-color:rgba(17,24,39,.3)}.dark\:bg-transparent{background-color:transparent}.dark\:text-base-100{color:var(--color-base-100)}.dark\:text-base-200{color:var(--color-base-200)}.dark\:text-base-300{color:var(--color-base-300)}.dark\:text-base-400{color:var(--color-base-400)}.dark\:text-base-50{color:var(--color-base-50)}.dark\:text-base-500{color:var(--color-base-500)}.dark\:checked\:bg-primary:checked{background-color:var(--color-primary-500)}.dark\:hover\:border-base-600:hover{border-color:var(--color-base-600)}.dark\:hover\:border-primary-500:hover{border-color:var(--color-primary-500)}.dark\:hover\:bg-base-600:hover{background-color:var(--color-base-600)}.dark\:hover\:bg-base-800:hover{background-color:var(--color-base-800)}.dark\:hover\:bg-base-900:hover{background-color:var(--color-base-900)}.dark\:hover\:text-base-200:hover{color:var(--color-base-200)}.dark\:focus\:border-primary-500:focus{border-color:var(--color-primary-500)}.dark\:focus\:bg-base-800:focus{background-color:var(--color-base-800)}.dark\:focus\:outline-primary:focus{outline-color:var(--color-primary-500)}.dark\:focus\:ring-primary-500:focus{--tw-ring-color:var(--color-primary-500)}.dark\:disabled\:border-base-200:disabled{border-color:var(--color-base-200)}.dark\:disabled\:border-base-700:disabled{border-color:var(--color-base-700)}.dark\:disabled\:bg-base-700:disabled{background-color:var(--color-base-700)}.dark\:disabled\:text-base-500:disabled{color:var(--color-base-500)}.dark\:disabled\:hover\:border-base-200:hover:disabled{border-color:var(--color-base-200)}.dark\:disabled\:hover\:border-base-700:hover:disabled{border-color:var(--color-base-700)}.dark\:disabled\:hover\:bg-base-700:hover:disabled{background-color:var(--color-base-700)}}
3
+ /*! tailwindcss v3.4.10 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}[multiple],[type=date],[type=datetime-local],[type=email],[type=month],[type=number],[type=password],[type=search],[type=tel],[type=text],[type=time],[type=url],[type=week],input:where(:not([type])),select,textarea{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#fff;border-color:#6b7280;border-width:1px;border-radius:0;padding:.5rem .75rem;font-size:1rem;line-height:1.5rem;--tw-shadow:0 0 #0000}[multiple]:focus,[type=date]:focus,[type=datetime-local]:focus,[type=email]:focus,[type=month]:focus,[type=number]:focus,[type=password]:focus,[type=search]:focus,[type=tel]:focus,[type=text]:focus,[type=time]:focus,[type=url]:focus,[type=week]:focus,input:where(:not([type])):focus,select:focus,textarea:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-inset:var(--tw-empty,/*!*/ /*!*/);--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#2563eb;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);border-color:#2563eb}input::-moz-placeholder,textarea::-moz-placeholder{color:#6b7280;opacity:1}input::placeholder,textarea::placeholder{color:#6b7280;opacity:1}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-date-and-time-value{min-height:1.5em;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-meridiem-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-year-field{padding-top:0;padding-bottom:0}select{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3E%3C/svg%3E");background-position:right .5rem center;background-repeat:no-repeat;background-size:1.5em 1.5em;padding-right:2.5rem;-webkit-print-color-adjust:exact;print-color-adjust:exact}[multiple],[size]:where(select:not([size="1"])){background-image:none;background-position:0 0;background-repeat:unset;background-size:initial;padding-right:.75rem;-webkit-print-color-adjust:unset;print-color-adjust:unset}[type=checkbox],[type=radio]{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:0;-webkit-print-color-adjust:exact;print-color-adjust:exact;display:inline-block;vertical-align:middle;background-origin:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none;flex-shrink:0;height:1rem;width:1rem;color:#2563eb;background-color:#fff;border-color:#6b7280;border-width:1px;--tw-shadow:0 0 #0000}[type=checkbox]{border-radius:0}[type=radio]{border-radius:100%}[type=checkbox]:focus,[type=radio]:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-inset:var(--tw-empty,/*!*/ /*!*/);--tw-ring-offset-width:2px;--tw-ring-offset-color:#fff;--tw-ring-color:#2563eb;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}[type=checkbox]:checked,[type=radio]:checked{border-color:transparent;background-color:currentColor;background-size:100% 100%;background-position:50%;background-repeat:no-repeat}[type=checkbox]:checked{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3E%3Cpath d='M12.207 4.793a1 1 0 0 1 0 1.414l-5 5a1 1 0 0 1-1.414 0l-2-2a1 1 0 0 1 1.414-1.414L6.5 9.086l4.293-4.293a1 1 0 0 1 1.414 0'/%3E%3C/svg%3E")}@media (forced-colors:active) {[type=checkbox]:checked{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto}}[type=radio]:checked{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23fff' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='3'/%3E%3C/svg%3E")}@media (forced-colors:active) {[type=radio]:checked{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto}}[type=checkbox]:checked:focus,[type=checkbox]:checked:hover,[type=radio]:checked:focus,[type=radio]:checked:hover{border-color:transparent;background-color:currentColor}[type=checkbox]:indeterminate{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3E%3C/svg%3E");border-color:transparent;background-color:currentColor;background-size:100% 100%;background-position:50%;background-repeat:no-repeat}@media (forced-colors:active) {[type=checkbox]:indeterminate{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto}}[type=checkbox]:indeterminate:focus,[type=checkbox]:indeterminate:hover{border-color:transparent;background-color:currentColor}[type=file]{background:unset;border-color:inherit;border-width:0;border-radius:0;padding:0;font-size:unset;line-height:inherit}[type=file]:focus{outline:1px solid ButtonText;outline:1px auto -webkit-focus-ring-color}*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }.pointer-events-none{pointer-events:none}.static{position:static}.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.inset-0{inset:0}.bottom-20{bottom:5rem}.left-1\/2{left:50%}.right-0{right:0}.start-1{inset-inline-start:.25rem}.top-0{top:0}.z-10{z-index:10}.z-20{z-index:20}.z-30{z-index:30}.mx-1{margin-left:.25rem;margin-right:.25rem}.mx-3{margin-left:.75rem;margin-right:.75rem}.mx-4{margin-left:1rem;margin-right:1rem}.my-1{margin-top:.25rem;margin-bottom:.25rem}.-mb-2{margin-bottom:-.5rem}.mb-1{margin-bottom:.25rem}.mb-4{margin-bottom:1rem}.ml-4{margin-left:1rem}.ms-1{margin-inline-start:.25rem}.mt-1{margin-top:.25rem}.mt-6{margin-top:1.5rem}.block{display:block}.flex{display:flex}.inline-flex{display:inline-flex}.inline-grid{display:inline-grid}.contents{display:contents}.hidden{display:none}.\!h-4{height:1rem!important}.\!h-5{height:1.25rem!important}.\!h-6{height:1.5rem!important}.\!h-7{height:1.75rem!important}.h-1{height:.25rem}.h-10{height:2.5rem}.h-12{height:3rem}.h-16{height:4rem}.h-2{height:.5rem}.h-3{height:.75rem}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-full{height:100%}.h-screen{height:100vh}.max-h-1\/2vh{max-height:50vh}.max-h-80{max-height:20rem}.max-h-full{max-height:100%}.max-h-screen{max-height:100vh}.min-h-full{min-height:100%}.\!w-4{width:1rem!important}.\!w-5{width:1.25rem!important}.\!w-6{width:1.5rem!important}.\!w-7{width:1.75rem!important}.w-1\/2{width:50%}.w-1\/3{width:33.333333%}.w-10{width:2.5rem}.w-12{width:3rem}.w-16{width:4rem}.w-20{width:5rem}.w-3{width:.75rem}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-64{width:16rem}.w-7\/10{width:70%}.w-72{width:18rem}.w-8{width:2rem}.w-96{width:24rem}.w-full{width:100%}.w-max{width:-moz-max-content;width:max-content}.w-screen{width:100vw}.min-w-40{min-width:10rem}.min-w-52{min-width:13rem}.max-w-full{max-width:100%}.max-w-min{max-width:-moz-min-content;max-width:min-content}.shrink-0{flex-shrink:0}.flex-grow,.grow{flex-grow:1}.origin-top{transform-origin:top}.-translate-x-1\/2{--tw-translate-x:-50%}.-translate-x-1\/2,.-translate-x-full{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-x-full{--tw-translate-x:-100%}.-translate-y-1\/2{--tw-translate-y:-50%}.-translate-y-1\/2,.-translate-y-full{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-full{--tw-translate-y:-100%}.translate-x-0{--tw-translate-x:0px}.translate-x-0,.translate-x-1\/2{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-x-1\/2{--tw-translate-x:50%}.translate-x-full{--tw-translate-x:100%}.translate-x-full,.translate-y-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-y-0{--tw-translate-y:0px}.translate-y-4{--tw-translate-y:1rem}.translate-y-4,.translate-y-full{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-y-full{--tw-translate-y:100%}.scale-100{--tw-scale-x:1;--tw-scale-y:1}.scale-100,.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}@keyframes ping{75%,to{transform:scale(2);opacity:0}}.animate-ping{animation:ping 1s cubic-bezier(0,0,.2,1) infinite}@keyframes spin{to{transform:rotate(1turn)}}.animate-spin{animation:spin 1s linear infinite}.cursor-auto{cursor:auto}.cursor-default{cursor:default}.cursor-pointer{cursor:pointer}.select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}.appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}.flex-row{flex-direction:row}.flex-row-reverse{flex-direction:row-reverse}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.flex-wrap{flex-wrap:wrap}.flex-nowrap{flex-wrap:nowrap}.place-items-center{place-items:center}.items-center{align-items:center}.justify-start{justify-content:flex-start}.justify-end{justify-content:flex-end}.justify-center{justify-content:center}.gap-0{gap:0}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.space-x-6>:not([hidden])~:not([hidden]){--tw-space-x-reverse:0;margin-right:calc(1.5rem*var(--tw-space-x-reverse));margin-left:calc(1.5rem*(1 - var(--tw-space-x-reverse)))}.space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem*var(--tw-space-y-reverse))}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.text-ellipsis{text-overflow:ellipsis}.text-nowrap{text-wrap:nowrap}.rounded{border-radius:.25rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.rounded-md{border-radius:.375rem}.rounded-none{border-radius:0}.rounded-bl-lg{border-bottom-left-radius:.5rem}.rounded-br-lg{border-bottom-right-radius:.5rem}.rounded-tl-lg{border-top-left-radius:.5rem}.rounded-tr-lg{border-top-right-radius:.5rem}.border{border-width:1px}.border-0{border-width:0}.border-2{border-width:2px}.border-b{border-bottom-width:1px}.border-b-2{border-bottom-width:2px}.border-t{border-top-width:1px}.border-base{border-color:var(--color-base-500)}.border-base-100{border-color:var(--color-base-100)}.border-base-200{border-color:var(--color-base-200)}.border-base-300{border-color:var(--color-base-300)}.border-primary{border-color:var(--color-primary-500)}.bg-base-100{background-color:var(--color-base-100)}.bg-base-200{background-color:var(--color-base-200)}.bg-base-50{background-color:var(--color-base-50)}.bg-gray-100{--tw-bg-opacity:1;background-color:rgb(243 244 246/var(--tw-bg-opacity))}.bg-gray-200{--tw-bg-opacity:1;background-color:rgb(229 231 235/var(--tw-bg-opacity))}.bg-gray-500\/20{background-color:hsla(220,9%,46%,.2)}.bg-indigo-600{--tw-bg-opacity:1;background-color:rgb(79 70 229/var(--tw-bg-opacity))}.bg-primary-600{background-color:var(--color-primary-600)}.bg-red-500{--tw-bg-opacity:1;background-color:rgb(239 68 68/var(--tw-bg-opacity))}.bg-sky-400{--tw-bg-opacity:1;background-color:rgb(56 189 248/var(--tw-bg-opacity))}.bg-sky-500{--tw-bg-opacity:1;background-color:rgb(14 165 233/var(--tw-bg-opacity))}.bg-transparent{background-color:transparent}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}.\!p-3{padding:.75rem!important}.p-1{padding:.25rem}.p-2{padding:.5rem}.p-2\.5{padding:.625rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-6{padding:1.5rem}.px-0{padding-left:0;padding-right:0}.px-1{padding-left:.25rem;padding-right:.25rem}.px-10{padding-left:2.5rem;padding-right:2.5rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-4{padding-left:1rem;padding-right:1rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.px-8{padding-left:2rem;padding-right:2rem}.py-0{padding-top:0;padding-bottom:0}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-4{padding-top:1rem;padding-bottom:1rem}.py-6{padding-top:1.5rem;padding-bottom:1.5rem}.pb-1{padding-bottom:.25rem}.pl-12{padding-left:3rem}.pl-16{padding-left:4rem}.pr-14{padding-right:3.5rem}.pr-8{padding-right:2rem}.pt-1{padding-top:.25rem}.pt-16{padding-top:4rem}.text-left{text-align:left}.text-center{text-align:center}.text-start{text-align:start}.align-middle{vertical-align:middle}.text-2xl{font-size:1.5rem;line-height:2rem}.text-3xs{font-size:8px}.text-base{font-size:1rem;line-height:1.5rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs{font-size:.75rem;line-height:1rem}.font-bold{font-weight:700}.font-light{font-weight:300}.font-medium{font-weight:500}.font-semibold{font-weight:600}.lowercase{text-transform:lowercase}.leading-6{line-height:1.5rem}.text-base{color:var(--color-base-500)}.text-base-400{color:var(--color-base-400)}.text-base-500{color:var(--color-base-500)}.text-base-600{color:var(--color-base-600)}.text-base-700{color:var(--color-base-700)}.text-base-800{color:var(--color-base-800)}.text-base-900{color:var(--color-base-900)}.text-base-950{color:var(--color-base-950)}.text-gray-400{--tw-text-opacity:1;color:rgb(156 163 175/var(--tw-text-opacity))}.text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128/var(--tw-text-opacity))}.text-gray-600{--tw-text-opacity:1;color:rgb(75 85 99/var(--tw-text-opacity))}.text-gray-700{--tw-text-opacity:1;color:rgb(55 65 81/var(--tw-text-opacity))}.text-gray-900{--tw-text-opacity:1;color:rgb(17 24 39/var(--tw-text-opacity))}.text-indigo-600{--tw-text-opacity:1;color:rgb(79 70 229/var(--tw-text-opacity))}.text-primary{color:var(--color-primary-500)}.text-primary-100{color:var(--color-primary-100)}.text-transparent{color:transparent}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.underline{text-decoration-line:underline}.opacity-0{opacity:0}.opacity-100{opacity:1}.opacity-25{opacity:.25}.opacity-75{opacity:.75}.shadow-lg{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color)}.shadow-lg,.shadow-sm{box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 2px 0 rgba(0,0,0,.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color)}.shadow-xl{--tw-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1);--tw-shadow-colored:0 20px 25px -5px var(--tw-shadow-color),0 8px 10px -6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.outline-none{outline:2px solid transparent;outline-offset:2px}.outline-primary{outline-color:var(--color-primary-500)}.ring-0{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color)}.ring-0,.ring-1{box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.ring-1{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color)}.ring-black{--tw-ring-opacity:1;--tw-ring-color:rgb(0 0 0/var(--tw-ring-opacity))}.ring-opacity-5{--tw-ring-opacity:0.05}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-100{transition-duration:.1s}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.ease-in{transition-timing-function:cubic-bezier(.4,0,1,1)}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.ease-linear{transition-timing-function:linear}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}@keyframes ripple-effect{0%{transform:scale(0);opacity:1}to{transform:scale(4);opacity:0}}.ripple{position:absolute;border-radius:9999px;background-color:currentColor;transform:scale(0);animation:ripple-effect .5s linear;background-color:var(--ripple-color)}.checked\:bg-primary:checked{background-color:var(--color-primary-500)}.hover\:border-base-300:hover{border-color:var(--color-base-300)}.hover\:border-primary-500:hover{border-color:var(--color-primary-500)}.hover\:bg-base-100:hover{background-color:var(--color-base-100)}.hover\:bg-base-300:hover{background-color:var(--color-base-300)}.hover\:bg-base-50:hover{background-color:var(--color-base-50)}.hover\:bg-gray-100:hover{--tw-bg-opacity:1;background-color:rgb(243 244 246/var(--tw-bg-opacity))}.hover\:bg-primary-500:hover{background-color:var(--color-primary-500)}.hover\:bg-red-700:hover{--tw-bg-opacity:1;background-color:rgb(185 28 28/var(--tw-bg-opacity))}.hover\:text-base-600:hover{color:var(--color-base-600)}.hover\:text-base-900:hover{color:var(--color-base-900)}.hover\:text-gray-700:hover{--tw-text-opacity:1;color:rgb(55 65 81/var(--tw-text-opacity))}.hover\:text-primary-50:hover{color:var(--color-primary-50)}.hover\:text-primary-500:hover{color:var(--color-primary-500)}.checked\:hover\:bg-primary:hover:checked{background-color:var(--color-primary-500)}.focus\:border-primary-500:focus{border-color:var(--color-primary-500)}.focus\:bg-base-100:focus{background-color:var(--color-base-100)}.focus\:bg-base-50:focus{background-color:var(--color-base-50)}.focus\:bg-gray-200:focus{--tw-bg-opacity:1;background-color:rgb(229 231 235/var(--tw-bg-opacity))}.focus\:bg-indigo-700:focus{--tw-bg-opacity:1;background-color:rgb(67 56 202/var(--tw-bg-opacity))}.focus\:bg-red-700:focus{--tw-bg-opacity:1;background-color:rgb(185 28 28/var(--tw-bg-opacity))}.focus\:shadow-primary:focus{--tw-shadow-color:var(--color-primary-500);--tw-shadow:var(--tw-shadow-colored)}.focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.focus\:outline-primary:focus{outline-color:var(--color-primary-500)}.focus\:ring-0:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.focus\:ring-primary-500:focus,.focus\:ring-primary:focus{--tw-ring-color:var(--color-primary-500)}.checked\:focus\:bg-primary:focus:checked{background-color:var(--color-primary-500)}.disabled\:bg-base-200:disabled{background-color:var(--color-base-200)}.disabled\:bg-white:disabled{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}.disabled\:text-base-400:disabled{color:var(--color-base-400)}.disabled\:text-gray-400:disabled{--tw-text-opacity:1;color:rgb(156 163 175/var(--tw-text-opacity))}.disabled\:hover\:bg-base-200:hover:disabled{background-color:var(--color-base-200)}.peer:-moz-placeholder-shown~.peer-placeholder-shown\:start-0{inset-inline-start:0}.peer:placeholder-shown~.peer-placeholder-shown\:start-0{inset-inline-start:0}.peer:-moz-placeholder-shown~.peer-placeholder-shown\:top-1\/2{top:50%}.peer:placeholder-shown~.peer-placeholder-shown\:top-1\/2{top:50%}.peer:-moz-placeholder-shown~.peer-placeholder-shown\:bg-transparent{background-color:transparent}.peer:placeholder-shown~.peer-placeholder-shown\:bg-transparent{background-color:transparent}.peer:-moz-placeholder-shown~.peer-placeholder-shown\:px-1{padding-left:.25rem;padding-right:.25rem}.peer:placeholder-shown~.peer-placeholder-shown\:px-1{padding-left:.25rem;padding-right:.25rem}.peer:-moz-placeholder-shown~.peer-placeholder-shown\:px-2{padding-left:.5rem;padding-right:.5rem}.peer:placeholder-shown~.peer-placeholder-shown\:px-2{padding-left:.5rem;padding-right:.5rem}.peer:-moz-placeholder-shown~.peer-placeholder-shown\:px-2\.5{padding-left:.625rem;padding-right:.625rem}.peer:placeholder-shown~.peer-placeholder-shown\:px-2\.5{padding-left:.625rem;padding-right:.625rem}.peer:-moz-placeholder-shown~.peer-placeholder-shown\:px-4{padding-left:1rem;padding-right:1rem}.peer:placeholder-shown~.peer-placeholder-shown\:px-4{padding-left:1rem;padding-right:1rem}.peer:-moz-placeholder-shown~.peer-placeholder-shown\:ps-16{padding-inline-start:4rem}.peer:placeholder-shown~.peer-placeholder-shown\:ps-16{padding-inline-start:4rem}.peer:focus~.peer-focus\:start-1{inset-inline-start:.25rem}.peer:focus~.peer-focus\:top-0{top:0}.peer:focus~.peer-focus\:bg-base-800{background-color:var(--color-base-800)}.peer:focus~.peer-focus\:bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}.peer:focus~.peer-focus\:px-0{padding-left:0;padding-right:0}.peer:focus~.peer-focus\:px-1{padding-left:.25rem;padding-right:.25rem}@media (min-width:640px){.sm\:fixed{position:fixed}.sm\:inset-y-0{top:0;bottom:0}.sm\:flex{display:flex}.sm\:w-72{width:18rem}.sm\:translate-y-0{--tw-translate-y:0px}.sm\:scale-100,.sm\:translate-y-0{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.sm\:scale-100{--tw-scale-x:1;--tw-scale-y:1}.sm\:scale-95{--tw-scale-x:.95;--tw-scale-y:.95;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.sm\:flex-col{flex-direction:column}.sm\:pl-72{padding-left:18rem}.sm\:pr-72{padding-right:18rem}.sm\:text-sm{font-size:.875rem;line-height:1.25rem}}@media (min-width:768px){.md\:fixed{position:fixed}.md\:inset-y-0{top:0;bottom:0}.md\:flex{display:flex}.md\:w-72{width:18rem}.md\:flex-col{flex-direction:column}.md\:pl-72{padding-left:18rem}.md\:pr-72{padding-right:18rem}}@media (min-width:1024px){.lg\:fixed{position:fixed}.lg\:inset-y-0{top:0;bottom:0}.lg\:flex{display:flex}.lg\:w-72{width:18rem}.lg\:w-px{width:1px}.lg\:flex-col{flex-direction:column}.lg\:bg-gray-200{--tw-bg-opacity:1;background-color:rgb(229 231 235/var(--tw-bg-opacity))}.lg\:pl-72{padding-left:18rem}.lg\:pr-72{padding-right:18rem}}@media (min-width:1280px){.xl\:fixed{position:fixed}.xl\:inset-y-0{top:0;bottom:0}.xl\:flex{display:flex}.xl\:w-72{width:18rem}.xl\:flex-col{flex-direction:column}.xl\:pl-72{padding-left:18rem}.xl\:pr-72{padding-right:18rem}}@media (min-width:1536px){.\32xl\:fixed{position:fixed}.\32xl\:inset-y-0{top:0;bottom:0}.\32xl\:flex{display:flex}.\32xl\:w-72{width:18rem}.\32xl\:flex-col{flex-direction:column}.\32xl\:pl-72{padding-left:18rem}.\32xl\:pr-72{padding-right:18rem}}@media (prefers-color-scheme:dark){.dark\:border-base-500{border-color:var(--color-base-500)}.dark\:border-base-600{border-color:var(--color-base-600)}.dark\:border-base-700{border-color:var(--color-base-700)}.dark\:border-primary-600{border-color:var(--color-primary-600)}.dark\:bg-base-700{background-color:var(--color-base-700)}.dark\:bg-base-800{background-color:var(--color-base-800)}.dark\:bg-gray-700{--tw-bg-opacity:1;background-color:rgb(55 65 81/var(--tw-bg-opacity))}.dark\:bg-gray-900\/30{background-color:rgba(17,24,39,.3)}.dark\:bg-transparent{background-color:transparent}.dark\:text-base-100{color:var(--color-base-100)}.dark\:text-base-200{color:var(--color-base-200)}.dark\:text-base-300{color:var(--color-base-300)}.dark\:text-base-400{color:var(--color-base-400)}.dark\:text-base-50{color:var(--color-base-50)}.dark\:text-base-500{color:var(--color-base-500)}.dark\:checked\:bg-primary:checked{background-color:var(--color-primary-500)}.dark\:hover\:border-base-600:hover{border-color:var(--color-base-600)}.dark\:hover\:border-primary-500:hover{border-color:var(--color-primary-500)}.dark\:hover\:bg-base-600:hover{background-color:var(--color-base-600)}.dark\:hover\:bg-base-800:hover{background-color:var(--color-base-800)}.dark\:hover\:bg-base-900:hover{background-color:var(--color-base-900)}.dark\:hover\:text-base-200:hover{color:var(--color-base-200)}.dark\:focus\:border-primary-500:focus{border-color:var(--color-primary-500)}.dark\:focus\:bg-base-800:focus{background-color:var(--color-base-800)}.dark\:focus\:outline-primary:focus{outline-color:var(--color-primary-500)}.dark\:focus\:ring-primary-500:focus{--tw-ring-color:var(--color-primary-500)}.dark\:disabled\:border-base-200:disabled{border-color:var(--color-base-200)}.dark\:disabled\:border-base-700:disabled{border-color:var(--color-base-700)}.dark\:disabled\:bg-base-700:disabled{background-color:var(--color-base-700)}.dark\:disabled\:text-base-500:disabled{color:var(--color-base-500)}.dark\:disabled\:hover\:border-base-200:hover:disabled{border-color:var(--color-base-200)}.dark\:disabled\:hover\:border-base-700:hover:disabled{border-color:var(--color-base-700)}.dark\:disabled\:hover\:bg-base-700:hover:disabled{background-color:var(--color-base-700)}}
@@ -7,7 +7,7 @@ export type CropperDialogPropsType = {
7
7
  inputImageFile?: File | null;
8
8
  className?: string;
9
9
  };
10
- import type { DialogExportsType } from '../dialog/dialog.svelte';
10
+ import type { DialogExports } from '../dialog/dialog.svelte';
11
11
  interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
12
12
  new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
13
13
  $$bindings?: Bindings;
@@ -21,7 +21,7 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
21
21
  };
22
22
  z_$$bindings?: Bindings;
23
23
  }
24
- declare const CropperDialog: $$__sveltets_2_IsomorphicComponent<CropperDialogPropsType & DialogExportsType, {
24
+ declare const CropperDialog: $$__sveltets_2_IsomorphicComponent<CropperDialogPropsType & DialogExports, {
25
25
  [evt: string]: CustomEvent<any>;
26
26
  }, {}, {}, "">;
27
27
  type CropperDialog = InstanceType<typeof CropperDialog>;
@@ -11,7 +11,6 @@ let {
11
11
  backdropClassName = "",
12
12
  bodyClassName = "",
13
13
  bodyComponent,
14
- bodySnippet,
15
14
  cancelable = true,
16
15
  children,
17
16
  className = "",
@@ -25,7 +24,6 @@ let {
25
24
  footerOkButtonSpinner = false,
26
25
  footerOkButtonType = "button",
27
26
  footerOkButtonLable = "Save",
28
- footerSnippet,
29
27
  hasFooter = false,
30
28
  hasFooterCloseButton = false,
31
29
  hasFooterOkButton = false,
@@ -44,7 +42,6 @@ let {
44
42
  hasHeaderBack = isMobileScreen(),
45
43
  hasHeaderClose = !isMobileScreen(),
46
44
  size = isMobileScreen() ? "full" : "sm",
47
- headerSnippet,
48
45
  id = "",
49
46
  onClose,
50
47
  onCloseClick,
@@ -65,10 +62,14 @@ let dialogExports = {
65
62
  setOkEnabled,
66
63
  setOnCloseClick,
67
64
  setOnOkClick,
68
- setOnData
65
+ setOnData,
66
+ setHeaderSnippet,
67
+ setFooterSnippet
69
68
  };
70
69
  let isPlaced = $state(false);
71
70
  let isOpened = $state(false);
71
+ let headerSnippet = $state(null);
72
+ let footerSnippet = $state(null);
72
73
  let CustomComponent = $state(null);
73
74
  let BodyComponent = $state(null);
74
75
  let result;
@@ -131,6 +132,12 @@ export function setOnCloseClick(onclick) {
131
132
  export function postData(data) {
132
133
  onData && onData(data);
133
134
  }
135
+ export function setHeaderSnippet(snippet) {
136
+ headerSnippet = snippet;
137
+ }
138
+ export function setFooterSnippet(snippet) {
139
+ footerSnippet = snippet;
140
+ }
134
141
  function handleBackdropClick() {
135
142
  if (cancelable) {
136
143
  closeDialog();
@@ -185,7 +192,7 @@ $effect(() => {
185
192
  {:else}
186
193
  {#if hasHeader}
187
194
  <div
188
- class="flex items-start gap-4 w-full cursor-default py-2 {hasHeaderShadow
195
+ class="flex items-center gap-4 w-full cursor-default py-2 {hasHeaderShadow
189
196
  ? 'border-b shadow-sm'
190
197
  : ''} {headerClassName}"
191
198
  >
@@ -199,7 +206,7 @@ $effect(() => {
199
206
  />
200
207
  {/if}
201
208
  </div>
202
- <div class="py-2">
209
+ <div class="py-2 flex-grow">
203
210
  {#if hasTitle}
204
211
  <div class="text-xl text-base-800 dark:text-base-300 {titleClassName}">
205
212
  {title || ''}
@@ -211,9 +218,9 @@ $effect(() => {
211
218
  </div>
212
219
  {/if}
213
220
  </div>
214
- <div class="flex-grow">
221
+ <div class="">
215
222
  {#if headerSnippet}
216
- {@render headerSnippet(dialogExports)}
223
+ {@render headerSnippet()}
217
224
  {/if}
218
225
  </div>
219
226
  <div>
@@ -232,8 +239,6 @@ $effect(() => {
232
239
  <div class="flex-grow overflow-y-auto {bodyClassName}">
233
240
  {#if children}
234
241
  {@render children()}
235
- {:else if bodySnippet}
236
- {@render bodySnippet(dialogExports)}
237
242
  {:else if BodyComponent?.length == 2}
238
243
  <BodyComponent {...{ ...props }} {...{ ...dialogExports }} />
239
244
  {/if}
@@ -245,9 +250,10 @@ $effect(() => {
245
250
  ? 'border-t'
246
251
  : ''} {footerClassName}"
247
252
  >
248
- <div class="flex-grow">
253
+ <div class="flex-grow"></div>
254
+ <div>
249
255
  {#if footerSnippet}
250
- {@render footerSnippet(dialogExports)}
256
+ {@render footerSnippet()}
251
257
  {/if}
252
258
  </div>
253
259
  {#if hasFooterOkButton}
@@ -9,7 +9,6 @@ export type DialogProps = {
9
9
  backdropClassName?: string;
10
10
  bodyClassName?: string;
11
11
  bodyComponent?: any;
12
- bodySnippet?: Snippet<[dialogExports: DialogExportsType]>;
13
12
  cancelable?: boolean;
14
13
  children?: Snippet;
15
14
  className?: string;
@@ -23,7 +22,6 @@ export type DialogProps = {
23
22
  footerOkButtonSpinner?: boolean;
24
23
  footerOkButtonType?: 'button' | 'submit' | 'reset';
25
24
  footerOkButtonLable?: string;
26
- footerSnippet?: Snippet<[dialogExports: DialogExportsType]>;
27
25
  hasFooter?: boolean;
28
26
  hasFooterCloseButton?: boolean;
29
27
  hasFooterOkButton?: boolean;
@@ -41,11 +39,10 @@ export type DialogProps = {
41
39
  headerCloseButtonClassName?: string;
42
40
  headerCloseIconClassName?: string;
43
41
  headerCloseIconPath?: string;
44
- headerSnippet?: Snippet<[dialogExports: DialogExportsType]>;
45
42
  id?: string;
46
43
  onClose?: () => void;
47
44
  onCloseClick?: DialogCloseButtonClickFunction;
48
- onOkClick?: (ev: MouseEvent | TouchEvent, options: DialogExportsType) => void;
45
+ onOkClick?: (ev: MouseEvent | TouchEvent, options: DialogExports) => void;
49
46
  onResult?: (value: any) => void;
50
47
  onData?: (data: any) => void;
51
48
  props?: any;
@@ -56,7 +53,7 @@ export type DialogProps = {
56
53
  title?: string;
57
54
  titleClassName?: string;
58
55
  };
59
- export type DialogExportsType = {
56
+ export type DialogExports = {
60
57
  closeDialog: (result?: any) => void;
61
58
  setResult: (result: any) => void;
62
59
  setOkSpinner: (enable: boolean) => void;
@@ -64,6 +61,8 @@ export type DialogExportsType = {
64
61
  setOnOkClick: (onclick: (ev: MouseEvent | TouchEvent) => void) => void;
65
62
  setOnCloseClick: (onclick: DialogCloseButtonClickFunction) => void;
66
63
  setOnData: (listener: (data: any) => void) => void;
64
+ setHeaderSnippet: (snippet: Snippet) => void;
65
+ setFooterSnippet: (snippet: Snippet) => void;
67
66
  };
68
67
  import { type Snippet } from 'svelte';
69
68
  import '../../../../../tailwind.css';
@@ -90,9 +89,11 @@ declare const Dialog: $$__sveltets_2_IsomorphicComponent<DialogProps, {
90
89
  setOkEnabled: (value: boolean) => void;
91
90
  setOkSpinner: (value: boolean) => void;
92
91
  setOnData: (listener: (data: any) => void) => void;
93
- setOnOkClick: (onclick: (event: MouseEvent | TouchEvent, options: DialogExportsType) => void) => void;
92
+ setOnOkClick: (onclick: (event: MouseEvent | TouchEvent, options: DialogExports) => void) => void;
94
93
  setOnCloseClick: (onclick: DialogCloseButtonClickFunction) => void;
95
94
  postData: (data: any) => void;
95
+ setHeaderSnippet: (snippet: Snippet) => void;
96
+ setFooterSnippet: (snippet: Snippet) => void;
96
97
  }, "">;
97
98
  type Dialog = InstanceType<typeof Dialog>;
98
99
  export default Dialog;
@@ -1,4 +1,4 @@
1
- import type { DialogExportsType } from '../dialog/dialog.svelte';
1
+ import type { DialogExports } from '../dialog/dialog.svelte';
2
2
  interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
3
3
  new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
4
4
  $$bindings?: Bindings;
@@ -18,7 +18,7 @@ declare const LoadingDialog: $$__sveltets_2_IsomorphicComponent<{
18
18
  spinnerClassName?: string;
19
19
  containerClassName?: string;
20
20
  className?: string;
21
- } & DialogExportsType, {
21
+ } & DialogExports, {
22
22
  [evt: string]: CustomEvent<any>;
23
23
  }, {}, {}, "">;
24
24
  type LoadingDialog = InstanceType<typeof LoadingDialog>;
@@ -1,10 +1,4 @@
1
- <script lang="ts">let {
2
- className,
3
- msg,
4
- setOnOkClick,
5
- setResult,
6
- closeDialog
7
- } = $props();
1
+ <script lang="ts">let { className, msg, setOnOkClick, setResult, closeDialog } = $props();
8
2
  $effect(() => {
9
3
  setOnOkClick(() => {
10
4
  setResult(true);
@@ -14,5 +8,5 @@ $effect(() => {
14
8
  </script>
15
9
 
16
10
  <div class="p-6 text-base-800 dark:text-base-300 {className}">
17
- <div>{@html (msg ||'')}</div>
11
+ <div>{@html msg || ''}</div>
18
12
  </div>
@@ -1,4 +1,4 @@
1
- import type { DialogExportsType } from '../dialog/dialog.svelte';
1
+ import type { DialogExports } from '../dialog/dialog.svelte';
2
2
  interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
3
3
  new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
4
4
  $$bindings?: Bindings;
@@ -15,7 +15,7 @@ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> =
15
15
  declare const MsgDialog: $$__sveltets_2_IsomorphicComponent<{
16
16
  className?: string;
17
17
  msg?: string;
18
- } & DialogExportsType, {
18
+ } & DialogExports, {
19
19
  [evt: string]: CustomEvent<any>;
20
20
  }, {}, {}, "">;
21
21
  type MsgDialog = InstanceType<typeof MsgDialog>;
@@ -0,0 +1,99 @@
1
+ <script lang="ts" module></script>
2
+
3
+ <script lang="ts">import ButtonListItem from "../../../button/components/button-list-item/button-list-item.svelte";
4
+ import ButtonSearch from "../../../button/components/button-search/button-search.svelte";
5
+ let {
6
+ value,
7
+ items = [],
8
+ multiple = false,
9
+ identityFieldName = "_id",
10
+ titleFieldName = "name",
11
+ subtitleFieldName,
12
+ searchFieldName = "name",
13
+ hasCheckbox,
14
+ hasArrow,
15
+ closeDialog,
16
+ setResult,
17
+ setOnOkClick,
18
+ setHeaderSnippet
19
+ } = $props();
20
+ let selected = $state({ items: {} });
21
+ let searchText = $state("");
22
+ let records = $derived.by(() => {
23
+ if (items && typeof items[0] == "string") {
24
+ return items.map((name) => {
25
+ return {
26
+ [identityFieldName]: name,
27
+ [titleFieldName]: name
28
+ };
29
+ });
30
+ }
31
+ return [...items];
32
+ });
33
+ let filteredRecords = $derived.by(() => {
34
+ if (searchText) {
35
+ return records.filter((item) => {
36
+ return (item[searchFieldName] || "").toLowerCase().indexOf(searchText) >= 0;
37
+ });
38
+ }
39
+ return records;
40
+ });
41
+ $effect(() => {
42
+ if (value) {
43
+ if (Array.isArray(value)) {
44
+ value.forEach((val) => selected.items[val] = val);
45
+ } else {
46
+ selected.items[value] = value;
47
+ }
48
+ }
49
+ });
50
+ function handleItemClick(ev, item, index) {
51
+ let itemId = item[identityFieldName];
52
+ if (!multiple) {
53
+ if (selected.items[itemId]) {
54
+ selected.items = {};
55
+ } else {
56
+ selected.items = { [itemId]: itemId };
57
+ }
58
+ let selectedItemId = Object.keys(selected.items)[0];
59
+ setResult(selectedItemId);
60
+ closeDialog();
61
+ } else {
62
+ if (selected.items[itemId]) {
63
+ delete selected.items[itemId];
64
+ } else {
65
+ selected.items[itemId] = itemId;
66
+ }
67
+ }
68
+ }
69
+ function handleOkClick(ev) {
70
+ if (multiple) {
71
+ closeDialog(Object.keys(selected.items));
72
+ }
73
+ }
74
+ function handleSearch(txt) {
75
+ searchText = txt;
76
+ }
77
+ setOnOkClick(handleOkClick);
78
+ setHeaderSnippet(headerSnippet);
79
+ </script>
80
+
81
+ {#snippet headerSnippet()}
82
+ <ButtonSearch className="rounded-full !p-3 " onSearch={handleSearch} />
83
+ {/snippet}
84
+
85
+ <div class="mb-4">
86
+ {#each filteredRecords as record, index}
87
+ {@const isSelected = !!selected.items[record[identityFieldName]]}
88
+ <div>
89
+ <ButtonListItem
90
+ onClick={(ev) => handleItemClick(ev, record, index)}
91
+ title={record[titleFieldName]}
92
+ subtitle={record[subtitleFieldName || ''] || ''}
93
+ {hasCheckbox}
94
+ {hasArrow}
95
+ isChecked={isSelected}
96
+ />
97
+ </div>
98
+ {/each}
99
+ </div>
@@ -0,0 +1,36 @@
1
+ export type PickerDialogProps = {
2
+ items?: string[] | any[];
3
+ multiple?: boolean;
4
+ value?: string | string[];
5
+ identityFieldName?: string;
6
+ titleFieldName?: string;
7
+ searchFieldName?: string;
8
+ subtitleFieldName?: string;
9
+ hasCheckbox?: boolean;
10
+ checkboxCheckIconPath?: string;
11
+ checkboxUncheckIconPath?: string;
12
+ checkboxCheckIconClassName?: string;
13
+ checkboxUncheckIconClassName?: string;
14
+ hasArrow?: boolean;
15
+ arrowIconPath?: string;
16
+ arrowIconClassName?: string;
17
+ };
18
+ import type { DialogExports } from '../dialog/dialog.svelte';
19
+ interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
20
+ new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
21
+ $$bindings?: Bindings;
22
+ } & Exports;
23
+ (internal: unknown, props: Props & {
24
+ $$events?: Events;
25
+ $$slots?: Slots;
26
+ }): Exports & {
27
+ $set?: any;
28
+ $on?: any;
29
+ };
30
+ z_$$bindings?: Bindings;
31
+ }
32
+ declare const PickerDialog: $$__sveltets_2_IsomorphicComponent<DialogExports & PickerDialogProps, {
33
+ [evt: string]: CustomEvent<any>;
34
+ }, {}, {}, "">;
35
+ type PickerDialog = InstanceType<typeof PickerDialog>;
36
+ export default PickerDialog;
@@ -1,5 +1,5 @@
1
1
  import type { InputValue } from '../../../input/components/input-field/input-field.svelte';
2
- import type { DialogExportsType } from '../dialog/dialog.svelte';
2
+ import type { DialogExports } from '../dialog/dialog.svelte';
3
3
  interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
4
4
  new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
5
5
  $$bindings?: Bindings;
@@ -21,7 +21,7 @@ declare const TextFieldDialog: $$__sveltets_2_IsomorphicComponent<{
21
21
  className?: string;
22
22
  autofocus?: boolean;
23
23
  required?: boolean;
24
- } & DialogExportsType, {
24
+ } & DialogExports, {
25
25
  [evt: string]: CustomEvent<any>;
26
26
  }, {}, {}, "value">;
27
27
  type TextFieldDialog = InstanceType<typeof TextFieldDialog>;
@@ -1,5 +1,5 @@
1
1
  import type { InputValue } from '../../../input/components/input-field/input-field.svelte';
2
- import type { DialogExportsType } from '../dialog/dialog.svelte';
2
+ import type { DialogExports } from '../dialog/dialog.svelte';
3
3
  interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
4
4
  new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
5
5
  $$bindings?: Bindings;
@@ -21,7 +21,7 @@ declare const TextareaFieldDialog: $$__sveltets_2_IsomorphicComponent<{
21
21
  className?: string;
22
22
  autofocus?: boolean;
23
23
  required?: boolean;
24
- } & DialogExportsType, {
24
+ } & DialogExports, {
25
25
  [evt: string]: CustomEvent<any>;
26
26
  }, {}, {}, "value">;
27
27
  type TextareaFieldDialog = InstanceType<typeof TextareaFieldDialog>;
@@ -1,4 +1,4 @@
1
- import type { DialogExportsType, DialogProps, DialogSize } from './components/dialog/dialog.svelte';
1
+ import type { DialogExports, DialogProps, DialogSize } from './components/dialog/dialog.svelte';
2
2
  import Dialog from './components/dialog/dialog.svelte';
3
3
  export { Dialog, };
4
- export type { DialogExportsType, DialogProps, DialogSize };
4
+ export type { DialogExports, DialogProps, DialogSize };
@@ -3,7 +3,7 @@
3
3
  <script lang="ts">import { ripple } from "../../../../../actions";
4
4
  import EasyScriptLoader from "@cloudparker/easy-script-loader-svelte";
5
5
  import InputField, {} from "../input-field/input-field.svelte";
6
- import { isMobileScreen, openListPickerDialog } from "../../../../../services";
6
+ import { isMobileScreen, openPickerDialog } from "../../../../../services";
7
7
  let {
8
8
  id,
9
9
  name,
@@ -64,14 +64,14 @@ async function hanleDialCodePicker() {
64
64
  if (EasyCountryData) {
65
65
  let items = EasyCountryData.getCountries();
66
66
  let size2 = isMobileScreen() ? "full" : "sm";
67
- let res = await openListPickerDialog({
68
- items,
69
- itemTitle: "dialCode",
70
- itemSubtitle: "name",
71
- size: size2,
72
- hasCheck: true,
73
- identity: "dialCode",
74
- search: ["name", "dialCode", "isoCode"]
67
+ let res = await openPickerDialog({
68
+ items
69
+ // itemTitle: 'dialCode',
70
+ // itemSubtitle: 'name',
71
+ // size,
72
+ // hasCheck: true,
73
+ // identity: 'dialCode',
74
+ // search: ['name', 'dialCode', 'isoCode']
75
75
  });
76
76
  console.log(res);
77
77
  if (res) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cloudparker/moldex.js",
3
- "version": "0.0.67",
3
+ "version": "0.0.68",
4
4
  "author": "cloudparker.com",
5
5
  "license": "MIT",
6
6
  "keywords": [
@@ -1,149 +0,0 @@
1
- <script lang="ts">import { ButtonListItem } from "../../..";
2
- import ButtonBack from "../../../button/components/button-back/button-back.svelte";
3
- import ButtonCloseIcon from "../../../button/components/button-close-icon/button-close-icon.svelte";
4
- import ButtonClose from "../../../button/components/button-close/button-close.svelte";
5
- import ButtonOk from "../../../button/components/button-ok/button-ok.svelte";
6
- import SearchField from "../../../input/components/search-field/search-field.svelte";
7
- let {
8
- value,
9
- multiple = false,
10
- items,
11
- itemTitle,
12
- itemSubtitle,
13
- hasCheckbox,
14
- hasArrow,
15
- search,
16
- identity,
17
- itemTitleClassName,
18
- itemSubtitleClassName,
19
- okButtonLable = "Select",
20
- okButtonClassName = "",
21
- closeButtonLabel = "Close",
22
- closeButtonClassName = "",
23
- itemSnippet,
24
- closeDialog,
25
- setResult
26
- } = $props();
27
- let searchText = $state("");
28
- let idField = Symbol("_id");
29
- let searchField = Symbol("_search");
30
- let selectedItemsSet = $derived.by(() => {
31
- let set = /* @__PURE__ */ new Set();
32
- if (value != null) {
33
- if (Array.isArray(value)) {
34
- value.forEach((v) => set.add(v));
35
- } else {
36
- set.add(value);
37
- }
38
- }
39
- return set;
40
- });
41
- let preparedItems = $derived.by(() => {
42
- return (items || []).map((item, index) => {
43
- let res = {
44
- [idField]: identity && item.hasOwnProperty(identity) ? item[identity] : index
45
- };
46
- if (itemTitle) {
47
- res.title = item.hasOwnProperty(itemTitle) ? item[itemTitle] : itemTitle;
48
- }
49
- if (itemSubtitle) {
50
- res.subtitle = item.hasOwnProperty(itemSubtitle) ? item[itemSubtitle] : itemSubtitle;
51
- }
52
- if (search) {
53
- if (typeof search === "string") {
54
- res[searchField] = (item[search] || "").trim().toLowerCase();
55
- } else {
56
- res[searchField] = (search.map((fieldName) => item[fieldName]).join(" ") || "").trim().toLowerCase();
57
- }
58
- } else {
59
- res[searchField] = `${res.title || ""} ${res.subtitle || ""}`.trim().toLowerCase();
60
- }
61
- if (selectedItemsSet.has(res[idField])) {
62
- res.isChecked = true;
63
- } else {
64
- res.isChecked = false;
65
- }
66
- return res;
67
- });
68
- });
69
- let filteredItems = $derived.by(() => {
70
- if (searchText) {
71
- return preparedItems.filter((item) => {
72
- return item[searchField].indexOf(searchText) >= 0;
73
- });
74
- } else {
75
- return [...preparedItems];
76
- }
77
- });
78
- function handleSearch(text) {
79
- searchText = text;
80
- }
81
- function handleItemSelected(ev, item, index) {
82
- let id = item[idField];
83
- if (multiple) {
84
- if (selectedItemsSet.has(id)) {
85
- selectedItemsSet.delete(id);
86
- } else {
87
- selectedItemsSet.add(id);
88
- }
89
- } else {
90
- selectedItemsSet.clear();
91
- selectedItemsSet.add(id);
92
- }
93
- items = [...items || []];
94
- if (!multiple) {
95
- if (selectedItemsSet.size) {
96
- setTimeout(() => {
97
- setResult(Array.from(selectedItemsSet)[0]);
98
- closeDialog();
99
- }, 300);
100
- }
101
- }
102
- }
103
- function handleClose() {
104
- closeDialog();
105
- }
106
- function handleOk() {
107
- setResult(Array.from(selectedItemsSet));
108
- closeDialog();
109
- }
110
- $effect(() => {
111
- setResult(null);
112
- });
113
- </script>
114
-
115
- <div class="flex gap-3 p-3">
116
- <ButtonBack onlyMobile onClick={handleClose} />
117
- <div class="flex-grow">
118
- <SearchField
119
- name="search"
120
- className="rounded-full"
121
- onSearch={handleSearch}
122
- placeholder="Search..."
123
- />
124
- </div>
125
- <ButtonCloseIcon onlyWeb onClick={handleClose} />
126
- </div>
127
- <div class="flex-grow overflow-y-auto">
128
- {#each filteredItems as item, index}
129
- <div>
130
- <ButtonListItem
131
- {item}
132
- id="list"
133
- {index}
134
- titleClassName={itemTitleClassName}
135
- subtitleClassName={itemSubtitleClassName}
136
- {hasArrow}
137
- {hasCheckbox}
138
- onClick={(ev) => handleItemSelected(ev, item, index)}
139
- className="px-4"
140
- />
141
- </div>
142
- {/each}
143
- </div>
144
- {#if multiple}
145
- <div class="flex items-center justify-end gap-3 p-4">
146
- <ButtonOk label={okButtonLable} className={okButtonClassName} onClick={handleOk} />
147
- <ButtonClose label={closeButtonLabel} className={closeButtonClassName} onClick={handleClose} />
148
- </div>
149
- {/if}
@@ -1,41 +0,0 @@
1
- import type { Snippet } from 'svelte';
2
- import type { DialogExportsType } from '../dialog/dialog.svelte';
3
- interface $$__sveltets_2_IsomorphicComponent<Props extends Record<string, any> = any, Events extends Record<string, any> = any, Slots extends Record<string, any> = any, Exports = {}, Bindings = string> {
4
- new (options: import('svelte').ComponentConstructorOptions<Props>): import('svelte').SvelteComponent<Props, Events, Slots> & {
5
- $$bindings?: Bindings;
6
- } & Exports;
7
- (internal: unknown, props: Props & {
8
- $$events?: Events;
9
- $$slots?: Slots;
10
- }): Exports & {
11
- $set?: any;
12
- $on?: any;
13
- };
14
- z_$$bindings?: Bindings;
15
- }
16
- declare const ListPickerDialog: $$__sveltets_2_IsomorphicComponent<{
17
- value?: any | any[];
18
- multiple?: boolean;
19
- items?: any[];
20
- itemSnippet?: Snippet<[any, number]>;
21
- itemTitle?: string;
22
- itemSubtitle?: string;
23
- search?: string | string[];
24
- identity?: string;
25
- iconPath?: string;
26
- hasCheckbox?: boolean;
27
- hasArrow?: boolean;
28
- itemTitleClassName?: string;
29
- itemSubtitleClassName?: string;
30
- okButtonLable?: string;
31
- okButtonClassName?: string;
32
- closeButtonLabel?: string;
33
- closeButtonClassName?: string;
34
- } & DialogExportsType & {
35
- items?: any[];
36
- itemSnippet?: Snippet<[any, number]>;
37
- }, {
38
- [evt: string]: CustomEvent<any>;
39
- }, {}, {}, "">;
40
- type ListPickerDialog = InstanceType<typeof ListPickerDialog>;
41
- export default ListPickerDialog;