@simplysm/angular 14.0.1 → 14.0.4

package/src/core/utils/useExpandingManager.ts

@@ -0,0 +1,117 @@
+import { computed, type Signal, type WritableSignal } from "@angular/core";
+import "@simplysm/core-common";
+
+export interface IExpandItemDef<T> {
+  item: T;
+  parentDef: IExpandItemDef<T> | undefined;
+  hasChildren: boolean;
+  depth: number;
+}
+
+export function useExpandingManager<T>(binding: {
+  items: Signal<T[]>;
+  expandedItems: WritableSignal<T[]>;
+  getChildrenFn: Signal<((item: T, index: number) => T[] | undefined) | undefined>;
+  sort: (items: T[]) => T[];
+}): {
+  displayItems: Signal<T[]>;
+  hasExpandable: Signal<boolean>;
+  isAllExpanded: Signal<boolean>;
+  toggle(item: T): void;
+  toggleAll(): void;
+  isVisible(item: T): boolean;
+  def(item: T): IExpandItemDef<T>;
+} {
+  const allDefs = computed(() => {
+    const getChildrenFn = binding.getChildrenFn();
+    const defs: IExpandItemDef<T>[] = [];
+
+    function walk(items: T[], parentDef: IExpandItemDef<T> | undefined, depth: number): void {
+      const sorted = binding.sort(items);
+      for (let i = 0; i < sorted.length; i++) {
+        const item = sorted[i];
+        const children = getChildrenFn?.(item, i);
+        const hasChildren = children != null && children.length > 0;
+        const itemDef: IExpandItemDef<T> = { item, parentDef, hasChildren, depth };
+        defs.push(itemDef);
+        if (hasChildren) {
+          walk(children, itemDef, depth + 1);
+        }
+      }
+    }
+
+    walk(binding.items(), undefined, 0);
+    return defs;
+  });
+
+  const displayItems = computed(() => allDefs().map((d) => d.item));
+
+  const expandableDefs = computed(() => allDefs().filter((d) => d.hasChildren));
+
+  const hasExpandable = computed(() => expandableDefs().length > 0);
+
+  const isAllExpanded = computed(() => {
+    const expandable = expandableDefs();
+    if (expandable.length === 0) return false;
+    const expandedSet = new Set(binding.expandedItems());
+    return expandable.every((d) => expandedSet.has(d.item));
+  });
+
+  const defMap = computed(() => {
+    const map = new Map<T, IExpandItemDef<T>>();
+    for (const d of allDefs()) {
+      map.set(d.item, d);
+    }
+    return map;
+  });
+
+  function toggle(item: T): void {
+    binding.expandedItems.update((arr) => {
+      const next = [...arr];
+      next.toggle(item);
+      return next;
+    });
+  }
+
+  function toggleAll(): void {
+    if (isAllExpanded()) {
+      binding.expandedItems.set([]);
+    } else {
+      binding.expandedItems.set(expandableDefs().map((d) => d.item));
+    }
+  }
+
+  function isVisible(item: T): boolean {
+    const map = defMap();
+    const itemDef = map.get(item);
+    if (itemDef == null) return false;
+
+    let current = itemDef.parentDef;
+    while (current != null) {
+      if (!binding.expandedItems().includes(current.item)) {
+        return false;
+      }
+      current = current.parentDef;
+    }
+    return true;
+  }
+
+  function def(item: T): IExpandItemDef<T> {
+    const map = defMap();
+    const d = map.get(item);
+    if (d == null) {
+      throw new Error(`Item not found in expanding manager`);
+    }
+    return d;
+  }
+
+  return {
+    displayItems,
+    hasExpandable,
+    isAllExpanded,
+    toggle,
+    toggleAll,
+    isVisible,
+    def,
+  };
+}

package/src/core/utils/useFullPageCodeSignal.ts

@@ -0,0 +1,24 @@
+import { computed, inject, type Signal } from "@angular/core";
+import { toSignal } from "@angular/core/rxjs-interop";
+import { NavigationEnd, Router } from "@angular/router";
+import { filter, map } from "rxjs";
+
+export function useFullPageCodeSignal(): Signal<string> {
+  const router = inject(Router);
+
+  const url = toSignal(
+    router.events.pipe(
+      filter((event) => event instanceof NavigationEnd),
+      map((event) => event.url),
+    ),
+    { initialValue: router.url },
+  );
+
+  return computed(() =>
+    url()
+      .split("/")
+      .slice(2)
+      .map((item) => item.split(/[;?]/)[0])
+      .join("."),
+  );
+}

