@simplysm/solid 13.0.62 → 13.0.65

package/src/components/form-control/select-list/SelectList.tsx

@@ -0,0 +1,385 @@
+import {
+  children,
+  createEffect,
+  createMemo,
+  createSignal,
+  For,
+  type JSX,
+  onCleanup,
+  type ParentComponent,
+  Show,
+  splitProps,
+} from "solid-js";
+import clsx from "clsx";
+import { twMerge } from "tailwind-merge";
+import { List } from "../../data/list/List";
+import { Pagination } from "../../data/Pagination";
+import { TextInput } from "../field/TextInput";
+import { createSlotSignal } from "../../../hooks/createSlotSignal";
+import { SelectListContext, type SelectListContextValue } from "./SelectListContext";
+import { useSelectListContext } from "./SelectListContext";
+import {
+  listItemBaseClass,
+  listItemSelectedClass,
+  listItemContentClass,
+  listItemDisabledClass,
+} from "../../data/list/ListItem.styles";
+import { ripple } from "../../../directives/ripple";
+import { textMuted } from "../../../styles/tokens.styles";
+
+void ripple;
+
+// ─── 서브 컴포넌트 ──────────────────────────────────────
+
+/**
+ * Header 슬롯 서브 컴포넌트
+ */
+const SelectListHeader: ParentComponent = (props) => {
+  const ctx = useSelectListContext();
+  // eslint-disable-next-line solid/reactivity -- 슬롯 accessor로 저장, JSX tracked scope에서 호출됨
+  ctx.setHeader(() => props.children);
+  onCleanup(() => ctx.setHeader(undefined));
+  return null;
+};
+
+/**
+ * Filter 슬롯 서브 컴포넌트
+ */
+const SelectListFilter: ParentComponent = (props) => {
+  const ctx = useSelectListContext();
+  // eslint-disable-next-line solid/reactivity -- 슬롯 accessor로 저장, JSX tracked scope에서 호출됨
+  ctx.setFilter(() => props.children);
+  onCleanup(() => ctx.setFilter(undefined));
+  return null;
+};
+
+/**
+ * ItemTemplate 서브 컴포넌트
+ */
+const SelectListItemTemplate = <TArgs extends unknown[]>(props: {
+  children: (...args: TArgs) => JSX.Element;
+}) => {
+  const ctx = useSelectListContext();
+  // eslint-disable-next-line solid/reactivity -- 렌더 함수를 signal에 저장, JSX tracked scope에서 호출됨
+  ctx.setItemTemplate(props.children as (...args: unknown[]) => JSX.Element);
+  onCleanup(() => ctx.setItemTemplate(undefined));
+  return null;
+};
+
+// ─── Props ──────────────────────────────────────────────
+
+export interface SelectListProps<TValue> {
+  /** 목록 아이템 배열 */
+  items: TValue[];
+
+  /** 현재 선택된 값 */
+  value?: TValue;
+
+  /** 값 변경 콜백 */
+  onValueChange?: (value: TValue | undefined) => void;
+
+  /** 필수 선택 여부 (true이면 미지정 항목 숨김) */
+  required?: boolean;
+
+  /** 비활성화 */
+  disabled?: boolean;
+
+  /** 검색 텍스트 추출 함수 (있으면 검색 TextInput 자동 표시) */
+  getSearchText?: (item: TValue) => string;
+
+  /** 숨김 여부 필터 */
+  getIsHidden?: (item: TValue) => boolean;
+
+  /** 커스텀 필터 함수 */
+  filterFn?: (item: TValue, index: number) => boolean;
+
+  /** 값 변경 가드 (false 반환 시 변경 차단) */
+  canChange?: (item: TValue | undefined) => boolean | Promise<boolean>;
+
+  /** 페이지 크기 (있으면 Pagination 자동 표시) */
+  pageSize?: number;
+
+  /** 헤더 텍스트 (Header 슬롯보다 우선순위 낮음) */
+  header?: string;
+
+  /** 커스텀 class */
+  class?: string;
+
+  /** 커스텀 style */
+  style?: JSX.CSSProperties;
+
+  /** 서브 컴포넌트용 children */
+  children?: JSX.Element;
+}
+
+// ─── 스타일 ──────────────────────────────────────────────
+
+const containerClass = clsx("inline-flex flex-col gap-1");
+
+const headerClass = clsx("px-2 py-1 text-sm font-semibold");
+
+// ─── 컴포넌트 ───────────────────────────────────────────
+
+interface SelectListComponent {
+  <TValue = unknown>(props: SelectListProps<TValue>): JSX.Element;
+  Header: typeof SelectListHeader;
+  Filter: typeof SelectListFilter;
+  ItemTemplate: typeof SelectListItemTemplate;
+}
+
+export const SelectList: SelectListComponent = <TValue,>(props: SelectListProps<TValue>) => {
+  const [local, rest] = splitProps(props as SelectListProps<TValue> & { children?: JSX.Element }, [
+    "children",
+    "class",
+    "style",
+    "items",
+    "value",
+    "onValueChange",
+    "required",
+    "disabled",
+    "getSearchText",
+    "getIsHidden",
+    "filterFn",
+    "canChange",
+    "pageSize",
+    "header",
+  ]);
+
+  // ─── 내부 상태 ─────────────────────────────────────────
+
+  const [searchText, setSearchText] = createSignal("");
+  const [page, setPage] = createSignal(1);
+
+  // ─── 슬롯 signals ────────────────────────────────────
+
+  const [headerSlot, setHeader] = createSlotSignal();
+  const [filterSlot, setFilter] = createSlotSignal();
+  const [itemTemplate, _setItemTemplate] = createSignal<
+    ((...args: unknown[]) => JSX.Element) | undefined
+  >();
+  const setItemTemplate = (fn: ((...args: unknown[]) => JSX.Element) | undefined) =>
+    _setItemTemplate(() => fn);
+
+  // Context 값
+  const contextValue: SelectListContextValue = {
+    setHeader,
+    setFilter,
+    setItemTemplate,
+  };
+
+  // ─── items 변경 시 value 자동 재매칭 ──────────────────
+
+  createEffect(() => {
+    const currentItems = local.items;
+    const currentValue = local.value;
+    if (currentValue === undefined) return;
+
+    // 새 items에서 현재 value를 참조로 찾기
+    const found = currentItems.find((item) => item === currentValue);
+    if (found !== undefined) {
+      // 이미 같은 참조면 아무 것도 하지 않음
+      return;
+    }
+
+    // 참조가 없으면 현재 value를 유지 (호출하지 않음)
+  });
+
+  // ─── 필터링 파이프라인 ─────────────────────────────────
+
+  // getIsHidden 필터 → 검색 필터 → filterFn
+  const filteredItems = createMemo(() => {
+    let result = local.items;
+
+    // getIsHidden 필터
+    if (local.getIsHidden) {
+      const fn = local.getIsHidden;
+      result = result.filter((item) => !fn(item));
+    }
+
+    // 검색 필터
+    const search = searchText().trim().toLowerCase();
+    if (search && local.getSearchText) {
+      const getText = local.getSearchText;
+      result = result.filter((item) => getText(item).toLowerCase().includes(search));
+    }
+
+    // filterFn
+    if (local.filterFn) {
+      const fn = local.filterFn;
+      result = result.filter((item, index) => fn(item, index));
+    }
+
+    return result;
+  });
+
+  // 페이지 수 계산
+  const totalPageCount = createMemo(() => {
+    if (local.pageSize == null) return 1;
+    return Math.max(1, Math.ceil(filteredItems().length / local.pageSize));
+  });
+
+  // 검색이나 필터 변경 시 페이지 리셋
+  createEffect(() => {
+    // filteredItems에 의존
+    void filteredItems();
+    setPage(1);
+  });
+
+  // 페이지 슬라이스
+  const displayItems = createMemo(() => {
+    const items = filteredItems();
+    if (local.pageSize == null) return items;
+
+    const start = (page() - 1) * local.pageSize;
+    const end = start + local.pageSize;
+    return items.slice(start, end);
+  });
+
+  // ─── 선택/토글 핸들러 ─────────────────────────────────
+
+  const handleSelect = async (item: TValue | undefined) => {
+    if (local.disabled) return;
+
+    // canChange 가드
+    if (local.canChange) {
+      const allowed = await local.canChange(item);
+      if (!allowed) return;
+    }
+
+    // 토글: 이미 선택된 값을 다시 클릭하면 선택 해제 (required가 아닐 때만)
+    if (item !== undefined && item === local.value && !local.required) {
+      local.onValueChange?.(undefined);
+    } else {
+      local.onValueChange?.(item);
+    }
+  };
+
+  // ─── 아이템 렌더링 ────────────────────────────────────
+
+  const getItemTemplate = (): ((item: TValue, index: number) => JSX.Element) | undefined => {
+    return itemTemplate() as ((item: TValue, index: number) => JSX.Element) | undefined;
+  };
+
+  const renderItem = (item: TValue, index: number): JSX.Element => {
+    const tpl = getItemTemplate();
+    if (tpl) {
+      return tpl(item, index);
+    }
+    return <>{String(item)}</>;
+  };
+
+  // ─── 내부 렌더링 ──────────────────────────────────────
+
+  const SelectListInner: ParentComponent = (innerProps) => {
+    // children() resolve로 서브 컴포넌트 등록 트리거
+    const resolved = children(() => innerProps.children);
+    // resolved는 사용하지 않지만 서브 컴포넌트가 등록되도록 evaluate 필요
+    void resolved;
+
+    return (
+      <div
+        {...rest}
+        data-select-list
+        class={twMerge(containerClass, local.class)}
+        style={local.style}
+      >
+        {/* Header: 슬롯 우선, 없으면 props.header 텍스트 */}
+        <Show
+          when={headerSlot()}
+          fallback={
+            <Show when={local.header}>
+              <div class={headerClass}>{local.header}</div>
+            </Show>
+          }
+        >
+          {headerSlot()!()}
+        </Show>
+
+        {/* Filter: 슬롯 우선, 없으면 getSearchText 있을 때 TextInput */}
+        <Show
+          when={filterSlot()}
+          fallback={
+            <Show when={local.getSearchText}>
+              <TextInput
+                value={searchText()}
+                onValueChange={setSearchText}
+                placeholder="검색..."
+                inset
+                disabled={local.disabled}
+              />
+            </Show>
+          }
+        >
+          {filterSlot()!()}
+        </Show>
+
+        {/* Pagination */}
+        <Show when={local.pageSize != null && totalPageCount() > 1}>
+          <Pagination
+            page={page()}
+            onPageChange={setPage}
+            totalPageCount={totalPageCount()}
+            size="sm"
+          />
+        </Show>
+
+        {/* List */}
+        <List inset>
+          {/* 미지정 항목 (required가 아닐 때) */}
+          <Show when={!local.required}>
+            <button
+              type="button"
+              use:ripple={!local.disabled}
+              class={twMerge(
+                listItemBaseClass,
+                local.value === undefined && listItemSelectedClass,
+                local.disabled && listItemDisabledClass,
+              )}
+              data-list-item
+              role="treeitem"
+              aria-selected={local.value === undefined || undefined}
+              aria-disabled={local.disabled || undefined}
+              tabIndex={local.disabled ? -1 : 0}
+              onClick={() => handleSelect(undefined)}
+            >
+              <span class={clsx(listItemContentClass, textMuted)}>미지정</span>
+            </button>
+          </Show>
+
+          {/* 아이템 목록 */}
+          <For each={displayItems()}>
+            {(item, index) => (
+              <button
+                type="button"
+                use:ripple={!local.disabled}
+                class={twMerge(
+                  listItemBaseClass,
+                  item === local.value && listItemSelectedClass,
+                  local.disabled && listItemDisabledClass,
+                )}
+                data-list-item
+                role="treeitem"
+                aria-selected={item === local.value || undefined}
+                aria-disabled={local.disabled || undefined}
+                tabIndex={local.disabled ? -1 : 0}
+                onClick={() => handleSelect(item)}
+              >
+                <span class={listItemContentClass}>{renderItem(item, index())}</span>
+              </button>
+            )}
+          </For>
+        </List>
+      </div>
+    );
+  };
+
+  return (
+    <SelectListContext.Provider value={contextValue}>
+      <SelectListInner>{local.children}</SelectListInner>
+    </SelectListContext.Provider>
+  );
+};
+
+SelectList.Header = SelectListHeader;
+SelectList.Filter = SelectListFilter;
+SelectList.ItemTemplate = SelectListItemTemplate;

