@kosdev-code/kos-ui-plugin 2.0.0

package/dev.cjs

@@ -0,0 +1,57 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./emotion-react-jsx-runtime.browser.esm-UFFvJLiS.cjs"),p=require("react"),d=require("@kosdev-code/kos-ddk-components"),S=require("@kosdev-code/kos-ui-sdk"),m=require("@emotion/styled");require("react/jsx-runtime");const w=({component:n,location:e,resolver:o,props:c})=>{const[s,i]=p.useState();return p.useEffect(()=>{(async()=>{const l=await o(e);i(l[n])})()},[n,e,o]),s?t.jsx(s,{...c}):null},I=n=>Object.entries(n).reduce((e,[o,c])=>{if(Array.isArray(c)||typeof c=="object"&&c!==null){const s=`${o}List`,i=`${o}Map`,r=[],l={};(Array.isArray(c)?c:Object.values(c)).forEach(a=>{const g={...a,label:a.title};r.push(g),l[g.id]=g}),e[s]=r,e[i]=l}return e},{}),k=n=>{const e=n.kosdev.ddk.ncui.plugin.contributes;return{...I(e),contributes:e,json:n}},O=m.div`
+  display: flex;
+  flex-direction: column;
+  gap: 32px;
+  padding: 24px;
+`,D=S.kosComponent(({kOSMetadata:{experiencesMap:n},list:e,map:o,resolver:c})=>{const[s,i]=p.useState(),r=e.map(u=>u.namespace)||[],{t:l}=S.useKosTranslation([...new Set(r)]),C=s==null?void 0:s.experienceId,a=n[C],g=a==null?void 0:a.component,x=a==null?void 0:a.location,h=p.useCallback(u=>{const f=o[u];i(f)},[o]),j=p.useMemo(()=>e.map(u=>({...u,label:l(`${u.namespace}:${u.title}`,`"${u.title}"`)})),[e,l]);return t.jsxs(O,{children:[t.jsx(d.CardButtonGrid,{items:j,onSelect:h}),g&&x&&t.jsx(w,{component:g,location:x,resolver:c})]})}),$=m.div`
+  display: flex;
+  flex-direction: column;
+  gap: 32px;
+  padding: 24px;
+`,v=S.kosComponent(({kOSMetadata:{experiencesMap:n},list:e,map:o,showOpenButton:c=!0,showCloseButton:s=!0,resolver:i})=>{const[r,l]=p.useState(),C=e.map(y=>y.namespace)||[],{t:a}=S.useKosTranslation([...new Set(C)]),g=r==null?void 0:r.experienceId,x=n[g],h=x==null?void 0:x.component,j=x==null?void 0:x.location,u=p.useCallback(y=>{const b=o[y];l(b||null)},[o]),f=p.useMemo(()=>e.map(y=>({...y,label:a(`${y.namespace}:${y.title}`,`"${y.title}"`)})),[e,a]);return t.jsxs($,{children:[t.jsx(d.CardButtonGrid,{items:f,onSelect:u}),h&&j&&t.jsx(d.Modal,{mode:"maximized",show:!0,children:t.jsxs(t.Fragment,{children:[t.jsx(d.Header,{title:a(r.title,`"${r.title}"`),showOpenButton:c,showCloseButton:s,onClose:()=>{u("")}}),t.jsx(w,{component:h,location:j,resolver:i})]})})]})}),T=m.div`
+  display: flex;
+  flex-direction: column;
+  gap: 32px;
+  padding: 24px;
+`,L=m.div`
+  display: flex;
+  flex-direction: column;
+  gap: 32px;
+`,U=({experiencesMap:n,resolver:e,setting:{experienceId:o,id:c,namespace:s,title:i}})=>{const{t:r}=S.useKosTranslation(s),l=n[o],C=l==null?void 0:l.component,a=l==null?void 0:l.location;return t.jsxs(d.TabContainer,{children:[t.jsx(d.SettingsSubheading,{children:r(i,`"${i}"`)}),t.jsx(w,{component:C,location:a,resolver:e},c)]})},E=({experiencesMap:n,group:e,resolver:o})=>t.jsx(L,{children:e.map(c=>t.jsx(U,{experiencesMap:n,resolver:o,setting:c},c.settingsGroup))}),M=({kOSMetadata:{experiencesMap:n},list:e,resolver:o})=>{const c=p.useMemo(()=>{const i={};return e.forEach(r=>{i[r.settingsGroup]||(i[r.settingsGroup]=[]),i[r.settingsGroup].push(r)}),i},[e]),s=p.useMemo(()=>Object.keys(c).map(i=>({id:i,label:i,content:t.jsx(E,{experiencesMap:n,group:c[i],resolver:o})})),[n,c,o]);return t.jsx(T,{children:t.jsx(d.Tabs,{tabs:s})})},G=m.div`
+  display: flex;
+  flex-direction: column;
+  gap: 32px;
+  padding: 24px;
+`,B=S.kosComponent(({kOSMetadata:{experiencesMap:n},list:e,map:o,resolver:c})=>{const[s,i]=p.useState(),r=e.map(u=>u.namespace)||[],{t:l}=S.useKosTranslation([...new Set(r)]),C=s==null?void 0:s.experienceId,a=n[C],g=a==null?void 0:a.component,x=a==null?void 0:a.location,h=p.useCallback(u=>{const f=o[u];i(f||null)},[o]),j=p.useMemo(()=>e.map(u=>({...u,label:l(`${u.namespace}:${u.title}`,`"${u.title}"`)})),[e,l]);return t.jsxs(G,{children:[t.jsx(d.CardButtonGrid,{items:j,onSelect:h}),g&&x&&t.jsx(w,{component:g,location:x,resolver:c,props:{onComplete:h}})]})}),H={cui:n=>t.jsx(v,{...n,showOpenButton:!1}),utilities:B,setupStep:v,settings:n=>t.jsx(M,{baseRoute:"settings",...n})},q=S.kosComponent(({kOSJSON:n,resolver:e})=>{const o=p.useMemo(()=>k(n),[n]),c=p.useMemo(()=>Object.keys(o.contributes).filter(s=>Array.isArray(o.contributes[s])&&o.contributes[s].length).map(s=>{const i=H[s]||D;return{id:s,label:s,content:t.jsx(i,{kOSMetadata:o,list:o[`${s}List`],map:o[`${s}Map`],resolver:e},s)}}),[]);return t.jsx(d.TabRouter,{baseRoute:"",tabs:c})}),A=m.div`
+  display: flex;
+  flex-direction: column;
+  gap: 32px;
+  width: 100%;
+`,K=({kOSMetadata:{defaultExperienceId:n,experienceList:e,experienceMap:o},resolver:c})=>{const[s,i]=p.useState(n),r=o[s].component,l=o[s].location,C=p.useCallback(a=>{i(a)},[]);return t.jsxs(A,{children:[t.jsx(d.PickerCard,{label:"Experience",items:e,selectedItemId:s,cancelButtonLabel:"Cancel",proceedButtonLabel:"Select",onSave:C,displayValue:r}),t.jsx(w,{component:r,location:l,resolver:c})]})},R="data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20id='kos_logo_full'%20data-name='kos_logo_full'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2041.58%2016.95'%20fill='%23fff'%3e%3cpath%20d='m21.49,12.39c-.7-.38-1.25-.91-1.64-1.59-.4-.68-.59-1.45-.59-2.32s.2-1.64.59-2.32c.4-.68.94-1.21,1.64-1.59.7-.38,1.49-.57,2.38-.57s1.68.19,2.38.57c.7.38,1.25.91,1.64,1.59.4.68.59,1.45.59,2.32s-.2,1.64-.59,2.32c-.4.68-.94,1.21-1.64,1.59-.7.38-1.49.57-2.38.57s-1.68-.19-2.38-.57Zm3.76-1.49c.4-.24.72-.56.95-.98.23-.42.34-.9.34-1.43s-.11-1.01-.34-1.43c-.23-.42-.54-.75-.95-.98-.4-.24-.86-.35-1.37-.35s-.97.12-1.37.35c-.4.24-.72.56-.95.98-.23.42-.34.9-.34,1.43s.11,1.01.34,1.43c.23.42.54.75.95.98.4.24.86.35,1.37.35s.97-.12,1.37-.35Zm6.34,1.67c-.73-.24-1.32-.56-1.76-.98l1.16-1.42c.81.72,1.77,1.08,2.89,1.08.51,0,.92-.1,1.24-.29.31-.19.47-.43.47-.71,0-.21-.09-.38-.28-.53-.18-.14-.5-.26-.94-.35l-1.84-.35c-.8-.15-1.4-.43-1.79-.83-.4-.4-.59-.91-.59-1.51,0-.54.16-1.02.47-1.42.32-.4.76-.71,1.32-.93s1.2-.32,1.91-.32c.67,0,1.32.1,1.93.29s1.15.49,1.6.9l-1.08,1.38c-.76-.62-1.6-.92-2.51-.92-.49,0-.89.08-1.22.25-.32.17-.49.38-.49.64,0,.17.08.32.25.44.16.13.48.24.94.32l1.7.31c.85.16,1.49.46,1.91.91.43.44.64.97.64,1.59,0,.55-.15,1.04-.44,1.46s-.71.75-1.25.98-1.17.35-1.88.35c-.86,0-1.65-.12-2.38-.35ZM41.5,1c0-.55-.46-1-1.01-1H1C.45,0,0,.45,0,1v14.95c0,.55.45,1,1,1h15.2v-.02s.06.02.1.02h24.29c.55,0,1-.45.99-1l-.08-14.95Zm-25.21,14.95l-.09-14.95h24.3s.09,14.95.09,14.95h-24.3Zm-8.34-7.1l-1.66,1.64v2.32h-1.88V4.16h1.88v4.09l4.1-4.09h2.27l-3.42,3.4,3.62,5.24h-2.23l-2.69-3.96Z'%20/%3e%3c/svg%3e",Z=m.div`
+  background-color: var(--ddk-component-top-navigation-background-color);
+  color: var(--ddk-component-top-navigation-color);
+`,_=m.div`
+  padding: var(--ddk-component-top-navigation-padding);
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+`,z=m.div`
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  gap: 16px;
+`,P=m.div`
+  width: 100px;
+`,F=m.h1`
+  font-size: 16px;
+`,N=()=>p.useMemo(()=>[],[]),V=()=>{const n=N();return t.jsx(Z,{children:t.jsx(d.Container,{children:t.jsxs(_,{children:[t.jsxs(z,{children:[t.jsx(P,{children:t.jsx("img",{alt:"kOS logo",src:R})}),t.jsx(F,{children:"Welcome to kOS"})]}),t.jsx(d.TopNavigationButtonList,{items:n})]})})})},W=m.div`
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  height: 100vh;
+`,J=m.div`
+  display: flex;
+  flex-direction: column;
+  overflow-y: auto;
+`,Q=S.kosComponent(({children:n})=>t.jsxs(W,{children:[t.jsx(V,{}),t.jsx(J,{children:n})]})),X=({children:n})=>{const{componentModeOverride:e}=d.useComponentConfigurationContext();return t.jsx(d.Modal,{contain:e!=="compact",mode:"maximized",show:!0,children:t.jsxs(t.Fragment,{children:[t.jsx(d.Header,{CloseButton:e==="compact"?d.BackButton:void 0,contain:e==="compact",showCloseButton:!0,showOpenButton:!1,title:"CUI"}),n]})})},Y=({children:n})=>n,tt=({children:n})=>t.jsxs(d.TabContainer,{children:[t.jsx(d.SettingsSubheading,{children:"Setting"}),n]}),nt=({children:n})=>{const{componentModeOverride:e}=d.useComponentConfigurationContext();return t.jsx(d.Modal,{contain:e!=="compact",mode:"maximized",show:!0,children:t.jsxs(t.Fragment,{children:[t.jsx(d.Header,{CloseButton:e==="compact"?d.BackButton:void 0,contain:e==="compact",showCloseButton:!0,showOpenButton:!0,title:"Setup Step"}),n]})})},et=({children:n})=>n;exports.CUIStoryContainer=X;exports.DynamicComponentView=w;exports.DynamicContainer=q;exports.DynamicViewBasic=D;exports.DynamicViewModal=v;exports.DynamicViewPicker=K;exports.DynamicViewSettings=M;exports.DynamicViewUtilities=B;exports.Header=V;exports.NavStoryContainer=Y;exports.SettingStoryContainer=tt;exports.SetupStepStoryContainer=nt;exports.Shell=Q;exports.UtilityStoryContainer=et;exports.parse=k;
+//# sourceMappingURL=dev.cjs.map

package/dev.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"dev.cjs","sources":["../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/dynamic-view/dynamic-component-view.tsx","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/utils/normalize.ts","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/utils/kos-metadata-parser.ts","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/dynamic-view/dynamic-view-basic.tsx","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/dynamic-view/dynamic-view-modal.tsx","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/dynamic-view/dynamic-view-settings.tsx","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/dynamic-view/dynamic-view-utilities.tsx","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/dynamic-view/dynamic-container.tsx","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/dynamic-view/dynamic-view-picker.tsx","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/shell/header/kos-logo.svg","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/shell/header/header.tsx","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/shell/shell.tsx","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/storybook/cui-story-container/cui-story-container.tsx","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/storybook/nav-story-container/nav-story-container.tsx","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/storybook/setting-story-container/setting-story-container.tsx","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/storybook/setup-step-story-container/setup-step-story-container.tsx","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/storybook/utility-story-container/utility-story-container.tsx"],"sourcesContent":["import { ElementType, useEffect, useState } from \"react\";\n\ninterface DynamicComponentViewProps {\n  component: string;\n  location: string;\n  resolver: (location: string) => any;\n  props?: any;\n}\n\nexport const DynamicComponentView = ({\n  component,\n  location,\n  resolver,\n  props,\n}: DynamicComponentViewProps) => {\n  const [Component, setComponent] = useState<ElementType>();\n\n  useEffect(() => {\n    const load = async () => {\n      const result = await resolver(location);\n\n      setComponent(result[component]);\n    };\n\n    load();\n  }, [component, location, resolver]);\n\n  return Component ? <Component {...props} /> : null;\n};\n","export const normalize = (json: any): Record<string, any> =>\n  Object.entries(json).reduce((parsed: Record<string, any>, [key, value]) => {\n    if (Array.isArray(value) || (typeof value === \"object\" && value !== null)) {\n      const listKey = `${key}List`;\n      const mapKey = `${key}Map`;\n\n      const list: any[] = [];\n      const map: Record<string, any> = {};\n\n      const items = Array.isArray(value) ? value : Object.values(value);\n      items.forEach((item) => {\n        const data = { ...item, label: item.title };\n        list.push(data);\n        map[data.id] = data;\n      });\n\n      parsed[listKey] = list;\n      parsed[mapKey] = map;\n    }\n\n    return parsed;\n  }, {});\n","import { normalize } from \"./normalize\";\n\nexport interface KOSMetadata {\n  json: any;\n  [key: string]: any;\n}\n\nexport const parse = (json: any): KOSMetadata => {\n  const contributes = json.kosdev.ddk.ncui.plugin.contributes;\n\n  const parsed: Record<string, any> = normalize(contributes);\n\n  return {\n    ...parsed,\n    contributes,\n    json,\n  };\n};\n","import styled from \"@emotion/styled\";\nimport { CardButtonGrid } from \"@kosdev-code/kos-ddk-components\";\nimport { useCallback, useMemo, useState } from \"react\";\nimport { KOSMetadata } from \"../../utils\";\nimport { DynamicComponentView } from \"./dynamic-component-view\";\nimport { kosComponent, useKosTranslation } from \"@kosdev-code/kos-ui-sdk\";\n\nconst DynamicViewBasicContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  gap: 32px;\n  padding: 24px;\n`;\n\ninterface DynamicViewBasicProps {\n  kOSMetadata: KOSMetadata;\n  list: any[];\n  map: Record<string, any>;\n  resolver: (location: string) => any;\n}\n\nexport const DynamicViewBasic = kosComponent(\n  ({\n    kOSMetadata: { experiencesMap },\n    list,\n    map,\n    resolver,\n  }: DynamicViewBasicProps) => {\n    const [selectedItem, setSelectedItem] = useState<any>();\n\n    const namespaces = list.map((ext) => ext.namespace) || [];\n    const { t } = useKosTranslation([...new Set(namespaces)]);\n\n    const selectedExperienceID = selectedItem?.experienceId;\n    const experience = experiencesMap[selectedExperienceID];\n    const component = experience?.component;\n    const location = experience?.location;\n\n    const select = useCallback(\n      (itemID: string) => {\n        const item = map[itemID];\n\n        setSelectedItem(item);\n      },\n      [map]\n    );\n\n    const translatedList = useMemo(\n      () =>\n        list.map((item) => {\n          return {\n            ...item,\n            label: t(`${item.namespace}:${item.title}`, `\"${item.title}\"`),\n          };\n        }),\n      [list, t]\n    );\n\n    return (\n      <DynamicViewBasicContainer>\n        <CardButtonGrid items={translatedList} onSelect={select} />\n\n        {component && location && (\n          <DynamicComponentView\n            component={component}\n            location={location}\n            resolver={resolver}\n          />\n        )}\n      </DynamicViewBasicContainer>\n    );\n  }\n);\n","import styled from \"@emotion/styled\";\nimport { CardButtonGrid, Header, Modal } from \"@kosdev-code/kos-ddk-components\";\nimport { kosComponent, useKosTranslation } from \"@kosdev-code/kos-ui-sdk\";\nimport { useCallback, useMemo, useState } from \"react\";\nimport { KOSMetadata } from \"../../utils\";\nimport { DynamicComponentView } from \"./dynamic-component-view\";\n\nconst DynamicViewModalContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  gap: 32px;\n  padding: 24px;\n`;\n\ninterface DynamicViewModalProps {\n  kOSMetadata: KOSMetadata;\n  list: any[];\n  map: Record<string, any>;\n  showOpenButton?: boolean;\n  showCloseButton?: boolean;\n  resolver: (location: string) => any;\n}\n\nexport const DynamicViewModal = kosComponent(\n  ({\n    kOSMetadata: { experiencesMap },\n    list,\n    map,\n    showOpenButton = true,\n    showCloseButton = true,\n    resolver,\n  }: DynamicViewModalProps) => {\n    const [selectedItem, setSelectedItem] = useState<any>();\n\n    const namespaces = list.map((ext) => ext.namespace) || [];\n    const { t } = useKosTranslation([...new Set(namespaces)]);\n\n    const selectedExperienceID = selectedItem?.experienceId;\n    const experience = experiencesMap[selectedExperienceID];\n    const component = experience?.component;\n    const location = experience?.location;\n\n    const select = useCallback(\n      (itemID: string) => {\n        const item = map[itemID];\n\n        if (item) {\n          setSelectedItem(item);\n        } else {\n          setSelectedItem(null);\n        }\n      },\n      [map]\n    );\n\n    const translatedList = useMemo(\n      () =>\n        list.map((item) => {\n          return {\n            ...item,\n            label: t(`${item.namespace}:${item.title}`, `\"${item.title}\"`),\n          };\n        }),\n      [list, t]\n    );\n\n    return (\n      <DynamicViewModalContainer>\n        <CardButtonGrid items={translatedList} onSelect={select} />\n\n        {component && location && (\n          <Modal mode=\"maximized\" show={true}>\n            <>\n              <Header\n                title={t(selectedItem.title, `\"${selectedItem.title}\"`)}\n                showOpenButton={showOpenButton}\n                showCloseButton={showCloseButton}\n                onClose={() => {\n                  select(\"\");\n                }}\n              />\n              <DynamicComponentView\n                component={component}\n                location={location}\n                resolver={resolver}\n              />\n            </>\n          </Modal>\n        )}\n      </DynamicViewModalContainer>\n    );\n  }\n);\n","import styled from \"@emotion/styled\";\nimport {\n  SettingsSubheading,\n  TabContainer,\n  Tabs,\n} from \"@kosdev-code/kos-ddk-components\";\nimport { useKosTranslation } from \"@kosdev-code/kos-ui-sdk\";\nimport { useMemo } from \"react\";\nimport type { SettingsDefinition } from \"../../../../types/global\";\nimport { KOSMetadata } from \"../../utils\";\nimport { DynamicComponentView } from \"./dynamic-component-view\";\n\nconst DynamicViewSettingsContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  gap: 32px;\n  padding: 24px;\n`;\n\nconst GroupContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  gap: 32px;\n`;\n\ninterface Setting {\n  id: string;\n  title: string;\n  namespace: string;\n  settingsGroup: string;\n  experienceId: string;\n}\n\ninterface SettingsViewProps {\n  experiencesMap: any;\n  resolver: (location: string) => any;\n  setting: Setting;\n}\n\nconst SettingView = ({\n  experiencesMap,\n  resolver,\n  setting: { experienceId, id, namespace, title },\n}: SettingsViewProps) => {\n  const { t } = useKosTranslation(namespace);\n\n  const experience = experiencesMap[experienceId];\n  const component = experience?.component;\n  const location = experience?.location;\n\n  return (\n    <TabContainer>\n      <SettingsSubheading>{t(title, `\"${title}\"`)}</SettingsSubheading>\n      <DynamicComponentView\n        key={id}\n        component={component}\n        location={location}\n        resolver={resolver}\n      />\n    </TabContainer>\n  );\n};\n\ninterface GroupViewProps {\n  experiencesMap: any;\n  group: Setting[];\n  resolver: (location: string) => any;\n}\n\nconst GroupView = ({ experiencesMap, group, resolver }: GroupViewProps) => (\n  <GroupContainer>\n    {group.map((setting) => (\n      <SettingView\n        key={setting.settingsGroup}\n        experiencesMap={experiencesMap}\n        resolver={resolver}\n        setting={setting}\n      />\n    ))}\n  </GroupContainer>\n);\n\ninterface DynamicViewSettingsProps {\n  kOSMetadata: KOSMetadata;\n  list: SettingsDefinition[];\n  map: Record<string, any>;\n  showOpenButton?: boolean;\n  showCloseButton?: boolean;\n  baseRoute?: string;\n  resolver: (location: string) => any;\n}\n\nexport const DynamicViewSettings = ({\n  kOSMetadata: { experiencesMap },\n  list,\n\n  resolver,\n}: DynamicViewSettingsProps) => {\n  const groups = useMemo(() => {\n    const groups: Record<string, any> = {};\n\n    list.forEach((item) => {\n      if (!groups[item.settingsGroup]) {\n        groups[item.settingsGroup] = [];\n      }\n\n      groups[item.settingsGroup].push(item);\n    });\n\n    return groups;\n  }, [list]);\n\n  const tabs = useMemo(\n    () =>\n      Object.keys(groups).map((groupName) => {\n        return {\n          id: groupName,\n          label: groupName,\n          content: (\n            <GroupView\n              experiencesMap={experiencesMap}\n              group={groups[groupName]}\n              resolver={resolver}\n            />\n          ),\n        };\n      }),\n    [experiencesMap, groups, resolver]\n  );\n\n  return (\n    <DynamicViewSettingsContainer>\n      <Tabs tabs={tabs} />\n    </DynamicViewSettingsContainer>\n  );\n};\n","import styled from \"@emotion/styled\";\nimport { CardButtonGrid } from \"@kosdev-code/kos-ddk-components\";\nimport { useCallback, useMemo, useState } from \"react\";\nimport { KOSMetadata } from \"../../utils\";\nimport { DynamicComponentView } from \"./dynamic-component-view\";\nimport { kosComponent, useKosTranslation } from \"@kosdev-code/kos-ui-sdk\";\n\nconst DynamicViewUtilitiesContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  gap: 32px;\n  padding: 24px;\n`;\n\ninterface DynamicViewUtilitiesProps {\n  kOSMetadata: KOSMetadata;\n  list: any[];\n  map: Record<string, any>;\n  showOpenButton?: boolean;\n  showCloseButton?: boolean;\n  resolver: (location: string) => any;\n}\n\nexport const DynamicViewUtilities = kosComponent(\n  ({\n    kOSMetadata: { experiencesMap },\n    list,\n    map,\n    resolver,\n  }: DynamicViewUtilitiesProps) => {\n    const [selectedItem, setSelectedItem] = useState<any>();\n\n    const namespaces = list.map((ext) => ext.namespace) || [];\n    const { t } = useKosTranslation([...new Set(namespaces)]);\n\n    const selectedExperienceID = selectedItem?.experienceId;\n    const experience = experiencesMap[selectedExperienceID];\n    const component = experience?.component;\n    const location = experience?.location;\n\n    const select = useCallback(\n      (itemID: string) => {\n        const item = map[itemID];\n\n        if (item) {\n          setSelectedItem(item);\n        } else {\n          setSelectedItem(null);\n        }\n      },\n      [map]\n    );\n\n    const translatedList = useMemo(\n      () =>\n        list.map((item) => {\n          return {\n            ...item,\n            label: t(`${item.namespace}:${item.title}`, `\"${item.title}\"`),\n          };\n        }),\n      [list, t]\n    );\n\n    return (\n      <DynamicViewUtilitiesContainer>\n        <CardButtonGrid items={translatedList} onSelect={select} />\n\n        {component && location && (\n          <DynamicComponentView\n            component={component}\n            location={location}\n            resolver={resolver}\n            props={{ onComplete: select }}\n          />\n        )}\n      </DynamicViewUtilitiesContainer>\n    );\n  }\n);\n","import { TabRouter } from \"@kosdev-code/kos-ddk-components\";\nimport { kosComponent } from \"@kosdev-code/kos-ui-sdk\";\nimport { useMemo } from \"react\";\nimport { parse } from \"../../utils\";\nimport { DynamicViewBasic } from \"./dynamic-view-basic\";\nimport { DynamicViewModal } from \"./dynamic-view-modal\";\nimport { DynamicViewSettings } from \"./dynamic-view-settings\";\nimport { DynamicViewUtilities } from \"./dynamic-view-utilities\";\n\nconst contentComponentMap: Record<string, any> = {\n  cui: (props: any) => <DynamicViewModal {...props} showOpenButton={false} />,\n  utilities: DynamicViewUtilities,\n  setupStep: DynamicViewModal,\n  settings: (props: any) => (\n    <DynamicViewSettings baseRoute=\"settings\" {...props} />\n  ),\n};\n\ninterface DynamicContainerProps {\n  kOSJSON: any;\n  resolver: (location: string) => any;\n}\n\nexport const DynamicContainer: React.FunctionComponent<DynamicContainerProps> =\n  kosComponent(({ kOSJSON, resolver }) => {\n    const kOSMetadata = useMemo(() => parse(kOSJSON), [kOSJSON]);\n\n    const tabs = useMemo(\n      () =>\n        Object.keys(kOSMetadata.contributes)\n          .filter(\n            (key) =>\n              Array.isArray(kOSMetadata.contributes[key]) &&\n              kOSMetadata.contributes[key].length\n          )\n          .map((key) => {\n            const Component = contentComponentMap[key] || DynamicViewBasic;\n\n            return {\n              id: key,\n              label: key,\n              content: (\n                <Component\n                  key={key}\n                  kOSMetadata={kOSMetadata}\n                  list={kOSMetadata[`${key}List`]}\n                  map={kOSMetadata[`${key}Map`]}\n                  resolver={resolver}\n                />\n              ),\n            };\n          }),\n      []\n    );\n\n    return <TabRouter baseRoute=\"\" tabs={tabs} />;\n  });\n","import styled from \"@emotion/styled\";\nimport { PickerCard } from \"@kosdev-code/kos-ddk-components\";\nimport { useCallback, useState } from \"react\";\nimport { DynamicComponentView } from \"./dynamic-component-view\";\nimport { KOSMetadata } from \"../../utils\";\n\nconst DynamicViewPickerContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  gap: 32px;\n  width: 100%;\n`;\n\ninterface DynamicViewPickerProps {\n  kOSMetadata: KOSMetadata;\n  resolver: (location: string) => any;\n}\n\nexport const DynamicViewPicker = ({\n  kOSMetadata: { defaultExperienceId, experienceList, experienceMap },\n  resolver,\n}: DynamicViewPickerProps) => {\n  const [selectedExperienceID, setSelectedExperienceID] =\n    useState(defaultExperienceId);\n\n  const component = experienceMap[selectedExperienceID].component;\n  const location = experienceMap[selectedExperienceID].location;\n\n  const save = useCallback((experienceID: string) => {\n    setSelectedExperienceID(experienceID);\n  }, []);\n\n  return (\n    <DynamicViewPickerContainer>\n      <PickerCard\n        label=\"Experience\"\n        items={experienceList}\n        selectedItemId={selectedExperienceID}\n        cancelButtonLabel=\"Cancel\"\n        proceedButtonLabel=\"Select\"\n        onSave={save}\n        displayValue={component}\n      />\n\n      <DynamicComponentView\n        component={component}\n        location={location}\n        resolver={resolver}\n      />\n    </DynamicViewPickerContainer>\n  );\n};\n","export default \"data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20id='kos_logo_full'%20data-name='kos_logo_full'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2041.58%2016.95'%20fill='%23fff'%3e%3cpath%20d='m21.49,12.39c-.7-.38-1.25-.91-1.64-1.59-.4-.68-.59-1.45-.59-2.32s.2-1.64.59-2.32c.4-.68.94-1.21,1.64-1.59.7-.38,1.49-.57,2.38-.57s1.68.19,2.38.57c.7.38,1.25.91,1.64,1.59.4.68.59,1.45.59,2.32s-.2,1.64-.59,2.32c-.4.68-.94,1.21-1.64,1.59-.7.38-1.49.57-2.38.57s-1.68-.19-2.38-.57Zm3.76-1.49c.4-.24.72-.56.95-.98.23-.42.34-.9.34-1.43s-.11-1.01-.34-1.43c-.23-.42-.54-.75-.95-.98-.4-.24-.86-.35-1.37-.35s-.97.12-1.37.35c-.4.24-.72.56-.95.98-.23.42-.34.9-.34,1.43s.11,1.01.34,1.43c.23.42.54.75.95.98.4.24.86.35,1.37.35s.97-.12,1.37-.35Zm6.34,1.67c-.73-.24-1.32-.56-1.76-.98l1.16-1.42c.81.72,1.77,1.08,2.89,1.08.51,0,.92-.1,1.24-.29.31-.19.47-.43.47-.71,0-.21-.09-.38-.28-.53-.18-.14-.5-.26-.94-.35l-1.84-.35c-.8-.15-1.4-.43-1.79-.83-.4-.4-.59-.91-.59-1.51,0-.54.16-1.02.47-1.42.32-.4.76-.71,1.32-.93s1.2-.32,1.91-.32c.67,0,1.32.1,1.93.29s1.15.49,1.6.9l-1.08,1.38c-.76-.62-1.6-.92-2.51-.92-.49,0-.89.08-1.22.25-.32.17-.49.38-.49.64,0,.17.08.32.25.44.16.13.48.24.94.32l1.7.31c.85.16,1.49.46,1.91.91.43.44.64.97.64,1.59,0,.55-.15,1.04-.44,1.46s-.71.75-1.25.98-1.17.35-1.88.35c-.86,0-1.65-.12-2.38-.35ZM41.5,1c0-.55-.46-1-1.01-1H1C.45,0,0,.45,0,1v14.95c0,.55.45,1,1,1h15.2v-.02s.06.02.1.02h24.29c.55,0,1-.45.99-1l-.08-14.95Zm-25.21,14.95l-.09-14.95h24.3s.09,14.95.09,14.95h-24.3Zm-8.34-7.1l-1.66,1.64v2.32h-1.88V4.16h1.88v4.09l4.1-4.09h2.27l-3.42,3.4,3.62,5.24h-2.23l-2.69-3.96Z'%20/%3e%3c/svg%3e\"","import styled from \"@emotion/styled\";\nimport {\n  Container,\n  TopNavigationButtonList,\n} from \"@kosdev-code/kos-ddk-components\";\nimport { ReactNode, useMemo } from \"react\";\nimport kosLogo from \"./kos-logo.svg\";\n\nconst HeaderStyles = styled.div`\n  background-color: var(--ddk-component-top-navigation-background-color);\n  color: var(--ddk-component-top-navigation-color);\n`;\n\nconst ContainerStyles = styled.div`\n  padding: var(--ddk-component-top-navigation-padding);\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n`;\n\nconst LogoContainerStyles = styled.div`\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  gap: 16px;\n`;\n\nconst LogoStyles = styled.div`\n  width: 100px;\n`;\n\nconst TitleStyles = styled.h1`\n  font-size: 16px;\n`;\n\nconst useNavigationItems = () => {\n  const navigationItems = useMemo(() => {\n    const navigationItems: { children: ReactNode; to: string }[] = [\n      // { children: 'Develop', to: '/develop' }\n    ];\n\n    return navigationItems;\n  }, []);\n\n  return navigationItems;\n};\n\nexport const Header = () => {\n  const navigationItems = useNavigationItems();\n\n  return (\n    <HeaderStyles>\n      <Container>\n        <ContainerStyles>\n          <LogoContainerStyles>\n            <LogoStyles>\n              <img alt=\"kOS logo\" src={kosLogo} />\n            </LogoStyles>\n            <TitleStyles>Welcome to kOS</TitleStyles>\n          </LogoContainerStyles>\n          <TopNavigationButtonList items={navigationItems} />\n        </ContainerStyles>\n      </Container>\n    </HeaderStyles>\n  );\n};\n","import styled from \"@emotion/styled\";\nimport { kosComponent } from \"@kosdev-code/kos-ui-sdk\";\nimport { ReactNode } from \"react\";\nimport { Header } from \"./header\";\n\nconst Container = styled.div`\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  height: 100vh;\n`;\n\nconst Body = styled.div`\n  display: flex;\n  flex-direction: column;\n  overflow-y: auto;\n`;\n\ninterface ShellProps {\n  children: ReactNode;\n}\n\nexport const Shell = kosComponent(({ children }: ShellProps) => (\n  <Container>\n    <Header />\n    <Body>{children}</Body>\n  </Container>\n));\n","import {\n  BackButton,\n  Header,\n  Modal,\n  useComponentConfigurationContext,\n} from \"@kosdev-code/kos-ddk-components\";\nimport type { ReactNode } from \"react\";\n\ninterface CUIStoryContainerProps {\n  children: ReactNode;\n}\n\nexport const CUIStoryContainer = ({ children }: CUIStoryContainerProps) => {\n  const { componentModeOverride } = useComponentConfigurationContext();\n\n  return (\n    <Modal\n      contain={componentModeOverride !== \"compact\"}\n      mode=\"maximized\"\n      show={true}\n    >\n      <>\n        <Header\n          CloseButton={\n            componentModeOverride === \"compact\" ? BackButton : undefined\n          }\n          contain={componentModeOverride === \"compact\"}\n          showCloseButton={true}\n          showOpenButton={false}\n          title=\"CUI\"\n        />\n        {children}\n      </>\n    </Modal>\n  );\n};\n","import type { ReactNode } from \"react\";\n\ninterface NavStoryContainerProps {\n  children: ReactNode;\n}\n\nexport const NavStoryContainer = ({ children }: NavStoryContainerProps) =>\n  children;\n","import {\n  SettingsSubheading,\n  TabContainer,\n} from \"@kosdev-code/kos-ddk-components\";\nimport type { ReactNode } from \"react\";\n\ninterface SettingStoryContainerProps {\n  children: ReactNode;\n}\n\nexport const SettingStoryContainer = ({\n  children,\n}: SettingStoryContainerProps) => (\n  <TabContainer>\n    <SettingsSubheading>Setting</SettingsSubheading>\n    {children}\n  </TabContainer>\n);\n","import {\n  BackButton,\n  Header,\n  Modal,\n  useComponentConfigurationContext,\n} from \"@kosdev-code/kos-ddk-components\";\nimport type { ReactNode } from \"react\";\n\ninterface SetupStepStoryContainerProps {\n  children: ReactNode;\n}\n\nexport const SetupStepStoryContainer = ({\n  children,\n}: SetupStepStoryContainerProps) => {\n  const { componentModeOverride } = useComponentConfigurationContext();\n\n  return (\n    <Modal\n      contain={componentModeOverride !== \"compact\"}\n      mode=\"maximized\"\n      show={true}\n    >\n      <>\n        <Header\n          CloseButton={\n            componentModeOverride === \"compact\" ? BackButton : undefined\n          }\n          contain={componentModeOverride === \"compact\"}\n          showCloseButton={true}\n          showOpenButton={true}\n          title=\"Setup Step\"\n        />\n        {children}\n      </>\n    </Modal>\n  );\n};\n","import type { ReactNode } from \"react\";\n\ninterface UtilityStoryContainerProps {\n  children: ReactNode;\n}\n\nexport const UtilityStoryContainer = ({\n  children,\n}: UtilityStoryContainerProps) => children;\n"],"names":["DynamicComponentView","component","location","resolver","props","Component","setComponent","useState","useEffect","result","jsx","normalize","json","parsed","key","value","listKey","mapKey","list","map","item","data","parse","contributes","DynamicViewBasicContainer","styled","DynamicViewBasic","kosComponent","experiencesMap","selectedItem","setSelectedItem","namespaces","ext","t","useKosTranslation","selectedExperienceID","experience","select","useCallback","itemID","translatedList","useMemo","CardButtonGrid","DynamicViewModalContainer","DynamicViewModal","showOpenButton","showCloseButton","Modal","jsxs","Fragment","Header","DynamicViewSettingsContainer","GroupContainer","SettingView","experienceId","id","namespace","title","TabContainer","SettingsSubheading","GroupView","group","setting","DynamicViewSettings","groups","tabs","groupName","Tabs","DynamicViewUtilitiesContainer","DynamicViewUtilities","contentComponentMap","DynamicContainer","kOSJSON","kOSMetadata","TabRouter","DynamicViewPickerContainer","DynamicViewPicker","defaultExperienceId","experienceList","experienceMap","setSelectedExperienceID","save","experienceID","PickerCard","kosLogo","HeaderStyles","ContainerStyles","LogoContainerStyles","LogoStyles","TitleStyles","useNavigationItems","navigationItems","Container","TopNavigationButtonList","Body","Shell","children","CUIStoryContainer","componentModeOverride","useComponentConfigurationContext","BackButton","NavStoryContainer","SettingStoryContainer","SetupStepStoryContainer","UtilityStoryContainer"],"mappings":"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"}