package/src/core/utils/useSdSystemConfigResource.ts

@@ -0,0 +1,36 @@
+import { ElementRef, inject, type ResourceRef, resource, type Signal } from "@angular/core";
+import { SdSystemConfigProvider } from "../providers/sd-system-config.provider";
+
+export function useSdSystemConfigResource<T>(options: { key: Signal<string | undefined> }) {
+  const sdSystemConfig = inject<SdSystemConfigProvider<Record<string, T>>>(SdSystemConfigProvider);
+  const elRef = inject(ElementRef);
+
+  const elTag = elRef.nativeElement.tagName.toLowerCase();
+
+  const res: ResourceRef<T | undefined> = resource({
+    params: () => options.key(),
+    loader: async ({ params: key }) => {
+      return (await sdSystemConfig.getAsync(`${elTag}.${key}`)) as T | undefined;
+    },
+  });
+
+  return {
+    value: res.value,
+    isLoading: res.isLoading,
+    status: res.status,
+    hasValue: () => res.hasValue(),
+    reload: () => res.reload(),
+    set(value: T | undefined) {
+      res.set(value);
+      const key = options.key();
+      if (key == null) return;
+      queueMicrotask(async () => {
+        await sdSystemConfig.setAsync(`${elTag}.${key}`, value as T);
+      });
+    },
+    update(fn: (prev: T | undefined) => T | undefined) {
+      const newValue = fn(res.value());
+      this.set(newValue);
+    },
+  };
+}

package/src/core/utils/useSelectionManager.ts

@@ -0,0 +1,104 @@
+import { computed, type Signal, type WritableSignal } from "@angular/core";
+
+export function useSelectionManager<T>(options: {
+  displayItems: Signal<T[]>;
+  selectedItems: WritableSignal<T[]>;
+  selectMode: Signal<"single" | "multi" | undefined>;
+  getItemSelectableFn: Signal<((item: T) => boolean | string) | undefined>;
+}): {
+  hasSelectable: Signal<boolean>;
+  isAllSelected: Signal<boolean>;
+  getSelectable(item: T): true | string | undefined;
+  getCanChangeFn(item: T): () => boolean;
+  select(item: T): void;
+  deselect(item: T): void;
+  toggle(item: T): void;
+  toggleAll(): void;
+  isSelected(item: T): boolean;
+} {
+  const selectableItems = computed(() => {
+    const fn = options.getItemSelectableFn();
+    if (fn == null) return options.displayItems();
+    return options.displayItems().filter((item) => fn(item) === true);
+  });
+
+  const hasSelectable = computed(() => {
+    return options.selectMode() != null;
+  });
+
+  const isAllSelected = computed(() => {
+    const items = selectableItems();
+    if (items.length === 0) return false;
+    const selectedSet = new Set(options.selectedItems());
+    return items.every((item) => selectedSet.has(item));
+  });
+
+  function getSelectable(item: T): true | string | undefined {
+    const mode = options.selectMode();
+    if (mode == null) return undefined;
+    const fn = options.getItemSelectableFn();
+    if (fn == null) return true;
+    const result = fn(item);
+    if (result === true) return true;
+    if (result === false) return undefined;
+    return result; // string reason
+  }
+
+  function getCanChangeFn(item: T): () => boolean {
+    return () => {
+      const selectable = getSelectable(item);
+      return selectable === true;
+    };
+  }
+
+  function select(item: T): void {
+    const mode = options.selectMode();
+    if (mode == null) return;
+    if (getSelectable(item) !== true) return;
+
+    if (mode === "single") {
+      options.selectedItems.set([item]);
+    } else {
+      options.selectedItems.update((arr) => {
+        if (arr.includes(item)) return arr;
+        return [...arr, item];
+      });
+    }
+  }
+
+  function deselect(item: T): void {
+    options.selectedItems.update((arr) => arr.filter((i) => i !== item));
+  }
+
+  function toggle(item: T): void {
+    if (isSelected(item)) {
+      deselect(item);
+    } else {
+      select(item);
+    }
+  }
+
+  function toggleAll(): void {
+    if (isAllSelected()) {
+      options.selectedItems.set([]);
+    } else {
+      options.selectedItems.set([...selectableItems()]);
+    }
+  }
+
+  function isSelected(item: T): boolean {
+    return options.selectedItems().includes(item);
+  }
+
+  return {
+    hasSelectable,
+    isAllSelected,
+    getSelectable,
+    getCanChangeFn,
+    select,
+    deselect,
+    toggle,
+    toggleAll,
+    isSelected,
+  };
+}

