@simplysm/angular 14.1.15 → 14.1.18
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 +2 -2
- package/dist/controls/button/sd-anchor.js +2 -2
- package/dist/controls/button/sd-button.js +2 -2
- package/dist/controls/button/sd-modal-select-button.js +2 -2
- package/dist/controls/checkbox/sd-checkbox.js +2 -2
- package/dist/controls/checkbox/sd-switch.js +2 -2
- package/dist/controls/collapse/sd-collapse.js +2 -1
- package/dist/controls/dropdown/sd-dropdown-popup.js +2 -2
- package/dist/controls/dropdown/sd-dropdown.js +1 -3
- package/dist/controls/form/sd-form.js +1 -3
- package/dist/controls/gap/sd-gap.js +2 -2
- package/dist/controls/input/sd-date-range-picker.js +2 -2
- package/dist/controls/input/sd-range.js +2 -2
- package/dist/controls/input/sd-textarea.js +2 -2
- package/dist/controls/input/sd-textfield.js +2 -2
- package/dist/controls/select/sd-select-item.js +2 -2
- package/dist/controls/select/sd-select.js +3 -2
- package/dist/core/busy/sd-busy-container.js +2 -2
- package/dist/core/modal/sd-modal.js +2 -2
- package/dist/core/provideSdAngular.d.ts.map +1 -1
- package/dist/core/provideSdAngular.js +0 -12
- package/dist/core/toast/sd-toast-container.js +2 -2
- package/dist/core/toast/sd-toast.js +2 -2
- package/dist/data/kanban/sd-kanban-board.js +2 -2
- package/dist/data/shared-data/sd-shared-data-select-button.js +1 -1
- package/dist/data/sheet/sd-sheet-column.js +1 -1
- package/dist/data/sheet/sd-sheet.js +2 -2
- package/dist/features/theme/sd-theme-provider.d.ts +0 -1
- package/dist/features/theme/sd-theme-provider.d.ts.map +1 -1
- package/dist/features/theme/sd-theme-provider.js +1 -6
- package/dist/features/theme/sd-theme-selector.d.ts.map +1 -1
- package/dist/features/theme/sd-theme-selector.js +42 -54
- package/dist/features/visual/sd-calendar.js +3 -3
- package/dist/features/visual/sd-label.js +2 -2
- package/dist/features/visual/sd-note.js +2 -2
- package/dist/features/visual/sd-progress.js +2 -2
- package/dist/layout/sidebar/sd-sidebar-container.js +2 -2
- package/dist/layout/sidebar/sd-sidebar.js +2 -2
- package/package.json +26 -26
- package/scss/commons/_colors.scss +247 -326
- package/scss/commons/_theme-variables.scss +2 -12
- package/scss/commons/_variables.scss +83 -56
- package/scss/themes/_variables-blueprint.scss +99 -95
- package/src/core/provideSdAngular.ts +0 -14
- package/src/features/theme/sd-theme-provider.ts +1 -7
- package/src/features/theme/sd-theme-selector.ts +77 -81
- package/src/layout/sidebar/sd-sidebar.ts +1 -1
- package/styles.css +368 -485
- package/scss/themes/_variables-dark.scss +0 -53
|
@@ -794,7 +794,7 @@ export class SdSheet {
|
|
|
794
794
|
SdPagination,
|
|
795
795
|
SdAnchor,
|
|
796
796
|
SdButton,
|
|
797
|
-
SdResizeDirective], styles: ["
|
|
797
|
+
SdResizeDirective], styles: ["sd-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 });
|
|
798
798
|
}
|
|
799
799
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdSheet, [{
|
|
800
800
|
type: Component,
|
|
@@ -1089,6 +1089,6 @@ export class SdSheet {
|
|
|
1089
1089
|
></div>
|
|
1090
1090
|
<div class="_select-row-indicator-container"></div>
|
|
1091
1091
|
</div>
|
|
1092
|
-
`, styles: ["
|
|
1092
|
+
`, styles: ["sd-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}"] }]
|
|
1093
1093
|
}], null, { key: [{ type: i0.Input, args: [{ isSignal: true, alias: "key", required: false }] }], items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: false }] }], trackByFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "trackByFn", required: false }] }], selectMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectMode", required: false }] }], autoSelect: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoSelect", required: false }] }], getItemSelectableFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "getItemSelectableFn", required: false }] }], getChildrenFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "getChildrenFn", required: false }] }], useAutoSort: [{ type: i0.Input, args: [{ isSignal: true, alias: "useAutoSort", required: false }] }], visiblePageCount: [{ type: i0.Input, args: [{ isSignal: true, alias: "visiblePageCount", required: false }] }], totalPageCount: [{ type: i0.Input, args: [{ isSignal: true, alias: "totalPageCount", required: false }] }], itemsPerPage: [{ type: i0.Input, args: [{ isSignal: true, alias: "itemsPerPage", required: false }] }], focusMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "focusMode", required: false }] }], inset: [{ type: i0.Input, args: [{ isSignal: true, alias: "inset", required: false }] }], contentStyle: [{ type: i0.Input, args: [{ isSignal: true, alias: "contentStyle", required: false }] }], getItemCellClassFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "getItemCellClassFn", required: false }] }], getItemCellStyleFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "getItemCellStyleFn", required: false }] }], hideConfigBar: [{ type: i0.Input, args: [{ isSignal: true, alias: "hideConfigBar", required: false }] }], itemKeydown: [{ type: i0.Output, args: ["itemKeydown"] }], cellKeydown: [{ type: i0.Output, args: ["cellKeydown"] }], selectedKeys: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectedKeys", required: false }] }, { type: i0.Output, args: ["selectedKeysChange"] }], expandedItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "expandedItems", required: false }] }, { type: i0.Output, args: ["expandedItemsChange"] }], sorts: [{ type: i0.Input, args: [{ isSignal: true, alias: "sorts", required: false }] }, { type: i0.Output, args: ["sortsChange"] }], currentPage: [{ type: i0.Input, args: [{ isSignal: true, alias: "currentPage", required: false }] }, { type: i0.Output, args: ["currentPageChange"] }], columnControls: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => SdSheetColumn), { isSignal: true }] }], columnControlsInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "columnControlsInput", required: false }] }] }); })();
|
|
1094
1094
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdSheet, { className: "SdSheet", filePath: "packages/angular/src/data/sheet/sd-sheet.ts", lineNumber: 586 }); })();
|
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
import * as i0 from "@angular/core";
|
|
2
2
|
export declare class SdThemeProvider {
|
|
3
|
-
dark: import("@angular/core").WritableSignal<boolean>;
|
|
4
3
|
blueprint: import("@angular/core").WritableSignal<boolean>;
|
|
5
4
|
readonly fontSizePresets: readonly number[];
|
|
6
5
|
fontSize: import("@angular/core").WritableSignal<number>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sd-theme-provider.d.ts","sourceRoot":"","sources":["../../../src/features/theme/sd-theme-provider.ts"],"names":[],"mappings":";AAGA,qBACa,eAAe;
|
|
1
|
+
{"version":3,"file":"sd-theme-provider.d.ts","sourceRoot":"","sources":["../../../src/features/theme/sd-theme-provider.ts"],"names":[],"mappings":";AAGA,qBACa,eAAe;IAE1B,SAAS,kDAA0B;IAEnC,QAAQ,CAAC,eAAe,EAAE,SAAS,MAAM,EAAE,CAA4B;IAEvE,QAAQ,iDAAsB;;IAe9B,gBAAgB,IAAI,IAAI;IAOxB,gBAAgB,IAAI,IAAI;yCA5Bb,eAAe;6CAAf,eAAe;CAwC3B"}
|
|
@@ -2,9 +2,7 @@ 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
|
-
|
|
6
|
-
...(ngDevMode ? [{ debugName: "dark" }] : /* istanbul ignore next */ []));
|
|
7
|
-
// 블루프린트(엔지니어링 도면) 테마 — dark 토글과 직교. dark 와 조합해 4면을 만든다.
|
|
5
|
+
// 블루프린트(엔지니어링 도면) 테마
|
|
8
6
|
blueprint = signal(false, /* @ts-ignore */
|
|
9
7
|
...(ngDevMode ? [{ debugName: "blueprint" }] : /* istanbul ignore next */ []));
|
|
10
8
|
fontSizePresets = [12, 14, 16, 20, 24, 28];
|
|
@@ -14,9 +12,6 @@ export class SdThemeProvider {
|
|
|
14
12
|
// SSR(프리렌더) 가드: document 반영은 브라우저 전용
|
|
15
13
|
if (!isPlatformBrowser(inject(PLATFORM_ID)))
|
|
16
14
|
return;
|
|
17
|
-
effect(() => {
|
|
18
|
-
document.body.classList.toggle("sd-theme-dark", this.dark());
|
|
19
|
-
});
|
|
20
15
|
effect(() => {
|
|
21
16
|
document.body.classList.toggle("sd-theme-blueprint", this.blueprint());
|
|
22
17
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sd-theme-selector.d.ts","sourceRoot":"","sources":["../../../src/features/theme/sd-theme-selector.ts"],"names":[],"mappings":"AAYA,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;;AAGtD,
|
|
1
|
+
{"version":3,"file":"sd-theme-selector.d.ts","sourceRoot":"","sources":["../../../src/features/theme/sd-theme-selector.ts"],"names":[],"mappings":"AAYA,OAAO,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;;AAGtD,qBA+Ca,eAAe;IAC1B,SAAS,CAAC,QAAQ,CAAC,QAAQ,kBAA2B;IAEtD,aAAa,0CAAgF;IAE7F,aAAa,0CAIX;IAEF,SAAS,CAAC,QAAQ,CAAC,UAAU,uVAAc;IAC3C,SAAS,CAAC,QAAQ,CAAC,WAAW,yTAAe;IAC7C,SAAS,CAAC,QAAQ,CAAC,aAAa,uoBAAiB;yCAbtC,eAAe;2CAAf,eAAe;CAc3B"}
|
|
@@ -18,7 +18,7 @@ export class SdThemeSelector {
|
|
|
18
18
|
tablerMinus = tablerMinus;
|
|
19
19
|
tablerPalette = tablerPalette;
|
|
20
20
|
static ɵfac = function SdThemeSelector_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || SdThemeSelector)(); };
|
|
21
|
-
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdThemeSelector, selectors: [["sd-theme-selector"]], decls:
|
|
21
|
+
static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: SdThemeSelector, selectors: [["sd-theme-selector"]], decls: 19, vars: 15, consts: [[3, "inline", "theme"], [3, "svg"], [1, "p-default"], [1, "flex-row", "gap-sm", "cross-align-center"], [1, "flex-row", "gap-xs", "cross-align-center"], [3, "click", "inline", "theme", "size", "disabled"], [3, "valueChange", "value"]], template: function SdThemeSelector_Template(rf, ctx) { if (rf & 1) {
|
|
22
22
|
i0.ɵɵelementStart(0, "sd-dropdown")(1, "sd-button", 0);
|
|
23
23
|
i0.ɵɵelement(2, "ng-icon", 1);
|
|
24
24
|
i0.ɵɵelementEnd();
|
|
@@ -37,16 +37,10 @@ export class SdThemeSelector {
|
|
|
37
37
|
i0.ɵɵelement(14, "ng-icon", 1);
|
|
38
38
|
i0.ɵɵelementEnd()()();
|
|
39
39
|
i0.ɵɵelementStart(15, "div", 3)(16, "span");
|
|
40
|
-
i0.ɵɵtext(17, "\
|
|
40
|
+
i0.ɵɵtext(17, "\uBE14\uB8E8\uD504\uB9B0\uD2B8");
|
|
41
41
|
i0.ɵɵelementEnd();
|
|
42
42
|
i0.ɵɵelementStart(18, "sd-switch", 6);
|
|
43
|
-
i0.ɵɵtwoWayListener("valueChange", function SdThemeSelector_Template_sd_switch_valueChange_18_listener($event) { i0.ɵɵtwoWayBindingSet(ctx._sdTheme.
|
|
44
|
-
i0.ɵɵelementEnd()();
|
|
45
|
-
i0.ɵɵelementStart(19, "div", 3)(20, "span");
|
|
46
|
-
i0.ɵɵtext(21, "\uBE14\uB8E8\uD504\uB9B0\uD2B8");
|
|
47
|
-
i0.ɵɵelementEnd();
|
|
48
|
-
i0.ɵɵelementStart(22, "sd-switch", 6);
|
|
49
|
-
i0.ɵɵtwoWayListener("valueChange", function SdThemeSelector_Template_sd_switch_valueChange_22_listener($event) { i0.ɵɵtwoWayBindingSet(ctx._sdTheme.blueprint, $event) || (ctx._sdTheme.blueprint = $event); return $event; });
|
|
43
|
+
i0.ɵɵtwoWayListener("valueChange", function SdThemeSelector_Template_sd_switch_valueChange_18_listener($event) { i0.ɵɵtwoWayBindingSet(ctx._sdTheme.blueprint, $event) || (ctx._sdTheme.blueprint = $event); return $event; });
|
|
50
44
|
i0.ɵɵelementEnd()()()()();
|
|
51
45
|
} if (rf & 2) {
|
|
52
46
|
i0.ɵɵadvance();
|
|
@@ -64,55 +58,49 @@ export class SdThemeSelector {
|
|
|
64
58
|
i0.ɵɵadvance();
|
|
65
59
|
i0.ɵɵproperty("svg", ctx.tablerPlus);
|
|
66
60
|
i0.ɵɵadvance(4);
|
|
67
|
-
i0.ɵɵtwoWayProperty("value", ctx._sdTheme.dark);
|
|
68
|
-
i0.ɵɵadvance(4);
|
|
69
61
|
i0.ɵɵtwoWayProperty("value", ctx._sdTheme.blueprint);
|
|
70
62
|
} }, dependencies: [SdDropdown, SdDropdownPopup, SdButton, SdSwitch, NgIcon], encapsulation: 2 });
|
|
71
63
|
}
|
|
72
64
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdThemeSelector, [{
|
|
73
65
|
type: Component,
|
|
74
|
-
args: [{ selector: "sd-theme-selector", changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [SdDropdown, SdDropdownPopup, SdButton, SdSwitch, NgIcon], template: `
|
|
75
|
-
<sd-dropdown>
|
|
76
|
-
<sd-button [inline]="true" [theme]="'link-gray'">
|
|
77
|
-
<ng-icon [svg]="tablerPalette" />
|
|
78
|
-
</sd-button>
|
|
79
|
-
<sd-dropdown-popup>
|
|
80
|
-
<div class="p-default">
|
|
81
|
-
<div class="flex-row gap-sm cross-align-center">
|
|
82
|
-
<span>글자 크기</span>
|
|
83
|
-
<div class="flex-row gap-xs cross-align-center">
|
|
84
|
-
<sd-button
|
|
85
|
-
[inline]="true"
|
|
86
|
-
[theme]="'link-gray'"
|
|
87
|
-
[size]="'sm'"
|
|
88
|
-
[disabled]="isMinFontSize()"
|
|
89
|
-
(click)="_sdTheme.decreaseFontSize()"
|
|
90
|
-
>
|
|
91
|
-
<ng-icon [svg]="tablerMinus" />
|
|
92
|
-
</sd-button>
|
|
93
|
-
<span>{{ _sdTheme.fontSize() }}px</span>
|
|
94
|
-
<sd-button
|
|
95
|
-
[inline]="true"
|
|
96
|
-
[theme]="'link-gray'"
|
|
97
|
-
[size]="'sm'"
|
|
98
|
-
[disabled]="isMaxFontSize()"
|
|
99
|
-
(click)="_sdTheme.increaseFontSize()"
|
|
100
|
-
>
|
|
101
|
-
<ng-icon [svg]="tablerPlus" />
|
|
102
|
-
</sd-button>
|
|
103
|
-
</div>
|
|
104
|
-
</div>
|
|
105
|
-
<div class="flex-row gap-sm cross-align-center">
|
|
106
|
-
<span
|
|
107
|
-
<sd-switch [(value)]="_sdTheme.
|
|
108
|
-
</div>
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
</div>
|
|
113
|
-
</div>
|
|
114
|
-
</sd-dropdown-popup>
|
|
115
|
-
</sd-dropdown>
|
|
66
|
+
args: [{ selector: "sd-theme-selector", changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, standalone: true, imports: [SdDropdown, SdDropdownPopup, SdButton, SdSwitch, NgIcon], template: `
|
|
67
|
+
<sd-dropdown>
|
|
68
|
+
<sd-button [inline]="true" [theme]="'link-gray'">
|
|
69
|
+
<ng-icon [svg]="tablerPalette" />
|
|
70
|
+
</sd-button>
|
|
71
|
+
<sd-dropdown-popup>
|
|
72
|
+
<div class="p-default">
|
|
73
|
+
<div class="flex-row gap-sm cross-align-center">
|
|
74
|
+
<span>글자 크기</span>
|
|
75
|
+
<div class="flex-row gap-xs cross-align-center">
|
|
76
|
+
<sd-button
|
|
77
|
+
[inline]="true"
|
|
78
|
+
[theme]="'link-gray'"
|
|
79
|
+
[size]="'sm'"
|
|
80
|
+
[disabled]="isMinFontSize()"
|
|
81
|
+
(click)="_sdTheme.decreaseFontSize()"
|
|
82
|
+
>
|
|
83
|
+
<ng-icon [svg]="tablerMinus" />
|
|
84
|
+
</sd-button>
|
|
85
|
+
<span>{{ _sdTheme.fontSize() }}px</span>
|
|
86
|
+
<sd-button
|
|
87
|
+
[inline]="true"
|
|
88
|
+
[theme]="'link-gray'"
|
|
89
|
+
[size]="'sm'"
|
|
90
|
+
[disabled]="isMaxFontSize()"
|
|
91
|
+
(click)="_sdTheme.increaseFontSize()"
|
|
92
|
+
>
|
|
93
|
+
<ng-icon [svg]="tablerPlus" />
|
|
94
|
+
</sd-button>
|
|
95
|
+
</div>
|
|
96
|
+
</div>
|
|
97
|
+
<div class="flex-row gap-sm cross-align-center">
|
|
98
|
+
<span>블루프린트</span>
|
|
99
|
+
<sd-switch [(value)]="_sdTheme.blueprint" />
|
|
100
|
+
</div>
|
|
101
|
+
</div>
|
|
102
|
+
</sd-dropdown-popup>
|
|
103
|
+
</sd-dropdown>
|
|
116
104
|
` }]
|
|
117
105
|
}], null, null); })();
|
|
118
|
-
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdThemeSelector, { className: "SdThemeSelector", filePath: "packages/angular/src/features/theme/sd-theme-selector.ts", lineNumber:
|
|
106
|
+
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdThemeSelector, { className: "SdThemeSelector", filePath: "packages/angular/src/features/theme/sd-theme-selector.ts", lineNumber: 63 }); })();
|
|
@@ -48,7 +48,7 @@ export class SdCalendar {
|
|
|
48
48
|
...(ngDevMode ? [{ debugName: "getItemDateFn" }] : /* istanbul ignore next */ []));
|
|
49
49
|
yearMonth = input(new DateOnly().setDay(1), /* @ts-ignore */
|
|
50
50
|
...(ngDevMode ? [{ debugName: "yearMonth" }] : /* istanbul ignore next */ []));
|
|
51
|
-
itemTplRef = contentChild.required(SdItemOfTemplate, { read: TemplateRef });
|
|
51
|
+
itemTplRef = contentChild.required(SdItemOfTemplate, { ...(ngDevMode ? { debugName: "itemTplRef" } : /* istanbul ignore next */ {}), read: TemplateRef });
|
|
52
52
|
weekStartDay = input(0, /* @ts-ignore */
|
|
53
53
|
...(ngDevMode ? [{ debugName: "weekStartDay" }] : /* istanbul ignore next */ []));
|
|
54
54
|
minDaysInFirstWeek = input(1, /* @ts-ignore */
|
|
@@ -132,7 +132,7 @@ export class SdCalendar {
|
|
|
132
132
|
i0.ɵɵtextInterpolate1(" ", ctx.weeks[(ctx.weekStartDay() + 6) % 7], " ");
|
|
133
133
|
i0.ɵɵadvance(2);
|
|
134
134
|
i0.ɵɵrepeater(ctx.dataTable());
|
|
135
|
-
} }, dependencies: [NgTemplateOutlet, FormatPipe], styles: ["
|
|
135
|
+
} }, dependencies: [NgTemplateOutlet, FormatPipe], styles: ["sd-calendar > table {\n border-collapse: collapse;\n width: 100%;\n height: 100%;\n border-radius: var(--border-radius-default);\n overflow: hidden;\n}\nsd-calendar > table > * > tr > * {\n padding: var(--gap-sm) var(--gap-default);\n border: 1px solid var(--theme-gray-light);\n width: 14.2857142857%;\n}\nsd-calendar > table > thead > tr > th {\n background: var(--theme-gray-lighter);\n height: 10%;\n}\nsd-calendar > table > tbody > tr > td {\n vertical-align: top;\n height: 15%;\n}\nsd-calendar > table > tbody > tr > td > .day {\n margin-bottom: var(--gap-sm);\n}\nsd-calendar > table > tbody > tr > td.not-current {\n background: var(--theme-gray-lightest);\n}\nsd-calendar > table > tbody > tr > td.not-current > .day {\n color: var(--theme-gray-default);\n}\nsd-calendar > table > tbody > tr > td > .content {\n display: flex;\n flex-wrap: nowrap;\n flex-direction: column;\n gap: var(--gap-sm);\n}\n@supports not (appearance: auto) {\n sd-calendar > table > tbody > tr > td > .content {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content > * + * {\n margin-top: var(--gap-sm);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xxs {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xxs > * + * {\n margin-top: var(--gap-xxs);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xs {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xs > * + * {\n margin-top: var(--gap-xs);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-sm {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-sm > * + * {\n margin-top: var(--gap-sm);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-default {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-default > * + * {\n margin-top: var(--gap-default);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-lg {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-lg > * + * {\n margin-top: var(--gap-lg);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xl {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xl > * + * {\n margin-top: var(--gap-xl);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xxl {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xxl > * + * {\n margin-top: var(--gap-xxl);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-0 {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-0 > * + * {\n margin-top: var(--gap-0);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-auto {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-auto > * + * {\n margin-top: var(--gap-auto);\n }\n}"], encapsulation: 2 });
|
|
136
136
|
}
|
|
137
137
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdCalendar, [{
|
|
138
138
|
type: Component,
|
|
@@ -190,6 +190,6 @@ export class SdCalendar {
|
|
|
190
190
|
}
|
|
191
191
|
</tbody>
|
|
192
192
|
</table>
|
|
193
|
-
`, styles: ["
|
|
193
|
+
`, styles: ["sd-calendar > table {\n border-collapse: collapse;\n width: 100%;\n height: 100%;\n border-radius: var(--border-radius-default);\n overflow: hidden;\n}\nsd-calendar > table > * > tr > * {\n padding: var(--gap-sm) var(--gap-default);\n border: 1px solid var(--theme-gray-light);\n width: 14.2857142857%;\n}\nsd-calendar > table > thead > tr > th {\n background: var(--theme-gray-lighter);\n height: 10%;\n}\nsd-calendar > table > tbody > tr > td {\n vertical-align: top;\n height: 15%;\n}\nsd-calendar > table > tbody > tr > td > .day {\n margin-bottom: var(--gap-sm);\n}\nsd-calendar > table > tbody > tr > td.not-current {\n background: var(--theme-gray-lightest);\n}\nsd-calendar > table > tbody > tr > td.not-current > .day {\n color: var(--theme-gray-default);\n}\nsd-calendar > table > tbody > tr > td > .content {\n display: flex;\n flex-wrap: nowrap;\n flex-direction: column;\n gap: var(--gap-sm);\n}\n@supports not (appearance: auto) {\n sd-calendar > table > tbody > tr > td > .content {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content > * + * {\n margin-top: var(--gap-sm);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xxs {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xxs > * + * {\n margin-top: var(--gap-xxs);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xs {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xs > * + * {\n margin-top: var(--gap-xs);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-sm {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-sm > * + * {\n margin-top: var(--gap-sm);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-default {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-default > * + * {\n margin-top: var(--gap-default);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-lg {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-lg > * + * {\n margin-top: var(--gap-lg);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xl {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xl > * + * {\n margin-top: var(--gap-xl);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xxl {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-xxl > * + * {\n margin-top: var(--gap-xxl);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-0 {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-0 > * + * {\n margin-top: var(--gap-0);\n }\n sd-calendar > table > tbody > tr > td > .content.gap-auto {\n gap: 0;\n }\n sd-calendar > table > tbody > tr > td > .content.gap-auto > * + * {\n margin-top: var(--gap-auto);\n }\n}"] }]
|
|
194
194
|
}], null, { items: [{ type: i0.Input, args: [{ isSignal: true, alias: "items", required: true }] }], getItemDateFn: [{ type: i0.Input, args: [{ isSignal: true, alias: "getItemDateFn", required: true }] }], yearMonth: [{ type: i0.Input, args: [{ isSignal: true, alias: "yearMonth", required: false }] }], itemTplRef: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SdItemOfTemplate), { ...{ read: TemplateRef }, isSignal: true }] }], weekStartDay: [{ type: i0.Input, args: [{ isSignal: true, alias: "weekStartDay", required: false }] }], minDaysInFirstWeek: [{ type: i0.Input, args: [{ isSignal: true, alias: "minDaysInFirstWeek", required: false }] }] }); })();
|
|
195
195
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdCalendar, { className: "SdCalendar", filePath: "packages/angular/src/features/visual/sd-calendar.ts", lineNumber: 131 }); })();
|
|
@@ -14,7 +14,7 @@ export class SdLabel {
|
|
|
14
14
|
} }, inputs: { theme: [1, "theme"], color: [1, "color"], clickable: [1, "clickable"] }, ngContentSelectors: _c0, decls: 1, vars: 0, template: function SdLabel_Template(rf, ctx) { if (rf & 1) {
|
|
15
15
|
i0.ɵɵprojectionDef();
|
|
16
16
|
i0.ɵɵprojection(0);
|
|
17
|
-
} }, styles: ["
|
|
17
|
+
} }, styles: ["sd-label {\n display: inline-block;\n background: var(--theme-gray-darker);\n color: var(--text-trans-rev-default);\n padding: 0 var(--gap-sm);\n border-radius: var(--border-radius-default);\n text-indent: 0;\n}\nsd-label[data-sd-theme=gray] {\n background: var(--theme-gray-default);\n}\nsd-label[data-sd-theme=blue-gray] {\n background: var(--theme-blue-gray-default);\n}\nsd-label[data-sd-theme=primary] {\n background: var(--theme-primary-default);\n}\nsd-label[data-sd-theme=secondary] {\n background: var(--theme-secondary-default);\n}\nsd-label[data-sd-theme=info] {\n background: var(--theme-info-default);\n}\nsd-label[data-sd-theme=success] {\n background: var(--theme-success-default);\n}\nsd-label[data-sd-theme=warning] {\n background: var(--theme-warning-default);\n}\nsd-label[data-sd-theme=danger] {\n background: var(--theme-danger-default);\n}\nsd-label[data-sd-clickable=true] {\n cursor: pointer;\n}\nsd-label[data-sd-clickable=true]:hover {\n background: var(--theme-gray-dark);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=gray] {\n background: var(--theme-gray-dark);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=blue-gray] {\n background: var(--theme-blue-gray-dark);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=primary] {\n background: var(--theme-primary-dark);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=secondary] {\n background: var(--theme-secondary-dark);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=info] {\n background: var(--theme-info-dark);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=success] {\n background: var(--theme-success-dark);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=warning] {\n background: var(--theme-warning-dark);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=danger] {\n background: var(--theme-danger-dark);\n}"], encapsulation: 2 });
|
|
18
18
|
}
|
|
19
19
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdLabel, [{
|
|
20
20
|
type: Component,
|
|
@@ -24,6 +24,6 @@ export class SdLabel {
|
|
|
24
24
|
"[attr.data-sd-clickable]": "clickable()",
|
|
25
25
|
}, template: `
|
|
26
26
|
<ng-content></ng-content>
|
|
27
|
-
`, styles: ["
|
|
27
|
+
`, styles: ["sd-label {\n display: inline-block;\n background: var(--theme-gray-darker);\n color: var(--text-trans-rev-default);\n padding: 0 var(--gap-sm);\n border-radius: var(--border-radius-default);\n text-indent: 0;\n}\nsd-label[data-sd-theme=gray] {\n background: var(--theme-gray-default);\n}\nsd-label[data-sd-theme=blue-gray] {\n background: var(--theme-blue-gray-default);\n}\nsd-label[data-sd-theme=primary] {\n background: var(--theme-primary-default);\n}\nsd-label[data-sd-theme=secondary] {\n background: var(--theme-secondary-default);\n}\nsd-label[data-sd-theme=info] {\n background: var(--theme-info-default);\n}\nsd-label[data-sd-theme=success] {\n background: var(--theme-success-default);\n}\nsd-label[data-sd-theme=warning] {\n background: var(--theme-warning-default);\n}\nsd-label[data-sd-theme=danger] {\n background: var(--theme-danger-default);\n}\nsd-label[data-sd-clickable=true] {\n cursor: pointer;\n}\nsd-label[data-sd-clickable=true]:hover {\n background: var(--theme-gray-dark);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=gray] {\n background: var(--theme-gray-dark);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=blue-gray] {\n background: var(--theme-blue-gray-dark);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=primary] {\n background: var(--theme-primary-dark);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=secondary] {\n background: var(--theme-secondary-dark);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=info] {\n background: var(--theme-info-dark);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=success] {\n background: var(--theme-success-dark);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=warning] {\n background: var(--theme-warning-dark);\n}\nsd-label[data-sd-clickable=true]:hover[data-sd-theme=danger] {\n background: var(--theme-danger-dark);\n}"] }]
|
|
28
28
|
}], null, { theme: [{ type: i0.Input, args: [{ isSignal: true, alias: "theme", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], clickable: [{ type: i0.Input, args: [{ isSignal: true, alias: "clickable", required: false }] }] }); })();
|
|
29
29
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdLabel, { className: "SdLabel", filePath: "packages/angular/src/features/visual/sd-label.ts", lineNumber: 60 }); })();
|
|
@@ -13,7 +13,7 @@ export class SdNote {
|
|
|
13
13
|
} }, inputs: { theme: [1, "theme"], size: [1, "size"], inset: [1, "inset"] }, ngContentSelectors: _c0, decls: 1, vars: 0, template: function SdNote_Template(rf, ctx) { if (rf & 1) {
|
|
14
14
|
i0.ɵɵprojectionDef();
|
|
15
15
|
i0.ɵɵprojection(0);
|
|
16
|
-
} }, styles: ["
|
|
16
|
+
} }, styles: ["sd-note {\n display: block;\n padding: var(--gap-sm) var(--gap-default);\n background: var(--theme-gray-lightest);\n border: none;\n border-radius: var(--border-radius-default);\n}\nsd-note[data-sd-theme=gray] {\n background: var(--theme-gray-lightest);\n border: 1px solid var(--theme-gray-lightest);\n}\nsd-note[data-sd-theme=blue-gray] {\n background: var(--theme-blue-gray-lightest);\n border: 1px solid var(--theme-blue-gray-lightest);\n}\nsd-note[data-sd-theme=primary] {\n background: var(--theme-primary-lightest);\n border: 1px solid var(--theme-primary-lightest);\n}\nsd-note[data-sd-theme=secondary] {\n background: var(--theme-secondary-lightest);\n border: 1px solid var(--theme-secondary-lightest);\n}\nsd-note[data-sd-theme=info] {\n background: var(--theme-info-lightest);\n border: 1px solid var(--theme-info-lightest);\n}\nsd-note[data-sd-theme=success] {\n background: var(--theme-success-lightest);\n border: 1px solid var(--theme-success-lightest);\n}\nsd-note[data-sd-theme=warning] {\n background: var(--theme-warning-lightest);\n border: 1px solid var(--theme-warning-lightest);\n}\nsd-note[data-sd-theme=danger] {\n background: var(--theme-danger-lightest);\n border: 1px solid var(--theme-danger-lightest);\n}\nsd-note[data-sd-size=sm] {\n font-size: var(--font-size-sm);\n padding: var(--gap-xs) var(--gap-sm);\n}\nsd-note[data-sd-size=lg] {\n padding: var(--gap-default) var(--gap-lg);\n}\nsd-note[data-sd-inset=true] {\n border-radius: 0;\n}"], encapsulation: 2 });
|
|
17
17
|
}
|
|
18
18
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdNote, [{
|
|
19
19
|
type: Component,
|
|
@@ -23,6 +23,6 @@ export class SdNote {
|
|
|
23
23
|
"[attr.data-sd-inset]": "inset()",
|
|
24
24
|
}, template: `
|
|
25
25
|
<ng-content></ng-content>
|
|
26
|
-
`, styles: ["
|
|
26
|
+
`, styles: ["sd-note {\n display: block;\n padding: var(--gap-sm) var(--gap-default);\n background: var(--theme-gray-lightest);\n border: none;\n border-radius: var(--border-radius-default);\n}\nsd-note[data-sd-theme=gray] {\n background: var(--theme-gray-lightest);\n border: 1px solid var(--theme-gray-lightest);\n}\nsd-note[data-sd-theme=blue-gray] {\n background: var(--theme-blue-gray-lightest);\n border: 1px solid var(--theme-blue-gray-lightest);\n}\nsd-note[data-sd-theme=primary] {\n background: var(--theme-primary-lightest);\n border: 1px solid var(--theme-primary-lightest);\n}\nsd-note[data-sd-theme=secondary] {\n background: var(--theme-secondary-lightest);\n border: 1px solid var(--theme-secondary-lightest);\n}\nsd-note[data-sd-theme=info] {\n background: var(--theme-info-lightest);\n border: 1px solid var(--theme-info-lightest);\n}\nsd-note[data-sd-theme=success] {\n background: var(--theme-success-lightest);\n border: 1px solid var(--theme-success-lightest);\n}\nsd-note[data-sd-theme=warning] {\n background: var(--theme-warning-lightest);\n border: 1px solid var(--theme-warning-lightest);\n}\nsd-note[data-sd-theme=danger] {\n background: var(--theme-danger-lightest);\n border: 1px solid var(--theme-danger-lightest);\n}\nsd-note[data-sd-size=sm] {\n font-size: var(--font-size-sm);\n padding: var(--gap-xs) var(--gap-sm);\n}\nsd-note[data-sd-size=lg] {\n padding: var(--gap-default) var(--gap-lg);\n}\nsd-note[data-sd-inset=true] {\n border-radius: 0;\n}"] }]
|
|
27
27
|
}], null, { theme: [{ type: i0.Input, args: [{ isSignal: true, alias: "theme", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], inset: [{ type: i0.Input, args: [{ isSignal: true, alias: "inset", required: false }] }] }); })();
|
|
28
28
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdNote, { className: "SdNote", filePath: "packages/angular/src/features/visual/sd-note.ts", lineNumber: 60 }); })();
|
|
@@ -25,7 +25,7 @@ export class SdProgress {
|
|
|
25
25
|
i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind2(2, 3, ctx.value(), "1.0-2"), " ");
|
|
26
26
|
i0.ɵɵadvance(2);
|
|
27
27
|
i0.ɵɵstyleProp("width", ctx._barWidth());
|
|
28
|
-
} }, dependencies: [PercentPipe], styles: ["
|
|
28
|
+
} }, dependencies: [PercentPipe], styles: ["sd-progress {\n position: relative;\n display: block;\n width: 100%;\n white-space: nowrap;\n background: var(--theme-gray-lightest);\n border: 1px solid var(--theme-gray-lightest);\n border-radius: var(--border-radius-default);\n overflow: hidden;\n}\nsd-progress > ._content {\n position: relative;\n z-index: 2;\n padding: var(--gap-lg) var(--gap-default);\n}\nsd-progress > ._progress {\n position: absolute;\n z-index: 1;\n top: 0;\n left: 0;\n height: 100%;\n}\nsd-progress[data-sd-theme=gray] > ._progress {\n background: var(--theme-gray-default);\n}\nsd-progress[data-sd-theme=blue-gray] > ._progress {\n background: var(--theme-blue-gray-default);\n}\nsd-progress[data-sd-theme=primary] > ._progress {\n background: var(--theme-primary-default);\n}\nsd-progress[data-sd-theme=secondary] > ._progress {\n background: var(--theme-secondary-default);\n}\nsd-progress[data-sd-theme=info] > ._progress {\n background: var(--theme-info-default);\n}\nsd-progress[data-sd-theme=success] > ._progress {\n background: var(--theme-success-default);\n}\nsd-progress[data-sd-theme=warning] > ._progress {\n background: var(--theme-warning-default);\n}\nsd-progress[data-sd-theme=danger] > ._progress {\n background: var(--theme-danger-default);\n}\nsd-progress[data-sd-size=sm] > ._content {\n padding: var(--gap-xs) var(--gap-default);\n}\nsd-progress[data-sd-size=lg] > ._content {\n padding: var(--gap-default) var(--gap-xl);\n}\nsd-progress[data-sd-inset=true] {\n border-radius: 0;\n border: none;\n background: var(--control-color);\n}"], encapsulation: 2 });
|
|
29
29
|
}
|
|
30
30
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdProgress, [{
|
|
31
31
|
type: Component,
|
|
@@ -38,6 +38,6 @@ export class SdProgress {
|
|
|
38
38
|
{{ value() | percent: "1.0-2" }}
|
|
39
39
|
</div>
|
|
40
40
|
<div class="_progress" [style.width]="_barWidth()"></div>
|
|
41
|
-
`, styles: ["
|
|
41
|
+
`, styles: ["sd-progress {\n position: relative;\n display: block;\n width: 100%;\n white-space: nowrap;\n background: var(--theme-gray-lightest);\n border: 1px solid var(--theme-gray-lightest);\n border-radius: var(--border-radius-default);\n overflow: hidden;\n}\nsd-progress > ._content {\n position: relative;\n z-index: 2;\n padding: var(--gap-lg) var(--gap-default);\n}\nsd-progress > ._progress {\n position: absolute;\n z-index: 1;\n top: 0;\n left: 0;\n height: 100%;\n}\nsd-progress[data-sd-theme=gray] > ._progress {\n background: var(--theme-gray-default);\n}\nsd-progress[data-sd-theme=blue-gray] > ._progress {\n background: var(--theme-blue-gray-default);\n}\nsd-progress[data-sd-theme=primary] > ._progress {\n background: var(--theme-primary-default);\n}\nsd-progress[data-sd-theme=secondary] > ._progress {\n background: var(--theme-secondary-default);\n}\nsd-progress[data-sd-theme=info] > ._progress {\n background: var(--theme-info-default);\n}\nsd-progress[data-sd-theme=success] > ._progress {\n background: var(--theme-success-default);\n}\nsd-progress[data-sd-theme=warning] > ._progress {\n background: var(--theme-warning-default);\n}\nsd-progress[data-sd-theme=danger] > ._progress {\n background: var(--theme-danger-default);\n}\nsd-progress[data-sd-size=sm] > ._content {\n padding: var(--gap-xs) var(--gap-default);\n}\nsd-progress[data-sd-size=lg] > ._content {\n padding: var(--gap-default) var(--gap-xl);\n}\nsd-progress[data-sd-inset=true] {\n border-radius: 0;\n border: none;\n background: var(--control-color);\n}"] }]
|
|
42
42
|
}], null, { inset: [{ type: i0.Input, args: [{ isSignal: true, alias: "inset", required: false }] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], theme: [{ type: i0.Input, args: [{ isSignal: true, alias: "theme", required: true }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }] }); })();
|
|
43
43
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdProgress, { className: "SdProgress", filePath: "packages/angular/src/features/visual/sd-progress.ts", lineNumber: 81 }); })();
|
|
@@ -33,7 +33,7 @@ export class SdSidebarContainer {
|
|
|
33
33
|
i0.ɵɵdomElementStart(1, "div", 0);
|
|
34
34
|
i0.ɵɵdomListener("click", function SdSidebarContainer_Template_div_click_1_listener() { return ctx.onBackdropClick(); })("keydown.enter", function SdSidebarContainer_Template_div_keydown_enter_1_listener() { return ctx.onBackdropClick(); });
|
|
35
35
|
i0.ɵɵdomElementEnd();
|
|
36
|
-
} }, styles: ["
|
|
36
|
+
} }, styles: ["sd-sidebar-container {\n display: block;\n position: relative;\n height: 100%;\n padding-left: var(--sidebar-width);\n transition: padding-left var(--animation-duration) ease-out;\n}\nsd-sidebar-container[data-sd-toggle=true] {\n padding-left: 0;\n transition: padding-left var(--animation-duration) ease-in;\n}\nsd-sidebar-container > ._backdrop {\n display: none;\n}\n\n@media all and (max-width: 520px) {\n sd-sidebar-container {\n padding-left: 0;\n }\n sd-sidebar-container > ._backdrop {\n position: absolute;\n display: block;\n z-index: calc(var(--z-index-sidebar) - 1);\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: var(--background-rev-color);\n opacity: 0;\n pointer-events: none;\n transition: opacity var(--animation-duration) ease-in-out;\n }\n sd-sidebar-container[data-sd-toggle=true] > ._backdrop {\n opacity: 0.6;\n pointer-events: auto;\n }\n}"], encapsulation: 2 });
|
|
37
37
|
}
|
|
38
38
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdSidebarContainer, [{
|
|
39
39
|
type: Component,
|
|
@@ -42,6 +42,6 @@ export class SdSidebarContainer {
|
|
|
42
42
|
}, template: `
|
|
43
43
|
<ng-content />
|
|
44
44
|
<div class="_backdrop" tabindex="0" role="button" (click)="onBackdropClick()" (keydown.enter)="onBackdropClick()"></div>
|
|
45
|
-
`, styles: ["
|
|
45
|
+
`, styles: ["sd-sidebar-container {\n display: block;\n position: relative;\n height: 100%;\n padding-left: var(--sidebar-width);\n transition: padding-left var(--animation-duration) ease-out;\n}\nsd-sidebar-container[data-sd-toggle=true] {\n padding-left: 0;\n transition: padding-left var(--animation-duration) ease-in;\n}\nsd-sidebar-container > ._backdrop {\n display: none;\n}\n\n@media all and (max-width: 520px) {\n sd-sidebar-container {\n padding-left: 0;\n }\n sd-sidebar-container > ._backdrop {\n position: absolute;\n display: block;\n z-index: calc(var(--z-index-sidebar) - 1);\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: var(--background-rev-color);\n opacity: 0;\n pointer-events: none;\n transition: opacity var(--animation-duration) ease-in-out;\n }\n sd-sidebar-container[data-sd-toggle=true] > ._backdrop {\n opacity: 0.6;\n pointer-events: auto;\n }\n}"] }]
|
|
46
46
|
}], () => [], null); })();
|
|
47
47
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdSidebarContainer, { className: "SdSidebarContainer", filePath: "packages/angular/src/layout/sidebar/sd-sidebar-container.ts", lineNumber: 69 }); })();
|
|
@@ -12,7 +12,7 @@ export class SdSidebar {
|
|
|
12
12
|
} }, ngContentSelectors: _c0, decls: 1, vars: 0, template: function SdSidebar_Template(rf, ctx) { if (rf & 1) {
|
|
13
13
|
i0.ɵɵprojectionDef();
|
|
14
14
|
i0.ɵɵprojection(0);
|
|
15
|
-
} }, styles: ["
|
|
15
|
+
} }, styles: ["sd-sidebar {\n position: absolute;\n z-index: var(--z-index-sidebar);\n top: 0;\n left: 0;\n width: var(--sidebar-width);\n height: 100%;\n border-right: 1px solid var(--border-color-lighter);\n}\n@media not all and (max-width: 520px) {\n sd-sidebar {\n transition: transform var(--animation-duration) ease-out;\n }\n sd-sidebar[data-sd-toggle=true] {\n transform: translateX(-100%);\n transition: transform var(--animation-duration) ease-in;\n }\n}\n@media all and (max-width: 520px) {\n sd-sidebar {\n transition: transform var(--animation-duration) ease-in;\n transform: translateX(-100%);\n }\n sd-sidebar[data-sd-toggle=true] {\n transform: none;\n transition: transform var(--animation-duration) ease-out;\n box-shadow: 0 calc(16 * var(--elevation-size)) calc(16 * 4 * var(--elevation-size) * var(--elevation-blur-mult)) var(--trans-lighter), 0 var(--elevation-size) calc(var(--elevation-size) * var(--elevation-blur-mult)) var(--trans-lighter);\n }\n}"], encapsulation: 2 });
|
|
16
16
|
}
|
|
17
17
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(SdSidebar, [{
|
|
18
18
|
type: Component,
|
|
@@ -20,6 +20,6 @@ export class SdSidebar {
|
|
|
20
20
|
"[attr.data-sd-toggle]": "toggle()",
|
|
21
21
|
}, template: `
|
|
22
22
|
<ng-content />
|
|
23
|
-
`, styles: ["
|
|
23
|
+
`, styles: ["sd-sidebar {\n position: absolute;\n z-index: var(--z-index-sidebar);\n top: 0;\n left: 0;\n width: var(--sidebar-width);\n height: 100%;\n border-right: 1px solid var(--border-color-lighter);\n}\n@media not all and (max-width: 520px) {\n sd-sidebar {\n transition: transform var(--animation-duration) ease-out;\n }\n sd-sidebar[data-sd-toggle=true] {\n transform: translateX(-100%);\n transition: transform var(--animation-duration) ease-in;\n }\n}\n@media all and (max-width: 520px) {\n sd-sidebar {\n transition: transform var(--animation-duration) ease-in;\n transform: translateX(-100%);\n }\n sd-sidebar[data-sd-toggle=true] {\n transform: none;\n transition: transform var(--animation-duration) ease-out;\n box-shadow: 0 calc(16 * var(--elevation-size)) calc(16 * 4 * var(--elevation-size) * var(--elevation-blur-mult)) var(--trans-lighter), 0 var(--elevation-size) calc(var(--elevation-size) * var(--elevation-blur-mult)) var(--trans-lighter);\n }\n}"] }]
|
|
24
24
|
}], null, null); })();
|
|
25
25
|
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SdSidebar, { className: "SdSidebar", filePath: "packages/angular/src/layout/sidebar/sd-sidebar.ts", lineNumber: 62 }); })();
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@simplysm/angular",
|
|
3
|
-
"version": "14.1.
|
|
3
|
+
"version": "14.1.18",
|
|
4
4
|
"description": "심플리즘 패키지 - Angular",
|
|
5
5
|
"author": "심플리즘",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -32,39 +32,39 @@
|
|
|
32
32
|
"./styles.css"
|
|
33
33
|
],
|
|
34
34
|
"dependencies": {
|
|
35
|
-
"@angular/common": "^22.0.
|
|
36
|
-
"@angular/core": "^22.0.
|
|
37
|
-
"@angular/platform-browser": "^22.0.
|
|
38
|
-
"@angular/router": "^22.0.
|
|
39
|
-
"@angular/service-worker": "^22.0.
|
|
40
|
-
"@ng-icons/core": "^33.
|
|
41
|
-
"@ng-icons/tabler-icons": "^33.
|
|
42
|
-
"@tiptap/core": "^3.27.
|
|
43
|
-
"@tiptap/extension-color": "^3.27.
|
|
44
|
-
"@tiptap/extension-document": "^3.27.
|
|
45
|
-
"@tiptap/extension-highlight": "^3.27.
|
|
46
|
-
"@tiptap/extension-image": "^3.27.
|
|
47
|
-
"@tiptap/extension-paragraph": "^3.27.
|
|
48
|
-
"@tiptap/extension-placeholder": "^3.27.
|
|
49
|
-
"@tiptap/extension-text": "^3.27.
|
|
50
|
-
"@tiptap/extension-text-align": "^3.27.
|
|
51
|
-
"@tiptap/extension-text-style": "^3.27.
|
|
52
|
-
"@tiptap/extension-underline": "^3.27.
|
|
53
|
-
"@tiptap/markdown": "^3.27.
|
|
54
|
-
"@tiptap/starter-kit": "^3.27.
|
|
35
|
+
"@angular/common": "^22.0.6",
|
|
36
|
+
"@angular/core": "^22.0.6",
|
|
37
|
+
"@angular/platform-browser": "^22.0.6",
|
|
38
|
+
"@angular/router": "^22.0.6",
|
|
39
|
+
"@angular/service-worker": "^22.0.6",
|
|
40
|
+
"@ng-icons/core": "^33.4.0",
|
|
41
|
+
"@ng-icons/tabler-icons": "^33.4.0",
|
|
42
|
+
"@tiptap/core": "^3.27.4",
|
|
43
|
+
"@tiptap/extension-color": "^3.27.4",
|
|
44
|
+
"@tiptap/extension-document": "^3.27.4",
|
|
45
|
+
"@tiptap/extension-highlight": "^3.27.4",
|
|
46
|
+
"@tiptap/extension-image": "^3.27.4",
|
|
47
|
+
"@tiptap/extension-paragraph": "^3.27.4",
|
|
48
|
+
"@tiptap/extension-placeholder": "^3.27.4",
|
|
49
|
+
"@tiptap/extension-text": "^3.27.4",
|
|
50
|
+
"@tiptap/extension-text-align": "^3.27.4",
|
|
51
|
+
"@tiptap/extension-text-style": "^3.27.4",
|
|
52
|
+
"@tiptap/extension-underline": "^3.27.4",
|
|
53
|
+
"@tiptap/markdown": "^3.27.4",
|
|
54
|
+
"@tiptap/starter-kit": "^3.27.4",
|
|
55
55
|
"bwip-js": "^4.11.2",
|
|
56
56
|
"echarts": "^6.1.0",
|
|
57
57
|
"html-to-image": "^1.11.13",
|
|
58
58
|
"jspdf": "^4.2.1",
|
|
59
59
|
"rxjs": "^7.8.2",
|
|
60
60
|
"tabbable": "^6.5.0",
|
|
61
|
-
"@simplysm/core-browser": "14.1.
|
|
62
|
-
"@simplysm/
|
|
63
|
-
"@simplysm/service-
|
|
64
|
-
"@simplysm/
|
|
61
|
+
"@simplysm/core-browser": "14.1.18",
|
|
62
|
+
"@simplysm/core-common": "14.1.18",
|
|
63
|
+
"@simplysm/service-client": "14.1.18",
|
|
64
|
+
"@simplysm/service-common": "14.1.18"
|
|
65
65
|
},
|
|
66
66
|
"devDependencies": {
|
|
67
|
-
"@angular/compiler": "^22.0.
|
|
67
|
+
"@angular/compiler": "^22.0.6"
|
|
68
68
|
},
|
|
69
69
|
"scripts": {}
|
|
70
70
|
}
|