@starodubenko/fsd-gen 0.1.0 → 1.0.0-0

package/templates/entity/model-ui-basic/Component.tsx

@@ -1,18 +1,29 @@
+import type { GeneratorContext } from '../../../src/config/types.js';
+
+export default (ctx: GeneratorContext) => {
+  const {
+      base: { baseName },
+      template: { componentName }
+  } = ctx;
+
+  return `
 import styled from '@emotion/styled';
 
-export const {{componentName}}Root = styled.div`
+export const ${componentName}Root = styled.div\`
   padding: 1rem;
   border: 1px solid #ccc;
-`;
+\`;
 
-export interface {{componentName}}Props {
+export interface ${componentName}Props {
   className?: string;
 }
 
-export const {{componentName}} = ({ className }: {{componentName}}Props) => {
+export const ${componentName} = ({ className }: ${componentName}Props) => {
   return (
-    <{{componentName}}Root className={className}>
-      {{componentName}} Entity
-    </{{componentName}}Root>
+    <${componentName}Root className={className}>
+      ${componentName} Entity
+    </${componentName}Root>
   );
 };
+`;
+};

package/templates/feature/ui-model-basic/Component.tsx

@@ -1,17 +1,28 @@
+import type { GeneratorContext } from '../../../src/config/types.js';
+
+export default (ctx: GeneratorContext) => {
+  const {
+      base: { baseName },
+      template: { componentName }
+  } = ctx;
+
+  return `
 import styled from '@emotion/styled';
 
-export const {{componentName}}Root = styled.div`
+export const ${componentName}Root = styled.div\`
   padding: 1rem;
-`;
+\`;
 
-export interface {{componentName}}Props {
+export interface ${componentName}Props {
   className?: string;
 }
 
-export const {{componentName}} = ({ className }: {{componentName}}Props) => {
+export const ${componentName} = ({ className }: ${componentName}Props) => {
   return (
-    <{{componentName}}Root className={className}>
-      Feature: {{componentName}}
-    </{{componentName}}Root>
+    <${componentName}Root className={className}>
+      Feature: ${componentName}
+    </${componentName}Root>
   );
 };
+`;
+};

package/templates/page/ui-basic/Component.tsx

@@ -1,17 +1,28 @@
+import type { GeneratorContext } from '../../../src/config/types.js';
+
+export default (ctx: GeneratorContext) => {
+  const {
+      base: { baseName },
+      template: { componentName }
+  } = ctx;
+
+  return `
 import styled from '@emotion/styled';
 
-export const {{componentName}}Root = styled.div`
+export const ${componentName}Root = styled.div\`
   min-height: 100vh;
-`;
+\`;
 
-export interface {{componentName}}Props {
+export interface ${componentName}Props {
   className?: string;
 }
 
-export const {{componentName}} = ({ className }: {{componentName}}Props) => {
+export const ${componentName} = ({ className }: ${componentName}Props) => {
   return (
-    <{{componentName}}Root className={className}>
-      <h1>Page: {{componentName}}</h1>
-    </{{componentName}}Root>
+    <${componentName}Root className={className}>
+      <h1>Page: ${componentName}</h1>
+    </${componentName}Root>
   );
 };
+`;
+};

package/templates/preset/table/entity/model.ts