package/src/core/utils/useSortingManager.ts

@@ -0,0 +1,89 @@
+import { computed, type Signal, type WritableSignal } from "@angular/core";
+import "@simplysm/core-common";
+
+export interface ISortingDef {
+  key: string;
+  desc: boolean;
+}
+
+export function useSortingManager(options: {
+  sorts: WritableSignal<ISortingDef[]>;
+}): {
+  defMap: Signal<Map<string, { indexText?: string; desc: boolean }>>;
+  toggle(key: string, multiple: boolean): void;
+  sort<T>(items: T[]): T[];
+} {
+  const defMap = computed(() => {
+    const map = new Map<string, { indexText?: string; desc: boolean }>();
+    const sorts = options.sorts();
+    for (let i = 0; i < sorts.length; i++) {
+      map.set(sorts[i].key, {
+        indexText: sorts.length > 1 ? String(i + 1) : undefined,
+        desc: sorts[i].desc,
+      });
+    }
+    return map;
+  });
+
+  function toggle(key: string, multiple: boolean): void {
+    options.sorts.update((prev) => {
+      const existing = prev.find((s) => s.key === key);
+
+      if (multiple) {
+        if (existing == null) {
+          return [...prev, { key, desc: false }];
+        } else if (!existing.desc) {
+          return prev.map((s) => (s.key === key ? { ...s, desc: true } : s));
+        } else {
+          return prev.filter((s) => s.key !== key);
+        }
+      } else {
+        if (existing == null) {
+          return [{ key, desc: false }];
+        } else if (!existing.desc) {
+          return [{ key, desc: true }];
+        } else {
+          return [];
+        }
+      }
+    });
+  }
+
+  function sort<T>(items: T[]): T[] {
+    const sorts = options.sorts();
+    if (sorts.length === 0) return items;
+
+    return [...items].sort((a, b) => {
+      for (const s of sorts) {
+        const aVal = (a as Record<string, unknown>)[s.key];
+        const bVal = (b as Record<string, unknown>)[s.key];
+
+        let cmp = 0;
+        if (aVal == null && bVal == null) {
+          cmp = 0;
+        } else if (aVal == null) {
+          cmp = -1;
+        } else if (bVal == null) {
+          cmp = 1;
+        } else if (typeof aVal === "string" && typeof bVal === "string") {
+          cmp = aVal.localeCompare(bVal);
+        } else if (typeof aVal === "number" && typeof bVal === "number") {
+          cmp = aVal - bVal;
+        } else {
+          cmp = String(aVal).localeCompare(String(bVal));
+        }
+
+        if (cmp !== 0) {
+          return s.desc ? -cmp : cmp;
+        }
+      }
+      return 0;
+    });
+  }
+
+  return {
+    defMap,
+    toggle,
+    sort,
+  };
+}

package/src/core/utils/useViewTitleSignal.ts

@@ -0,0 +1,21 @@
+import { computed, inject, type Signal } from "@angular/core";
+import { SdActivatedModalProvider } from "../../ui/overlay/modal/sd-modal.provider";
+import { SdAppStructureProvider } from "../providers/sd-app-structure.provider";
+import { useFullPageCodeSignal } from "./useFullPageCodeSignal";
+import { useCurrentPageCodeSignal } from "./useCurrentPageCodeSignal";
+
+export function useViewTitleSignal(): Signal<string> {
+  const activatedModal = inject(SdActivatedModalProvider, { optional: true });
+  const sdAppStructure = inject(SdAppStructureProvider);
+
+  const fullPageCode = useFullPageCodeSignal();
+  const currPageCode = useCurrentPageCodeSignal();
+
+  return computed(() => {
+    if (activatedModal != null) {
+      return activatedModal.modalComponent()?.title() ?? "";
+    }
+
+    return sdAppStructure.getTitleByFullCode(currPageCode?.() ?? fullPageCode());
+  });
+}

