@simplysm/angular 14.1.2 → 14.1.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/controls/button/sd-additional-button.js +3 -2
- package/dist/controls/button/sd-anchor.js +3 -2
- package/dist/controls/button/sd-button.js +11 -6
- package/dist/controls/button/sd-modal-select-button.js +15 -8
- package/dist/controls/checkbox/sd-checkbox-group-item.js +7 -4
- package/dist/controls/checkbox/sd-checkbox-group.js +3 -2
- package/dist/controls/checkbox/sd-checkbox.js +13 -7
- package/dist/controls/checkbox/sd-switch.js +9 -5
- package/dist/controls/collapse/sd-collapse-icon.js +7 -4
- package/dist/controls/collapse/sd-collapse.js +9 -5
- package/dist/controls/dropdown/sd-dropdown-popup.js +1 -1
- package/dist/controls/dropdown/sd-dropdown.js +5 -3
- package/dist/controls/form/sd-form.js +1 -1
- package/dist/controls/gap/sd-gap.js +13 -7
- package/dist/controls/input/sd-date-range-picker.js +7 -4
- package/dist/controls/input/sd-numpad.js +7 -4
- package/dist/controls/input/sd-range.js +9 -5
- package/dist/controls/input/sd-textarea.js +21 -11
- package/dist/controls/input/sd-textfield-type-handlers.d.ts.map +1 -1
- package/dist/controls/input/sd-textfield-type-handlers.js +5 -8
- package/dist/controls/input/sd-textfield.d.ts.map +1 -1
- package/dist/controls/input/sd-textfield.js +54 -26
- package/dist/controls/list/sd-list-item.js +19 -10
- package/dist/controls/list/sd-list.js +1 -1
- package/dist/controls/pagination/sd-pagination.js +11 -6
- package/dist/controls/select/sd-select-button.js +1 -1
- package/dist/controls/select/sd-select-item.js +7 -4
- package/dist/controls/select/sd-select.js +35 -18
- package/dist/controls/tab/sd-tab-item.d.ts +4 -4
- package/dist/controls/tab/sd-tab-item.d.ts.map +1 -1
- package/dist/controls/tab/sd-tab-item.js +6 -4
- package/dist/controls/tab/sd-tab.d.ts +4 -4
- package/dist/controls/tab/sd-tab.d.ts.map +1 -1
- package/dist/controls/tab/sd-tab.js +3 -2
- package/dist/core/app-structure/sd-app-structure.provider.js +10 -5
- package/dist/core/busy/sd-busy-container.js +9 -5
- package/dist/core/busy/sd-busy.provider.js +4 -2
- package/dist/core/config/injectSdSystemConfigResource.js +1 -1
- package/dist/core/config/sd-system-config.provider.d.ts +1 -1
- package/dist/core/config/sd-system-config.provider.d.ts.map +1 -1
- package/dist/core/config/sd-system-config.provider.js +1 -1
- package/dist/core/mark.d.ts +1 -1
- package/dist/core/mark.d.ts.map +1 -1
- package/dist/core/modal/sd-activated-modal.provider.js +4 -2
- package/dist/core/modal/sd-confirm-modal.js +5 -3
- package/dist/core/modal/sd-modal.js +37 -19
- package/dist/core/modal/sd-modal.provider.js +2 -1
- package/dist/core/modal/sd-prompt-modal.js +7 -4
- package/dist/core/selection/useExpandingManager.js +14 -7
- package/dist/core/selection/useSelectionManager.js +8 -4
- package/dist/core/selection/useSortingManager.js +2 -1
- package/dist/core/setupModelHook.d.ts +1 -1
- package/dist/core/setupModelHook.d.ts.map +1 -1
- package/dist/core/shared-data/sd-shared-data.provider.js +6 -3
- package/dist/core/show-effect/sd-show-effect.js +2 -1
- package/dist/core/show-effect/setupRevealOnShow.js +2 -1
- package/dist/core/template/sd-item-of-template.js +2 -1
- package/dist/core/template/sd-typed-template.js +2 -1
- package/dist/core/toast/sd-toast-container.js +1 -1
- package/dist/core/toast/sd-toast.js +13 -7
- package/dist/core/toast/sd-toast.provider.js +4 -2
- package/dist/data/crud/sd-base-container.js +19 -10
- package/dist/data/crud/sd-crud-detail.js +22 -12
- package/dist/data/crud/sd-crud-list.d.ts +1 -1
- package/dist/data/crud/sd-crud-list.d.ts.map +1 -1
- package/dist/data/crud/sd-crud-list.js +66 -34
- package/dist/data/kanban/sd-kanban-board.js +5 -3
- package/dist/data/kanban/sd-kanban-lane.js +14 -9
- package/dist/data/kanban/sd-kanban.js +18 -11
- package/dist/data/permission-table/sd-permission-table.js +15 -8
- package/dist/data/shared-data/sd-shared-data-select-button.d.ts +2 -2
- package/dist/data/shared-data/sd-shared-data-select-button.d.ts.map +1 -1
- package/dist/data/shared-data/sd-shared-data-select-button.js +13 -7
- package/dist/data/shared-data/sd-shared-data-select-list.js +27 -14
- package/dist/data/shared-data/sd-shared-data-select.js +45 -23
- package/dist/data/sheet/injectSheetColumnResizing.js +6 -3
- package/dist/data/sheet/sd-sheet-column-cell-template.js +2 -1
- package/dist/data/sheet/sd-sheet-column.d.ts +4 -4
- package/dist/data/sheet/sd-sheet-column.d.ts.map +1 -1
- package/dist/data/sheet/sd-sheet-column.js +16 -8
- package/dist/data/sheet/sd-sheet-config.modal.d.ts +1 -1
- package/dist/data/sheet/sd-sheet-config.modal.d.ts.map +1 -1
- package/dist/data/sheet/sd-sheet-config.modal.js +11 -6
- package/dist/data/sheet/sd-sheet.d.ts +2 -2
- package/dist/data/sheet/sd-sheet.d.ts.map +1 -1
- package/dist/data/sheet/sd-sheet.js +57 -32
- package/dist/data/sheet/useSheetCellAgent.js +2 -1
- package/dist/data/sheet/useSheetCellStyling.js +2 -1
- package/dist/data/sheet/useSheetColumnFixing.js +2 -1
- package/dist/data/sheet/useSheetDisplayPipeline.js +8 -4
- package/dist/data/sheet/useSheetLayoutEngine.js +10 -5
- package/dist/data/state-preset/sd-state-preset.js +9 -5
- package/dist/features/address/sd-address-search.modal.js +5 -3
- package/dist/features/editor/sd-markdown-editor.d.ts +2 -1
- package/dist/features/editor/sd-markdown-editor.d.ts.map +1 -1
- package/dist/features/editor/sd-markdown-editor.js +11 -6
- package/dist/features/editor/sd-tiptap-editor.d.ts +1 -1
- package/dist/features/editor/sd-tiptap-editor.d.ts.map +1 -1
- package/dist/features/editor/sd-tiptap-editor.js +13 -7
- package/dist/features/editor/useTiptapToolbar.d.ts +2 -1
- package/dist/features/editor/useTiptapToolbar.d.ts.map +1 -1
- package/dist/features/editor/useTiptapToolbar.js +8 -4
- package/dist/features/theme/sd-theme-provider.js +6 -3
- package/dist/features/theme/sd-theme-selector.js +5 -3
- package/dist/features/visual/sd-barcode.js +7 -4
- package/dist/features/visual/sd-calendar.js +13 -7
- package/dist/features/visual/sd-echarts.js +9 -5
- package/dist/features/visual/sd-label.js +5 -3
- package/dist/features/visual/sd-note.js +5 -3
- package/dist/features/visual/sd-progress.js +9 -5
- package/dist/layout/sidebar/sd-sidebar-container.js +3 -2
- package/dist/layout/sidebar/sd-sidebar-menu.js +11 -6
- package/dist/layout/sidebar/sd-sidebar-user.js +5 -3
- package/dist/layout/sidebar/sd-sidebar.js +3 -2
- package/dist/layout/topbar/sd-topbar-container.js +1 -1
- package/dist/layout/topbar/sd-topbar-menu.js +7 -4
- package/dist/layout/topbar/sd-topbar-user.js +5 -3
- package/dist/layout/topbar/sd-topbar.js +5 -3
- package/package.json +11 -13
- package/src/controls/input/sd-textfield-type-handlers.ts +5 -7
- package/src/controls/input/sd-textfield.ts +5 -1
- package/src/controls/tab/sd-tab-item.ts +3 -3
- package/src/controls/tab/sd-tab.ts +2 -2
- package/src/core/config/injectSdSystemConfigResource.ts +1 -1
- package/src/core/config/sd-system-config.provider.ts +2 -2
- package/src/core/mark.ts +2 -2
- package/src/core/setupModelHook.ts +2 -2
- package/src/data/shared-data/sd-shared-data-select-button.ts +2 -2
- package/src/data/sheet/sd-sheet-column.ts +2 -2
- package/src/features/editor/sd-markdown-editor.ts +2 -2
- package/src/features/editor/useTiptapToolbar.ts +21 -2
|
@@ -27,7 +27,8 @@ import * as i0 from "@angular/core";
|
|
|
27
27
|
import * as i1 from "../../core/events/sd-events";
|
|
28
28
|
const _c0 = (a0, a1) => ({ r: a0, c: a1 });
|
|
29
29
|
const _c1 = (a0, a1, a2, a3, a4) => ({ $implicit: a0, item: a1, index: a2, depth: a3, edit: a4 });
|
|
30
|
-
function _forTrack0($index, $item) {
|
|
30
|
+
function _forTrack0($index, $item) { /* @ts-ignore */
|
|
31
|
+
return this.trackByFn()($item, $index) ?? $item; }
|
|
31
32
|
const _forTrack1 = ($index, $item) => $item.key;
|
|
32
33
|
function SdSheet_Conditional_0_Conditional_1_Template(rf, ctx) { if (rf & 1) {
|
|
33
34
|
const _r1 = i0.ɵɵgetCurrentView();
|
|
@@ -137,7 +138,7 @@ function SdSheet_For_5_For_3_Conditional_1_Conditional_3_Template(rf, ctx) { if
|
|
|
137
138
|
i0.ɵɵelementEnd()();
|
|
138
139
|
} if (rf & 2) {
|
|
139
140
|
const cell_r9 = i0.ɵɵnextContext(2).$implicit;
|
|
140
|
-
i0.ɵɵattribute("style", cell_r9.colDef
|
|
141
|
+
i0.ɵɵattribute("style", cell_r9.colDef?.headerStyle, i0.ɵɵsanitizeStyle);
|
|
141
142
|
i0.ɵɵadvance(2);
|
|
142
143
|
i0.ɵɵtextInterpolate(cell_r9.text);
|
|
143
144
|
} }
|
|
@@ -167,7 +168,7 @@ function SdSheet_For_5_For_3_Conditional_1_Conditional_4_Conditional_5_Template(
|
|
|
167
168
|
i0.ɵɵnextContext();
|
|
168
169
|
const _sortDef_r11 = i0.ɵɵreadContextLet(0);
|
|
169
170
|
i0.ɵɵadvance();
|
|
170
|
-
i0.ɵɵtextInterpolate(_sortDef_r11
|
|
171
|
+
i0.ɵɵtextInterpolate(_sortDef_r11?.indexText);
|
|
171
172
|
} }
|
|
172
173
|
function SdSheet_For_5_For_3_Conditional_1_Conditional_4_Template(rf, ctx) { if (rf & 1) {
|
|
173
174
|
i0.ɵɵdeclareLet(0);
|
|
@@ -179,9 +180,9 @@ function SdSheet_For_5_For_3_Conditional_1_Conditional_4_Template(rf, ctx) { if
|
|
|
179
180
|
const cell_r9 = i0.ɵɵnextContext(2).$implicit;
|
|
180
181
|
const _sortDef_r12 = i0.ɵɵstoreLet(i0.ɵɵnextContext(2).getSortDef(cell_r9.colDef.key));
|
|
181
182
|
i0.ɵɵadvance(2);
|
|
182
|
-
i0.ɵɵconditional(
|
|
183
|
+
i0.ɵɵconditional(_sortDef_r12?.desc === false ? 2 : _sortDef_r12?.desc === true ? 3 : 4);
|
|
183
184
|
i0.ɵɵadvance(3);
|
|
184
|
-
i0.ɵɵconditional(
|
|
185
|
+
i0.ɵɵconditional(_sortDef_r12?.indexText ? 5 : -1);
|
|
185
186
|
} }
|
|
186
187
|
function SdSheet_For_5_For_3_Conditional_1_Conditional_5_Template(rf, ctx) { if (rf & 1) {
|
|
187
188
|
const _r13 = i0.ɵɵgetCurrentView();
|
|
@@ -204,8 +205,8 @@ function SdSheet_For_5_For_3_Conditional_1_Template(rf, ctx) { if (rf & 1) {
|
|
|
204
205
|
const cell_r9 = i0.ɵɵnextContext().$implicit;
|
|
205
206
|
const ctx_r1 = i0.ɵɵnextContext(2);
|
|
206
207
|
i0.ɵɵstyleMap(ctx_r1.getHeaderCellStyle(cell_r9));
|
|
207
|
-
i0.ɵɵclassProp("_fixed", cell_r9.fixed)("_sort", cell_r9.colDef && !cell_r9.colDef.disableSorting)("help", cell_r9.colDef
|
|
208
|
-
i0.ɵɵattribute("colspan", cell_r9.colspan > 1 ? cell_r9.colspan : null)("rowspan", cell_r9.rowspan > 1 ? cell_r9.rowspan : null)("data-c", cell_r9.colIndex)("title",
|
|
208
|
+
i0.ɵɵclassProp("_fixed", cell_r9.fixed)("_sort", cell_r9.colDef && !cell_r9.colDef.disableSorting)("help", cell_r9.colDef?.tooltip);
|
|
209
|
+
i0.ɵɵattribute("colspan", cell_r9.colspan > 1 ? cell_r9.colspan : null)("rowspan", cell_r9.rowspan > 1 ? cell_r9.rowspan : null)("data-c", cell_r9.colIndex)("title", cell_r9.colDef?.tooltip ?? cell_r9.text)("aria-sort", ctx_r1.getAriaSortValue(cell_r9));
|
|
209
210
|
i0.ɵɵadvance(2);
|
|
210
211
|
i0.ɵɵconditional((tmp_31_0 = cell_r9.colDef && ctx_r1.getColumnHeaderTpl(cell_r9.colDef.key)) ? 2 : 3, tmp_31_0);
|
|
211
212
|
i0.ɵɵadvance(2);
|
|
@@ -408,38 +409,59 @@ function SdSheet_For_9_Template(rf, ctx) { if (rf & 1) {
|
|
|
408
409
|
} }
|
|
409
410
|
export class SdSheet {
|
|
410
411
|
// Inputs
|
|
411
|
-
key = input(
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
412
|
+
key = input(/* @ts-ignore */
|
|
413
|
+
...(ngDevMode ? [undefined, { debugName: "key" }] : /* istanbul ignore next */ []));
|
|
414
|
+
items = input([], /* @ts-ignore */
|
|
415
|
+
...(ngDevMode ? [{ debugName: "items" }] : /* istanbul ignore next */ []));
|
|
416
|
+
trackByFn = input((item) => item, /* @ts-ignore */
|
|
417
|
+
...(ngDevMode ? [{ debugName: "trackByFn" }] : /* istanbul ignore next */ []));
|
|
418
|
+
selectMode = input(/* @ts-ignore */
|
|
419
|
+
...(ngDevMode ? [undefined, { debugName: "selectMode" }] : /* istanbul ignore next */ []));
|
|
420
|
+
autoSelect = input(/* @ts-ignore */
|
|
421
|
+
...(ngDevMode ? [undefined, { debugName: "autoSelect" }] : /* istanbul ignore next */ []));
|
|
422
|
+
getItemSelectableFn = input(/* @ts-ignore */
|
|
423
|
+
...(ngDevMode ? [undefined, { debugName: "getItemSelectableFn" }] : /* istanbul ignore next */ []));
|
|
424
|
+
getChildrenFn = input(/* @ts-ignore */
|
|
425
|
+
...(ngDevMode ? [undefined, { debugName: "getChildrenFn" }] : /* istanbul ignore next */ []));
|
|
418
426
|
useAutoSort = input(false, { ...(ngDevMode ? { debugName: "useAutoSort" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
419
|
-
visiblePageCount = input(10,
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
427
|
+
visiblePageCount = input(10, /* @ts-ignore */
|
|
428
|
+
...(ngDevMode ? [{ debugName: "visiblePageCount" }] : /* istanbul ignore next */ []));
|
|
429
|
+
totalPageCount = input(0, /* @ts-ignore */
|
|
430
|
+
...(ngDevMode ? [{ debugName: "totalPageCount" }] : /* istanbul ignore next */ []));
|
|
431
|
+
itemsPerPage = input(0, /* @ts-ignore */
|
|
432
|
+
...(ngDevMode ? [{ debugName: "itemsPerPage" }] : /* istanbul ignore next */ []));
|
|
433
|
+
focusMode = input("cell", /* @ts-ignore */
|
|
434
|
+
...(ngDevMode ? [{ debugName: "focusMode" }] : /* istanbul ignore next */ []));
|
|
423
435
|
inset = input(false, { ...(ngDevMode ? { debugName: "inset" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
424
|
-
contentStyle = input(
|
|
425
|
-
|
|
426
|
-
|
|
436
|
+
contentStyle = input(/* @ts-ignore */
|
|
437
|
+
...(ngDevMode ? [undefined, { debugName: "contentStyle" }] : /* istanbul ignore next */ []));
|
|
438
|
+
getItemCellClassFn = input(/* @ts-ignore */
|
|
439
|
+
...(ngDevMode ? [undefined, { debugName: "getItemCellClassFn" }] : /* istanbul ignore next */ []));
|
|
440
|
+
getItemCellStyleFn = input(/* @ts-ignore */
|
|
441
|
+
...(ngDevMode ? [undefined, { debugName: "getItemCellStyleFn" }] : /* istanbul ignore next */ []));
|
|
427
442
|
hideConfigBar = input(false, { ...(ngDevMode ? { debugName: "hideConfigBar" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
428
443
|
// Outputs
|
|
429
444
|
itemKeydown = output();
|
|
430
445
|
cellKeydown = output();
|
|
431
446
|
// Models
|
|
432
|
-
selectedKeys = model([],
|
|
433
|
-
|
|
434
|
-
|
|
435
|
-
|
|
447
|
+
selectedKeys = model([], /* @ts-ignore */
|
|
448
|
+
...(ngDevMode ? [{ debugName: "selectedKeys" }] : /* istanbul ignore next */ []));
|
|
449
|
+
expandedItems = model([], /* @ts-ignore */
|
|
450
|
+
...(ngDevMode ? [{ debugName: "expandedItems" }] : /* istanbul ignore next */ []));
|
|
451
|
+
sorts = model([], /* @ts-ignore */
|
|
452
|
+
...(ngDevMode ? [{ debugName: "sorts" }] : /* istanbul ignore next */ [])); // Re-exported from useSortingManager
|
|
453
|
+
currentPage = model(0, /* @ts-ignore */
|
|
454
|
+
...(ngDevMode ? [{ debugName: "currentPage" }] : /* istanbul ignore next */ []));
|
|
436
455
|
// Content query
|
|
437
|
-
columnControls = contentChildren(SdSheetColumn,
|
|
438
|
-
|
|
456
|
+
columnControls = contentChildren(SdSheetColumn, /* @ts-ignore */
|
|
457
|
+
...(ngDevMode ? [{ debugName: "columnControls" }] : /* istanbul ignore next */ []));
|
|
458
|
+
columnControlsInput = input([], /* @ts-ignore */
|
|
459
|
+
...(ngDevMode ? [{ debugName: "columnControlsInput" }] : /* istanbul ignore next */ []));
|
|
439
460
|
_effectiveColumnControls = computed(() => [
|
|
440
461
|
...this.columnControls(),
|
|
441
462
|
...this.columnControlsInput(),
|
|
442
|
-
],
|
|
463
|
+
], /* @ts-ignore */
|
|
464
|
+
...(ngDevMode ? [{ debugName: "_effectiveColumnControls" }] : /* istanbul ignore next */ []));
|
|
443
465
|
// Injected providers
|
|
444
466
|
_sdModal = inject(SdModalProvider);
|
|
445
467
|
// DOM accessor & cell agent
|
|
@@ -482,7 +504,8 @@ export class SdSheet {
|
|
|
482
504
|
expanding = this._pipeline.expanding;
|
|
483
505
|
displayItems = this._pipeline.displayItems;
|
|
484
506
|
// Column fixing (DOM 측정 기반 통합 fixedLeftMap)
|
|
485
|
-
_fixedCellWidths = signal(new Map(),
|
|
507
|
+
_fixedCellWidths = signal(new Map(), /* @ts-ignore */
|
|
508
|
+
...(ngDevMode ? [{ debugName: "_fixedCellWidths" }] : /* istanbul ignore next */ []));
|
|
486
509
|
fixing = useSheetColumnFixing({
|
|
487
510
|
columnDefs: this.layout.columnDefs,
|
|
488
511
|
cellWidths: this._fixedCellWidths,
|
|
@@ -537,7 +560,8 @@ export class SdSheet {
|
|
|
537
560
|
map.set(col.key(), col);
|
|
538
561
|
}
|
|
539
562
|
return map;
|
|
540
|
-
},
|
|
563
|
+
}, /* @ts-ignore */
|
|
564
|
+
...(ngDevMode ? [{ debugName: "_columnControlMap" }] : /* istanbul ignore next */ []));
|
|
541
565
|
getColumnHeaderTpl(key) {
|
|
542
566
|
const col = this._columnControlMap().get(key);
|
|
543
567
|
return col?.headerTplRef() ?? null;
|
|
@@ -587,7 +611,8 @@ export class SdSheet {
|
|
|
587
611
|
return this.expanding.def(item);
|
|
588
612
|
}
|
|
589
613
|
// PERF-005: Set-based lookup for O(1) isExpanded check
|
|
590
|
-
_expandedSet = computed(() => new Set(this.expandedItems()),
|
|
614
|
+
_expandedSet = computed(() => new Set(this.expandedItems()), /* @ts-ignore */
|
|
615
|
+
...(ngDevMode ? [{ debugName: "_expandedSet" }] : /* istanbul ignore next */ []));
|
|
591
616
|
isExpanded(item) {
|
|
592
617
|
return this._expandedSet().has(item);
|
|
593
618
|
}
|
|
@@ -769,7 +794,7 @@ export class SdSheet {
|
|
|
769
794
|
SdPagination,
|
|
770
795
|
SdAnchor,
|
|
771
796
|
SdButton,
|
|
772
|
-
SdResizeDirective], styles: ["/*@function to-rgb($oklch-color) {\n @return color.to-space($oklch-color, rgb);\n}*/\n/*$colors: (\n red: to-rgb(oklch(0.704 0.191 22.216)),\n orange: to-rgb(oklch(0.75 0.183 55.934)),\n amber: to-rgb(oklch(0.828 0.189 84.429)),\n yellow: to-rgb(oklch(0.852 0.199 91.936)),\n lime: to-rgb(oklch(0.841 0.238 128.85)),\n green: to-rgb(oklch(0.792 0.209 151.711)),\n emerald: to-rgb(oklch(0.765 0.177 163.223)),\n teal: to-rgb(oklch(0.777 0.152 181.912)),\n cyan: to-rgb(oklch(0.789 0.154 211.53)),\n sky: to-rgb(oklch(0.746 0.16 232.661)),\n blue: to-rgb(oklch(0.707 0.165 254.624)),\n indigo: to-rgb(oklch(0.673 0.182 276.935)),\n violet: to-rgb(oklch(0.702 0.183 293.541)),\n purple: to-rgb(oklch(0.714 0.203 305.504)),\n fuchsia: to-rgb(oklch(0.74 0.238 322.16)),\n pink: to-rgb(oklch(0.718 0.202 349.761)),\n rose: to-rgb(oklch(0.712 0.194 13.428)),\n slate: to-rgb(oklch(0.704 0.04 256.788)),\n gray: to-rgb(oklch(0.707 0.022 261.325)),\n zinc: to-rgb(oklch(0.705 0.015 286.067)),\n neutral: to-rgb(oklch(0.708 0 0)),\n stone: to-rgb(oklch(0.709 0.01 56.259)),\n);*/\nsd-sheet {\n border: 1px solid var(--border-color-lighter);\n border-radius: var(--border-radius-default);\n}\nsd-sheet > ._tool {\n background: var(--control-color);\n border-top-left-radius: var(--border-radius-default);\n border-top-right-radius: var(--border-radius-default);\n border-bottom: 1px solid var(--border-color-lighter);\n}\nsd-sheet > ._sheet-container {\n position: relative;\n background: var(--sheet-bg);\n border-bottom-left-radius: var(--border-radius-default);\n border-bottom-right-radius: var(--border-radius-default);\n overflow: auto;\n}\nsd-sheet > ._sheet-container > table {\n border-spacing: 0;\n table-layout: fixed;\n margin-right: 2px;\n margin-bottom: 2px;\n border-bottom-right-radius: var(--border-radius-default);\n}\nsd-sheet > ._sheet-container > table > * > tr > *:last-child {\n border-right: 1px solid var(--border-color-lighter);\n}\nsd-sheet > ._sheet-container > table > * > tr:last-child > * {\n border-bottom: 1px solid var(--border-color-lighter);\n}\nsd-sheet > ._sheet-container > table > *:last-child > tr:last-child > td:last-child {\n border-bottom-right-radius: var(--border-radius-default);\n overflow: hidden;\n}\nsd-sheet > ._sheet-container > table > * > tr > * {\n border-right: 1px solid var(--border-color-lighter);\n border-bottom: 1px solid var(--border-color-lighter);\n white-space: nowrap;\n overflow: hidden;\n padding: 0;\n position: relative;\n}\nsd-sheet > ._sheet-container > table > * > tr > *._fixed:has(+ :not(._fixed)) + :not(._fixed):not([data-c=\"0\"]) {\n border-left: 1px solid var(--border-color-lighter);\n}\nsd-sheet > ._sheet-container > table > * > tr > *._feature-cell {\n background: var(--theme-gray-lightest);\n min-width: calc(var(--font-size-default) + 2px + var(--sheet-ph) * 2);\n padding: var(--sheet-pv) var(--sheet-ph);\n text-align: left;\n}\nsd-sheet > ._sheet-container > table > * > tr > *._feature-cell > ng-icon {\n cursor: pointer;\n color: var(--text-trans-lightest);\n}\nsd-sheet > ._sheet-container > table > * > tr > *._fixed {\n position: sticky;\n left: 0;\n}\nsd-sheet > ._sheet-container > table > * > tr > *._fixed:has(+ :not(._fixed)) {\n border-right: 1px solid var(--border-color-lighter);\n}\nsd-sheet > ._sheet-container > table > thead {\n position: sticky;\n top: 0;\n z-index: 3;\n}\nsd-sheet > ._sheet-container > table > thead > tr > th {\n position: relative;\n background: var(--theme-gray-lightest);\n vertical-align: middle;\n}\nsd-sheet > ._sheet-container > table > thead > tr > th._fixed {\n z-index: 4;\n}\nsd-sheet > ._sheet-container > table > thead > tr > th._last-depth {\n border-bottom: 1px solid var(--border-color-lighter);\n}\nsd-sheet > ._sheet-container > table > thead > tr > th._feature-cell {\n border-bottom: 1px solid var(--border-color-lighter);\n}\nsd-sheet > ._sheet-container > table > thead > tr > th._sort {\n cursor: pointer;\n}\nsd-sheet > ._sheet-container > table > thead > tr > th._sort:hover {\n text-decoration: underline;\n}\nsd-sheet > ._sheet-container > table > thead > tr > th > ._headerContent > ._sort-icon {\n padding: var(--gap-xs) var(--gap-xs) var(--gap-xs) 0;\n background-color: var(--theme-gray-lightest);\n}\nsd-sheet > ._sheet-container > table > thead > tr > th > ._resizer {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n width: 2px;\n cursor: ew-resize;\n}\nsd-sheet > ._sheet-container > table > thead:has(> tr._summary-row) > tr > th._last-depth {\n border-bottom: 1px solid var(--border-color-lighter);\n}\nsd-sheet > ._sheet-container > table > thead:has(> tr._summary-row) > tr._summary-row > th {\n background: var(--theme-warning-lightest);\n text-align: left;\n border-bottom: 1px solid var(--border-color-lighter);\n}\nsd-sheet > ._sheet-container > table > tbody > tr > td {\n font-family: var(--font-family-field);\n background: var(--control-color);\n vertical-align: top;\n}\nsd-sheet > ._sheet-container > table > tbody > tr > td._fixed {\n z-index: 2;\n}\nsd-sheet > ._sheet-container > table > tbody > tr > td > ._depth-indicator {\n display: inline-block;\n margin-top: 0.4em;\n width: 0.5em;\n height: 0.5em;\n border-left: 1px solid var(--text-trans-default);\n border-bottom: 1px solid var(--text-trans-default);\n vertical-align: top;\n}\nsd-sheet > ._sheet-container > ._focus-row-indicator {\n display: none;\n position: absolute;\n pointer-events: none;\n background: rgba(158, 158, 158, 0.1);\n z-index: 6;\n}\nsd-sheet > ._sheet-container > ._focus-row-indicator > ._focus-cell-indicator {\n position: absolute;\n border: 2px solid var(--theme-primary-default);\n border-radius: var(--border-radius-default);\n}\nsd-sheet > ._sheet-container > ._resize-indicator {\n display: none;\n position: absolute;\n pointer-events: none;\n top: 0;\n height: 100%;\n border: 1px dotted var(--border-color-light);\n z-index: 7;\n}\nsd-sheet > ._sheet-container > ._select-row-indicator-container {\n display: none;\n position: absolute;\n pointer-events: none;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 5;\n}\nsd-sheet > ._sheet-container > ._select-row-indicator-container > ._select-row-indicator {\n display: block;\n left: 0;\n position: absolute;\n pointer-events: none;\n background: var(--theme-primary-default);\n opacity: 0.1;\n}\nsd-sheet ._p-sheet {\n padding: var(--sheet-pv) var(--sheet-ph);\n}\nsd-sheet[data-sd-focus-mode=row] > ._sheet-container > ._focus-row-indicator > ._focus-cell-indicator {\n display: none !important;\n}\nsd-sheet[data-sd-inset=true] {\n border: none;\n border-radius: 0;\n}"], encapsulation: 2
|
|
797
|
+
SdResizeDirective], styles: ["/*@function to-rgb($oklch-color) {\n @return color.to-space($oklch-color, rgb);\n}*/\n/*$colors: (\n red: to-rgb(oklch(0.704 0.191 22.216)),\n orange: to-rgb(oklch(0.75 0.183 55.934)),\n amber: to-rgb(oklch(0.828 0.189 84.429)),\n yellow: to-rgb(oklch(0.852 0.199 91.936)),\n lime: to-rgb(oklch(0.841 0.238 128.85)),\n green: to-rgb(oklch(0.792 0.209 151.711)),\n emerald: to-rgb(oklch(0.765 0.177 163.223)),\n teal: to-rgb(oklch(0.777 0.152 181.912)),\n cyan: to-rgb(oklch(0.789 0.154 211.53)),\n sky: to-rgb(oklch(0.746 0.16 232.661)),\n blue: to-rgb(oklch(0.707 0.165 254.624)),\n indigo: to-rgb(oklch(0.673 0.182 276.935)),\n violet: to-rgb(oklch(0.702 0.183 293.541)),\n purple: to-rgb(oklch(0.714 0.203 305.504)),\n fuchsia: to-rgb(oklch(0.74 0.238 322.16)),\n pink: to-rgb(oklch(0.718 0.202 349.761)),\n rose: to-rgb(oklch(0.712 0.194 13.428)),\n slate: to-rgb(oklch(0.704 0.04 256.788)),\n gray: to-rgb(oklch(0.707 0.022 261.325)),\n zinc: to-rgb(oklch(0.705 0.015 286.067)),\n neutral: to-rgb(oklch(0.708 0 0)),\n stone: to-rgb(oklch(0.709 0.01 56.259)),\n);*/\nsd-sheet {\n border: 1px solid var(--border-color-lighter);\n border-radius: var(--border-radius-default);\n}\nsd-sheet > ._tool {\n background: var(--control-color);\n border-top-left-radius: var(--border-radius-default);\n border-top-right-radius: var(--border-radius-default);\n border-bottom: 1px solid var(--border-color-lighter);\n}\nsd-sheet > ._sheet-container {\n position: relative;\n background: var(--sheet-bg);\n border-bottom-left-radius: var(--border-radius-default);\n border-bottom-right-radius: var(--border-radius-default);\n overflow: auto;\n}\nsd-sheet > ._sheet-container > table {\n border-spacing: 0;\n table-layout: fixed;\n margin-right: 2px;\n margin-bottom: 2px;\n border-bottom-right-radius: var(--border-radius-default);\n}\nsd-sheet > ._sheet-container > table > * > tr > *:last-child {\n border-right: 1px solid var(--border-color-lighter);\n}\nsd-sheet > ._sheet-container > table > * > tr:last-child > * {\n border-bottom: 1px solid var(--border-color-lighter);\n}\nsd-sheet > ._sheet-container > table > *:last-child > tr:last-child > td:last-child {\n border-bottom-right-radius: var(--border-radius-default);\n overflow: hidden;\n}\nsd-sheet > ._sheet-container > table > * > tr > * {\n border-right: 1px solid var(--border-color-lighter);\n border-bottom: 1px solid var(--border-color-lighter);\n white-space: nowrap;\n overflow: hidden;\n padding: 0;\n position: relative;\n}\nsd-sheet > ._sheet-container > table > * > tr > *._fixed:has(+ :not(._fixed)) + :not(._fixed):not([data-c=\"0\"]) {\n border-left: 1px solid var(--border-color-lighter);\n}\nsd-sheet > ._sheet-container > table > * > tr > *._feature-cell {\n background: var(--theme-gray-lightest);\n min-width: calc(var(--font-size-default) + 2px + var(--sheet-ph) * 2);\n padding: var(--sheet-pv) var(--sheet-ph);\n text-align: left;\n}\nsd-sheet > ._sheet-container > table > * > tr > *._feature-cell > ng-icon {\n cursor: pointer;\n color: var(--text-trans-lightest);\n}\nsd-sheet > ._sheet-container > table > * > tr > *._fixed {\n position: sticky;\n left: 0;\n}\nsd-sheet > ._sheet-container > table > * > tr > *._fixed:has(+ :not(._fixed)) {\n border-right: 1px solid var(--border-color-lighter);\n}\nsd-sheet > ._sheet-container > table > thead {\n position: sticky;\n top: 0;\n z-index: 3;\n}\nsd-sheet > ._sheet-container > table > thead > tr > th {\n position: relative;\n background: var(--theme-gray-lightest);\n vertical-align: middle;\n}\nsd-sheet > ._sheet-container > table > thead > tr > th._fixed {\n z-index: 4;\n}\nsd-sheet > ._sheet-container > table > thead > tr > th._last-depth {\n border-bottom: 1px solid var(--border-color-lighter);\n}\nsd-sheet > ._sheet-container > table > thead > tr > th._feature-cell {\n border-bottom: 1px solid var(--border-color-lighter);\n}\nsd-sheet > ._sheet-container > table > thead > tr > th._sort {\n cursor: pointer;\n}\nsd-sheet > ._sheet-container > table > thead > tr > th._sort:hover {\n text-decoration: underline;\n}\nsd-sheet > ._sheet-container > table > thead > tr > th > ._headerContent > ._sort-icon {\n padding: var(--gap-xs) var(--gap-xs) var(--gap-xs) 0;\n background-color: var(--theme-gray-lightest);\n}\nsd-sheet > ._sheet-container > table > thead > tr > th > ._resizer {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n width: 2px;\n cursor: ew-resize;\n}\nsd-sheet > ._sheet-container > table > thead:has(> tr._summary-row) > tr > th._last-depth {\n border-bottom: 1px solid var(--border-color-lighter);\n}\nsd-sheet > ._sheet-container > table > thead:has(> tr._summary-row) > tr._summary-row > th {\n background: var(--theme-warning-lightest);\n text-align: left;\n border-bottom: 1px solid var(--border-color-lighter);\n}\nsd-sheet > ._sheet-container > table > tbody > tr > td {\n font-family: var(--font-family-field);\n background: var(--control-color);\n vertical-align: top;\n}\nsd-sheet > ._sheet-container > table > tbody > tr > td._fixed {\n z-index: 2;\n}\nsd-sheet > ._sheet-container > table > tbody > tr > td > ._depth-indicator {\n display: inline-block;\n margin-top: 0.4em;\n width: 0.5em;\n height: 0.5em;\n border-left: 1px solid var(--text-trans-default);\n border-bottom: 1px solid var(--text-trans-default);\n vertical-align: top;\n}\nsd-sheet > ._sheet-container > ._focus-row-indicator {\n display: none;\n position: absolute;\n pointer-events: none;\n background: rgba(158, 158, 158, 0.1);\n z-index: 6;\n}\nsd-sheet > ._sheet-container > ._focus-row-indicator > ._focus-cell-indicator {\n position: absolute;\n border: 2px solid var(--theme-primary-default);\n border-radius: var(--border-radius-default);\n}\nsd-sheet > ._sheet-container > ._resize-indicator {\n display: none;\n position: absolute;\n pointer-events: none;\n top: 0;\n height: 100%;\n border: 1px dotted var(--border-color-light);\n z-index: 7;\n}\nsd-sheet > ._sheet-container > ._select-row-indicator-container {\n display: none;\n position: absolute;\n pointer-events: none;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 5;\n}\nsd-sheet > ._sheet-container > ._select-row-indicator-container > ._select-row-indicator {\n display: block;\n left: 0;\n position: absolute;\n pointer-events: none;\n background: var(--theme-primary-default);\n opacity: 0.1;\n}\nsd-sheet ._p-sheet {\n padding: var(--sheet-pv) var(--sheet-ph);\n}\nsd-sheet[data-sd-focus-mode=row] > ._sheet-container > ._focus-row-indicator > ._focus-cell-indicator {\n display: none !important;\n}\nsd-sheet[data-sd-inset=true] {\n border: none;\n border-radius: 0;\n}"], encapsulation: 2 });
|
|
773
798
|
}
|
|
774
799
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdSheet, [{
|
|
775
800
|
type: Component,
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { signal } from "@angular/core";
|
|
2
2
|
export function useSheetCellAgent(options) {
|
|
3
|
-
const editModeCellAddr = signal(undefined,
|
|
3
|
+
const editModeCellAddr = signal(undefined, /* @ts-ignore */
|
|
4
|
+
...(ngDevMode ? [{ debugName: "editModeCellAddr" }] : /* istanbul ignore next */ []));
|
|
4
5
|
let _isTransitioning = false;
|
|
5
6
|
function isCellEditMode(addr) {
|
|
6
7
|
const current = editModeCellAddr();
|
|
@@ -32,7 +32,8 @@ export function useSheetCellStyling(options) {
|
|
|
32
32
|
map.set(colDef.key, parts.length > 0 ? parts.join("; ") : null);
|
|
33
33
|
}
|
|
34
34
|
return map;
|
|
35
|
-
},
|
|
35
|
+
}, /* @ts-ignore */
|
|
36
|
+
...(ngDevMode ? [{ debugName: "columnBaseStyles" }] : /* istanbul ignore next */ []));
|
|
36
37
|
function getHeaderCellStyle(cell) {
|
|
37
38
|
if (cell.colDef == null)
|
|
38
39
|
return null;
|
|
@@ -22,6 +22,7 @@ export function useSheetColumnFixing(options) {
|
|
|
22
22
|
accLeft += widths.get(idx) ?? 0;
|
|
23
23
|
}
|
|
24
24
|
return map;
|
|
25
|
-
},
|
|
25
|
+
}, /* @ts-ignore */
|
|
26
|
+
...(ngDevMode ? [{ debugName: "fixedLeftMap" }] : /* istanbul ignore next */ []));
|
|
26
27
|
return { fixedLeftMap };
|
|
27
28
|
}
|
|
@@ -9,14 +9,16 @@ export function useSheetDisplayPipeline(options) {
|
|
|
9
9
|
if (perPage <= 0)
|
|
10
10
|
return 0;
|
|
11
11
|
return Math.ceil(options.items().length / perPage);
|
|
12
|
-
},
|
|
12
|
+
}, /* @ts-ignore */
|
|
13
|
+
...(ngDevMode ? [{ debugName: "effectivePageCount" }] : /* istanbul ignore next */ []));
|
|
13
14
|
const sortedItems = computed(() => {
|
|
14
15
|
const items = options.items();
|
|
15
16
|
if (options.useAutoSort()) {
|
|
16
17
|
return options.sortItems(items);
|
|
17
18
|
}
|
|
18
19
|
return items;
|
|
19
|
-
},
|
|
20
|
+
}, /* @ts-ignore */
|
|
21
|
+
...(ngDevMode ? [{ debugName: "sortedItems" }] : /* istanbul ignore next */ []));
|
|
20
22
|
const pagedItems = computed(() => {
|
|
21
23
|
const items = sortedItems();
|
|
22
24
|
const perPage = options.itemsPerPage();
|
|
@@ -25,7 +27,8 @@ export function useSheetDisplayPipeline(options) {
|
|
|
25
27
|
const page = options.currentPage();
|
|
26
28
|
const start = page * perPage;
|
|
27
29
|
return items.slice(start, start + perPage);
|
|
28
|
-
},
|
|
30
|
+
}, /* @ts-ignore */
|
|
31
|
+
...(ngDevMode ? [{ debugName: "pagedItems" }] : /* istanbul ignore next */ []));
|
|
29
32
|
const expanding = useExpandingManager({
|
|
30
33
|
items: pagedItems,
|
|
31
34
|
expandedItems: options.expandedItems,
|
|
@@ -43,7 +46,8 @@ export function useSheetDisplayPipeline(options) {
|
|
|
43
46
|
return expanding.displayItems().filter((item) => expanding.isVisible(item));
|
|
44
47
|
}
|
|
45
48
|
return pagedItems();
|
|
46
|
-
},
|
|
49
|
+
}, /* @ts-ignore */
|
|
50
|
+
...(ngDevMode ? [{ debugName: "displayItems" }] : /* istanbul ignore next */ []));
|
|
47
51
|
return {
|
|
48
52
|
effectivePageCount,
|
|
49
53
|
displayItems,
|
|
@@ -23,10 +23,12 @@ export function useSheetLayoutEngine(options) {
|
|
|
23
23
|
})
|
|
24
24
|
.filter((def) => !def.hidden)
|
|
25
25
|
.orderBy((a) => a.ordering);
|
|
26
|
-
},
|
|
26
|
+
}, /* @ts-ignore */
|
|
27
|
+
...(ngDevMode ? [{ debugName: "columnDefs" }] : /* istanbul ignore next */ []));
|
|
27
28
|
const hasSummary = computed(() => {
|
|
28
29
|
return options.columnControls().some((col) => col.summaryTplRef() != null);
|
|
29
|
-
},
|
|
30
|
+
}, /* @ts-ignore */
|
|
31
|
+
...(ngDevMode ? [{ debugName: "hasSummary" }] : /* istanbul ignore next */ []));
|
|
30
32
|
const headerDepth = computed(() => {
|
|
31
33
|
let maxDepth = 1;
|
|
32
34
|
for (const def of columnDefs()) {
|
|
@@ -36,7 +38,8 @@ export function useSheetLayoutEngine(options) {
|
|
|
36
38
|
}
|
|
37
39
|
}
|
|
38
40
|
return maxDepth;
|
|
39
|
-
},
|
|
41
|
+
}, /* @ts-ignore */
|
|
42
|
+
...(ngDevMode ? [{ debugName: "headerDepth" }] : /* istanbul ignore next */ []));
|
|
40
43
|
const headerDefTable = computed(() => {
|
|
41
44
|
const depth = headerDepth();
|
|
42
45
|
const cols = columnDefs();
|
|
@@ -120,10 +123,12 @@ export function useSheetLayoutEngine(options) {
|
|
|
120
123
|
}
|
|
121
124
|
}
|
|
122
125
|
return table;
|
|
123
|
-
},
|
|
126
|
+
}, /* @ts-ignore */
|
|
127
|
+
...(ngDevMode ? [{ debugName: "headerDefTable" }] : /* istanbul ignore next */ []));
|
|
124
128
|
const headerFeatureRowSpan = computed(() => {
|
|
125
129
|
return headerDepth();
|
|
126
|
-
},
|
|
130
|
+
}, /* @ts-ignore */
|
|
131
|
+
...(ngDevMode ? [{ debugName: "headerFeatureRowSpan" }] : /* istanbul ignore next */ []));
|
|
127
132
|
return {
|
|
128
133
|
columnDefs,
|
|
129
134
|
hasSummary,
|
|
@@ -39,16 +39,20 @@ function SdStatePreset_For_4_Template(rf, ctx) { if (rf & 1) {
|
|
|
39
39
|
export class SdStatePreset {
|
|
40
40
|
_sdModal = inject(SdModalProvider);
|
|
41
41
|
_sdToast = inject(SdToastProvider);
|
|
42
|
-
key = input.required(
|
|
43
|
-
|
|
44
|
-
|
|
42
|
+
key = input.required(/* @ts-ignore */
|
|
43
|
+
...(ngDevMode ? [{ debugName: "key" }] : /* istanbul ignore next */ []));
|
|
44
|
+
state = model.required(/* @ts-ignore */
|
|
45
|
+
...(ngDevMode ? [{ debugName: "state" }] : /* istanbul ignore next */ []));
|
|
46
|
+
size = input(/* @ts-ignore */
|
|
47
|
+
...(ngDevMode ? [undefined, { debugName: "size" }] : /* istanbul ignore next */ []));
|
|
45
48
|
tablerStar = tablerStar;
|
|
46
49
|
tablerDeviceFloppy = tablerDeviceFloppy;
|
|
47
50
|
tablerX = tablerX;
|
|
48
51
|
_configResource = injectSdSystemConfigResource({
|
|
49
52
|
key: this.key,
|
|
50
53
|
});
|
|
51
|
-
_presets = computed(() => this._configResource.value() ?? [],
|
|
54
|
+
_presets = computed(() => this._configResource.value() ?? [], /* @ts-ignore */
|
|
55
|
+
...(ngDevMode ? [{ debugName: "_presets" }] : /* istanbul ignore next */ []));
|
|
52
56
|
async onAddClick() {
|
|
53
57
|
const name = await this._sdModal.showAsync({
|
|
54
58
|
title: "프리셋 추가",
|
|
@@ -108,7 +112,7 @@ export class SdStatePreset {
|
|
|
108
112
|
i0.ɵɵproperty("svg", ctx.tablerStar);
|
|
109
113
|
i0.ɵɵadvance();
|
|
110
114
|
i0.ɵɵrepeater(ctx._presets());
|
|
111
|
-
} }, dependencies: [SdAnchor, NgIcon], styles: ["sd-state-preset {\n display: inline-block;\n vertical-align: top;\n}\nsd-state-preset > ._sd-state-preset {\n display: flex;\n align-items: center;\n gap: var(--gap-sm);\n flex-wrap: wrap;\n}\nsd-state-preset > ._sd-state-preset > ._add-btn {\n line-height: var(--line-height);\n border: 1px solid transparent;\n padding: var(--gap-sm) var(--gap-default);\n}\nsd-state-preset > ._sd-state-preset > ._preset-item {\n display: inline-flex;\n align-items: center;\n gap: var(--gap-xs);\n line-height: var(--line-height);\n border: 1px solid transparent;\n border-radius: var(--border-radius-lg);\n padding: var(--gap-sm) var(--gap-default);\n background: var(--theme-gray-lightest);\n}\nsd-state-preset > ._sd-state-preset > ._preset-item:hover {\n background: var(--theme-gray-lighter);\n}\nsd-state-preset > ._sd-state-preset > ._preset-item > sd-anchor {\n padding: 0 var(--gap-sm);\n}\nsd-state-preset[data-sd-size=sm] > ._sd-state-preset > ._add-btn {\n padding: var(--gap-xs) var(--gap-default);\n}\nsd-state-preset[data-sd-size=sm] > ._sd-state-preset > ._preset-item {\n padding: var(--gap-xs) var(--gap-default);\n}\nsd-state-preset[data-sd-size=lg] > ._sd-state-preset > ._add-btn {\n padding: var(--gap-default) var(--gap-lg);\n}\nsd-state-preset[data-sd-size=lg] > ._sd-state-preset > ._preset-item {\n padding: var(--gap-default) var(--gap-lg);\n}"], encapsulation: 2
|
|
115
|
+
} }, dependencies: [SdAnchor, NgIcon], styles: ["sd-state-preset {\n display: inline-block;\n vertical-align: top;\n}\nsd-state-preset > ._sd-state-preset {\n display: flex;\n align-items: center;\n gap: var(--gap-sm);\n flex-wrap: wrap;\n}\nsd-state-preset > ._sd-state-preset > ._add-btn {\n line-height: var(--line-height);\n border: 1px solid transparent;\n padding: var(--gap-sm) var(--gap-default);\n}\nsd-state-preset > ._sd-state-preset > ._preset-item {\n display: inline-flex;\n align-items: center;\n gap: var(--gap-xs);\n line-height: var(--line-height);\n border: 1px solid transparent;\n border-radius: var(--border-radius-lg);\n padding: var(--gap-sm) var(--gap-default);\n background: var(--theme-gray-lightest);\n}\nsd-state-preset > ._sd-state-preset > ._preset-item:hover {\n background: var(--theme-gray-lighter);\n}\nsd-state-preset > ._sd-state-preset > ._preset-item > sd-anchor {\n padding: 0 var(--gap-sm);\n}\nsd-state-preset[data-sd-size=sm] > ._sd-state-preset > ._add-btn {\n padding: var(--gap-xs) var(--gap-default);\n}\nsd-state-preset[data-sd-size=sm] > ._sd-state-preset > ._preset-item {\n padding: var(--gap-xs) var(--gap-default);\n}\nsd-state-preset[data-sd-size=lg] > ._sd-state-preset > ._add-btn {\n padding: var(--gap-default) var(--gap-lg);\n}\nsd-state-preset[data-sd-size=lg] > ._sd-state-preset > ._preset-item {\n padding: var(--gap-default) var(--gap-lg);\n}"], encapsulation: 2 });
|
|
112
116
|
}
|
|
113
117
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdStatePreset, [{
|
|
114
118
|
type: Component,
|
|
@@ -51,8 +51,10 @@ function loadDaumPostcodeScript() {
|
|
|
51
51
|
export class SdAddressSearchModal {
|
|
52
52
|
contentElRef = viewChild("content", { ...(ngDevMode ? { debugName: "contentElRef" } : /* istanbul ignore next */ {}), read: ElementRef });
|
|
53
53
|
close = output();
|
|
54
|
-
initialized = signal(false,
|
|
55
|
-
|
|
54
|
+
initialized = signal(false, /* @ts-ignore */
|
|
55
|
+
...(ngDevMode ? [{ debugName: "initialized" }] : /* istanbul ignore next */ []));
|
|
56
|
+
errorMessage = signal(null, /* @ts-ignore */
|
|
57
|
+
...(ngDevMode ? [{ debugName: "errorMessage" }] : /* istanbul ignore next */ []));
|
|
56
58
|
ngOnInit() {
|
|
57
59
|
void this._initAsync();
|
|
58
60
|
}
|
|
@@ -111,7 +113,7 @@ export class SdAddressSearchModal {
|
|
|
111
113
|
i0.ɵɵproperty("busy", !ctx.initialized());
|
|
112
114
|
i0.ɵɵadvance();
|
|
113
115
|
i0.ɵɵconditional(ctx.errorMessage() != null ? 1 : 2);
|
|
114
|
-
} }, dependencies: [SdBusyContainer], encapsulation: 2
|
|
116
|
+
} }, dependencies: [SdBusyContainer], encapsulation: 2 });
|
|
115
117
|
}
|
|
116
118
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdAddressSearchModal, [{
|
|
117
119
|
type: Component,
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { type WritableSignal } from "@angular/core";
|
|
2
2
|
import { Editor } from "@tiptap/core";
|
|
3
|
+
import { type TiptapCommand } from "./useTiptapToolbar";
|
|
3
4
|
import * as i0 from "@angular/core";
|
|
4
5
|
export declare class SdMarkdownEditor {
|
|
5
6
|
value: import("@angular/core").ModelSignal<string | undefined>;
|
|
@@ -18,7 +19,7 @@ export declare class SdMarkdownEditor {
|
|
|
18
19
|
private _lastExtensions;
|
|
19
20
|
private readonly _resolvedExtensions;
|
|
20
21
|
constructor();
|
|
21
|
-
execCmd(cmd:
|
|
22
|
+
execCmd(cmd: TiptapCommand): void;
|
|
22
23
|
private _createEditor;
|
|
23
24
|
private _destroyEditor;
|
|
24
25
|
private _getEditorMarkdownFrom;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sd-markdown-editor.d.ts","sourceRoot":"","sources":["../../../src/features/editor/sd-markdown-editor.ts"],"names":[],"mappings":"AAAA,OAAO,EAcL,KAAK,cAAc,EACpB,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,MAAM,EAAqB,MAAM,cAAc,CAAC;;
|
|
1
|
+
{"version":3,"file":"sd-markdown-editor.d.ts","sourceRoot":"","sources":["../../../src/features/editor/sd-markdown-editor.ts"],"names":[],"mappings":"AAAA,OAAO,EAcL,KAAK,cAAc,EACpB,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,MAAM,EAAqB,MAAM,cAAc,CAAC;AAIzD,OAAO,EAAoB,KAAK,aAAa,EAAE,MAAM,oBAAoB,CAAC;;AAO1E,qBA6Ha,gBAAgB;IAC3B,KAAK,0DAAmB;IACxB,QAAQ,qEAAiD;IACzD,QAAQ,qEAAiD;IACzD,QAAQ,qEAAiD;IACzD,WAAW,0DAAmB;IAC9B,WAAW,+CAAiB,MAAM,GAAG,SAAS,KAAK,MAAM,GAAG,SAAS,eAAI;IAEzE,OAAO,CAAC,QAAQ,CAAC,MAAM,CAA+C;IACtE,OAAO,CAAC,QAAQ,CAAC,WAAW,CAAsB;IAElD,qDAAqD;IACrD,MAAM,EAAE,cAAc,CAAC,MAAM,GAAG,SAAS,CAAC,CAAqB;IAE/D,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAA6C;IACtE,YAAY,kEAA8B;IAE1C,OAAO,CAAC,mBAAmB,CAAqB;IAChD,OAAO,CAAC,eAAe,CAA6B;IAEpD,OAAO,CAAC,QAAQ,CAAC,mBAAmB,CAMjC;;IA2DH,OAAO,CAAC,GAAG,EAAE,aAAa,GAAG,IAAI;IAKjC,OAAO,CAAC,aAAa;IAqBrB,OAAO,CAAC,cAAc;IAStB,OAAO,CAAC,sBAAsB;yCAxHnB,gBAAgB;2CAAhB,gBAAgB;CA4H5B"}
|
|
@@ -82,16 +82,20 @@ const DEFAULT_EXTENSIONS = [
|
|
|
82
82
|
Markdown,
|
|
83
83
|
];
|
|
84
84
|
export class SdMarkdownEditor {
|
|
85
|
-
value = model(
|
|
85
|
+
value = model(/* @ts-ignore */
|
|
86
|
+
...(ngDevMode ? [undefined, { debugName: "value" }] : /* istanbul ignore next */ []));
|
|
86
87
|
disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
87
88
|
readonly = input(false, { ...(ngDevMode ? { debugName: "readonly" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
88
89
|
required = input(false, { ...(ngDevMode ? { debugName: "required" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
89
|
-
placeholder = input(
|
|
90
|
-
|
|
90
|
+
placeholder = input(/* @ts-ignore */
|
|
91
|
+
...(ngDevMode ? [undefined, { debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
92
|
+
validatorFn = input(/* @ts-ignore */
|
|
93
|
+
...(ngDevMode ? [undefined, { debugName: "validatorFn" }] : /* istanbul ignore next */ []));
|
|
91
94
|
_elRef = inject(ElementRef);
|
|
92
95
|
_destroyRef = inject(DestroyRef);
|
|
93
96
|
/** @internal -- TipTap Editor 인스턴스. 테스트 및 고급 사용자용 */
|
|
94
|
-
editor = signal(undefined,
|
|
97
|
+
editor = signal(undefined, /* @ts-ignore */
|
|
98
|
+
...(ngDevMode ? [{ debugName: "editor" }] : /* istanbul ignore next */ []));
|
|
95
99
|
_toolbar = useTiptapToolbar({ editor: this.editor });
|
|
96
100
|
activeStates = this._toolbar.activeStates;
|
|
97
101
|
_lastEditorMarkdown;
|
|
@@ -102,7 +106,8 @@ export class SdMarkdownEditor {
|
|
|
102
106
|
return [...DEFAULT_EXTENSIONS, Placeholder.configure({ placeholder: ph })];
|
|
103
107
|
}
|
|
104
108
|
return DEFAULT_EXTENSIONS;
|
|
105
|
-
},
|
|
109
|
+
}, /* @ts-ignore */
|
|
110
|
+
...(ngDevMode ? [{ debugName: "_resolvedExtensions" }] : /* istanbul ignore next */ []));
|
|
106
111
|
constructor() {
|
|
107
112
|
effect(() => {
|
|
108
113
|
const extensions = this._resolvedExtensions();
|
|
@@ -201,7 +206,7 @@ export class SdMarkdownEditor {
|
|
|
201
206
|
i0.ɵɵdomElement(1, "div", 1);
|
|
202
207
|
} if (rf & 2) {
|
|
203
208
|
i0.ɵɵconditional(!ctx.disabled() && !ctx.readonly() ? 0 : -1);
|
|
204
|
-
} }, styles: ["sd-markdown-editor {\n display: block;\n position: relative;\n border: 1px solid var(--trans-lighter);\n border-radius: var(--border-radius-default);\n background: var(--theme-secondary-lightest);\n}\nsd-markdown-editor > ._toolbar {\n display: flex;\n flex-wrap: wrap;\n gap: var(--gap-xs);\n padding: var(--gap-xs);\n border-bottom: 1px solid var(--trans-lighter);\n}\nsd-markdown-editor > ._toolbar > ._btn-group {\n display: flex;\n gap: 1px;\n}\nsd-markdown-editor > ._toolbar > ._btn-group > button {\n padding: var(--gap-xs) var(--gap-sm);\n border: 1px solid var(--trans-lighter);\n border-radius: var(--border-radius-default);\n background: transparent;\n cursor: pointer;\n font-size: var(--font-size-default);\n line-height: 1;\n}\nsd-markdown-editor > ._toolbar > ._btn-group > button._active {\n background: var(--theme-primary-default);\n color: var(--text-trans-rev-default);\n}\nsd-markdown-editor > ._toolbar > ._btn-group > button:hover {\n background: var(--trans-lighter);\n}\nsd-markdown-editor > ._toolbar > ._btn-group > button._active:hover {\n background: var(--theme-primary-default);\n}\nsd-markdown-editor > ._editor-container {\n padding: var(--gap-sm);\n min-height: 6.25rem;\n font-family: var(--font-family-field);\n}\nsd-markdown-editor > ._editor-container > .tiptap {\n outline: none;\n}\nsd-markdown-editor > ._editor-container > .tiptap:focus {\n outline: none;\n}\nsd-markdown-editor[data-sd-disabled=true] {\n background: var(--theme-gray-lightest);\n color: var(--text-trans-light);\n}\nsd-markdown-editor[data-sd-disabled=true] > ._editor-container > .tiptap {\n cursor: not-allowed;\n}\nsd-markdown-editor[data-sd-readonly=true] > ._editor-container > .tiptap {\n cursor: default;\n}"], encapsulation: 2
|
|
209
|
+
} }, styles: ["sd-markdown-editor {\n display: block;\n position: relative;\n border: 1px solid var(--trans-lighter);\n border-radius: var(--border-radius-default);\n background: var(--theme-secondary-lightest);\n}\nsd-markdown-editor > ._toolbar {\n display: flex;\n flex-wrap: wrap;\n gap: var(--gap-xs);\n padding: var(--gap-xs);\n border-bottom: 1px solid var(--trans-lighter);\n}\nsd-markdown-editor > ._toolbar > ._btn-group {\n display: flex;\n gap: 1px;\n}\nsd-markdown-editor > ._toolbar > ._btn-group > button {\n padding: var(--gap-xs) var(--gap-sm);\n border: 1px solid var(--trans-lighter);\n border-radius: var(--border-radius-default);\n background: transparent;\n cursor: pointer;\n font-size: var(--font-size-default);\n line-height: 1;\n}\nsd-markdown-editor > ._toolbar > ._btn-group > button._active {\n background: var(--theme-primary-default);\n color: var(--text-trans-rev-default);\n}\nsd-markdown-editor > ._toolbar > ._btn-group > button:hover {\n background: var(--trans-lighter);\n}\nsd-markdown-editor > ._toolbar > ._btn-group > button._active:hover {\n background: var(--theme-primary-default);\n}\nsd-markdown-editor > ._editor-container {\n padding: var(--gap-sm);\n min-height: 6.25rem;\n font-family: var(--font-family-field);\n}\nsd-markdown-editor > ._editor-container > .tiptap {\n outline: none;\n}\nsd-markdown-editor > ._editor-container > .tiptap:focus {\n outline: none;\n}\nsd-markdown-editor[data-sd-disabled=true] {\n background: var(--theme-gray-lightest);\n color: var(--text-trans-light);\n}\nsd-markdown-editor[data-sd-disabled=true] > ._editor-container > .tiptap {\n cursor: not-allowed;\n}\nsd-markdown-editor[data-sd-readonly=true] > ._editor-container > .tiptap {\n cursor: default;\n}"], encapsulation: 2 });
|
|
205
210
|
}
|
|
206
211
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdMarkdownEditor, [{
|
|
207
212
|
type: Component,
|
|
@@ -19,7 +19,7 @@ export declare class SdTiptapEditor {
|
|
|
19
19
|
activeColor: WritableSignal<string>;
|
|
20
20
|
activeBgColor: WritableSignal<string>;
|
|
21
21
|
colorPickerMode: WritableSignal<"text" | "bg" | undefined>;
|
|
22
|
-
execCmd: (cmd:
|
|
22
|
+
execCmd: (cmd: import("./useTiptapToolbar").TiptapCommand) => void;
|
|
23
23
|
toggleColorPicker: (mode: "text" | "bg") => void;
|
|
24
24
|
applyColor: (color: string | undefined) => void;
|
|
25
25
|
private _lastEditorHtml;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sd-tiptap-editor.d.ts","sourceRoot":"","sources":["../../../src/features/editor/sd-tiptap-editor.ts"],"names":[],"mappings":"AAAA,OAAO,EAcL,KAAK,cAAc,EACpB,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,MAAM,EAAE,KAAK,YAAY,EAAE,MAAM,cAAc,CAAC;;AAqBzD,qBAuMa,cAAc;IACzB,KAAK,0DAAmB;IACxB,QAAQ,qEAAiD;IACzD,QAAQ,qEAAiD;IACzD,QAAQ,qEAAiD;IACzD,WAAW,0DAAmB;IAC9B,WAAW,+CAAiB,MAAM,GAAG,SAAS,KAAK,MAAM,GAAG,SAAS,eAAI;IACzE,UAAU,kEAA2B;IAErC,OAAO,CAAC,QAAQ,CAAC,MAAM,CAA+C;IACtE,OAAO,CAAC,QAAQ,CAAC,WAAW,CAAsB;IAElD,QAAQ,CAAC,YAAY,WAMnB;IAEF,qDAAqD;IACrD,MAAM,EAAE,cAAc,CAAC,MAAM,GAAG,SAAS,CAAC,CAAqB;IAE/D,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAA6C;IACtE,YAAY,kEAA8B;IAC1C,WAAW,yBAA6B;IACxC,aAAa,yBAA+B;IAC5C,eAAe,4CAAiC;IAChD,OAAO,
|
|
1
|
+
{"version":3,"file":"sd-tiptap-editor.d.ts","sourceRoot":"","sources":["../../../src/features/editor/sd-tiptap-editor.ts"],"names":[],"mappings":"AAAA,OAAO,EAcL,KAAK,cAAc,EACpB,MAAM,eAAe,CAAC;AAEvB,OAAO,EAAE,MAAM,EAAE,KAAK,YAAY,EAAE,MAAM,cAAc,CAAC;;AAqBzD,qBAuMa,cAAc;IACzB,KAAK,0DAAmB;IACxB,QAAQ,qEAAiD;IACzD,QAAQ,qEAAiD;IACzD,QAAQ,qEAAiD;IACzD,WAAW,0DAAmB;IAC9B,WAAW,+CAAiB,MAAM,GAAG,SAAS,KAAK,MAAM,GAAG,SAAS,eAAI;IACzE,UAAU,kEAA2B;IAErC,OAAO,CAAC,QAAQ,CAAC,MAAM,CAA+C;IACtE,OAAO,CAAC,QAAQ,CAAC,WAAW,CAAsB;IAElD,QAAQ,CAAC,YAAY,WAMnB;IAEF,qDAAqD;IACrD,MAAM,EAAE,cAAc,CAAC,MAAM,GAAG,SAAS,CAAC,CAAqB;IAE/D,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAA6C;IACtE,YAAY,kEAA8B;IAC1C,WAAW,yBAA6B;IACxC,aAAa,yBAA+B;IAC5C,eAAe,4CAAiC;IAChD,OAAO,4DAAyB;IAChC,iBAAiB,gCAAmC;IACpD,UAAU,sCAA4B;IAEtC,OAAO,CAAC,eAAe,CAAqB;IAC5C,OAAO,CAAC,eAAe,CAA6B;IAEpD,OAAO,CAAC,QAAQ,CAAC,mBAAmB,CASjC;;IA6DH,OAAO,CAAC,aAAa;IAoBrB,OAAO,CAAC,cAAc;IAStB,OAAO,CAAC,kBAAkB;yCAtIf,cAAc;2CAAd,cAAc;CA4I1B"}
|
|
@@ -162,13 +162,17 @@ const DEFAULT_EXTENSIONS = [
|
|
|
162
162
|
Underline,
|
|
163
163
|
];
|
|
164
164
|
export class SdTiptapEditor {
|
|
165
|
-
value = model(
|
|
165
|
+
value = model(/* @ts-ignore */
|
|
166
|
+
...(ngDevMode ? [undefined, { debugName: "value" }] : /* istanbul ignore next */ []));
|
|
166
167
|
disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
167
168
|
readonly = input(false, { ...(ngDevMode ? { debugName: "readonly" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
168
169
|
required = input(false, { ...(ngDevMode ? { debugName: "required" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
169
|
-
placeholder = input(
|
|
170
|
-
|
|
171
|
-
|
|
170
|
+
placeholder = input(/* @ts-ignore */
|
|
171
|
+
...(ngDevMode ? [undefined, { debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
172
|
+
validatorFn = input(/* @ts-ignore */
|
|
173
|
+
...(ngDevMode ? [undefined, { debugName: "validatorFn" }] : /* istanbul ignore next */ []));
|
|
174
|
+
extensions = input(/* @ts-ignore */
|
|
175
|
+
...(ngDevMode ? [undefined, { debugName: "extensions" }] : /* istanbul ignore next */ []));
|
|
172
176
|
_elRef = inject(ElementRef);
|
|
173
177
|
_destroyRef = inject(DestroyRef);
|
|
174
178
|
colorPresets = [
|
|
@@ -179,7 +183,8 @@ export class SdTiptapEditor {
|
|
|
179
183
|
"#f9cb9c", "#ffe599", "#b6d7a8", "#a2c4c9", "#a4c2f4", "#9fc5e8", "#b4a7d6", "#d5a6bd",
|
|
180
184
|
];
|
|
181
185
|
/** @internal -- TipTap Editor 인스턴스. 테스트 및 고급 사용자용 */
|
|
182
|
-
editor = signal(undefined,
|
|
186
|
+
editor = signal(undefined, /* @ts-ignore */
|
|
187
|
+
...(ngDevMode ? [{ debugName: "editor" }] : /* istanbul ignore next */ []));
|
|
183
188
|
_toolbar = useTiptapToolbar({ editor: this.editor });
|
|
184
189
|
activeStates = this._toolbar.activeStates;
|
|
185
190
|
activeColor = this._toolbar.activeColor;
|
|
@@ -199,7 +204,8 @@ export class SdTiptapEditor {
|
|
|
199
204
|
return [...DEFAULT_EXTENSIONS, Placeholder.configure({ placeholder: ph })];
|
|
200
205
|
}
|
|
201
206
|
return DEFAULT_EXTENSIONS;
|
|
202
|
-
},
|
|
207
|
+
}, /* @ts-ignore */
|
|
208
|
+
...(ngDevMode ? [{ debugName: "_resolvedExtensions" }] : /* istanbul ignore next */ []));
|
|
203
209
|
constructor() {
|
|
204
210
|
// Single effect that tracks both extensions and value
|
|
205
211
|
effect(() => {
|
|
@@ -295,7 +301,7 @@ export class SdTiptapEditor {
|
|
|
295
301
|
i0.ɵɵdomElement(1, "div", 0);
|
|
296
302
|
} if (rf & 2) {
|
|
297
303
|
i0.ɵɵconditional(!ctx.disabled() ? 0 : -1);
|
|
298
|
-
} }, styles: ["sd-tiptap-editor {\n display: block;\n position: relative;\n border: 1px solid var(--trans-lighter);\n border-radius: var(--border-radius-default);\n background: var(--theme-secondary-lightest);\n}\nsd-tiptap-editor > ._toolbar {\n display: flex;\n flex-wrap: wrap;\n gap: var(--gap-xs);\n padding: var(--gap-xs);\n border-bottom: 1px solid var(--trans-lighter);\n}\nsd-tiptap-editor > ._toolbar > ._btn-group {\n display: flex;\n gap: 1px;\n}\nsd-tiptap-editor > ._toolbar > ._btn-group > button {\n padding: var(--gap-xs) var(--gap-sm);\n border: 1px solid var(--trans-lighter);\n border-radius: var(--border-radius-default);\n background: transparent;\n cursor: pointer;\n font-size: var(--font-size-default);\n line-height: 1;\n}\nsd-tiptap-editor > ._toolbar > ._btn-group > button._active {\n background: var(--theme-primary-default);\n color: var(--text-trans-rev-default);\n}\nsd-tiptap-editor > ._toolbar > ._btn-group > button:hover {\n background: var(--trans-lighter);\n}\nsd-tiptap-editor > ._toolbar > ._btn-group > button._active:hover {\n background: var(--theme-primary-default);\n}\nsd-tiptap-editor > ._color-picker {\n display: flex;\n flex-wrap: wrap;\n gap: 2px;\n padding: var(--gap-xs);\n border-bottom: 1px solid var(--trans-lighter);\n}\nsd-tiptap-editor > ._color-picker > ._color-swatch {\n width: 1.25rem;\n height: 1.25rem;\n border: 1px solid var(--trans-lighter);\n border-radius: 2px;\n cursor: pointer;\n padding: 0;\n}\nsd-tiptap-editor > ._color-picker > ._color-swatch._no-color {\n display: flex;\n align-items: center;\n justify-content: center;\n background: var(--control-color);\n font-size: 0.625rem;\n}\nsd-tiptap-editor > ._editor-container {\n padding: var(--gap-sm);\n min-height: 6.25rem;\n font-family: var(--font-family-field);\n}\nsd-tiptap-editor > ._editor-container > .tiptap {\n outline: none;\n}\nsd-tiptap-editor > ._editor-container > .tiptap:focus {\n outline: none;\n}\nsd-tiptap-editor[data-sd-disabled=true] {\n background: var(--theme-gray-lightest);\n color: var(--text-trans-light);\n}\nsd-tiptap-editor[data-sd-disabled=true] > ._editor-container > .tiptap {\n cursor: not-allowed;\n}\nsd-tiptap-editor[data-sd-readonly=true] > ._editor-container > .tiptap {\n cursor: default;\n}\nsd-tiptap-editor ._color-btn {\n position: relative;\n}\nsd-tiptap-editor ._color-btn > ._color-indicator {\n display: block;\n height: 2px;\n width: 100%;\n position: absolute;\n bottom: 2px;\n left: 0;\n}"], encapsulation: 2
|
|
304
|
+
} }, styles: ["sd-tiptap-editor {\n display: block;\n position: relative;\n border: 1px solid var(--trans-lighter);\n border-radius: var(--border-radius-default);\n background: var(--theme-secondary-lightest);\n}\nsd-tiptap-editor > ._toolbar {\n display: flex;\n flex-wrap: wrap;\n gap: var(--gap-xs);\n padding: var(--gap-xs);\n border-bottom: 1px solid var(--trans-lighter);\n}\nsd-tiptap-editor > ._toolbar > ._btn-group {\n display: flex;\n gap: 1px;\n}\nsd-tiptap-editor > ._toolbar > ._btn-group > button {\n padding: var(--gap-xs) var(--gap-sm);\n border: 1px solid var(--trans-lighter);\n border-radius: var(--border-radius-default);\n background: transparent;\n cursor: pointer;\n font-size: var(--font-size-default);\n line-height: 1;\n}\nsd-tiptap-editor > ._toolbar > ._btn-group > button._active {\n background: var(--theme-primary-default);\n color: var(--text-trans-rev-default);\n}\nsd-tiptap-editor > ._toolbar > ._btn-group > button:hover {\n background: var(--trans-lighter);\n}\nsd-tiptap-editor > ._toolbar > ._btn-group > button._active:hover {\n background: var(--theme-primary-default);\n}\nsd-tiptap-editor > ._color-picker {\n display: flex;\n flex-wrap: wrap;\n gap: 2px;\n padding: var(--gap-xs);\n border-bottom: 1px solid var(--trans-lighter);\n}\nsd-tiptap-editor > ._color-picker > ._color-swatch {\n width: 1.25rem;\n height: 1.25rem;\n border: 1px solid var(--trans-lighter);\n border-radius: 2px;\n cursor: pointer;\n padding: 0;\n}\nsd-tiptap-editor > ._color-picker > ._color-swatch._no-color {\n display: flex;\n align-items: center;\n justify-content: center;\n background: var(--control-color);\n font-size: 0.625rem;\n}\nsd-tiptap-editor > ._editor-container {\n padding: var(--gap-sm);\n min-height: 6.25rem;\n font-family: var(--font-family-field);\n}\nsd-tiptap-editor > ._editor-container > .tiptap {\n outline: none;\n}\nsd-tiptap-editor > ._editor-container > .tiptap:focus {\n outline: none;\n}\nsd-tiptap-editor[data-sd-disabled=true] {\n background: var(--theme-gray-lightest);\n color: var(--text-trans-light);\n}\nsd-tiptap-editor[data-sd-disabled=true] > ._editor-container > .tiptap {\n cursor: not-allowed;\n}\nsd-tiptap-editor[data-sd-readonly=true] > ._editor-container > .tiptap {\n cursor: default;\n}\nsd-tiptap-editor ._color-btn {\n position: relative;\n}\nsd-tiptap-editor ._color-btn > ._color-indicator {\n display: block;\n height: 2px;\n width: 100%;\n position: absolute;\n bottom: 2px;\n left: 0;\n}"], encapsulation: 2 });
|
|
299
305
|
}
|
|
300
306
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdTiptapEditor, [{
|
|
301
307
|
type: Component,
|
|
@@ -16,6 +16,7 @@ export interface TiptapActiveStates {
|
|
|
16
16
|
alignRight: boolean;
|
|
17
17
|
alignJustify: boolean;
|
|
18
18
|
}
|
|
19
|
+
export type TiptapCommand = "bold" | "italic" | "underline" | "strike" | "h1" | "h2" | "bulletList" | "orderedList" | "indent" | "outdent" | "blockquote" | "codeBlock" | "alignLeft" | "alignCenter" | "alignRight" | "alignJustify" | "clean";
|
|
19
20
|
export declare const DEFAULT_ACTIVE_STATES: TiptapActiveStates;
|
|
20
21
|
interface TiptapToolbarOptions {
|
|
21
22
|
editor: Signal<Editor | undefined>;
|
|
@@ -25,7 +26,7 @@ export declare function useTiptapToolbar(opt: TiptapToolbarOptions): {
|
|
|
25
26
|
activeColor: WritableSignal<string>;
|
|
26
27
|
activeBgColor: WritableSignal<string>;
|
|
27
28
|
colorPickerMode: WritableSignal<"text" | "bg" | undefined>;
|
|
28
|
-
execCmd: (cmd:
|
|
29
|
+
execCmd: (cmd: TiptapCommand) => void;
|
|
29
30
|
refreshActiveStates: () => void;
|
|
30
31
|
toggleColorPicker: (mode: "text" | "bg") => void;
|
|
31
32
|
applyColor: (color: string | undefined) => void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useTiptapToolbar.d.ts","sourceRoot":"","sources":["../../../src/features/editor/useTiptapToolbar.ts"],"names":[],"mappings":"AAAA,OAAO,EAAU,KAAK,MAAM,EAAE,KAAK,cAAc,EAAE,MAAM,eAAe,CAAC;AACzE,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AAE3C,MAAM,WAAW,kBAAkB;IACjC,EAAE,EAAE,OAAO,CAAC;IACZ,EAAE,EAAE,OAAO,CAAC;IACZ,IAAI,EAAE,OAAO,CAAC;IACd,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,OAAO,CAAC;IACnB,MAAM,EAAE,OAAO,CAAC;IAChB,UAAU,EAAE,OAAO,CAAC;IACpB,WAAW,EAAE,OAAO,CAAC;IACrB,UAAU,EAAE,OAAO,CAAC;IACpB,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,WAAW,EAAE,OAAO,CAAC;IACrB,UAAU,EAAE,OAAO,CAAC;IACpB,YAAY,EAAE,OAAO,CAAC;CACvB;AAED,eAAO,MAAM,qBAAqB,EAAE,kBAenC,CAAC;AAEF,UAAU,oBAAoB;IAC5B,MAAM,EAAE,MAAM,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC;CACpC;AAED,wBAAgB,gBAAgB,CAAC,GAAG,EAAE,oBAAoB,GAAG;IAC3D,YAAY,EAAE,cAAc,CAAC,kBAAkB,CAAC,CAAC;IACjD,WAAW,EAAE,cAAc,CAAC,MAAM,CAAC,CAAC;IACpC,aAAa,EAAE,cAAc,CAAC,MAAM,CAAC,CAAC;IACtC,eAAe,EAAE,cAAc,CAAC,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC,CAAC;IAC3D,OAAO,EAAE,CAAC,GAAG,EAAE,
|
|
1
|
+
{"version":3,"file":"useTiptapToolbar.d.ts","sourceRoot":"","sources":["../../../src/features/editor/useTiptapToolbar.ts"],"names":[],"mappings":"AAAA,OAAO,EAAU,KAAK,MAAM,EAAE,KAAK,cAAc,EAAE,MAAM,eAAe,CAAC;AACzE,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AAE3C,MAAM,WAAW,kBAAkB;IACjC,EAAE,EAAE,OAAO,CAAC;IACZ,EAAE,EAAE,OAAO,CAAC;IACZ,IAAI,EAAE,OAAO,CAAC;IACd,MAAM,EAAE,OAAO,CAAC;IAChB,SAAS,EAAE,OAAO,CAAC;IACnB,MAAM,EAAE,OAAO,CAAC;IAChB,UAAU,EAAE,OAAO,CAAC;IACpB,WAAW,EAAE,OAAO,CAAC;IACrB,UAAU,EAAE,OAAO,CAAC;IACpB,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,WAAW,EAAE,OAAO,CAAC;IACrB,UAAU,EAAE,OAAO,CAAC;IACpB,YAAY,EAAE,OAAO,CAAC;CACvB;AAED,MAAM,MAAM,aAAa,GACrB,MAAM,GACN,QAAQ,GACR,WAAW,GACX,QAAQ,GACR,IAAI,GACJ,IAAI,GACJ,YAAY,GACZ,aAAa,GACb,QAAQ,GACR,SAAS,GACT,YAAY,GACZ,WAAW,GACX,WAAW,GACX,aAAa,GACb,YAAY,GACZ,cAAc,GACd,OAAO,CAAC;AAEZ,eAAO,MAAM,qBAAqB,EAAE,kBAenC,CAAC;AAEF,UAAU,oBAAoB;IAC5B,MAAM,EAAE,MAAM,CAAC,MAAM,GAAG,SAAS,CAAC,CAAC;CACpC;AAED,wBAAgB,gBAAgB,CAAC,GAAG,EAAE,oBAAoB,GAAG;IAC3D,YAAY,EAAE,cAAc,CAAC,kBAAkB,CAAC,CAAC;IACjD,WAAW,EAAE,cAAc,CAAC,MAAM,CAAC,CAAC;IACpC,aAAa,EAAE,cAAc,CAAC,MAAM,CAAC,CAAC;IACtC,eAAe,EAAE,cAAc,CAAC,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC,CAAC;IAC3D,OAAO,EAAE,CAAC,GAAG,EAAE,aAAa,KAAK,IAAI,CAAC;IACtC,mBAAmB,EAAE,MAAM,IAAI,CAAC;IAChC,iBAAiB,EAAE,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACjD,UAAU,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,KAAK,IAAI,CAAC;CACjD,CAgIA"}
|
|
@@ -16,10 +16,14 @@ export const DEFAULT_ACTIVE_STATES = {
|
|
|
16
16
|
alignJustify: false,
|
|
17
17
|
};
|
|
18
18
|
export function useTiptapToolbar(opt) {
|
|
19
|
-
const activeStates = signal(DEFAULT_ACTIVE_STATES,
|
|
20
|
-
|
|
21
|
-
const
|
|
22
|
-
|
|
19
|
+
const activeStates = signal(DEFAULT_ACTIVE_STATES, /* @ts-ignore */
|
|
20
|
+
...(ngDevMode ? [{ debugName: "activeStates" }] : /* istanbul ignore next */ []));
|
|
21
|
+
const activeColor = signal("", /* @ts-ignore */
|
|
22
|
+
...(ngDevMode ? [{ debugName: "activeColor" }] : /* istanbul ignore next */ []));
|
|
23
|
+
const activeBgColor = signal("", /* @ts-ignore */
|
|
24
|
+
...(ngDevMode ? [{ debugName: "activeBgColor" }] : /* istanbul ignore next */ []));
|
|
25
|
+
const colorPickerMode = signal(undefined, /* @ts-ignore */
|
|
26
|
+
...(ngDevMode ? [{ debugName: "colorPickerMode" }] : /* istanbul ignore next */ []));
|
|
23
27
|
function execCmd(cmd) {
|
|
24
28
|
const ed = opt.editor();
|
|
25
29
|
if (ed == null)
|
|
@@ -2,11 +2,14 @@ import { effect, inject, Injectable, PLATFORM_ID, signal } from "@angular/core";
|
|
|
2
2
|
import { isPlatformBrowser } from "@angular/common";
|
|
3
3
|
import * as i0 from "@angular/core";
|
|
4
4
|
export class SdThemeProvider {
|
|
5
|
-
dark = signal(false,
|
|
5
|
+
dark = signal(false, /* @ts-ignore */
|
|
6
|
+
...(ngDevMode ? [{ debugName: "dark" }] : /* istanbul ignore next */ []));
|
|
6
7
|
// 블루프린트(엔지니어링 도면) 테마 — dark 토글과 직교. dark 와 조합해 4면을 만든다.
|
|
7
|
-
blueprint = signal(false,
|
|
8
|
+
blueprint = signal(false, /* @ts-ignore */
|
|
9
|
+
...(ngDevMode ? [{ debugName: "blueprint" }] : /* istanbul ignore next */ []));
|
|
8
10
|
fontSizePresets = [12, 14, 16, 20, 24, 28];
|
|
9
|
-
fontSize = signal(12,
|
|
11
|
+
fontSize = signal(12, /* @ts-ignore */
|
|
12
|
+
...(ngDevMode ? [{ debugName: "fontSize" }] : /* istanbul ignore next */ []));
|
|
10
13
|
constructor() {
|
|
11
14
|
// SSR(프리렌더) 가드: document 반영은 브라우저 전용
|
|
12
15
|
if (!isPlatformBrowser(inject(PLATFORM_ID)))
|