@@ -1,9 +1,15 @@
-export interface { { componentName } } {
+import type { GeneratorContext } from '../../../../src/config/types.js';
+
+export default (ctx: GeneratorContext) => {
+    const { base: { baseName } } = ctx;
+    return `export interface ${baseName} {
     id: string;
     name: string;
 }
 
-export const mock{{ componentName }}Data: { { componentName } } [] = [
-    { id: '1', name: 'Test {{componentName}} 1' },
-    { id: '2', name: 'Test {{componentName}} 2' },
+export const mock${baseName}Data: ${baseName}[] = [
+    { id: '1', name: 'Test ${baseName} 1' },
+    { id: '2', name: 'Test ${baseName} 2' },
 ];
+`;
+};

package/templates/preset/table/feature/buttons.tsx

@@ -1,11 +1,17 @@
-import styled from '@emotion/styled';
+import type { GeneratorContext } from '../../../../src/config/types.js';
 
-const Button = styled.button`
+export default (ctx: GeneratorContext) => {
+    const { base: { baseName } } = ctx;
+    return `import styled from '@emotion/styled';
+
+const Button = styled.button\`
   padding: 8px 16px;
   margin: 0 4px;
   cursor: pointer;
-`;
+\`;
 
-export const Create{{componentName}}Button = () => <Button>Create</Button>;
-export const Edit{{componentName}}Button = () => <Button>Edit</Button>;
-export const Delete{{componentName}}Button = () => <Button>Delete</Button>;
+export const Create${baseName}Button = () => <Button>Create</Button>;
+export const Edit${baseName}Button = () => <Button>Edit</Button>;
+export const Delete${baseName}Button = () => <Button>Delete</Button>;
+`;
+};

package/templates/preset/table/page/page.tsx

@@ -1,19 +1,41 @@
+import type { GeneratorContext } from '../../../../src/config/types.js';
+
+export default (ctx: GeneratorContext) => {
+  const {
+      base: { baseName },
+      template: { componentName },
+      layer: {
+          widget: { importPath: widgetImportPath, slice: widgetSlice }
+      }
+  } = ctx;
+
+  // Ideally the widget name would be dynamic, but in this specific preset it's often Table
+  // However, the componentName here is the Page component name (e.g. UserPage)
+  // The widget slice/component might be UserTable.
+  
+  // We need the widget component name. 
+  // In the 'table' preset, the widget is typically `${baseName}Table`.
+  const widgetComponent = `${baseName}Table`;
+
+  return `
 import styled from '@emotion/styled';
-import { {{componentName}}Table } from '../../widgets/{{componentName}}Table/ui/{{componentName}}Table';
+import { ${widgetComponent} } from '${widgetImportPath}';
 
-const PageWrapper = styled.div`
+const PageWrapper = styled.div\`
   padding: 2rem;
-`;
+\`;
 
-const Title = styled.h1`
+const Title = styled.h1\`
   margin-bottom: 2rem;
-`;
+\`;
 
-export const {{componentName}}Page = () => {
+export const ${componentName} = () => {
   return (
     <PageWrapper>
-      <Title>{{componentName}} Management</Title>
-      <{{componentName}}Table />
+      <Title>${baseName} Management</Title>
+      <${widgetComponent} />
     </PageWrapper>
   );
 };
+`;
+};

package/templates/preset/table/widget/table.tsx

@@ -1,13 +1,28 @@
+import type { GeneratorContext } from '../../../../src/config/types.js';
+
+export default (ctx: GeneratorContext) => {
+  const {
+      base: { baseName },
+      template: { componentName },
+      layer: {
+          entity: { apiPath: entityApiPath },
+          features: { importPath: featureImportPath }
+      }
+  } = ctx;
+
+  return `
 import styled from '@emotion/styled';
-import { {{componentName}}, mock{{componentName}}Data } from '../../../entities/{{componentName}}/model';
-import { Create{{componentName}}Button, Edit{{componentName}}Button, Delete{{componentName}}Button } from '../../../features/Manage{{componentName}}/ui/Manage{{componentName}}';
+import { ${baseName}, mock${baseName}Data } from '${entityApiPath}';
+// Note: Assuming specific button names based on feature convention, or should be generic?
+// For the Table preset, it assumes Create/Edit/Delete buttons exist in the feature slice.
+import { Create${baseName}Button, Edit${baseName}Button, Delete${baseName}Button } from '${featureImportPath}';
 
-const TableWrapper = styled.div`
+const TableWrapper = styled.div\`
   border: 1px solid #eee;
   padding: 1rem;
-`;
+\`;
 
-const Table = styled.table`
+const Table = styled.table\`
   width: 100%;
   border-collapse: collapse;
   
@@ -16,13 +31,13 @@ const Table = styled.table`
     padding: 8px;
     text-align: left;
   }