package/src/components/form-control/select-list/SelectListContext.ts

@@ -0,0 +1,23 @@
+import { createContext, useContext, type JSX } from "solid-js";
+import type { SlotAccessor } from "../../../hooks/createSlotSignal";
+
+export interface SelectListContextValue {
+  /** Header 슬롯 등록 */
+  setHeader: (content: SlotAccessor) => void;
+
+  /** Filter 슬롯 등록 */
+  setFilter: (content: SlotAccessor) => void;
+
+  /** ItemTemplate 등록 */
+  setItemTemplate: (fn: ((...args: unknown[]) => JSX.Element) | undefined) => void;
+}
+
+export const SelectListContext = createContext<SelectListContextValue>();
+
+export function useSelectListContext(): SelectListContextValue {
+  const context = useContext(SelectListContext);
+  if (!context) {
+    throw new Error("useSelectListContext는 SelectList 컴포넌트 내부에서만 사용할 수 있습니다");
+  }
+  return context;
+}

package/src/index.ts

@@ -6,6 +6,9 @@ export * from "./components/form-control/Button";
 // Select
 export * from "./components/form-control/select/Select";
 
+// SelectList
+export * from "./components/form-control/select-list/SelectList";
+
 // Combobox
 export * from "./components/form-control/combobox/Combobox";
 