package/src/core/utils/useViewTypeSignal.ts

@@ -0,0 +1,33 @@
+import { computed, inject, type Signal } from "@angular/core";
+import { ActivatedRoute } from "@angular/router";
+import { SdActivatedModalProvider } from "../../ui/overlay/modal/sd-modal.provider";
+import { useCurrentPageCodeSignal } from "./useCurrentPageCodeSignal";
+import { useFullPageCodeSignal } from "./useFullPageCodeSignal";
+
+export function useViewTypeSignal(getComp: () => object): Signal<TSdViewType> {
+  const activatedModal = inject(SdActivatedModalProvider, { optional: true });
+  const activatedRoute = inject(ActivatedRoute, { optional: true });
+
+  const fullPageCode = useFullPageCodeSignal();
+  const currPageCode = useCurrentPageCodeSignal();
+
+  return computed<TSdViewType>(() => {
+    if (activatedModal != null) {
+      return "modal";
+    }
+
+    const comp = getComp();
+
+    if (
+      activatedRoute &&
+      activatedRoute.component === comp.constructor &&
+      fullPageCode() === currPageCode?.()
+    ) {
+      return "page";
+    }
+
+    return "control";
+  });
+}
+
+export type TSdViewType = "page" | "modal" | "control";

package/src/index.ts

@@ -1,5 +1,7 @@
 import "@simplysm/core-browser";
 
+export { TXT_CHANGE_IGNORE_CONFIRM } from "./core/commons";
+export { provideSdAngular } from "./core/provideSdAngular";
 export { SdThemeProvider } from "./core/providers/sd-theme-provider";
 export { setupBgTheme } from "./core/utils/setups/setupBgTheme";
 export { SdOptionEventPlugin } from "./core/plugins/events/sd-option-event.plugin";
@@ -17,3 +19,210 @@ export { setupRevealOnShow } from "./core/utils/setups/setupRevealOnShow";
 export { SdShowEffectDirective } from "./core/directives/sd-show-effect.directive";
 export { setupInvalid } from "./core/utils/setups/setupInvalid";
 export { SdInvalidDirective } from "./core/directives/sd-invalid.directive";