package/dev.js

@@ -0,0 +1,400 @@
+import { j as o, a as u, F as B } from "./emotion-react-jsx-runtime.browser.esm-vwuMB3sI.js";
+import { useState as x, useEffect as T, useCallback as k, useMemo as y } from "react";
+import { CardButtonGrid as D, Header as $, Modal as O, Tabs as A, SettingsSubheading as L, TabContainer as j, TabRouter as U, PickerCard as Z, Container as z, TopNavigationButtonList as H, useComponentConfigurationContext as E, BackButton as G } from "@kosdev-code/kos-ddk-components";
+import { kosComponent as w, useKosTranslation as I } from "@kosdev-code/kos-ui-sdk";
+import p from "@emotion/styled";
+import "react/jsx-runtime";
+const b = ({
+  component: t,
+  location: n,
+  resolver: e,
+  props: s
+}) => {
+  const [c, i] = x();
+  return T(() => {
+    (async () => {
+      const r = await e(n);
+      i(r[t]);
+    })();
+  }, [t, n, e]), c ? /* @__PURE__ */ o(c, { ...s }) : null;
+}, _ = (t) => Object.entries(t).reduce((n, [e, s]) => {
+  if (Array.isArray(s) || typeof s == "object" && s !== null) {
+    const c = `${e}List`, i = `${e}Map`, l = [], r = {};
+    (Array.isArray(s) ? s : Object.values(s)).forEach((a) => {
+      const g = { ...a, label: a.title };
+      l.push(g), r[g.id] = g;
+    }), n[c] = l, n[i] = r;
+  }
+  return n;
+}, {}), F = (t) => {
+  const n = t.kosdev.ddk.ncui.plugin.contributes;
+  return {
+    ..._(n),
+    contributes: n,
+    json: t
+  };
+}, K = p.div`
+  display: flex;
+  flex-direction: column;
+  gap: 32px;
+  padding: 24px;
+`, P = w(
+  ({
+    kOSMetadata: { experiencesMap: t },
+    list: n,
+    map: e,
+    resolver: s
+  }) => {
+    const [c, i] = x(), l = n.map((d) => d.namespace) || [], { t: r } = I([...new Set(l)]), h = c == null ? void 0 : c.experienceId, a = t[h], g = a == null ? void 0 : a.component, m = a == null ? void 0 : a.location, S = k(
+      (d) => {
+        const C = e[d];
+        i(C);
+      },
+      [e]
+    ), v = y(
+      () => n.map((d) => ({
+        ...d,
+        label: r(`${d.namespace}:${d.title}`, `"${d.title}"`)
+      })),
+      [n, r]
+    );
+    return /* @__PURE__ */ u(K, { children: [
+      /* @__PURE__ */ o(D, { items: v, onSelect: S }),
+      g && m && /* @__PURE__ */ o(
+        b,
+        {
+          component: g,
+          location: m,
+          resolver: s
+        }
+      )
+    ] });
+  }
+), R = p.div`
+  display: flex;
+  flex-direction: column;
+  gap: 32px;
+  padding: 24px;
+`, M = w(
+  ({
+    kOSMetadata: { experiencesMap: t },
+    list: n,
+    map: e,
+    showOpenButton: s = !0,
+    showCloseButton: c = !0,
+    resolver: i
+  }) => {
+    const [l, r] = x(), h = n.map((f) => f.namespace) || [], { t: a } = I([...new Set(h)]), g = l == null ? void 0 : l.experienceId, m = t[g], S = m == null ? void 0 : m.component, v = m == null ? void 0 : m.location, d = k(
+      (f) => {
+        const V = e[f];
+        r(V || null);
+      },
+      [e]
+    ), C = y(
+      () => n.map((f) => ({
+        ...f,
+        label: a(`${f.namespace}:${f.title}`, `"${f.title}"`)
+      })),
+      [n, a]
+    );
+    return /* @__PURE__ */ u(R, { children: [
+      /* @__PURE__ */ o(D, { items: C, onSelect: d }),
+      S && v && /* @__PURE__ */ o(O, { mode: "maximized", show: !0, children: /* @__PURE__ */ u(B, { children: [
+        /* @__PURE__ */ o(
+          $,
+          {
+            title: a(l.title, `"${l.title}"`),
+            showOpenButton: s,
+            showCloseButton: c,
+            onClose: () => {
+              d("");
+            }
+          }
+        ),
+        /* @__PURE__ */ o(
+          b,
+          {
+            component: S,
+            location: v,
+            resolver: i
+          }
+        )
+      ] }) })
+    ] });
+  }
+), W = p.div`
+  display: flex;
+  flex-direction: column;
+  gap: 32px;
+  padding: 24px;
+`, q = p.div`
+  display: flex;
+  flex-direction: column;
+  gap: 32px;
+`, N = ({
+  experiencesMap: t,
+  resolver: n,
+  setting: { experienceId: e, id: s, namespace: c, title: i }
+}) => {
+  const { t: l } = I(c), r = t[e], h = r == null ? void 0 : r.component, a = r == null ? void 0 : r.location;
+  return /* @__PURE__ */ u(j, { children: [
+    /* @__PURE__ */ o(L, { children: l(i, `"${i}"`) }),
+    /* @__PURE__ */ o(
+      b,
+      {
+        component: h,
+        location: a,
+        resolver: n
+      },
+      s
+    )
+  ] });
+}, Q = ({ experiencesMap: t, group: n, resolver: e }) => /* @__PURE__ */ o(q, { children: n.map((s) => /* @__PURE__ */ o(
+  N,
+  {
+    experiencesMap: t,
+    resolver: e,
+    setting: s
+  },
+  s.settingsGroup
+)) }), X = ({
+  kOSMetadata: { experiencesMap: t },
+  list: n,
+  resolver: e
+}) => {
+  const s = y(() => {
+    const i = {};
+    return n.forEach((l) => {
+      i[l.settingsGroup] || (i[l.settingsGroup] = []), i[l.settingsGroup].push(l);
+    }), i;
+  }, [n]), c = y(
+    () => Object.keys(s).map((i) => ({
+      id: i,
+      label: i,
+      content: /* @__PURE__ */ o(
+        Q,
+        {
+          experiencesMap: t,
+          group: s[i],
+          resolver: e
+        }
+      )
+    })),
+    [t, s, e]
+  );
+  return /* @__PURE__ */ o(W, { children: /* @__PURE__ */ o(A, { tabs: c }) });
+}, Y = p.div`
+  display: flex;
+  flex-direction: column;
+  gap: 32px;
+  padding: 24px;
+`, J = w(
+  ({
+    kOSMetadata: { experiencesMap: t },
+    list: n,
+    map: e,
+    resolver: s
+  }) => {
+    const [c, i] = x(), l = n.map((d) => d.namespace) || [], { t: r } = I([...new Set(l)]), h = c == null ? void 0 : c.experienceId, a = t[h], g = a == null ? void 0 : a.component, m = a == null ? void 0 : a.location, S = k(
+      (d) => {
+        const C = e[d];
+        i(C || null);
+      },
+      [e]
+    ), v = y(
+      () => n.map((d) => ({
+        ...d,
+        label: r(`${d.namespace}:${d.title}`, `"${d.title}"`)
+      })),
+      [n, r]
+    );
+    return /* @__PURE__ */ u(Y, { children: [
+      /* @__PURE__ */ o(D, { items: v, onSelect: S }),
+      g && m && /* @__PURE__ */ o(
+        b,
+        {
+          component: g,
+          location: m,
+          resolver: s,
+          props: { onComplete: S }
+        }
+      )
+    ] });
+  }
+), tt = {
+  cui: (t) => /* @__PURE__ */ o(M, { ...t, showOpenButton: !1 }),
+  utilities: J,
+  setupStep: M,
+  settings: (t) => /* @__PURE__ */ o(X, { baseRoute: "settings", ...t })
+}, St = w(({ kOSJSON: t, resolver: n }) => {
+  const e = y(() => F(t), [t]), s = y(
+    () => Object.keys(e.contributes).filter(
+      (c) => Array.isArray(e.contributes[c]) && e.contributes[c].length
+    ).map((c) => {
+      const i = tt[c] || P;
+      return {
+        id: c,
+        label: c,
+        content: /* @__PURE__ */ o(
+          i,
+          {
+            kOSMetadata: e,
+            list: e[`${c}List`],
+            map: e[`${c}Map`],
+            resolver: n
+          },
+          c
+        )
+      };
+    }),
+    []
+  );
+  return /* @__PURE__ */ o(U, { baseRoute: "", tabs: s });
+}), nt = p.div`
+  display: flex;
+  flex-direction: column;
+  gap: 32px;
+  width: 100%;
+`, vt = ({
+  kOSMetadata: { defaultExperienceId: t, experienceList: n, experienceMap: e },
+  resolver: s
+}) => {
+  const [c, i] = x(t), l = e[c].component, r = e[c].location, h = k((a) => {
+    i(a);
+  }, []);
+  return /* @__PURE__ */ u(nt, { children: [
+    /* @__PURE__ */ o(
+      Z,
+      {
+        label: "Experience",
+        items: n,
+        selectedItemId: c,
+        cancelButtonLabel: "Cancel",
+        proceedButtonLabel: "Select",
+        onSave: h,
+        displayValue: l
+      }
+    ),
+    /* @__PURE__ */ o(
+      b,
+      {
+        component: l,
+        location: r,
+        resolver: s
+      }
+    )
+  ] });
+}, ot = "data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20id='kos_logo_full'%20data-name='kos_logo_full'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2041.58%2016.95'%20fill='%23fff'%3e%3cpath%20d='m21.49,12.39c-.7-.38-1.25-.91-1.64-1.59-.4-.68-.59-1.45-.59-2.32s.2-1.64.59-2.32c.4-.68.94-1.21,1.64-1.59.7-.38,1.49-.57,2.38-.57s1.68.19,2.38.57c.7.38,1.25.91,1.64,1.59.4.68.59,1.45.59,2.32s-.2,1.64-.59,2.32c-.4.68-.94,1.21-1.64,1.59-.7.38-1.49.57-2.38.57s-1.68-.19-2.38-.57Zm3.76-1.49c.4-.24.72-.56.95-.98.23-.42.34-.9.34-1.43s-.11-1.01-.34-1.43c-.23-.42-.54-.75-.95-.98-.4-.24-.86-.35-1.37-.35s-.97.12-1.37.35c-.4.24-.72.56-.95.98-.23.42-.34.9-.34,1.43s.11,1.01.34,1.43c.23.42.54.75.95.98.4.24.86.35,1.37.35s.97-.12,1.37-.35Zm6.34,1.67c-.73-.24-1.32-.56-1.76-.98l1.16-1.42c.81.72,1.77,1.08,2.89,1.08.51,0,.92-.1,1.24-.29.31-.19.47-.43.47-.71,0-.21-.09-.38-.28-.53-.18-.14-.5-.26-.94-.35l-1.84-.35c-.8-.15-1.4-.43-1.79-.83-.4-.4-.59-.91-.59-1.51,0-.54.16-1.02.47-1.42.32-.4.76-.71,1.32-.93s1.2-.32,1.91-.32c.67,0,1.32.1,1.93.29s1.15.49,1.6.9l-1.08,1.38c-.76-.62-1.6-.92-2.51-.92-.49,0-.89.08-1.22.25-.32.17-.49.38-.49.64,0,.17.08.32.25.44.16.13.48.24.94.32l1.7.31c.85.16,1.49.46,1.91.91.43.44.64.97.64,1.59,0,.55-.15,1.04-.44,1.46s-.71.75-1.25.98-1.17.35-1.88.35c-.86,0-1.65-.12-2.38-.35ZM41.5,1c0-.55-.46-1-1.01-1H1C.45,0,0,.45,0,1v14.95c0,.55.45,1,1,1h15.2v-.02s.06.02.1.02h24.29c.55,0,1-.45.99-1l-.08-14.95Zm-25.21,14.95l-.09-14.95h24.3s.09,14.95.09,14.95h-24.3Zm-8.34-7.1l-1.66,1.64v2.32h-1.88V4.16h1.88v4.09l4.1-4.09h2.27l-3.42,3.4,3.62,5.24h-2.23l-2.69-3.96Z'%20/%3e%3c/svg%3e", et = p.div`
+  background-color: var(--ddk-component-top-navigation-background-color);
+  color: var(--ddk-component-top-navigation-color);
+`, ct = p.div`
+  padding: var(--ddk-component-top-navigation-padding);
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+`, st = p.div`
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  gap: 16px;
+`, it = p.div`
+  width: 100px;
+`, at = p.h1`
+  font-size: 16px;
+`, lt = () => y(() => [
+  // { children: 'Develop', to: '/develop' }
+], []), rt = () => {
+  const t = lt();
+  return /* @__PURE__ */ o(et, { children: /* @__PURE__ */ o(z, { children: /* @__PURE__ */ u(ct, { children: [
+    /* @__PURE__ */ u(st, { children: [
+      /* @__PURE__ */ o(it, { children: /* @__PURE__ */ o("img", { alt: "kOS logo", src: ot }) }),
+      /* @__PURE__ */ o(at, { children: "Welcome to kOS" })
+    ] }),
+    /* @__PURE__ */ o(H, { items: t })
+  ] }) }) });
+}, dt = p.div`
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  height: 100vh;
+`, pt = p.div`
+  display: flex;
+  flex-direction: column;
+  overflow-y: auto;
+`, Ct = w(({ children: t }) => /* @__PURE__ */ u(dt, { children: [
+  /* @__PURE__ */ o(rt, {}),
+  /* @__PURE__ */ o(pt, { children: t })
+] })), xt = ({ children: t }) => {
+  const { componentModeOverride: n } = E();
+  return /* @__PURE__ */ o(
+    O,
+    {
+      contain: n !== "compact",
+      mode: "maximized",
+      show: !0,
+      children: /* @__PURE__ */ u(B, { children: [
+        /* @__PURE__ */ o(
+          $,
+          {
+            CloseButton: n === "compact" ? G : void 0,
+            contain: n === "compact",
+            showCloseButton: !0,
+            showOpenButton: !1,
+            title: "CUI"
+          }
+        ),
+        t
+      ] })
+    }
+  );
+}, wt = ({ children: t }) => t, bt = ({
+  children: t
+}) => /* @__PURE__ */ u(j, { children: [
+  /* @__PURE__ */ o(L, { children: "Setting" }),
+  t
+] }), kt = ({
+  children: t
+}) => {
+  const { componentModeOverride: n } = E();
+  return /* @__PURE__ */ o(
+    O,
+    {
+      contain: n !== "compact",
+      mode: "maximized",
+      show: !0,
+      children: /* @__PURE__ */ u(B, { children: [
+        /* @__PURE__ */ o(
+          $,
+          {
+            CloseButton: n === "compact" ? G : void 0,
+            contain: n === "compact",
+            showCloseButton: !0,
+            showOpenButton: !0,
+            title: "Setup Step"
+          }
+        ),
+        t
+      ] })
+    }
+  );
+}, It = ({
+  children: t
+}) => t;
+export {
+  xt as CUIStoryContainer,
+  b as DynamicComponentView,
+  St as DynamicContainer,
+  P as DynamicViewBasic,
+  M as DynamicViewModal,
+  vt as DynamicViewPicker,
+  X as DynamicViewSettings,
+  J as DynamicViewUtilities,
+  rt as Header,
+  wt as NavStoryContainer,
+  bt as SettingStoryContainer,
+  kt as SetupStepStoryContainer,
+  Ct as Shell,
+  It as UtilityStoryContainer,
+  F as parse
+};
+//# sourceMappingURL=dev.js.map

