cmat 0.0.86 → 0.0.88
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/cmat-components-adapter.mjs +9 -9
- package/fesm2022/cmat-components-adapter.mjs.map +1 -1
- package/fesm2022/cmat-components-breadcrumb.mjs +98 -80
- package/fesm2022/cmat-components-breadcrumb.mjs.map +1 -1
- package/fesm2022/cmat-components-card.mjs +26 -34
- package/fesm2022/cmat-components-card.mjs.map +1 -1
- package/fesm2022/cmat-components-carousel.mjs +467 -556
- package/fesm2022/cmat-components-carousel.mjs.map +1 -1
- package/fesm2022/cmat-components-cascade.mjs +270 -259
- package/fesm2022/cmat-components-cascade.mjs.map +1 -1
- package/fesm2022/cmat-components-chip-input.mjs +200 -116
- package/fesm2022/cmat-components-chip-input.mjs.map +1 -1
- package/fesm2022/cmat-components-code-editor.mjs +85 -38
- package/fesm2022/cmat-components-code-editor.mjs.map +1 -1
- package/fesm2022/cmat-components-color-picker.mjs +841 -0
- package/fesm2022/cmat-components-color-picker.mjs.map +1 -0
- package/fesm2022/cmat-components-custom-formly.mjs +1395 -838
- package/fesm2022/cmat-components-custom-formly.mjs.map +1 -1
- package/fesm2022/cmat-components-data-picker.mjs +996 -0
- package/fesm2022/cmat-components-data-picker.mjs.map +1 -0
- package/fesm2022/cmat-components-date-range.mjs +310 -264
- package/fesm2022/cmat-components-date-range.mjs.map +1 -1
- package/fesm2022/cmat-components-date-time-display.mjs +16 -20
- package/fesm2022/cmat-components-date-time-display.mjs.map +1 -1
- package/fesm2022/cmat-components-drawer.mjs +120 -137
- package/fesm2022/cmat-components-drawer.mjs.map +1 -1
- package/fesm2022/cmat-components-empty-state.mjs +17 -24
- package/fesm2022/cmat-components-empty-state.mjs.map +1 -1
- package/fesm2022/cmat-components-file-preview.mjs +18 -24
- package/fesm2022/cmat-components-file-preview.mjs.map +1 -1
- package/fesm2022/cmat-components-filter-toolbar.mjs +30 -39
- package/fesm2022/cmat-components-filter-toolbar.mjs.map +1 -1
- package/fesm2022/cmat-components-form-actions.mjs +12 -12
- package/fesm2022/cmat-components-form-actions.mjs.map +1 -1
- package/fesm2022/cmat-components-fullscreen.mjs +10 -10
- package/fesm2022/cmat-components-fullscreen.mjs.map +1 -1
- package/fesm2022/cmat-components-highlight.mjs +48 -41
- package/fesm2022/cmat-components-highlight.mjs.map +1 -1
- package/fesm2022/cmat-components-image-viewer.mjs +104 -107
- package/fesm2022/cmat-components-image-viewer.mjs.map +1 -1
- package/fesm2022/cmat-components-inline-loading.mjs +12 -15
- package/fesm2022/cmat-components-inline-loading.mjs.map +1 -1
- package/fesm2022/cmat-components-json-editor.mjs +118 -75
- package/fesm2022/cmat-components-json-editor.mjs.map +1 -1
- package/fesm2022/cmat-components-knob-input.mjs +196 -178
- package/fesm2022/cmat-components-knob-input.mjs.map +1 -1
- package/fesm2022/cmat-components-masonry.mjs +26 -41
- package/fesm2022/cmat-components-masonry.mjs.map +1 -1
- package/fesm2022/cmat-components-material-color-picker.mjs +81 -80
- package/fesm2022/cmat-components-material-color-picker.mjs.map +1 -1
- package/fesm2022/cmat-components-material-datetimepicker.mjs +1212 -1287
- package/fesm2022/cmat-components-material-datetimepicker.mjs.map +1 -1
- package/fesm2022/cmat-components-navigation.mjs +467 -450
- package/fesm2022/cmat-components-navigation.mjs.map +1 -1
- package/fesm2022/cmat-components-opt-input.mjs +143 -132
- package/fesm2022/cmat-components-opt-input.mjs.map +1 -1
- package/fesm2022/cmat-components-org-chart.mjs +68 -83
- package/fesm2022/cmat-components-org-chart.mjs.map +1 -1
- package/fesm2022/cmat-components-page-header.mjs +18 -24
- package/fesm2022/cmat-components-page-header.mjs.map +1 -1
- package/fesm2022/cmat-components-pagination.mjs +220 -136
- package/fesm2022/cmat-components-pagination.mjs.map +1 -1
- package/fesm2022/cmat-components-password-strength.mjs +262 -215
- package/fesm2022/cmat-components-password-strength.mjs.map +1 -1
- package/fesm2022/cmat-components-popover.mjs +227 -195
- package/fesm2022/cmat-components-popover.mjs.map +1 -1
- package/fesm2022/cmat-components-progress-bar.mjs +15 -34
- package/fesm2022/cmat-components-progress-bar.mjs.map +1 -1
- package/fesm2022/cmat-components-qrcode.mjs +95 -88
- package/fesm2022/cmat-components-qrcode.mjs.map +1 -1
- package/fesm2022/cmat-components-rating.mjs +70 -67
- package/fesm2022/cmat-components-rating.mjs.map +1 -1
- package/fesm2022/cmat-components-rich-text-editor.mjs +23 -26
- package/fesm2022/cmat-components-rich-text-editor.mjs.map +1 -1
- package/fesm2022/cmat-components-select-search.mjs +190 -159
- package/fesm2022/cmat-components-select-search.mjs.map +1 -1
- package/fesm2022/cmat-components-select-table.mjs +276 -213
- package/fesm2022/cmat-components-select-table.mjs.map +1 -1
- package/fesm2022/cmat-components-select-tree.mjs +178 -128
- package/fesm2022/cmat-components-select-tree.mjs.map +1 -1
- package/fesm2022/cmat-components-skeleton.mjs +44 -28
- package/fesm2022/cmat-components-skeleton.mjs.map +1 -1
- package/fesm2022/cmat-components-speed-dial.mjs +107 -163
- package/fesm2022/cmat-components-speed-dial.mjs.map +1 -1
- package/fesm2022/cmat-components-status-tag.mjs +29 -36
- package/fesm2022/cmat-components-status-tag.mjs.map +1 -1
- package/fesm2022/cmat-components-table-toolbar.mjs +14 -18
- package/fesm2022/cmat-components-table-toolbar.mjs.map +1 -1
- package/fesm2022/cmat-components-timeline.mjs +111 -118
- package/fesm2022/cmat-components-timeline.mjs.map +1 -1
- package/fesm2022/cmat-components-toast.mjs +65 -66
- package/fesm2022/cmat-components-toast.mjs.map +1 -1
- package/fesm2022/cmat-components-transfer-picker.mjs +130 -160
- package/fesm2022/cmat-components-transfer-picker.mjs.map +1 -1
- package/fesm2022/cmat-components-treetable.mjs +32 -39
- package/fesm2022/cmat-components-treetable.mjs.map +1 -1
- package/fesm2022/cmat-components-upload.mjs +186 -176
- package/fesm2022/cmat-components-upload.mjs.map +1 -1
- package/fesm2022/cmat-directives-animate-on-scroll.mjs +25 -28
- package/fesm2022/cmat-directives-animate-on-scroll.mjs.map +1 -1
- package/fesm2022/cmat-directives-arrow-cursor.mjs +85 -92
- package/fesm2022/cmat-directives-arrow-cursor.mjs.map +1 -1
- package/fesm2022/cmat-directives-autofocus.mjs +3 -3
- package/fesm2022/cmat-directives-autofocus.mjs.map +1 -1
- package/fesm2022/cmat-directives-data-exporter.mjs +49 -50
- package/fesm2022/cmat-directives-data-exporter.mjs.map +1 -1
- package/fesm2022/cmat-directives-debounce.mjs +16 -19
- package/fesm2022/cmat-directives-debounce.mjs.map +1 -1
- package/fesm2022/cmat-directives-digit-only.mjs +60 -69
- package/fesm2022/cmat-directives-digit-only.mjs.map +1 -1
- package/fesm2022/cmat-directives-equal-validator.mjs +3 -3
- package/fesm2022/cmat-directives-equal-validator.mjs.map +1 -1
- package/fesm2022/cmat-directives-seamless-auto-scroll.mjs +31 -30
- package/fesm2022/cmat-directives-seamless-auto-scroll.mjs.map +1 -1
- package/fesm2022/cmat-lib-mock-api.mjs +6 -6
- package/fesm2022/cmat-lib-mock-api.mjs.map +1 -1
- package/fesm2022/cmat-pipes-bytes.mjs +3 -3
- package/fesm2022/cmat-pipes-bytes.mjs.map +1 -1
- package/fesm2022/cmat-pipes-date-format.mjs +3 -3
- package/fesm2022/cmat-pipes-date-format.mjs.map +1 -1
- package/fesm2022/cmat-pipes-find-by-key.mjs +3 -3
- package/fesm2022/cmat-pipes-find-by-key.mjs.map +1 -1
- package/fesm2022/cmat-pipes-group-by.mjs +3 -3
- package/fesm2022/cmat-pipes-group-by.mjs.map +1 -1
- package/fesm2022/cmat-pipes-keys.mjs +3 -3
- package/fesm2022/cmat-pipes-keys.mjs.map +1 -1
- package/fesm2022/cmat-pipes-secure.mjs +7 -13
- package/fesm2022/cmat-pipes-secure.mjs.map +1 -1
- package/fesm2022/cmat-pipes-uppercase.mjs +3 -3
- package/fesm2022/cmat-pipes-uppercase.mjs.map +1 -1
- package/fesm2022/cmat-services-alert.mjs +26 -27
- package/fesm2022/cmat-services-alert.mjs.map +1 -1
- package/fesm2022/cmat-services-config.mjs +14 -23
- package/fesm2022/cmat-services-config.mjs.map +1 -1
- package/fesm2022/cmat-services-confirmation.mjs +8 -8
- package/fesm2022/cmat-services-confirmation.mjs.map +1 -1
- package/fesm2022/cmat-services-data.mjs +6 -10
- package/fesm2022/cmat-services-data.mjs.map +1 -1
- package/fesm2022/cmat-services-export-as.mjs +3 -3
- package/fesm2022/cmat-services-export-as.mjs.map +1 -1
- package/fesm2022/cmat-services-loading.mjs +30 -47
- package/fesm2022/cmat-services-loading.mjs.map +1 -1
- package/fesm2022/cmat-services-local-storage.mjs +3 -3
- package/fesm2022/cmat-services-local-storage.mjs.map +1 -1
- package/fesm2022/cmat-services-media-watcher.mjs +43 -34
- package/fesm2022/cmat-services-media-watcher.mjs.map +1 -1
- package/fesm2022/cmat-services-platform.mjs +3 -3
- package/fesm2022/cmat-services-platform.mjs.map +1 -1
- package/fesm2022/cmat-services-splash-screen.mjs +3 -3
- package/fesm2022/cmat-services-splash-screen.mjs.map +1 -1
- package/fesm2022/cmat-services-title.mjs +3 -3
- package/fesm2022/cmat-services-title.mjs.map +1 -1
- package/fesm2022/cmat-services-translation.mjs +11 -11
- package/fesm2022/cmat-services-translation.mjs.map +1 -1
- package/fesm2022/cmat-services-utils.mjs +4 -4
- package/fesm2022/cmat-services-utils.mjs.map +1 -1
- package/fesm2022/cmat.mjs +9229 -7508
- package/fesm2022/cmat.mjs.map +1 -1
- package/icons/material-icons/heroicons-outline.svg +3 -0
- package/icons/material-icons/heroicons-solid.svg +3 -0
- package/package.json +10 -1
- package/styles/components/bundle.scss +21 -0
- package/styles/overrides/angular-material.scss +22 -1
- package/tailwind/plugins/theming.js +183 -183
- package/types/cmat-components-breadcrumb.d.ts +40 -37
- package/types/cmat-components-card.d.ts +11 -13
- package/types/cmat-components-carousel.d.ts +87 -113
- package/types/cmat-components-cascade.d.ts +84 -65
- package/types/cmat-components-chip-input.d.ts +29 -24
- package/types/cmat-components-code-editor.d.ts +28 -12
- package/types/cmat-components-color-picker.d.ts +236 -0
- package/types/cmat-components-custom-formly.d.ts +316 -184
- package/types/cmat-components-data-picker.d.ts +372 -0
- package/types/cmat-components-date-range.d.ts +31 -36
- package/types/cmat-components-date-time-display.d.ts +8 -8
- package/types/cmat-components-drawer.d.ts +30 -32
- package/types/cmat-components-empty-state.d.ts +9 -10
- package/types/cmat-components-file-preview.d.ts +9 -9
- package/types/cmat-components-filter-toolbar.d.ts +15 -15
- package/types/cmat-components-form-actions.d.ts +5 -5
- package/types/cmat-components-fullscreen.d.ts +5 -5
- package/types/cmat-components-highlight.d.ts +13 -14
- package/types/cmat-components-image-viewer.d.ts +29 -33
- package/types/cmat-components-inline-loading.d.ts +6 -6
- package/types/cmat-components-json-editor.d.ts +15 -17
- package/types/cmat-components-knob-input.d.ts +58 -55
- package/types/cmat-components-masonry.d.ts +9 -12
- package/types/cmat-components-material-color-picker.d.ts +16 -21
- package/types/cmat-components-material-datetimepicker.d.ts +174 -216
- package/types/cmat-components-navigation.d.ts +34 -39
- package/types/cmat-components-opt-input.d.ts +35 -33
- package/types/cmat-components-org-chart.d.ts +8 -9
- package/types/cmat-components-page-header.d.ts +9 -9
- package/types/cmat-components-pagination.d.ts +36 -40
- package/types/cmat-components-password-strength.d.ts +58 -64
- package/types/cmat-components-popover.d.ts +22 -32
- package/types/cmat-components-progress-bar.d.ts +7 -10
- package/types/cmat-components-qrcode.d.ts +22 -22
- package/types/cmat-components-rating.d.ts +17 -19
- package/types/cmat-components-rich-text-editor.d.ts +11 -12
- package/types/cmat-components-select-search.d.ts +48 -36
- package/types/cmat-components-select-table.d.ts +38 -34
- package/types/cmat-components-select-tree.d.ts +17 -15
- package/types/cmat-components-skeleton.d.ts +27 -10
- package/types/cmat-components-speed-dial.d.ts +24 -33
- package/types/cmat-components-status-tag.d.ts +19 -9
- package/types/cmat-components-table-toolbar.d.ts +7 -7
- package/types/cmat-components-timeline.d.ts +33 -34
- package/types/cmat-components-toast.d.ts +26 -30
- package/types/cmat-components-transfer-picker.d.ts +51 -56
- package/types/cmat-components-treetable.d.ts +12 -13
- package/types/cmat-components-upload.d.ts +33 -38
- package/types/cmat-components-x6-angular-shape.d.ts +1 -1
- package/types/cmat-directives-animate-on-scroll.d.ts +7 -7
- package/types/cmat-directives-arrow-cursor.d.ts +18 -20
- package/types/cmat-directives-data-exporter.d.ts +10 -10
- package/types/cmat-directives-debounce.d.ts +5 -5
- package/types/cmat-directives-digit-only.d.ts +13 -13
- package/types/cmat-directives-seamless-auto-scroll.d.ts +7 -7
- package/types/cmat-pipes-secure.d.ts +1 -3
- package/types/cmat-services-alert.d.ts +11 -12
- package/types/cmat-services-config.d.ts +2 -7
- package/types/cmat-services-confirmation.d.ts +2 -2
- package/types/cmat-services-data.d.ts +0 -1
- package/types/cmat-services-loading.d.ts +14 -22
- package/types/cmat-services-media-watcher.d.ts +5 -5
- package/types/cmat-services-translation.d.ts +4 -5
- package/types/cmat.d.ts +2167 -1746
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"cmat-components-material-color-picker.mjs","sources":["../../../projects/cmat/components/material-color-picker/base-color.ts","../../../projects/cmat/components/material-color-picker/material-color-picker.component.ts","../../../projects/cmat/components/material-color-picker/material-color-picker.component.html","../../../projects/cmat/components/material-color-picker/selected-color.ts","../../../projects/cmat/components/material-color-picker/cmat-components-material-color-picker.ts"],"sourcesContent":["export const baseColors = [\r\n 'bg-slate',\r\n 'bg-red',\r\n 'bg-amber',\r\n 'bg-orange',\r\n 'bg-emerald',\r\n 'bg-teal',\r\n 'bg-blue',\r\n 'bg-indigo',\r\n 'bg-violet',\r\n 'bg-pink'\r\n];\r\n\r\n\r\nexport const safteListBaseColors = [\r\n 'bg-slate-50', 'bg-slate-100', 'bg-slate-200', 'bg-slate-300', 'bg-slate-400', 'bg-slate-500', 'bg-slate-600', 'bg-slate-700', 'bg-slate-800', 'bg-slate-900',\r\n 'bg-red-50', 'bg-red-100', 'bg-red-200', 'bg-red-300', 'bg-red-400', 'bg-red-500', 'bg-red-600', 'bg-red-700', 'bg-red-800', 'bg-red-900',\r\n 'bg-amber-50', 'bg-amber-100', 'bg-amber-200', 'bg-amber-300', 'bg-amber-400', 'bg-amber-500', 'bg-amber-600', 'bg-amber-700', 'bg-amber-800', 'bg-amber-900',\r\n 'bg-orange-50', 'bg-orange-100', 'bg-orange-200', 'bg-orange-300', 'bg-orange-400', 'bg-orange-500', 'bg-orange-600', 'bg-orange-700', 'bg-orange-800', 'bg-orange-900',\r\n 'bg-emerald-50', 'bg-emerald-100', 'bg-emerald-200', 'bg-emerald-300', 'bg-emerald-400', 'bg-emerald-500', 'bg-emerald-600', 'bg-emerald-700', 'bg-emerald-800', 'bg-emerald-900',\r\n 'bg-teal-50', 'bg-teal-100', 'bg-teal-200', 'bg-teal-300', 'bg-teal-400', 'bg-teal-500', 'bg-teal-600', 'bg-teal-700', 'bg-teal-800', 'bg-teal-900',\r\n 'bg-blue-50', 'bg-blue-100', 'bg-blue-200', 'bg-blue-300', 'bg-blue-400', 'bg-blue-500', 'bg-blue-600', 'bg-blue-700', 'bg-blue-800', 'bg-blue-900',\r\n 'bg-indigo-50', 'bg-indigo-100', 'bg-indigo-200', 'bg-indigo-300', 'bg-indigo-400', 'bg-indigo-500', 'bg-indigo-600', 'bg-indigo-700', 'bg-indigo-800', 'bg-indigo-900',\r\n 'bg-violet-50', 'bg-violet-100', 'bg-violet-200', 'bg-violet-300', 'bg-violet-400', 'bg-violet-500', 'bg-violet-600', 'bg-violet-700', 'bg-violet-800', 'bg-violet-900',\r\n 'bg-pink-50', 'bg-pink-100', 'bg-pink-200', 'bg-pink-300', 'bg-pink-400', 'bg-pink-500', 'bg-pink-600', 'bg-pink-700', 'bg-pink-800', 'bg-pink-900'\r\n];\r\n","import { NgClass } from '@angular/common';\r\nimport {\r\n ChangeDetectionStrategy,\r\n Component,\r\n EventEmitter,\r\n forwardRef,\r\n Input,\r\n Output,\r\n ViewEncapsulation,\r\n signal,\r\n} from '@angular/core';\r\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\r\nimport { MatButtonModule } from '@angular/material/button';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { MatSelectModule } from '@angular/material/select';\r\nimport { MatTooltipModule } from '@angular/material/tooltip';\r\nimport { baseColors } from './base-color';\r\nimport { CmatSelectedColor } from './selected-color';\r\n\r\nexport const CMAT_MATERIAL_COLOR_PICKER_VALUE_ACCESSOR = {\r\n provide: NG_VALUE_ACCESSOR,\r\n useExisting: forwardRef(() => CmatMaterialColorPickerComponent),\r\n multi: true\r\n};\r\n\r\n\r\n@Component({\r\n selector: 'cmat-material-color-picker',\r\n templateUrl: './material-color-picker.component.html',\r\n styleUrls: ['./material-color-picker.component.scss'],\r\n encapsulation: ViewEncapsulation.None,\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n exportAs: 'cmatMaterialColorPicker',\r\n providers: [CMAT_MATERIAL_COLOR_PICKER_VALUE_ACCESSOR],\r\n imports: [NgClass, MatSelectModule, MatIconModule, MatButtonModule, MatTooltipModule]\r\n})\r\nexport class CmatMaterialColorPickerComponent implements ControlValueAccessor {\r\n @Output()\r\n colorChanged: EventEmitter<string> = new EventEmitter<string>();\r\n\r\n palettes: string[];\r\n hues: string[];\r\n view: string;\r\n readonly selectedColor = signal<CmatSelectedColor>({ palette: 'bg-indigo', hue: '500', color: 'bg-indigo-500' });\r\n selectedPalette: string;\r\n selectedHue: string;\r\n\r\n private _color: string;\r\n private _title: string;\r\n private _readonly: boolean;\r\n private _modelChange: (value: string) => void;\r\n private _modelTouched: (value: string) => void;\r\n\r\n constructor() {\r\n this.palettes = baseColors;\r\n this.hues = ['50', '100', '200', '300', '400', '500', '600', '700', '800', '900'];\r\n this.selectedHue = '500';\r\n this.selectedPalette = 'bg-indigo';\r\n this.view = 'palettes';\r\n\r\n // eslint-disable-next-line @typescript-eslint/no-empty-function\r\n this._modelChange = (): void => { };\r\n // eslint-disable-next-line @typescript-eslint/no-empty-function\r\n this._modelTouched = (): void => { };\r\n\r\n this.updateSelectedColor();\r\n }\r\n\r\n get color(): string {\r\n return this._color;\r\n }\r\n\r\n @Input()\r\n set color(value) {\r\n if (!value || value === '' || this._color === value) {\r\n return;\r\n }\r\n const colorParts = value.split('-');\r\n this.selectedHue = colorParts[colorParts.length - 1];\r\n colorParts.pop();\r\n this.selectedPalette = colorParts.join('-');\r\n this.updateSelectedColor();\r\n }\r\n\r\n // eslint-disable-next-line @typescript-eslint/member-ordering\r\n get title(): string {\r\n return this._title;\r\n }\r\n\r\n @Input()\r\n set title(value) {\r\n this._title = value;\r\n }\r\n\r\n // eslint-disable-next-line @typescript-eslint/member-ordering\r\n get readonly(): boolean {\r\n return this._readonly;\r\n }\r\n\r\n @Input()\r\n set readonly(value) {\r\n this._readonly = value;\r\n }\r\n\r\n\r\n registerOnChange(fn: (value: string) => void): void {\r\n this._modelChange = fn;\r\n }\r\n\r\n registerOnTouched(fn: (value: string) => void): void {\r\n this._modelTouched = fn;\r\n }\r\n\r\n writeValue(color: string | null): void {\r\n if (!color) {\r\n return;\r\n }\r\n this.color = color;\r\n }\r\n\r\n selectPalette(palette: string): void {\r\n this.view = 'hues';\r\n this.selectedPalette = palette;\r\n this.updateSelectedColor();\r\n }\r\n\r\n selectHue(hue: string): void {\r\n this.selectedHue = hue;\r\n this.updateSelectedColor();\r\n }\r\n\r\n removeColor(): void {\r\n this.view = 'palettes';\r\n this.selectedPalette = 'bg-indigo';\r\n this.selectedHue = '500';\r\n this.updateSelectedColor();\r\n }\r\n\r\n updateSelectedColor(): void {\r\n if (this.selectedColor()?.palette === this.selectedPalette && this.selectedColor()?.hue === this.selectedHue) {\r\n return;\r\n }\r\n this.selectedColor.set({\r\n palette: this.selectedPalette,\r\n hue: this.selectedHue,\r\n color: this.selectedPalette + '-' + this.selectedHue\r\n });\r\n\r\n this._color = this.selectedColor().color;\r\n\r\n this.colorChanged.emit(this.selectedColor().color);\r\n this._modelTouched(this.selectedColor().color);\r\n this._modelChange(this.selectedColor().color);\r\n }\r\n\r\n goToPalettesView(): void {\r\n this.view = 'palettes';\r\n }\r\n\r\n onMenuOpen(opened: boolean): void {\r\n if (opened) {\r\n this.view = 'hues';\r\n }\r\n }\r\n}\r\n","<div class=\"rounded\" [ngClass]=\"selectedColor().color\">\r\n <mat-select value=\"init\" panelClass=\"min-w-64 overflow-hidden\" [disableOptionCentering]=\"true\" [hideSingleSelectionIndicator]=\"true\"\r\n [disabled]=\"readonly\" (openedChange)=\"onMenuOpen($event)\">\r\n <mat-select-trigger class=\"flex p-1\">\r\n <mat-icon [svgIcon]=\"'heroicons_outline:paint-brush'\"></mat-icon>\r\n </mat-select-trigger>\r\n\r\n <header class=\"border-b-2 flex flex-row content-between justify-between p-2\">\r\n <button type=\"button\" matIconButton class=\"secondary-text\" aria-label=\"调色板\"\r\n [class.invisible]=\"view === 'palettes'\" (click)=\"goToPalettesView()\">\r\n <mat-icon svgIcon=\"mat_outline:arrow_back\"></mat-icon>\r\n </button>\r\n <span class=\"align-middle leading-loose text-xl font-bold\">{{title}}</span>\r\n <button type=\"button\" matIconButton class=\"remove-color-button secondary-text\" aria-label=\"移除颜色\"\r\n matTooltip=\"移除颜色\" (click)=\"removeColor()\">\r\n <mat-icon color=\"warn\" [svgIcon]=\"'mat_outline:cleaning_services'\"></mat-icon>\r\n </button>\r\n </header>\r\n\r\n <div class=\"flex flex-wrap w-60 m-2\">\r\n <mat-option value=\"init\" class=\"hidden\">初始化</mat-option>\r\n <div>\r\n @switch (view) {\r\n @case ('palettes') {\r\n <div>\r\n <div class=\"flex flex-row flex-wrap justify-start content-start colors\">\r\n @for (palette of palettes; track $index) {\r\n <div role=\"presentation\" class=\"cursor-pointer hover:opacity-50\" (click)=\"selectPalette(palette)\">\r\n <mat-option class=\"relative flex w-12 h-12 p-0 pointer-events-none rounded-full bg-transparent \"\r\n [value]=\"selectedPalette\">\r\n @if (selectedColor().color===palette + '-' + selectedHue) {\r\n <mat-icon class=\"absolute m-3 text-white\" [svgIcon]=\"'heroicons_outline:check'\"></mat-icon>\r\n }\r\n <span class=\"flex w-10 h-10 m-1 rounded-full\" [ngClass]=\"palette + '-' + selectedHue\"></span>\r\n </mat-option>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n @case ('hues') {\r\n <div>\r\n <div class=\"flex flex-row flex-wrap justify-start content-start colors\">\r\n @for (hue of hues; track $index) {\r\n <div role=\"presentation\" class=\"cursor-pointer hover:opacity-50\" (click)=\"selectHue(hue)\">\r\n <mat-option class=\"relative flex w-12 h-12 p-0 pointer-events-none rounded-full bg-transparent \"\r\n [value]=\"selectedHue\">\r\n @if (selectedColor().color===selectedPalette + '-' + hue) {\r\n <mat-icon class=\"absolute m-3 text-white\" [svgIcon]=\"'heroicons_outline:check'\"></mat-icon>\r\n }\r\n <span class=\"flex w-10 h-10 m-1 rounded-full\" [ngClass]=\"selectedPalette + '-' + hue\"></span>\r\n </mat-option>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n }\r\n </div>\r\n </div>\r\n </mat-select>\r\n</div>\r\n","export class CmatSelectedColor {\r\n palette: string;\r\n hue: string;\r\n color: string;\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"cmat-components-material-color-picker.mjs","sources":["../../../projects/cmat/components/material-color-picker/base-color.ts","../../../projects/cmat/components/material-color-picker/material-color-picker.component.ts","../../../projects/cmat/components/material-color-picker/material-color-picker.component.html","../../../projects/cmat/components/material-color-picker/selected-color.ts","../../../projects/cmat/components/material-color-picker/cmat-components-material-color-picker.ts"],"sourcesContent":["export const baseColors = [\r\n 'bg-slate',\r\n 'bg-red',\r\n 'bg-amber',\r\n 'bg-orange',\r\n 'bg-emerald',\r\n 'bg-teal',\r\n 'bg-blue',\r\n 'bg-indigo',\r\n 'bg-violet',\r\n 'bg-pink'\r\n];\r\n\r\n\r\nexport const safteListBaseColors = [\r\n 'bg-slate-50', 'bg-slate-100', 'bg-slate-200', 'bg-slate-300', 'bg-slate-400', 'bg-slate-500', 'bg-slate-600', 'bg-slate-700', 'bg-slate-800', 'bg-slate-900',\r\n 'bg-red-50', 'bg-red-100', 'bg-red-200', 'bg-red-300', 'bg-red-400', 'bg-red-500', 'bg-red-600', 'bg-red-700', 'bg-red-800', 'bg-red-900',\r\n 'bg-amber-50', 'bg-amber-100', 'bg-amber-200', 'bg-amber-300', 'bg-amber-400', 'bg-amber-500', 'bg-amber-600', 'bg-amber-700', 'bg-amber-800', 'bg-amber-900',\r\n 'bg-orange-50', 'bg-orange-100', 'bg-orange-200', 'bg-orange-300', 'bg-orange-400', 'bg-orange-500', 'bg-orange-600', 'bg-orange-700', 'bg-orange-800', 'bg-orange-900',\r\n 'bg-emerald-50', 'bg-emerald-100', 'bg-emerald-200', 'bg-emerald-300', 'bg-emerald-400', 'bg-emerald-500', 'bg-emerald-600', 'bg-emerald-700', 'bg-emerald-800', 'bg-emerald-900',\r\n 'bg-teal-50', 'bg-teal-100', 'bg-teal-200', 'bg-teal-300', 'bg-teal-400', 'bg-teal-500', 'bg-teal-600', 'bg-teal-700', 'bg-teal-800', 'bg-teal-900',\r\n 'bg-blue-50', 'bg-blue-100', 'bg-blue-200', 'bg-blue-300', 'bg-blue-400', 'bg-blue-500', 'bg-blue-600', 'bg-blue-700', 'bg-blue-800', 'bg-blue-900',\r\n 'bg-indigo-50', 'bg-indigo-100', 'bg-indigo-200', 'bg-indigo-300', 'bg-indigo-400', 'bg-indigo-500', 'bg-indigo-600', 'bg-indigo-700', 'bg-indigo-800', 'bg-indigo-900',\r\n 'bg-violet-50', 'bg-violet-100', 'bg-violet-200', 'bg-violet-300', 'bg-violet-400', 'bg-violet-500', 'bg-violet-600', 'bg-violet-700', 'bg-violet-800', 'bg-violet-900',\r\n 'bg-pink-50', 'bg-pink-100', 'bg-pink-200', 'bg-pink-300', 'bg-pink-400', 'bg-pink-500', 'bg-pink-600', 'bg-pink-700', 'bg-pink-800', 'bg-pink-900'\r\n];\r\n","import { NgClass } from '@angular/common';\r\nimport {\r\n ChangeDetectionStrategy,\r\n Component,\r\n forwardRef,\r\n ViewEncapsulation,\r\n computed,\r\n effect,\r\n input,\r\n signal,\r\n output,\r\n untracked,\r\n} from '@angular/core';\r\nimport { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';\r\nimport { MatButtonModule } from '@angular/material/button';\r\nimport { MatIconModule } from '@angular/material/icon';\r\nimport { MatSelectModule } from '@angular/material/select';\r\nimport { MatTooltipModule } from '@angular/material/tooltip';\r\nimport { baseColors } from './base-color';\r\nimport { CmatSelectedColor } from './selected-color';\r\n\r\nexport const CMAT_MATERIAL_COLOR_PICKER_VALUE_ACCESSOR = {\r\n provide: NG_VALUE_ACCESSOR,\r\n useExisting: forwardRef(() => CmatMaterialColorPickerComponent),\r\n multi: true\r\n};\r\n\r\n@Component({\r\n selector: 'cmat-material-color-picker',\r\n templateUrl: './material-color-picker.component.html',\r\n styleUrls: ['./material-color-picker.component.scss'],\r\n encapsulation: ViewEncapsulation.None,\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n exportAs: 'cmatMaterialColorPicker',\r\n providers: [CMAT_MATERIAL_COLOR_PICKER_VALUE_ACCESSOR],\r\n imports: [NgClass, MatSelectModule, MatIconModule, MatButtonModule, MatTooltipModule]\r\n})\r\nexport class CmatMaterialColorPickerComponent implements ControlValueAccessor {\r\n readonly title = input<string>('');\r\n readonly readonly = input<boolean>(false);\r\n\r\n readonly color = input<string | null>(null);\r\n\r\n readonly colorChanged = output<string>();\r\n\r\n readonly palettes = signal<string[]>(baseColors);\r\n readonly hues = signal<string[]>(['50', '100', '200', '300', '400', '500', '600', '700', '800', '900']);\r\n\r\n readonly view = signal<'palettes' | 'hues'>('palettes');\r\n readonly selectedPalette = signal<string>('bg-indigo');\r\n readonly selectedHue = signal<string>('500');\r\n\r\n readonly selectedColor = computed<CmatSelectedColor>(() => ({\r\n palette: this.selectedPalette(),\r\n hue: this.selectedHue(),\r\n color: `${this.selectedPalette()}-${this.selectedHue()}`\r\n }));\r\n\r\n private _isProcessingExternalChange = false;\r\n\r\n constructor() {\r\n effect(() => {\r\n const externalColor = this.color();\r\n\r\n untracked(() => {\r\n if (externalColor && externalColor !== '') {\r\n this._parseAndSetColor(externalColor);\r\n }\r\n });\r\n });\r\n }\r\n\r\n\r\n registerOnChange(fn: (value: string) => void): void {\r\n this._modelChange = fn;\r\n }\r\n\r\n registerOnTouched(fn: (value: string) => void): void {\r\n this._modelTouched = fn;\r\n }\r\n\r\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\r\n writeValue(color: string | null): void {\r\n // 由于我们使用了 effect 监听 colorInput,这里不需要做太多事\r\n // 但如果 writeValue 被直接调用(例如初始化),effect 也会捕获到 input 的变化\r\n // 注意:如果父组件直接绑定 [color],input 会更新,effect 会运行。\r\n }\r\n\r\n selectPalette(palette: string): void {\r\n this.view.set('hues');\r\n this.selectedPalette.set(palette);\r\n }\r\n\r\n selectHue(hue: string): void {\r\n this.selectedHue.set(hue);\r\n this._notifyChange();\r\n }\r\n\r\n removeColor(): void {\r\n this.view.set('palettes');\r\n this.selectedPalette.set('bg-indigo');\r\n this.selectedHue.set('500');\r\n this._notifyChange();\r\n }\r\n\r\n goToPalettesView(): void {\r\n this.view.set('palettes');\r\n }\r\n\r\n onMenuOpen(opened: boolean): void {\r\n if (opened) {\r\n this.view.set('hues');\r\n }\r\n }\r\n\r\n private _modelChange: (value: string) => void = () => { /* empty */ };\r\n private _modelTouched: (value: string) => void = () => { /* empty */ };\r\n\r\n private _notifyChange(): void {\r\n // 如果正在处理外部变化,不触发通知以避免循环\r\n if (this._isProcessingExternalChange) {\r\n return;\r\n }\r\n\r\n const currentColor = this.selectedColor().color;\r\n this.colorChanged.emit(currentColor);\r\n this._modelTouched(currentColor);\r\n this._modelChange(currentColor);\r\n }\r\n\r\n private _parseAndSetColor(value: string): void {\r\n const colorParts = value.split('-');\r\n if (colorParts.length < 2) return;\r\n\r\n const hue = colorParts[colorParts.length - 1];\r\n const palette = colorParts.slice(0, -1).join('-');\r\n\r\n // 只有当值真正改变时才更新,避免循环触发\r\n if (this.selectedPalette() !== palette || this.selectedHue() !== hue) {\r\n this._isProcessingExternalChange = true;\r\n try {\r\n this.selectedPalette.set(palette);\r\n this.selectedHue.set(hue);\r\n } finally {\r\n // 确保标志位被重置\r\n this._isProcessingExternalChange = false;\r\n }\r\n }\r\n }\r\n}","<div class=\"rounded\" [ngClass]=\"selectedColor().color\">\r\n <mat-select \r\n value=\"init\" \r\n panelClass=\"min-w-64 overflow-hidden!\" \r\n [disableOptionCentering]=\"true\" \r\n [hideSingleSelectionIndicator]=\"true\"\r\n [disabled]=\"readonly()\" \r\n (openedChange)=\"onMenuOpen($event)\">\r\n \r\n <mat-select-trigger class=\"flex p-1\">\r\n <mat-icon [svgIcon]=\"'heroicons_outline:paint-brush'\"></mat-icon>\r\n </mat-select-trigger>\r\n\r\n <header class=\"border-b-2 flex flex-row content-between justify-between p-2\">\r\n <button type=\"button\" matIconButton class=\"secondary-text\" aria-label=\"调色板\"\r\n [class.invisible]=\"view() === 'palettes'\" (click)=\"goToPalettesView()\">\r\n <mat-icon svgIcon=\"mat_outline:arrow_back\"></mat-icon>\r\n </button>\r\n <span class=\"align-middle leading-loose text-xl font-bold\">{{title()}}</span>\r\n <button type=\"button\" matIconButton class=\"remove-color-button secondary-text\" aria-label=\"移除颜色\"\r\n matTooltip=\"移除颜色\" (click)=\"removeColor()\">\r\n <mat-icon color=\"warn\" [svgIcon]=\"'mat_outline:cleaning_services'\"></mat-icon>\r\n </button>\r\n </header>\r\n\r\n <div class=\"flex flex-wrap w-60 m-2\">\r\n <mat-option value=\"init\" class=\"hidden\">初始化</mat-option>\r\n <div>\r\n @switch (view()) {\r\n @case ('palettes') {\r\n <div>\r\n <div class=\"flex flex-row flex-wrap justify-start content-start colors\">\r\n @for (palette of palettes(); track $index) {\r\n <div role=\"presentation\" class=\"cursor-pointer hover:opacity-50\" (click)=\"selectPalette(palette)\">\r\n <mat-option class=\"relative flex w-12 h-12 p-0 pointer-events-none rounded-full bg-transparent \"\r\n [value]=\"selectedPalette()\">\r\n @if (selectedColor().color === palette + '-' + selectedHue()) {\r\n <mat-icon class=\"absolute m-3 text-white\" [svgIcon]=\"'heroicons_outline:check'\"></mat-icon>\r\n }\r\n <span class=\"flex w-10 h-10 m-1 rounded-full\" [ngClass]=\"palette + '-' + selectedHue()\"></span>\r\n </mat-option>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n @case ('hues') {\r\n <div>\r\n <div class=\"flex flex-row flex-wrap justify-start content-start colors\">\r\n @for (hue of hues(); track $index) {\r\n <div role=\"presentation\" class=\"cursor-pointer hover:opacity-50\" (click)=\"selectHue(hue)\">\r\n <mat-option class=\"relative flex w-12 h-12 p-0 pointer-events-none rounded-full bg-transparent \"\r\n [value]=\"selectedHue()\">\r\n @if (selectedColor().color === selectedPalette() + '-' + hue) {\r\n <mat-icon class=\"absolute m-3 text-white\" [svgIcon]=\"'heroicons_outline:check'\"></mat-icon>\r\n }\r\n <span class=\"flex w-10 h-10 m-1 rounded-full\" [ngClass]=\"selectedPalette() + '-' + hue\"></span>\r\n </mat-option>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n }\r\n }\r\n </div>\r\n </div>\r\n </mat-select>\r\n</div>","export class CmatSelectedColor {\r\n palette: string;\r\n hue: string;\r\n color: string;\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;;;;;;;AAAO,MAAM,UAAU,GAAG;IACtB,UAAU;IACV,QAAQ;IACR,UAAU;IACV,WAAW;IACX,YAAY;IACZ,SAAS;IACT,SAAS;IACT,WAAW;IACX,WAAW;IACX;CACH;AAGM,MAAM,mBAAmB,GAAG;AAC/B,IAAA,aAAa,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc;AAC7J,IAAA,WAAW,EAAE,YAAY,EAAE,YAAY,EAAE,YAAY,EAAE,YAAY,EAAE,YAAY,EAAE,YAAY,EAAE,YAAY,EAAE,YAAY,EAAE,YAAY;AACzI,IAAA,aAAa,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc,EAAE,cAAc;AAC7J,IAAA,cAAc,EAAE,eAAe,EAAE,eAAe,EAAE,eAAe,EAAE,eAAe,EAAE,eAAe,EAAE,eAAe,EAAE,eAAe,EAAE,eAAe,EAAE,eAAe;AACvK,IAAA,eAAe,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,gBAAgB;AACjL,IAAA,YAAY,EAAE,aAAa,EAAE,aAAa,EAAE,aAAa,EAAE,aAAa,EAAE,aAAa,EAAE,aAAa,EAAE,aAAa,EAAE,aAAa,EAAE,aAAa;AACnJ,IAAA,YAAY,EAAE,aAAa,EAAE,aAAa,EAAE,aAAa,EAAE,aAAa,EAAE,aAAa,EAAE,aAAa,EAAE,aAAa,EAAE,aAAa,EAAE,aAAa;AACnJ,IAAA,cAAc,EAAE,eAAe,EAAE,eAAe,EAAE,eAAe,EAAE,eAAe,EAAE,eAAe,EAAE,eAAe,EAAE,eAAe,EAAE,eAAe,EAAE,eAAe;AACvK,IAAA,cAAc,EAAE,eAAe,EAAE,eAAe,EAAE,eAAe,EAAE,eAAe,EAAE,eAAe,EAAE,eAAe,EAAE,eAAe,EAAE,eAAe,EAAE,eAAe;AACvK,IAAA,YAAY,EAAE,aAAa,EAAE,aAAa,EAAE,aAAa,EAAE,aAAa,EAAE,aAAa,EAAE,aAAa,EAAE,aAAa,EAAE,aAAa,EAAE;CACzI;;ACJM,MAAM,yCAAyC,GAAG;AACrD,IAAA,OAAO,EAAE,iBAAiB;AAC1B,IAAA,WAAW,EAAE,UAAU,CAAC,MAAM,gCAAgC,CAAC;AAC/D,IAAA,KAAK,EAAE;;MAaE,gCAAgC,CAAA;AAuBzC,IAAA,WAAA,GAAA;QAtBS,IAAA,CAAA,KAAK,GAAG,KAAK,CAAS,EAAE;kFAAC;QACzB,IAAA,CAAA,QAAQ,GAAG,KAAK,CAAU,KAAK;qFAAC;QAEhC,IAAA,CAAA,KAAK,GAAG,KAAK,CAAgB,IAAI;kFAAC;QAElC,IAAA,CAAA,YAAY,GAAG,MAAM,EAAU;QAE/B,IAAA,CAAA,QAAQ,GAAG,MAAM,CAAW,UAAU;qFAAC;QACvC,IAAA,CAAA,IAAI,GAAG,MAAM,CAAW,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC;iFAAC;QAE9F,IAAA,CAAA,IAAI,GAAG,MAAM,CAAsB,UAAU;iFAAC;QAC9C,IAAA,CAAA,eAAe,GAAG,MAAM,CAAS,WAAW;4FAAC;QAC7C,IAAA,CAAA,WAAW,GAAG,MAAM,CAAS,KAAK;wFAAC;AAEnC,QAAA,IAAA,CAAA,aAAa,GAAG,QAAQ,CAAoB,OAAO;AACxD,YAAA,OAAO,EAAE,IAAI,CAAC,eAAe,EAAE;AAC/B,YAAA,GAAG,EAAE,IAAI,CAAC,WAAW,EAAE;YACvB,KAAK,EAAE,CAAA,EAAG,IAAI,CAAC,eAAe,EAAE,CAAA,CAAA,EAAI,IAAI,CAAC,WAAW,EAAE,CAAA;SACzD,CAAC;0FAAC;QAEK,IAAA,CAAA,2BAA2B,GAAG,KAAK;AAyDnC,QAAA,IAAA,CAAA,YAAY,GAA4B,MAAK,EAAe,CAAC;AAC7D,QAAA,IAAA,CAAA,aAAa,GAA4B,MAAK,EAAe,CAAC;QAvDlE,MAAM,CAAC,MAAK;AACR,YAAA,MAAM,aAAa,GAAG,IAAI,CAAC,KAAK,EAAE;YAElC,SAAS,CAAC,MAAK;AACX,gBAAA,IAAI,aAAa,IAAI,aAAa,KAAK,EAAE,EAAE;AACvC,oBAAA,IAAI,CAAC,iBAAiB,CAAC,aAAa,CAAC;gBACzC;AACJ,YAAA,CAAC,CAAC;AACN,QAAA,CAAC,CAAC;IACN;AAGA,IAAA,gBAAgB,CAAC,EAA2B,EAAA;AACxC,QAAA,IAAI,CAAC,YAAY,GAAG,EAAE;IAC1B;AAEA,IAAA,iBAAiB,CAAC,EAA2B,EAAA;AACzC,QAAA,IAAI,CAAC,aAAa,GAAG,EAAE;IAC3B;;AAGA,IAAA,UAAU,CAAC,KAAoB,EAAA;;;;IAI/B;AAEA,IAAA,aAAa,CAAC,OAAe,EAAA;AACzB,QAAA,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC;AACrB,QAAA,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,OAAO,CAAC;IACrC;AAEA,IAAA,SAAS,CAAC,GAAW,EAAA;AACjB,QAAA,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,GAAG,CAAC;QACzB,IAAI,CAAC,aAAa,EAAE;IACxB;IAEA,WAAW,GAAA;AACP,QAAA,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,UAAU,CAAC;AACzB,QAAA,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,WAAW,CAAC;AACrC,QAAA,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,KAAK,CAAC;QAC3B,IAAI,CAAC,aAAa,EAAE;IACxB;IAEA,gBAAgB,GAAA;AACZ,QAAA,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,UAAU,CAAC;IAC7B;AAEA,IAAA,UAAU,CAAC,MAAe,EAAA;QACtB,IAAI,MAAM,EAAE;AACR,YAAA,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC;QACzB;IACJ;IAKQ,aAAa,GAAA;;AAEjB,QAAA,IAAI,IAAI,CAAC,2BAA2B,EAAE;YAClC;QACJ;QAEA,MAAM,YAAY,GAAG,IAAI,CAAC,aAAa,EAAE,CAAC,KAAK;AAC/C,QAAA,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,YAAY,CAAC;AACpC,QAAA,IAAI,CAAC,aAAa,CAAC,YAAY,CAAC;AAChC,QAAA,IAAI,CAAC,YAAY,CAAC,YAAY,CAAC;IACnC;AAEQ,IAAA,iBAAiB,CAAC,KAAa,EAAA;QACnC,MAAM,UAAU,GAAG,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC;AACnC,QAAA,IAAI,UAAU,CAAC,MAAM,GAAG,CAAC;YAAE;QAE3B,MAAM,GAAG,GAAG,UAAU,CAAC,UAAU,CAAC,MAAM,GAAG,CAAC,CAAC;AAC7C,QAAA,MAAM,OAAO,GAAG,UAAU,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC;;AAGjD,QAAA,IAAI,IAAI,CAAC,eAAe,EAAE,KAAK,OAAO,IAAI,IAAI,CAAC,WAAW,EAAE,KAAK,GAAG,EAAE;AAClE,YAAA,IAAI,CAAC,2BAA2B,GAAG,IAAI;AACvC,YAAA,IAAI;AACA,gBAAA,IAAI,CAAC,eAAe,CAAC,GAAG,CAAC,OAAO,CAAC;AACjC,gBAAA,IAAI,CAAC,WAAW,CAAC,GAAG,CAAC,GAAG,CAAC;YAC7B;oBAAU;;AAEN,gBAAA,IAAI,CAAC,2BAA2B,GAAG,KAAK;YAC5C;QACJ;IACJ;8GA/GS,gCAAgC,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAAhC,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,gCAAgC,EAAA,YAAA,EAAA,IAAA,EAAA,QAAA,EAAA,4BAAA,EAAA,MAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,QAAA,EAAA,EAAA,iBAAA,EAAA,UAAA,EAAA,UAAA,EAAA,UAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,KAAA,EAAA,EAAA,iBAAA,EAAA,OAAA,EAAA,UAAA,EAAA,OAAA,EAAA,QAAA,EAAA,IAAA,EAAA,UAAA,EAAA,KAAA,EAAA,iBAAA,EAAA,IAAA,EAAA,EAAA,EAAA,OAAA,EAAA,EAAA,YAAA,EAAA,cAAA,EAAA,EAAA,SAAA,EAH9B,CAAC,yCAAyC,CAAC,iEClC1D,k0GAmEM,EAAA,MAAA,EAAA,CAAA,oFAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EDhCQ,OAAO,EAAA,QAAA,EAAA,WAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAE,eAAe,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,SAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,CAAA,kBAAA,EAAA,YAAA,EAAA,UAAA,EAAA,eAAA,EAAA,UAAA,EAAA,8BAAA,EAAA,aAAA,EAAA,UAAA,EAAA,UAAA,EAAA,wBAAA,EAAA,aAAA,EAAA,OAAA,EAAA,YAAA,EAAA,iBAAA,EAAA,mBAAA,EAAA,2BAAA,EAAA,gBAAA,EAAA,IAAA,EAAA,YAAA,EAAA,0BAAA,CAAA,EAAA,OAAA,EAAA,CAAA,cAAA,EAAA,QAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,aAAA,CAAA,EAAA,QAAA,EAAA,CAAA,WAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,QAAA,EAAA,oBAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,SAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,IAAA,EAAA,UAAA,CAAA,EAAA,OAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,QAAA,EAAA,CAAA,WAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAE,aAAa,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,UAAA,EAAA,MAAA,EAAA,CAAA,OAAA,EAAA,QAAA,EAAA,SAAA,EAAA,SAAA,EAAA,UAAA,CAAA,EAAA,QAAA,EAAA,CAAA,SAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,UAAA,EAAA,IAAA,EAAE,eAAe,qNAAE,gBAAgB,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,UAAA,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,CAAA,oBAAA,EAAA,4BAAA,EAAA,oBAAA,EAAA,qBAAA,EAAA,qBAAA,EAAA,yBAAA,EAAA,YAAA,EAAA,iBAAA,CAAA,EAAA,QAAA,EAAA,CAAA,YAAA,CAAA,EAAA,CAAA,EAAA,eAAA,EAAA,EAAA,CAAA,uBAAA,CAAA,MAAA,EAAA,aAAA,EAAA,EAAA,CAAA,iBAAA,CAAA,IAAA,EAAA,CAAA,CAAA;;2FAE3E,gCAAgC,EAAA,UAAA,EAAA,CAAA;kBAV5C,SAAS;+BACI,4BAA4B,EAAA,aAAA,EAGvB,iBAAiB,CAAC,IAAI,EAAA,eAAA,EACpB,uBAAuB,CAAC,MAAM,EAAA,QAAA,EACrC,yBAAyB,EAAA,SAAA,EACxB,CAAC,yCAAyC,CAAC,EAAA,OAAA,EAC7C,CAAC,OAAO,EAAE,eAAe,EAAE,aAAa,EAAE,eAAe,EAAE,gBAAgB,CAAC,EAAA,QAAA,EAAA,k0GAAA,EAAA,MAAA,EAAA,CAAA,oFAAA,CAAA,EAAA;;;MEnC5E,iBAAiB,CAAA;AAI7B;;ACJD;;AAEG;;;;"}
|