-`;
+\`;
 
-export const {{componentName}}Table = () => {
+export const ${componentName} = () => {
   return (
     <TableWrapper>
       <div style={{ marginBottom: '1rem' }}>
-        <Create{{componentName}}Button />
+        <Create${baseName}Button />
       </div>
       <Table>
         <thead>
@@ -33,13 +48,13 @@ export const {{componentName}}Table = () => {
           </tr>
         </thead>
         <tbody>
-          {mock{{componentName}}Data.map((item) => (
+          {mock${baseName}Data.map((item) => (
             <tr key={item.id}>
               <td>{item.id}</td>
               <td>{item.name}</td>
               <td>
-                <Edit{{componentName}}Button />
-                <Delete{{componentName}}Button />
+                <Edit${baseName}Button />
+                <Delete${baseName}Button />
               </td>
             </tr>
           ))}
@@ -48,3 +63,5 @@ export const {{componentName}}Table = () => {
     </TableWrapper>
   );
 };
+`;
+};

package/templates/shared/ui-basic/Component.tsx

@@ -1,18 +1,29 @@
+import type { GeneratorContext } from '../../../src/config/types.js';
+
+export default (ctx: GeneratorContext) => {
+  const {
+      base: { baseName },
+      template: { componentName }
+  } = ctx;
+
+  return `
 import styled from '@emotion/styled';
 
-export const {{componentName}}Root = styled.div`
+export const ${componentName}Root = styled.div\`
   display: flex;
-`;
+\`;
 
-export interface {{componentName}}Props {
+export interface ${componentName}Props {
   className?: string;
   children?: React.ReactNode;
 }
 
-export const {{componentName}} = ({ className, children }: {{componentName}}Props) => {
+export const ${componentName} = ({ className, children }: ${componentName}Props) => {
   return (
-    <{{componentName}}Root className={className}>
+    <${componentName}Root className={className}>
       {children}
-    </{{componentName}}Root>
+    </${componentName}Root>
   );
 };
+`;
+};

package/templates/widget/ui-basic/Component.tsx

@@ -1,18 +1,29 @@
+import type { GeneratorContext } from '../../../src/config/types.js';
+
+export default (ctx: GeneratorContext) => {
+  const {
+      base: { baseName },
+      template: { componentName }
+  } = ctx;
+
+  return `
 import styled from '@emotion/styled';
 
-export const {{componentName}}Root = styled.div`
+export const ${componentName}Root = styled.div\`
   display: grid;
   gap: 1rem;
-`;
+\`;
 
-export interface {{componentName}}Props {
+export interface ${componentName}Props {
   className?: string;
 }
 
-export const {{componentName}} = ({ className }: {{componentName}}Props) => {
+export const ${componentName} = ({ className }: ${componentName}Props) => {
   return (
-    <{{componentName}}Root className={className}>
-      Widget: {{componentName}}
-    </{{componentName}}Root>
+    <${componentName}Root className={className}>
+      Widget: ${componentName}
+    </${componentName}Root>
   );
 };
+`;
+};

package/templates/entity/model-ui-basic/Component.styles.ts

@@ -1 +0,0 @@
-// Styles for {{componentName}}

package/templates/feature/ui-model-basic/Component.styles.ts

@@ -1 +0,0 @@
-// Styles for Feature {{componentName}}

package/templates/page/ui-basic/Component.styles.ts

@@ -1 +0,0 @@
-// Styles for Page {{componentName}}

package/templates/shared/ui-basic/Component.styles.ts

@@ -1 +0,0 @@
-// Styles for {{componentName}}

package/templates/widget/ui-basic/Component.styles.ts

@@ -1 +0,0 @@
-// Styles for Widget {{componentName}}