package/dev.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dev.js","sources":["../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/dynamic-view/dynamic-component-view.tsx","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/utils/normalize.ts","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/utils/kos-metadata-parser.ts","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/dynamic-view/dynamic-view-basic.tsx","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/dynamic-view/dynamic-view-modal.tsx","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/dynamic-view/dynamic-view-settings.tsx","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/dynamic-view/dynamic-view-utilities.tsx","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/dynamic-view/dynamic-container.tsx","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/dynamic-view/dynamic-view-picker.tsx","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/shell/header/kos-logo.svg","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/shell/header/header.tsx","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/shell/shell.tsx","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/storybook/cui-story-container/cui-story-container.tsx","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/storybook/nav-story-container/nav-story-container.tsx","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/storybook/setting-story-container/setting-story-container.tsx","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/storybook/setup-step-story-container/setup-step-story-container.tsx","../../../../packages/sdk/kos-ui-plugin/src/lib/dev/components/storybook/utility-story-container/utility-story-container.tsx"],"sourcesContent":["import { ElementType, useEffect, useState } from \"react\";\n\ninterface DynamicComponentViewProps {\n  component: string;\n  location: string;\n  resolver: (location: string) => any;\n  props?: any;\n}\n\nexport const DynamicComponentView = ({\n  component,\n  location,\n  resolver,\n  props,\n}: DynamicComponentViewProps) => {\n  const [Component, setComponent] = useState<ElementType>();\n\n  useEffect(() => {\n    const load = async () => {\n      const result = await resolver(location);\n\n      setComponent(result[component]);\n    };\n\n    load();\n  }, [component, location, resolver]);\n\n  return Component ? <Component {...props} /> : null;\n};\n","export const normalize = (json: any): Record<string, any> =>\n  Object.entries(json).reduce((parsed: Record<string, any>, [key, value]) => {\n    if (Array.isArray(value) || (typeof value === \"object\" && value !== null)) {\n      const listKey = `${key}List`;\n      const mapKey = `${key}Map`;\n\n      const list: any[] = [];\n      const map: Record<string, any> = {};\n\n      const items = Array.isArray(value) ? value : Object.values(value);\n      items.forEach((item) => {\n        const data = { ...item, label: item.title };\n        list.push(data);\n        map[data.id] = data;\n      });\n\n      parsed[listKey] = list;\n      parsed[mapKey] = map;\n    }\n\n    return parsed;\n  }, {});\n","import { normalize } from \"./normalize\";\n\nexport interface KOSMetadata {\n  json: any;\n  [key: string]: any;\n}\n\nexport const parse = (json: any): KOSMetadata => {\n  const contributes = json.kosdev.ddk.ncui.plugin.contributes;\n\n  const parsed: Record<string, any> = normalize(contributes);\n\n  return {\n    ...parsed,\n    contributes,\n    json,\n  };\n};\n","import styled from \"@emotion/styled\";\nimport { CardButtonGrid } from \"@kosdev-code/kos-ddk-components\";\nimport { useCallback, useMemo, useState } from \"react\";\nimport { KOSMetadata } from \"../../utils\";\nimport { DynamicComponentView } from \"./dynamic-component-view\";\nimport { kosComponent, useKosTranslation } from \"@kosdev-code/kos-ui-sdk\";\n\nconst DynamicViewBasicContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  gap: 32px;\n  padding: 24px;\n`;\n\ninterface DynamicViewBasicProps {\n  kOSMetadata: KOSMetadata;\n  list: any[];\n  map: Record<string, any>;\n  resolver: (location: string) => any;\n}\n\nexport const DynamicViewBasic = kosComponent(\n  ({\n    kOSMetadata: { experiencesMap },\n    list,\n    map,\n    resolver,\n  }: DynamicViewBasicProps) => {\n    const [selectedItem, setSelectedItem] = useState<any>();\n\n    const namespaces = list.map((ext) => ext.namespace) || [];\n    const { t } = useKosTranslation([...new Set(namespaces)]);\n\n    const selectedExperienceID = selectedItem?.experienceId;\n    const experience = experiencesMap[selectedExperienceID];\n    const component = experience?.component;\n    const location = experience?.location;\n\n    const select = useCallback(\n      (itemID: string) => {\n        const item = map[itemID];\n\n        setSelectedItem(item);\n      },\n      [map]\n    );\n\n    const translatedList = useMemo(\n      () =>\n        list.map((item) => {\n          return {\n            ...item,\n            label: t(`${item.namespace}:${item.title}`, `\"${item.title}\"`),\n          };\n        }),\n      [list, t]\n    );\n\n    return (\n      <DynamicViewBasicContainer>\n        <CardButtonGrid items={translatedList} onSelect={select} />\n\n        {component && location && (\n          <DynamicComponentView\n            component={component}\n            location={location}\n            resolver={resolver}\n          />\n        )}\n      </DynamicViewBasicContainer>\n    );\n  }\n);\n","import styled from \"@emotion/styled\";\nimport { CardButtonGrid, Header, Modal } from \"@kosdev-code/kos-ddk-components\";\nimport { kosComponent, useKosTranslation } from \"@kosdev-code/kos-ui-sdk\";\nimport { useCallback, useMemo, useState } from \"react\";\nimport { KOSMetadata } from \"../../utils\";\nimport { DynamicComponentView } from \"./dynamic-component-view\";\n\nconst DynamicViewModalContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  gap: 32px;\n  padding: 24px;\n`;\n\ninterface DynamicViewModalProps {\n  kOSMetadata: KOSMetadata;\n  list: any[];\n  map: Record<string, any>;\n  showOpenButton?: boolean;\n  showCloseButton?: boolean;\n  resolver: (location: string) => any;\n}\n\nexport const DynamicViewModal = kosComponent(\n  ({\n    kOSMetadata: { experiencesMap },\n    list,\n    map,\n    showOpenButton = true,\n    showCloseButton = true,\n    resolver,\n  }: DynamicViewModalProps) => {\n    const [selectedItem, setSelectedItem] = useState<any>();\n\n    const namespaces = list.map((ext) => ext.namespace) || [];\n    const { t } = useKosTranslation([...new Set(namespaces)]);\n\n    const selectedExperienceID = selectedItem?.experienceId;\n    const experience = experiencesMap[selectedExperienceID];\n    const component = experience?.component;\n    const location = experience?.location;\n\n    const select = useCallback(\n      (itemID: string) => {\n        const item = map[itemID];\n\n        if (item) {\n          setSelectedItem(item);\n        } else {\n          setSelectedItem(null);\n        }\n      },\n      [map]\n    );\n\n    const translatedList = useMemo(\n      () =>\n        list.map((item) => {\n          return {\n            ...item,\n            label: t(`${item.namespace}:${item.title}`, `\"${item.title}\"`),\n          };\n        }),\n      [list, t]\n    );\n\n    return (\n      <DynamicViewModalContainer>\n        <CardButtonGrid items={translatedList} onSelect={select} />\n\n        {component && location && (\n          <Modal mode=\"maximized\" show={true}>\n            <>\n              <Header\n                title={t(selectedItem.title, `\"${selectedItem.title}\"`)}\n                showOpenButton={showOpenButton}\n                showCloseButton={showCloseButton}\n                onClose={() => {\n                  select(\"\");\n                }}\n              />\n              <DynamicComponentView\n                component={component}\n                location={location}\n                resolver={resolver}\n              />\n            </>\n          </Modal>\n        )}\n      </DynamicViewModalContainer>\n    );\n  }\n);\n","import styled from \"@emotion/styled\";\nimport {\n  SettingsSubheading,\n  TabContainer,\n  Tabs,\n} from \"@kosdev-code/kos-ddk-components\";\nimport { useKosTranslation } from \"@kosdev-code/kos-ui-sdk\";\nimport { useMemo } from \"react\";\nimport type { SettingsDefinition } from \"../../../../types/global\";\nimport { KOSMetadata } from \"../../utils\";\nimport { DynamicComponentView } from \"./dynamic-component-view\";\n\nconst DynamicViewSettingsContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  gap: 32px;\n  padding: 24px;\n`;\n\nconst GroupContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  gap: 32px;\n`;\n\ninterface Setting {\n  id: string;\n  title: string;\n  namespace: string;\n  settingsGroup: string;\n  experienceId: string;\n}\n\ninterface SettingsViewProps {\n  experiencesMap: any;\n  resolver: (location: string) => any;\n  setting: Setting;\n}\n\nconst SettingView = ({\n  experiencesMap,\n  resolver,\n  setting: { experienceId, id, namespace, title },\n}: SettingsViewProps) => {\n  const { t } = useKosTranslation(namespace);\n\n  const experience = experiencesMap[experienceId];\n  const component = experience?.component;\n  const location = experience?.location;\n\n  return (\n    <TabContainer>\n      <SettingsSubheading>{t(title, `\"${title}\"`)}</SettingsSubheading>\n      <DynamicComponentView\n        key={id}\n        component={component}\n        location={location}\n        resolver={resolver}\n      />\n    </TabContainer>\n  );\n};\n\ninterface GroupViewProps {\n  experiencesMap: any;\n  group: Setting[];\n  resolver: (location: string) => any;\n}\n\nconst GroupView = ({ experiencesMap, group, resolver }: GroupViewProps) => (\n  <GroupContainer>\n    {group.map((setting) => (\n      <SettingView\n        key={setting.settingsGroup}\n        experiencesMap={experiencesMap}\n        resolver={resolver}\n        setting={setting}\n      />\n    ))}\n  </GroupContainer>\n);\n\ninterface DynamicViewSettingsProps {\n  kOSMetadata: KOSMetadata;\n  list: SettingsDefinition[];\n  map: Record<string, any>;\n  showOpenButton?: boolean;\n  showCloseButton?: boolean;\n  baseRoute?: string;\n  resolver: (location: string) => any;\n}\n\nexport const DynamicViewSettings = ({\n  kOSMetadata: { experiencesMap },\n  list,\n\n  resolver,\n}: DynamicViewSettingsProps) => {\n  const groups = useMemo(() => {\n    const groups: Record<string, any> = {};\n\n    list.forEach((item) => {\n      if (!groups[item.settingsGroup]) {\n        groups[item.settingsGroup] = [];\n      }\n\n      groups[item.settingsGroup].push(item);\n    });\n\n    return groups;\n  }, [list]);\n\n  const tabs = useMemo(\n    () =>\n      Object.keys(groups).map((groupName) => {\n        return {\n          id: groupName,\n          label: groupName,\n          content: (\n            <GroupView\n              experiencesMap={experiencesMap}\n              group={groups[groupName]}\n              resolver={resolver}\n            />\n          ),\n        };\n      }),\n    [experiencesMap, groups, resolver]\n  );\n\n  return (\n    <DynamicViewSettingsContainer>\n      <Tabs tabs={tabs} />\n    </DynamicViewSettingsContainer>\n  );\n};\n","import styled from \"@emotion/styled\";\nimport { CardButtonGrid } from \"@kosdev-code/kos-ddk-components\";\nimport { useCallback, useMemo, useState } from \"react\";\nimport { KOSMetadata } from \"../../utils\";\nimport { DynamicComponentView } from \"./dynamic-component-view\";\nimport { kosComponent, useKosTranslation } from \"@kosdev-code/kos-ui-sdk\";\n\nconst DynamicViewUtilitiesContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  gap: 32px;\n  padding: 24px;\n`;\n\ninterface DynamicViewUtilitiesProps {\n  kOSMetadata: KOSMetadata;\n  list: any[];\n  map: Record<string, any>;\n  showOpenButton?: boolean;\n  showCloseButton?: boolean;\n  resolver: (location: string) => any;\n}\n\nexport const DynamicViewUtilities = kosComponent(\n  ({\n    kOSMetadata: { experiencesMap },\n    list,\n    map,\n    resolver,\n  }: DynamicViewUtilitiesProps) => {\n    const [selectedItem, setSelectedItem] = useState<any>();\n\n    const namespaces = list.map((ext) => ext.namespace) || [];\n    const { t } = useKosTranslation([...new Set(namespaces)]);\n\n    const selectedExperienceID = selectedItem?.experienceId;\n    const experience = experiencesMap[selectedExperienceID];\n    const component = experience?.component;\n    const location = experience?.location;\n\n    const select = useCallback(\n      (itemID: string) => {\n        const item = map[itemID];\n\n        if (item) {\n          setSelectedItem(item);\n        } else {\n          setSelectedItem(null);\n        }\n      },\n      [map]\n    );\n\n    const translatedList = useMemo(\n      () =>\n        list.map((item) => {\n          return {\n            ...item,\n            label: t(`${item.namespace}:${item.title}`, `\"${item.title}\"`),\n          };\n        }),\n      [list, t]\n    );\n\n    return (\n      <DynamicViewUtilitiesContainer>\n        <CardButtonGrid items={translatedList} onSelect={select} />\n\n        {component && location && (\n          <DynamicComponentView\n            component={component}\n            location={location}\n            resolver={resolver}\n            props={{ onComplete: select }}\n          />\n        )}\n      </DynamicViewUtilitiesContainer>\n    );\n  }\n);\n","import { TabRouter } from \"@kosdev-code/kos-ddk-components\";\nimport { kosComponent } from \"@kosdev-code/kos-ui-sdk\";\nimport { useMemo } from \"react\";\nimport { parse } from \"../../utils\";\nimport { DynamicViewBasic } from \"./dynamic-view-basic\";\nimport { DynamicViewModal } from \"./dynamic-view-modal\";\nimport { DynamicViewSettings } from \"./dynamic-view-settings\";\nimport { DynamicViewUtilities } from \"./dynamic-view-utilities\";\n\nconst contentComponentMap: Record<string, any> = {\n  cui: (props: any) => <DynamicViewModal {...props} showOpenButton={false} />,\n  utilities: DynamicViewUtilities,\n  setupStep: DynamicViewModal,\n  settings: (props: any) => (\n    <DynamicViewSettings baseRoute=\"settings\" {...props} />\n  ),\n};\n\ninterface DynamicContainerProps {\n  kOSJSON: any;\n  resolver: (location: string) => any;\n}\n\nexport const DynamicContainer: React.FunctionComponent<DynamicContainerProps> =\n  kosComponent(({ kOSJSON, resolver }) => {\n    const kOSMetadata = useMemo(() => parse(kOSJSON), [kOSJSON]);\n\n    const tabs = useMemo(\n      () =>\n        Object.keys(kOSMetadata.contributes)\n          .filter(\n            (key) =>\n              Array.isArray(kOSMetadata.contributes[key]) &&\n              kOSMetadata.contributes[key].length\n          )\n          .map((key) => {\n            const Component = contentComponentMap[key] || DynamicViewBasic;\n\n            return {\n              id: key,\n              label: key,\n              content: (\n                <Component\n                  key={key}\n                  kOSMetadata={kOSMetadata}\n                  list={kOSMetadata[`${key}List`]}\n                  map={kOSMetadata[`${key}Map`]}\n                  resolver={resolver}\n                />\n              ),\n            };\n          }),\n      []\n    );\n\n    return <TabRouter baseRoute=\"\" tabs={tabs} />;\n  });\n","import styled from \"@emotion/styled\";\nimport { PickerCard } from \"@kosdev-code/kos-ddk-components\";\nimport { useCallback, useState } from \"react\";\nimport { DynamicComponentView } from \"./dynamic-component-view\";\nimport { KOSMetadata } from \"../../utils\";\n\nconst DynamicViewPickerContainer = styled.div`\n  display: flex;\n  flex-direction: column;\n  gap: 32px;\n  width: 100%;\n`;\n\ninterface DynamicViewPickerProps {\n  kOSMetadata: KOSMetadata;\n  resolver: (location: string) => any;\n}\n\nexport const DynamicViewPicker = ({\n  kOSMetadata: { defaultExperienceId, experienceList, experienceMap },\n  resolver,\n}: DynamicViewPickerProps) => {\n  const [selectedExperienceID, setSelectedExperienceID] =\n    useState(defaultExperienceId);\n\n  const component = experienceMap[selectedExperienceID].component;\n  const location = experienceMap[selectedExperienceID].location;\n\n  const save = useCallback((experienceID: string) => {\n    setSelectedExperienceID(experienceID);\n  }, []);\n\n  return (\n    <DynamicViewPickerContainer>\n      <PickerCard\n        label=\"Experience\"\n        items={experienceList}\n        selectedItemId={selectedExperienceID}\n        cancelButtonLabel=\"Cancel\"\n        proceedButtonLabel=\"Select\"\n        onSave={save}\n        displayValue={component}\n      />\n\n      <DynamicComponentView\n        component={component}\n        location={location}\n        resolver={resolver}\n      />\n    </DynamicViewPickerContainer>\n  );\n};\n","export default \"data:image/svg+xml,%3c?xml%20version='1.0'%20encoding='UTF-8'?%3e%3csvg%20id='kos_logo_full'%20data-name='kos_logo_full'%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2041.58%2016.95'%20fill='%23fff'%3e%3cpath%20d='m21.49,12.39c-.7-.38-1.25-.91-1.64-1.59-.4-.68-.59-1.45-.59-2.32s.2-1.64.59-2.32c.4-.68.94-1.21,1.64-1.59.7-.38,1.49-.57,2.38-.57s1.68.19,2.38.57c.7.38,1.25.91,1.64,1.59.4.68.59,1.45.59,2.32s-.2,1.64-.59,2.32c-.4.68-.94,1.21-1.64,1.59-.7.38-1.49.57-2.38.57s-1.68-.19-2.38-.57Zm3.76-1.49c.4-.24.72-.56.95-.98.23-.42.34-.9.34-1.43s-.11-1.01-.34-1.43c-.23-.42-.54-.75-.95-.98-.4-.24-.86-.35-1.37-.35s-.97.12-1.37.35c-.4.24-.72.56-.95.98-.23.42-.34.9-.34,1.43s.11,1.01.34,1.43c.23.42.54.75.95.98.4.24.86.35,1.37.35s.97-.12,1.37-.35Zm6.34,1.67c-.73-.24-1.32-.56-1.76-.98l1.16-1.42c.81.72,1.77,1.08,2.89,1.08.51,0,.92-.1,1.24-.29.31-.19.47-.43.47-.71,0-.21-.09-.38-.28-.53-.18-.14-.5-.26-.94-.35l-1.84-.35c-.8-.15-1.4-.43-1.79-.83-.4-.4-.59-.91-.59-1.51,0-.54.16-1.02.47-1.42.32-.4.76-.71,1.32-.93s1.2-.32,1.91-.32c.67,0,1.32.1,1.93.29s1.15.49,1.6.9l-1.08,1.38c-.76-.62-1.6-.92-2.51-.92-.49,0-.89.08-1.22.25-.32.17-.49.38-.49.64,0,.17.08.32.25.44.16.13.48.24.94.32l1.7.31c.85.16,1.49.46,1.91.91.43.44.64.97.64,1.59,0,.55-.15,1.04-.44,1.46s-.71.75-1.25.98-1.17.35-1.88.35c-.86,0-1.65-.12-2.38-.35ZM41.5,1c0-.55-.46-1-1.01-1H1C.45,0,0,.45,0,1v14.95c0,.55.45,1,1,1h15.2v-.02s.06.02.1.02h24.29c.55,0,1-.45.99-1l-.08-14.95Zm-25.21,14.95l-.09-14.95h24.3s.09,14.95.09,14.95h-24.3Zm-8.34-7.1l-1.66,1.64v2.32h-1.88V4.16h1.88v4.09l4.1-4.09h2.27l-3.42,3.4,3.62,5.24h-2.23l-2.69-3.96Z'%20/%3e%3c/svg%3e\"","import styled from \"@emotion/styled\";\nimport {\n  Container,\n  TopNavigationButtonList,\n} from \"@kosdev-code/kos-ddk-components\";\nimport { ReactNode, useMemo } from \"react\";\nimport kosLogo from \"./kos-logo.svg\";\n\nconst HeaderStyles = styled.div`\n  background-color: var(--ddk-component-top-navigation-background-color);\n  color: var(--ddk-component-top-navigation-color);\n`;\n\nconst ContainerStyles = styled.div`\n  padding: var(--ddk-component-top-navigation-padding);\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n`;\n\nconst LogoContainerStyles = styled.div`\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  gap: 16px;\n`;\n\nconst LogoStyles = styled.div`\n  width: 100px;\n`;\n\nconst TitleStyles = styled.h1`\n  font-size: 16px;\n`;\n\nconst useNavigationItems = () => {\n  const navigationItems = useMemo(() => {\n    const navigationItems: { children: ReactNode; to: string }[] = [\n      // { children: 'Develop', to: '/develop' }\n    ];\n\n    return navigationItems;\n  }, []);\n\n  return navigationItems;\n};\n\nexport const Header = () => {\n  const navigationItems = useNavigationItems();\n\n  return (\n    <HeaderStyles>\n      <Container>\n        <ContainerStyles>\n          <LogoContainerStyles>\n            <LogoStyles>\n              <img alt=\"kOS logo\" src={kosLogo} />\n            </LogoStyles>\n            <TitleStyles>Welcome to kOS</TitleStyles>\n          </LogoContainerStyles>\n          <TopNavigationButtonList items={navigationItems} />\n        </ContainerStyles>\n      </Container>\n    </HeaderStyles>\n  );\n};\n","import styled from \"@emotion/styled\";\nimport { kosComponent } from \"@kosdev-code/kos-ui-sdk\";\nimport { ReactNode } from \"react\";\nimport { Header } from \"./header\";\n\nconst Container = styled.div`\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  height: 100vh;\n`;\n\nconst Body = styled.div`\n  display: flex;\n  flex-direction: column;\n  overflow-y: auto;\n`;\n\ninterface ShellProps {\n  children: ReactNode;\n}\n\nexport const Shell = kosComponent(({ children }: ShellProps) => (\n  <Container>\n    <Header />\n    <Body>{children}</Body>\n  </Container>\n));\n","import {\n  BackButton,\n  Header,\n  Modal,\n  useComponentConfigurationContext,\n} from \"@kosdev-code/kos-ddk-components\";\nimport type { ReactNode } from \"react\";\n\ninterface CUIStoryContainerProps {\n  children: ReactNode;\n}\n\nexport const CUIStoryContainer = ({ children }: CUIStoryContainerProps) => {\n  const { componentModeOverride } = useComponentConfigurationContext();\n\n  return (\n    <Modal\n      contain={componentModeOverride !== \"compact\"}\n      mode=\"maximized\"\n      show={true}\n    >\n      <>\n        <Header\n          CloseButton={\n            componentModeOverride === \"compact\" ? BackButton : undefined\n          }\n          contain={componentModeOverride === \"compact\"}\n          showCloseButton={true}\n          showOpenButton={false}\n          title=\"CUI\"\n        />\n        {children}\n      </>\n    </Modal>\n  );\n};\n","import type { ReactNode } from \"react\";\n\ninterface NavStoryContainerProps {\n  children: ReactNode;\n}\n\nexport const NavStoryContainer = ({ children }: NavStoryContainerProps) =>\n  children;\n","import {\n  SettingsSubheading,\n  TabContainer,\n} from \"@kosdev-code/kos-ddk-components\";\nimport type { ReactNode } from \"react\";\n\ninterface SettingStoryContainerProps {\n  children: ReactNode;\n}\n\nexport const SettingStoryContainer = ({\n  children,\n}: SettingStoryContainerProps) => (\n  <TabContainer>\n    <SettingsSubheading>Setting</SettingsSubheading>\n    {children}\n  </TabContainer>\n);\n","import {\n  BackButton,\n  Header,\n  Modal,\n  useComponentConfigurationContext,\n} from \"@kosdev-code/kos-ddk-components\";\nimport type { ReactNode } from \"react\";\n\ninterface SetupStepStoryContainerProps {\n  children: ReactNode;\n}\n\nexport const SetupStepStoryContainer = ({\n  children,\n}: SetupStepStoryContainerProps) => {\n  const { componentModeOverride } = useComponentConfigurationContext();\n\n  return (\n    <Modal\n      contain={componentModeOverride !== \"compact\"}\n      mode=\"maximized\"\n      show={true}\n    >\n      <>\n        <Header\n          CloseButton={\n            componentModeOverride === \"compact\" ? BackButton : undefined\n          }\n          contain={componentModeOverride === \"compact\"}\n          showCloseButton={true}\n          showOpenButton={true}\n          title=\"Setup Step\"\n        />\n        {children}\n      </>\n    </Modal>\n  );\n};\n","import type { ReactNode } from \"react\";\n\ninterface UtilityStoryContainerProps {\n  children: ReactNode;\n}\n\nexport const UtilityStoryContainer = ({\n  children,\n}: UtilityStoryContainerProps) => children;\n"],"names":["DynamicComponentView","component","location","resolver","props","Component","setComponent","useState","useEffect","result","jsx","normalize","json","parsed","key","value","listKey","mapKey","list","map","item","data","parse","contributes","DynamicViewBasicContainer","styled","DynamicViewBasic","kosComponent","experiencesMap","selectedItem","setSelectedItem","namespaces","ext","t","useKosTranslation","selectedExperienceID","experience","select","useCallback","itemID","translatedList","useMemo","CardButtonGrid","DynamicViewModalContainer","DynamicViewModal","showOpenButton","showCloseButton","Modal","jsxs","Fragment","Header","DynamicViewSettingsContainer","GroupContainer","SettingView","experienceId","id","namespace","title","TabContainer","SettingsSubheading","GroupView","group","setting","DynamicViewSettings","groups","tabs","groupName","Tabs","DynamicViewUtilitiesContainer","DynamicViewUtilities","contentComponentMap","DynamicContainer","kOSJSON","kOSMetadata","TabRouter","DynamicViewPickerContainer","DynamicViewPicker","defaultExperienceId","experienceList","experienceMap","setSelectedExperienceID","save","experienceID","PickerCard","kosLogo","HeaderStyles","ContainerStyles","LogoContainerStyles","LogoStyles","TitleStyles","useNavigationItems","navigationItems","Container","TopNavigationButtonList","Body","Shell","children","CUIStoryContainer","componentModeOverride","useComponentConfigurationContext","BackButton","NavStoryContainer","SettingStoryContainer","SetupStepStoryContainer","UtilityStoryContainer"],"mappings":"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"}