chore: exclude local resource artifacts from main sync

src/app/main/pages/ApisPage.tsx

@@ -1,31 +1,45 @@
 import { Card, Typography } from 'antd';
+import { useMemo } from 'react';
+import { useLocation } from 'react-router-dom';
 import { ComponentSamplesLayout } from '../../../features/layout/component-sample-gallery';
 import { SampleWidgetsLayout } from '../../../features/layout/widget-sample-gallery';
 import { useMainLayoutContext } from '../layout/MainLayoutContext';
+import { readPreviewTargetDescriptorFromUrl } from '../previewRuntime';
 
 const { Paragraph } = Typography;
 const HIDDEN_COMPONENT_IDS = ['search-command-modal', 'window-ui'];
 
 export function ApisPage() {
+  const location = useLocation();
   const { selectedApiMenu, componentSampleEntries, widgetSampleEntries } = useMainLayoutContext();
+  const previewTarget = useMemo(() => readPreviewTargetDescriptorFromUrl(), [location.search]);
+  const isSingleWidgetPreview = selectedApiMenu === 'widgets' && previewTarget?.type === 'widget';
 
   return (
-    <div className="app-main-panel">
+    <div className={`app-main-panel${isSingleWidgetPreview ? ' app-main-panel--widget-preview' : ''}`}>
       <Card
         title={selectedApiMenu === 'components' ? 'APIs / Components' : 'APIs / Widgets'}
-        className="app-main-card"
+        className={`app-main-card${isSingleWidgetPreview ? ' app-main-card--widget-preview' : ''}`}
         bordered={false}
       >
-        <Paragraph className="app-main-copy">
-          {selectedApiMenu === 'components'
-            ? '공통 UI 컴포넌트 샘플과 확장 샘플을 확인합니다.'
-            : '공통 위젯 샘플을 확인합니다.'}
-        </Paragraph>
+        {isSingleWidgetPreview ? null : (
+          <Paragraph className="app-main-copy">
+            {selectedApiMenu === 'components'
+              ? '공통 UI 컴포넌트 샘플과 확장 샘플을 확인합니다.'
+              : '공통 위젯 샘플을 확인합니다.'}
+          </Paragraph>
+        )}
 
         {selectedApiMenu === 'components' ? (
           <ComponentSamplesLayout entries={componentSampleEntries} excludeComponentIds={HIDDEN_COMPONENT_IDS} />
         ) : (
-          <SampleWidgetsLayout entries={widgetSampleEntries} />
+          <SampleWidgetsLayout
+            entries={widgetSampleEntries}
+            includeComponentIds={isSingleWidgetPreview ? [previewTarget.componentId] : []}
+            includeSampleIds={isSingleWidgetPreview && previewTarget.sampleId ? [previewTarget.sampleId] : []}
+            disableWidgetCardWrapper={isSingleWidgetPreview}
+            singlePreviewMode={isSingleWidgetPreview}
+          />
         )}
       </Card>
     </div>

src/app/main/pages/PlayPage.tsx

@@ -1,37 +1,47 @@
-import { LayoutPlaygroundView } from '../../../views/play/LayoutPlaygroundView';
+import { useLocation } from 'react-router-dom';
+import { SampleWidgetsLayout } from '../../../features/layout/widget-sample-gallery';
 import { CbtPlayAppView } from '../../../views/play/apps/cbt/CbtPlayAppView';
 import { TestPlayAppView } from '../../../views/play/apps/test/TestPlayAppView';
-import { FeatureMenuLayoutPage } from '../../../features/layout/feature-menu';
-import { MemoLayoutPage } from '../../../features/layout/memo';
+import { LayoutPlaygroundView } from '../../../views/play/LayoutPlaygroundView';
 import { useMainLayoutContext } from '../layout/MainLayoutContext';
+import { readPreviewTargetDescriptorFromUrl } from '../previewRuntime';
 import { resolveSavedLayoutIdFromMenuKey } from '../routes';
+import { renderSavedLayoutContent } from '../../../features/layout/renderSavedLayoutContent';
 
 export function PlayPage() {
-  const { selectedPlayMenu, savedLayouts, setSavedLayouts } = useMainLayoutContext();
+  const location = useLocation();
+  const { selectedPlayMenu, savedLayouts, setSavedLayouts, widgetSampleEntries } = useMainLayoutContext();
   const selectedSavedLayoutId = resolveSavedLayoutIdFromMenuKey(selectedPlayMenu);
   const selectedSavedLayout = selectedSavedLayoutId
     ? savedLayouts.find((layout) => layout.id === selectedSavedLayoutId) ?? null
     : null;
-  const isMemoLayout = selectedSavedLayout?.name === '메모';
-  const isFeatureMenuLayout = selectedSavedLayout?.name === '기능설명 관리';
+  const previewTarget = readPreviewTargetDescriptorFromUrl();
+  const isWidgetPreview = selectedPlayMenu === 'cbt' && previewTarget?.type === 'widget';
   const panelClassName = selectedSavedLayoutId ? 'app-main-panel app-main-panel--play app-main-panel--play-saved' : 'app-main-panel app-main-panel--play';
 
   return (
     <div className={panelClassName}>
-      {selectedPlayMenu === 'layout' ? <LayoutPlaygroundView onSavedLayoutsChange={setSavedLayouts} /> : null}
-      {selectedPlayMenu === 'test' ? <TestPlayAppView /> : null}
-      {selectedPlayMenu === 'cbt' ? <CbtPlayAppView /> : null}
-      {selectedSavedLayoutId && isMemoLayout ? <MemoLayoutPage layoutId={selectedSavedLayoutId} /> : null}
-      {selectedSavedLayoutId && isFeatureMenuLayout ? (
-        <FeatureMenuLayoutPage
-          layoutId={selectedSavedLayoutId}
-          savedLayouts={savedLayouts}
-          onSavedLayoutsChange={setSavedLayouts}
+      {isWidgetPreview ? (
+        <SampleWidgetsLayout
+          key={location.search}
+          entries={widgetSampleEntries}
+          includeComponentIds={[previewTarget.componentId]}
+          includeSampleIds={previewTarget.sampleId ? [previewTarget.sampleId] : []}
+          disableWidgetCardWrapper
+          singlePreviewMode
         />
       ) : null}
-      {selectedSavedLayoutId && !isMemoLayout && !isFeatureMenuLayout ? (
-        <LayoutPlaygroundView savedLayoutViewId={selectedSavedLayoutId} onSavedLayoutsChange={setSavedLayouts} />
-      ) : null}
+      {selectedPlayMenu === 'layout' ? <LayoutPlaygroundView onSavedLayoutsChange={setSavedLayouts} /> : null}
+      {selectedPlayMenu === 'test' ? <TestPlayAppView /> : null}
+      {selectedPlayMenu === 'cbt' && !isWidgetPreview ? <CbtPlayAppView /> : null}
+      {selectedSavedLayoutId && selectedSavedLayout
+        ? renderSavedLayoutContent({
+            layoutId: selectedSavedLayoutId,
+            layout: selectedSavedLayout,
+            savedLayouts,
+            onSavedLayoutsChange: setSavedLayouts,
+          })
+        : null}
     </div>
   );
 }