@@ -57,12 +60,7 @@ export * from "./components/data/Pagination";
 export * from "./components/data/sheet/DataSheet";
 export * from "./components/data/sheet/DataSheet.styles";
 export * from "./components/data/sheet/types";
-export * from "./components/data/crud-sheet/CrudSheet";
-export * from "./components/data/crud-sheet/types";
-export * from "./components/data/crud-detail/CrudDetail";
-export * from "./components/data/crud-detail/types";
 export * from "./components/data/calendar/Calendar";
-export * from "./components/data/permission-table/PermissionTable";
 export * from "./components/data/kanban/Kanban";
 export * from "./components/data/kanban/KanbanContext";
 
@@ -171,3 +169,29 @@ export * from "./helpers/mergeStyles";
 export * from "./helpers/createAppStructure";
 
 //#endregion
+
+//#region ========== Features ==========
+
+// Address
+export * from "./components/features/address/AddressSearch";
+
+// SharedData wrappers
+export * from "./components/features/shared-data/SharedDataSelect";
+export * from "./components/features/shared-data/SharedDataSelectButton";
+export * from "./components/features/shared-data/SharedDataSelectList";
+
+// DataSelectButton
+export * from "./components/features/data-select-button/DataSelectButton";
+
+// CrudSheet
+export * from "./components/features/crud-sheet/CrudSheet";
+export * from "./components/features/crud-sheet/types";
+
+// CrudDetail
+export * from "./components/features/crud-detail/CrudDetail";
+export * from "./components/features/crud-detail/types";
+
+// PermissionTable
+export * from "./components/features/permission-table/PermissionTable";
+
+//#endregion