+export { SdTypedTemplateDirective } from "./core/directives/sd-typed-template.directive";
+export {
+  SdItemOfTemplateDirective,
+  type SdItemOfTemplateContext,
+} from "./core/directives/sd-item-of-template.directive";
+export { FormatPipe } from "./core/pipes/format.pipe";
+export { setupModelHook } from "./core/utils/setups/setupModelHook";
+export { SdNavigateWindowProvider } from "./core/providers/sd-navigate-window.provider";
+export { SdRouterLinkDirective } from "./core/directives/sd-router-link.directive";
+export { SdAngularConfigProvider } from "./core/providers/sd-angular-config.provider";
+export { SdSystemLogProvider } from "./core/providers/sd-system-log.provider";
+export {
+  SdAppStructureProvider,
+  SdAppStructureUtils,
+  usePermsSignal,
+  type TSdAppStructureItem,
+  type ISdMenu,
+  type ISdFlatMenu,
+  type ISdPermission,
+  type ISdFlatPermission,
+} from "./core/providers/sd-app-structure.provider";
+export { SdFileDialogProvider } from "./core/providers/sd-file-dialog.provider";
+export { SdLocalStorageProvider } from "./core/providers/sd-local-storage.provider";
+export { SdSystemConfigProvider } from "./core/providers/sd-system-config.provider";
+export { SdServiceClientFactoryProvider } from "./core/providers/sd-service-client-factory.provider";
+export {
+  SdSharedDataProvider,
+  SdSharedDataChangeEvent,
+  type ISharedDataBase,
+  type ISharedDataInfo,
+  type SharedDataHandle,
+} from "./core/providers/sd-shared-data.provider";
+export { useSdSystemConfigResource } from "./core/utils/useSdSystemConfigResource";
+export { useCurrentPageCodeSignal } from "./core/utils/useCurrentPageCodeSignal";
+export { useFullPageCodeSignal } from "./core/utils/useFullPageCodeSignal";
+export { useViewTitleSignal } from "./core/utils/useViewTitleSignal";
+export { useViewTypeSignal, type TSdViewType } from "./core/utils/useViewTypeSignal";
+export { setupCanDeactivate } from "./core/utils/setups/setupCanDeactivate";
+export {
+  useExpandingManager,
+  type IExpandItemDef,
+} from "./core/utils/useExpandingManager";
+export { useSelectionManager } from "./core/utils/useSelectionManager";
+
+// ui/layout
+export { SdDockContainerControl } from "./ui/layout/dock/sd-dock-container.control";
+export { SdDockControl } from "./ui/layout/dock/sd-dock.control";
+export { SdPaneDirective } from "./ui/layout/sd-pane.directive";
+export { SdGapControl } from "./ui/layout/sd-gap.control";
+export { SdViewControl } from "./ui/layout/view/sd-view.control";
+export { SdViewItemControl } from "./ui/layout/view/sd-view-item.control";
+export { SdCardDirective } from "./ui/layout/sd-card.directive";
+export {
+  SdKanbanBoardControl,
+  type ISdKanbanBoardDropInfo,
+  type ISdKanbanDragRef,
+  type ISdKanbanDropTarget,
+} from "./ui/layout/kanban/sd-kanban-board.control";
+export { SdKanbanControl } from "./ui/layout/kanban/sd-kanban.control";
+export { SdKanbanLaneControl } from "./ui/layout/kanban/sd-kanban-lane.control";
+
+// ui/form/button
+export { SdButtonControl } from "./ui/form/button/sd-button.control";
+export { SdAnchorControl } from "./ui/form/button/sd-anchor.control";
+export { SdAdditionalButtonControl } from "./ui/form/button/sd-additional-button.control";
+export {
+  SdModalSelectButtonControl,
+  type ISdSelectModal,
+  type ISelectModalOutputResult,
+  type TSdSelectModalInfo,
+} from "./ui/form/button/sd-modal-select-button.control";
+
+// ui/form/input
+export { SdTextfieldControl } from "./ui/form/input/sd-textfield.control";
+export { type TSdTextfieldTypes, sdTextfieldTypes } from "./ui/form/input/sd-textfield-type-handlers";
+export { SdTextareaControl } from "./ui/form/input/sd-textarea.control";
+export { SdNumpadControl } from "./ui/form/input/sd-numpad.control";
+export { SdRangeControl } from "./ui/form/input/sd-range.control";
+export { SdDateRangePicker } from "./ui/form/input/sd-date-range.picker";
+
+// ui/form/choice
+export {
+  SdStatePresetControl,
+  type ISdStatePreset,
+} from "./ui/form/choice/sd-state-preset.control";
+
+// ui/form/checkbox
+export { SdCheckboxControl } from "./ui/form/checkbox/sd-checkbox.control";
+export { SdSwitchControl } from "./ui/form/checkbox/sd-switch.control";
+export { SdCheckboxGroupControl } from "./ui/form/checkbox/sd-checkbox-group.control";
+export { SdCheckboxGroupItemControl } from "./ui/form/checkbox/sd-checkbox-group-item.control";
+
+// ui/form/editor
+export { SdTiptapEditorControl } from "./ui/form/editor/sd-tiptap-editor.control";
+
+// ui/form/select
+export { SdSelectControl, type TSelectModeValue } from "./ui/form/select/sd-select.control";
+export { SdSelectItemControl } from "./ui/form/select/sd-select-item.control";
+export { SdSelectButtonControl } from "./ui/form/select/sd-select-button.control";
+
+// ui/form
+export { SdFormControl } from "./ui/form/sd-form.control";
+
+// ui/navigation/collapse
+export { SdCollapseControl } from "./ui/navigation/collapse/sd-collapse.control";
+export { SdCollapseIconControl } from "./ui/navigation/collapse/sd-collapse-icon.control";
+
+// ui/navigation/tab
+export { SdTabControl } from "./ui/navigation/tab/sd-tab.control";
+export { SdTabItemControl } from "./ui/navigation/tab/sd-tab-item.control";
+export { SdTabviewControl } from "./ui/navigation/tab/sd-tabview.control";
+export { SdTabviewItemControl } from "./ui/navigation/tab/sd-tabview-item.control";
+
+// ui/navigation/pagination
+export { SdPaginationControl } from "./ui/navigation/pagination/sd-pagination.control";
+
+// ui/navigation/sidebar
+export { SdSidebarContainerControl } from "./ui/navigation/sidebar/sd-sidebar-container.control";
+export { SdSidebarControl } from "./ui/navigation/sidebar/sd-sidebar.control";
+export {
+  SdSidebarMenuControl,
+  type ISdSidebarMenu,
+} from "./ui/navigation/sidebar/sd-sidebar-menu.control";
+export {
+  SdSidebarUserControl,
+  type ISidebarUserMenu,
+} from "./ui/navigation/sidebar/sd-sidebar-user.control";
+
+// ui/navigation/topbar
+export { SdTopbarContainerControl } from "./ui/navigation/topbar/sd-topbar-container.control";
+export { SdTopbarControl } from "./ui/navigation/topbar/sd-topbar.control";
+export {
+  SdTopbarMenuControl,
+  type ISdTopbarMenu,
+} from "./ui/navigation/topbar/sd-topbar-menu.control";
+export {
+  SdTopbarUserControl,
+  type ISdTopbarUserMenu,
+} from "./ui/navigation/topbar/sd-topbar-user.control";
+
+// ui/data/list
+export { SdListControl } from "./ui/data/list/sd-list.control";
+export { SdListItemControl } from "./ui/data/list/sd-list-item.control";
+
+// ui/data/sheet
+export { SdSheetControl } from "./ui/data/sheet/sd-sheet.control";
+export { SdSheetColumnDirective } from "./ui/data/sheet/sd-sheet-column.directive";
+export { SdSheetConfigModal } from "./ui/data/sheet/sd-sheet-config.modal";
+export type {
+  ISdSheetColumnDef,
+  ISdSheetConfig,
+  ISdSheetHeaderDef,
+  ISdSheetItemKeydownEventParam,
+} from "./ui/data/sheet/types";
+
+// ui/visual
+export { SdLabelControl } from "./ui/visual/sd-label.control";
+export { SdNoteControl } from "./ui/visual/sd-note.control";
+export { SdProgressControl } from "./ui/visual/sd-progress.control";
+export { SdCalendarControl } from "./ui/visual/sd-calendar.control";
+export { SdBarcodeControl, type TBarcodeType } from "./ui/visual/sd-barcode.control";
+export { SdEchartsControl } from "./ui/visual/sd-echarts.control";
+
+// ui/overlay/dropdown
+export { SdDropdownControl } from "./ui/overlay/dropdown/sd-dropdown.control";
+export { SdDropdownPopupControl } from "./ui/overlay/dropdown/sd-dropdown-popup.control";
+
+// ui/overlay/modal
+export { SdModalControl } from "./ui/overlay/modal/sd-modal.control";
+export {
+  SdModalProvider,
+  SdActivatedModalProvider,
+  type ISdModal,
+  type ISdModalInfo,
+  type ISdModalOptions,
+} from "./ui/overlay/modal/sd-modal.provider";
+export { SdPromptModalControl } from "./ui/overlay/modal/sd-prompt-modal.control";
+export { SdConfirmModalControl } from "./ui/overlay/modal/sd-confirm-modal.control";
+
+// ui/overlay/toast
+export { SdToastControl } from "./ui/overlay/toast/sd-toast.control";
+export { SdToastContainerControl } from "./ui/overlay/toast/sd-toast-container.control";
+export {
+  SdToastProvider,
+  type TSdToastSeverity,
+  type TSdToastTheme,
+  type ISdToast,
+  type ISdToastInput,
+} from "./ui/overlay/toast/sd-toast.provider";
+
+// ui/overlay/busy
+export { SdBusyContainerControl } from "./ui/overlay/busy/sd-busy-container.control";
+export {
+  SdBusyProvider,
+  type TSdBusyType,
+} from "./ui/overlay/busy/sd-busy.provider";
+
+// core/providers (integration)
+export {
+  SdPrintProvider,
+  type ISdPrint,
+  type ISdPrintInput,
+} from "./core/providers/sd-print.provider";
+
+// core/utils
+export { useSortingManager, type ISortingDef } from "./core/utils/useSortingManager";
+export type { TDirectiveInputSignals, TUndefToOptional } from "./core/utils/TDirectiveInputSignals";

package/src/scss.d.ts

@@ -0,0 +1 @@
+declare module "*.scss" {}