From d2dd6ddcd0ddd9d62d1ea22c946e82c37dbbc846 Mon Sep 17 00:00:00 2001
From: Gabriele Petronella <gabriele@buildo.io>
Date: Mon, 6 May 2024 15:13:50 +0200
Subject: [PATCH] Add docs

---
 projects/layout-components/documentation.json | 12 +++---
 .../layout-components/src/stories/intro.mdx   | 43 -------------------
 2 files changed, 6 insertions(+), 49 deletions(-)
 delete mode 100644 projects/layout-components/src/stories/intro.mdx

diff --git a/projects/layout-components/documentation.json b/projects/layout-components/documentation.json
index a570db1..4a45da9 100644
--- a/projects/layout-components/documentation.json
+++ b/projects/layout-components/documentation.json
@@ -426,7 +426,7 @@
         },
         {
             "name": "TilesComponent",
-            "id": "component-TilesComponent-03266cf90b6daff9b03045a049a13b40dd6b8774a5b4bf72f484a4c6188fd91b00ed49343f53317f012689fc833a8cf3e9935789382b34de1e17d7b064b1592a",
+            "id": "component-TilesComponent-79d05d9319d9eb7a7a1d5dae6d3d387c35ab355c01c6392dd16c9bce7c7a724f2065583bb4c568ab2d0207707fb14a64599284601cdde061dbcad8f99dab2349",
             "file": "projects/layout-components/src/lib/tiles/tiles.component.ts",
             "encapsulation": [],
             "entryComponents": [],
@@ -442,11 +442,11 @@
             "hostDirectives": [],
             "inputsClass": [
                 {
-                    "required": true,
+                    "required": false,
                     "name": "columns",
+                    "defaultValue": "0",
                     "deprecated": false,
                     "deprecationMessage": "",
-                    "optional": false,
                     "line": 16,
                     "type": "number",
                     "decorators": []
@@ -500,7 +500,7 @@
             "description": "",
             "rawdescription": "\n",
             "type": "component",
-            "sourceCode": "import { Component, HostBinding, Input } from '@angular/core';\nimport { Gap, Padding } from '../common';\n\n@Component({\n  selector: 'tiles',\n  standalone: true,\n  imports: [],\n  template: `<ng-content></ng-content>`,\n  styleUrl: './tiles.component.css',\n})\nexport class TilesComponent {\n  @HostBinding('style.gap') @Input() gap: Gap = '0';\n  @HostBinding('style.grid-template-rows') @Input() gridTemplateRows: string =\n    'auto';\n  @HostBinding('style.padding') @Input() padding: Padding = '0';\n  @Input({ required: true }) columns!: number;\n  @HostBinding('style.grid-template-columns') get gridTemplateColumns() {\n    return `repeat(${this.columns}, 1fr)`;\n  }\n}\n",
+            "sourceCode": "import { Component, HostBinding, Input, numberAttribute } from '@angular/core';\nimport { Gap, Padding } from '../common';\n\n@Component({\n  selector: 'tiles',\n  standalone: true,\n  imports: [],\n  template: `<ng-content></ng-content>`,\n  styleUrl: './tiles.component.css',\n})\nexport class TilesComponent {\n  @HostBinding('style.gap') @Input() gap: Gap = '0';\n  @HostBinding('style.grid-template-rows') @Input() gridTemplateRows: string =\n    'auto';\n  @HostBinding('style.padding') @Input() padding: Padding = '0';\n  @Input({ transform: numberAttribute }) columns: number = 0;\n  @HostBinding('style.grid-template-columns') get gridTemplateColumns() {\n    return `repeat(${this.columns}, 1fr)`;\n  }\n}\n",
             "styleUrl": "./tiles.component.css",
             "assetsDirs": [],
             "styleUrlsData": "",
@@ -580,7 +580,7 @@
                 "deprecated": false,
                 "deprecationMessage": "",
                 "type": "Story",
-                "defaultValue": "{\n  args: {\n    gap: '16px',\n  },\n}"
+                "defaultValue": "{\n  args: {\n    gap: '16px',\n    columns: 3,\n  },\n}"
             },
             {
                 "name": "meta",
@@ -910,7 +910,7 @@
                     "deprecated": false,
                     "deprecationMessage": "",
                     "type": "Story",
-                    "defaultValue": "{\n  args: {\n    gap: '16px',\n  },\n}"
+                    "defaultValue": "{\n  args: {\n    gap: '16px',\n    columns: 3,\n  },\n}"
                 },
                 {
                     "name": "meta",
diff --git a/projects/layout-components/src/stories/intro.mdx b/projects/layout-components/src/stories/intro.mdx
deleted file mode 100644
index 2f827a7..0000000
--- a/projects/layout-components/src/stories/intro.mdx
+++ /dev/null
@@ -1,43 +0,0 @@
-import { Meta, Title, Subtitle, Description, Canvas } from "@storybook/blocks";
-import * as InsetStories from "./inset.stories";
-import * as StackStories from "./stack.stories";
-import * as InlineStories from "./inline.stories";
-import * as ColumnsStories from "./columns.stories";
-import * as TilesStories from "./tiles.stories";
-import * as ContentBlockStories from "./content-block.stories";
-
-<Meta title="Intro" />
-
-<Title>Layout components</Title>
-Layout components are containers that represent the most common spacing and alignment
-rules that are usually employed in constructing an interface.
-
-## Inset
-
-<Description of={InsetStories} />
-<Canvas of={InsetStories.Basic} />
-
-## Stack
-
-<Description of={StackStories} />
-<Canvas of={StackStories.Basic} />
-
-## Inline
-
-<Description of={InlineStories} />
-<Canvas of={InlineStories.Basic} />
-
-## Columns & Column
-
-<Description of={ColumnsStories} />
-<Canvas of={ColumnsStories.Basic} />
-
-## Tiles
-
-<Description of={TilesStories} />
-<Canvas of={TilesStories.Basic} />
-
-## Content Block
-
-<Description of={ContentBlockStories} />
-<Canvas of={ContentBlockStories.Basic} />