package/src/providers/ServiceClientContext.ts

@@ -5,14 +5,14 @@ import type { ServiceClient, ServiceConnectionConfig } from "@simplysm/service-c
  * WebSocket 서비스 클라이언트 Context 값
  */
 export interface ServiceClientContextValue {
-  /** WebSocket 연결 열기 (key로 다중 연결 관리) */
-  connect: (key: string, options?: Partial<ServiceConnectionConfig>) => Promise<void>;
+  /** WebSocket 연결 열기 (key 생략 시 "default") */
+  connect: (key?: string, options?: Partial<ServiceConnectionConfig>) => Promise<void>;
   /** 연결 닫기 */
-  close: (key: string) => Promise<void>;
+  close: (key?: string) => Promise<void>;
   /** 연결된 클라이언트 인스턴스 가져오기 (연결되지 않은 key면 에러 발생) */
-  get: (key: string) => ServiceClient;
+  get: (key?: string) => ServiceClient;
   /** 연결 상태 확인 */
-  isConnected: (key: string) => boolean;
+  isConnected: (key?: string) => boolean;
 }
 
 /** WebSocket 서비스 클라이언트 Context */

package/src/providers/ServiceClientProvider.tsx

@@ -45,11 +45,13 @@ export const ServiceClientProvider: ParentComponent = (props) => {
   });
 
   const connect = async (
-    key: string,
+    key?: string,
     options?: Partial<ServiceConnectionConfig>,
   ): Promise<void> => {
-    if (clientMap.has(key)) {
-      const existing = clientMap.get(key)!;
+    const resolvedKey = key ?? "default";
+
+    if (clientMap.has(resolvedKey)) {
+      const existing = clientMap.get(resolvedKey)!;
       if (!existing.connected) {
         throw new Error("이미 연결이 끊긴 클라이언트와 같은 키로 연결을 시도하였습니다.");
       } else {
@@ -125,27 +127,30 @@ export const ServiceClientProvider: ParentComponent = (props) => {
     });
 
     await client.connect();
-    clientMap.set(key, client);
+    clientMap.set(resolvedKey, client);
   };
 
-  const close = async (key: string): Promise<void> => {
-    const client = clientMap.get(key);
+  const close = async (key?: string): Promise<void> => {
+    const resolvedKey = key ?? "default";
+    const client = clientMap.get(resolvedKey);
     if (client) {
       await client.close();
-      clientMap.delete(key);
+      clientMap.delete(resolvedKey);
     }
   };
 
-  const get = (key: string): ServiceClient => {
-    const client = clientMap.get(key);
+  const get = (key?: string): ServiceClient => {
+    const resolvedKey = key ?? "default";
+    const client = clientMap.get(resolvedKey);
     if (!client) {
-      throw new Error(`연결하지 않은 클라이언트 키입니다. ${key}`);
+      throw new Error(`연결하지 않은 클라이언트 키입니다. ${resolvedKey}`);
     }
     return client;
   };
 
-  const isConnected = (key: string): boolean => {
-    const client = clientMap.get(key);
+  const isConnected = (key?: string): boolean => {
+    const resolvedKey = key ?? "default";
+    const client = clientMap.get(resolvedKey);
     return client?.connected ?? false;
   };
 

package/src/providers/shared-data/SharedDataContext.ts

@@ -7,8 +7,8 @@ import { type Accessor, createContext, useContext } from "solid-js";
  * SharedDataProvider에 전달하여 서버 데이터 구독을 설정한다.
  */
 export interface SharedDataDefinition<TData> {
-  /** 서비스 연결 key (useServiceClient의 connect key와 동일) */
-  serviceKey: string;
+  /** 서비스 연결 key (생략 시 "default") */
+  serviceKey?: string;
   /** 데이터 조회 함수 (changeKeys가 있으면 해당 항목만 부분 갱신) */
   fetch: (changeKeys?: Array<string | number>) => Promise<TData[]>;
   /** 항목의 고유 key 추출 함수 */
@@ -17,6 +17,12 @@ export interface SharedDataDefinition<TData> {
   orderBy: [(item: TData) => unknown, "asc" | "desc"][];
   /** 서버 이벤트 필터 (같은 name의 이벤트 중 filter가 일치하는 것만 수신) */
   filter?: unknown;
+  /** 항목에서 검색 텍스트를 추출하는 함수 */
+  getSearchText?: (item: TData) => string;
+  /** 항목이 숨김 상태인지 판별하는 함수 */
+  getIsHidden?: (item: TData) => boolean;
+  /** 항목의 부모 key를 추출하는 함수 (트리 구조 지원) */
+  getParentKey?: (item: TData) => string | number | undefined;
 }
 
 /**
@@ -32,6 +38,14 @@ export interface SharedDataAccessor<TData> {
   get: (key: string | number | undefined) => TData | undefined;
   /** 서버에 변경 이벤트 전파 (모든 구독자에게 refetch 트리거) */
   emit: (changeKeys?: Array<string | number>) => Promise<void>;
+  /** 항목의 고유 key 추출 함수 */
+  getKey: (item: TData) => string | number;
+  /** 항목에서 검색 텍스트를 추출하는 함수 */
+  getSearchText?: (item: TData) => string;
+  /** 항목이 숨김 상태인지 판별하는 함수 */
+  getIsHidden?: (item: TData) => boolean;
+  /** 항목의 부모 key를 추출하는 함수 (트리 구조 지원) */
+  getParentKey?: (item: TData) => string | number | undefined;
 }
 
 /**

package/src/providers/shared-data/SharedDataProvider.tsx

@@ -18,7 +18,7 @@ import { useLogger } from "../../hooks/useLogger";
  * - ServiceClientProvider와 NotificationProvider 내부에서 사용해야 함
  * - LoggerProvider가 있으면 fetch 실패를 로거에도 기록
  * - configure() 호출 전: wait, busy, configure만 접근 가능. 데이터 접근 시 throw
- * - configure() 호출 후: definitions의 각 key마다 서버 이벤트 리스너를 등록하여 실시간 동기화
+ * - configure() 호출 후: definitions 등록. 각 key의 items()/get() 첫 접근 시 서버 이벤트 리스너 등록 + fetch (lazy)
  * - 동시 fetch 호출 시 version counter로 데이터 역전 방지
  * - fetch 실패 시 사용자에게 danger 알림 표시
  * - cleanup 시 모든 이벤트 리스너 자동 해제
@@ -32,7 +32,6 @@ import { useLogger } from "../../hooks/useLogger";
  * // 자식 컴포넌트에서 나중에 설정:
  * useSharedData().configure(() => ({
  *   users: {
- *     serviceKey: "main",
  *     fetch: async (changeKeys) => fetchUsers(changeKeys),
  *     getKey: (item) => item.id,
  *     orderBy: [[(item) => item.name, "asc"]],
@@ -143,24 +142,37 @@ export function SharedDataProvider(props: { children: JSX.Element }): JSX.Elemen
       // eslint-disable-next-line solid/reactivity -- memo 참조를 Map에 저장하는 것은 반응성 접근이 아님
       memoMap.set(name, itemMap);
 
-      const client = serviceClient.get(def.serviceKey);
-      void client
-        .addEventListener(
-          SharedDataChangeEvent,
-          { name, filter: def.filter },
-          async (changeKeys) => {
-            await loadData(name, def, changeKeys);
-          },
-        )
-        .then((key) => {
-          listenerKeyMap.set(name, key);
-        });
+      const client = serviceClient.get(def.serviceKey ?? "default");
+
+      let initialized = false;
+
+      function ensureInitialized() {
+        if (initialized) return;
+        initialized = true;
 
-      void loadData(name, def);
+        // TODO: addEventListener가 resolve 전에 unmount되면 listener orphan 가능
+        void client
+          .addEventListener(
+            SharedDataChangeEvent,
+            { name, filter: def.filter },
+            async (changeKeys) => {
+              await loadData(name, def, changeKeys);
+            },
+          )
+          .then((key) => {
+            listenerKeyMap.set(name, key);
+          });
+
+        void loadData(name, def);
+      }
 
       accessors[name] = {
-        items,
+        items: () => {
+          ensureInitialized();
+          return items();
+        },
         get: (key: string | number | undefined) => {
+          ensureInitialized();
           if (key === undefined) return undefined;
           return itemMap().get(key);
         },
@@ -171,6 +183,10 @@ export function SharedDataProvider(props: { children: JSX.Element }): JSX.Elemen
             changeKeys,
           );
         },
+        getKey: def.getKey,
+        getSearchText: def.getSearchText,
+        getIsHidden: def.getIsHidden,
+        getParentKey: def.getParentKey,
       };
     }
   }
@@ -181,7 +197,7 @@ export function SharedDataProvider(props: { children: JSX.Element }): JSX.Elemen
       const listenerKey = listenerKeyMap.get(name);
       if (listenerKey != null) {
         const def = currentDefinitions[name];
-        const client = serviceClient.get(def.serviceKey);
+        const client = serviceClient.get(def.serviceKey ?? "default");
         void client.removeEventListener(listenerKey);
       }
     }

package/dist/components/data/crud-detail/CrudDetail.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"CrudDetail.d.ts","sourceRoot":"","sources":["..\\..\\..\\..\\src\\components\\data\\crud-detail\\CrudDetail.tsx"],"names":[],"mappings":"AAAA,OAAO,EAIL,KAAK,GAAG,EAKT,MAAM,UAAU,CAAC;AAoBlB,OAAO,EAAE,eAAe,EAAwB,MAAM,mBAAmB,CAAC;AAC1E,OAAO,EAAE,gBAAgB,EAAyB,MAAM,oBAAoB,CAAC;AAC7E,OAAO,EAAE,eAAe,EAAwB,MAAM,mBAAmB,CAAC;AAC1E,OAAO,KAAK,EAKV,eAAe,EAEhB,MAAM,SAAS,CAAC;AAEjB,UAAU,mBAAmB;IAC3B,CAAC,KAAK,SAAS,MAAM,EAAE,KAAK,EAAE,eAAe,CAAC,KAAK,CAAC,GAAG,GAAG,CAAC,OAAO,CAAC;IACnE,KAAK,EAAE,OAAO,eAAe,CAAC;IAC9B,MAAM,EAAE,OAAO,gBAAgB,CAAC;IAChC,KAAK,EAAE,OAAO,eAAe,CAAC;CAC/B;AA6SD,eAAO,MAAM,UAAU,EAAgC,mBAAmB,CAAC"}