@ryuzaki13/react-foundation-ui 1.0.8 → 1.0.12

package/dist/flex/stories/Flex.stories.js

@@ -1,607 +0,0 @@
-import { t as e } from "../../chunks/Flex-DUYSL5TE.js";
-import "react";
-import { Fragment as t, jsx as n, jsxs as r } from "react/jsx-runtime";
-//#region src/flex/stories/Flex.stories.tsx
-var i = {
-	container: {
-		border: "2px dashed var(--border-0)",
-		padding: "2em",
-		marginBlock: "1em"
-	},
-	item: {
-		padding: "16px",
-		textAlign: "center",
-		fontWeight: "bold",
-		color: "white",
-		minHeight: "5em",
-		minWidth: "10em",
-		display: "flex",
-		alignItems: "center",
-		justifyContent: "center"
-	},
-	itemColors: [
-		"#ff6b6b",
-		"#4ecdc4",
-		"#45b7d1",
-		"#96ceb4",
-		"#feca57",
-		"#ff9ff3"
-	]
-}, a = (e) => i.itemColors[e % i.itemColors.length], o = ({ children: t, index: r = 0 }) => /* @__PURE__ */ n(e.Item, {
-	style: {
-		...i.item,
-		backgroundColor: a(r)
-	},
-	children: t
-}), s = {
-	title: "Shared/Layout/Flex",
-	component: e.Container,
-	parameters: { layout: "padded" },
-	tags: ["autodocs"]
-}, c = {
-	render: (t) => /* @__PURE__ */ n(e.Container, {
-		...t,
-		style: i.container
-	}),
-	args: {
-		children: /* @__PURE__ */ r(t, { children: [
-			/* @__PURE__ */ n(o, {
-				index: 0,
-				children: "Item 1"
-			}),
-			/* @__PURE__ */ n(o, {
-				index: 1,
-				children: "Item 2"
-			}),
-			/* @__PURE__ */ n(o, {
-				index: 2,
-				children: "Item 3"
-			})
-		] }),
-		row: !0
-	}
-}, l = {
-	render: (t) => /* @__PURE__ */ n(e.Container, {
-		...t,
-		style: i.container
-	}),
-	args: {
-		children: /* @__PURE__ */ r(t, { children: [
-			/* @__PURE__ */ n(o, {
-				index: 0,
-				children: "Header"
-			}),
-			/* @__PURE__ */ n(o, {
-				index: 1,
-				children: "Content"
-			}),
-			/* @__PURE__ */ n(o, {
-				index: 2,
-				children: "Footer"
-			})
-		] }),
-		column: !0
-	}
-}, u = {
-	render: () => /* @__PURE__ */ r("div", { children: [
-		/* @__PURE__ */ n("h3", { children: "Row (default)" }),
-		/* @__PURE__ */ r(e.Container, {
-			row: !0,
-			style: i.container,
-			children: [
-				/* @__PURE__ */ n(o, {
-					index: 0,
-					children: "1"
-				}),
-				/* @__PURE__ */ n(o, {
-					index: 1,
-					children: "2"
-				}),
-				/* @__PURE__ */ n(o, {
-					index: 2,
-					children: "3"
-				})
-			]
-		}),
-		/* @__PURE__ */ n("h3", { children: "Row Reverse" }),
-		/* @__PURE__ */ r(e.Container, {
-			rowReverse: !0,
-			style: i.container,
-			children: [
-				/* @__PURE__ */ n(o, {
-					index: 0,
-					children: "1"
-				}),
-				/* @__PURE__ */ n(o, {
-					index: 1,
-					children: "2"
-				}),
-				/* @__PURE__ */ n(o, {
-					index: 2,
-					children: "3"
-				})
-			]
-		}),
-		/* @__PURE__ */ n("h3", { children: "Column" }),
-		/* @__PURE__ */ r(e.Container, {
-			column: !0,
-			style: i.container,
-			children: [
-				/* @__PURE__ */ n(o, {
-					index: 0,
-					children: "1"
-				}),
-				/* @__PURE__ */ n(o, {
-					index: 1,
-					children: "2"
-				}),
-				/* @__PURE__ */ n(o, {
-					index: 2,
-					children: "3"
-				})
-			]
-		}),
-		/* @__PURE__ */ n("h3", { children: "Column Reverse" }),
-		/* @__PURE__ */ r(e.Container, {
-			columnReverse: !0,
-			style: i.container,
-			children: [
-				/* @__PURE__ */ n(o, {
-					index: 0,
-					children: "1"
-				}),
-				/* @__PURE__ */ n(o, {
-					index: 1,
-					children: "2"
-				}),
-				/* @__PURE__ */ n(o, {
-					index: 2,
-					children: "3"
-				})
-			]
-		})
-	] }),
-	args: { children: void 0 }
-}, d = {
-	render: () => /* @__PURE__ */ n("div", { children: [
-		"start",
-		"center",
-		"end",
-		"between",
-		"around",
-		"evenly"
-	].map((t) => /* @__PURE__ */ r("div", { children: [/* @__PURE__ */ r("h3", { children: ["Justify: ", t] }), /* @__PURE__ */ r(e.Container, {
-		row: !0,
-		justify: t,
-		style: i.container,
-		children: [
-			/* @__PURE__ */ n(o, {
-				index: 0,
-				children: "Item 1"
-			}),
-			/* @__PURE__ */ n(o, {
-				index: 1,
-				children: "Item 2"
-			}),
-			/* @__PURE__ */ n(o, {
-				index: 2,
-				children: "Item 3"
-			})
-		]
-	})] }, t)) }),
-	args: { children: void 0 }
-}, f = {
-	render: () => /* @__PURE__ */ n("div", { children: [
-		"start",
-		"center",
-		"end",
-		"stretch",
-		"baseline"
-	].map((t) => /* @__PURE__ */ r("div", { children: [/* @__PURE__ */ r("h3", { children: ["Align: ", t] }), /* @__PURE__ */ r(e.Container, {
-		row: !0,
-		align: t,
-		style: {
-			...i.container,
-			height: "120px"
-		},
-		children: [
-			/* @__PURE__ */ n(o, {
-				index: 0,
-				children: /* @__PURE__ */ n("div", { children: "Short" })
-			}),
-			/* @__PURE__ */ n(o, {
-				index: 1,
-				children: /* @__PURE__ */ n("div", {
-					style: { padding: "40px" },
-					children: "Tall"
-				})
-			}),
-			/* @__PURE__ */ n(o, {
-				index: 2,
-				children: /* @__PURE__ */ n("div", {
-					style: { padding: "24px" },
-					children: "Medium"
-				})
-			})
-		]
-	})] }, t)) }),
-	args: { children: void 0 }
-}, p = {
-	render: () => /* @__PURE__ */ r("div", { children: [
-		/* @__PURE__ */ n("h3", { children: "No Wrap (default)" }),
-		/* @__PURE__ */ n(e.Container, {
-			row: !0,
-			nowrap: !0,
-			style: i.container,
-			children: [
-				1,
-				2,
-				3,
-				4,
-				5,
-				6,
-				7,
-				8,
-				9,
-				10,
-				11,
-				12
-			].map((e) => /* @__PURE__ */ r(o, {
-				index: e,
-				children: ["Item ", e]
-			}, e))
-		}),
-		/* @__PURE__ */ n("h3", { children: "Wrap" }),
-		/* @__PURE__ */ n(e.Container, {
-			row: !0,
-			wrap: !0,
-			style: i.container,
-			children: [
-				1,
-				2,
-				3,
-				4,
-				5,
-				6,
-				7,
-				8,
-				9,
-				10,
-				11,
-				12
-			].map((e) => /* @__PURE__ */ r(o, {
-				index: e,
-				children: ["Item ", e]
-			}, e))
-		}),
-		/* @__PURE__ */ n("h3", { children: "Wrap Reverse" }),
-		/* @__PURE__ */ n(e.Container, {
-			row: !0,
-			wrapReverse: !0,
-			style: i.container,
-			children: [
-				1,
-				2,
-				3,
-				4,
-				5,
-				6,
-				7,
-				8,
-				9,
-				10,
-				11,
-				12
-			].map((e) => /* @__PURE__ */ r(o, {
-				index: e,
-				children: ["Item ", e]
-			}, e))
-		})
-	] }),
-	args: { children: void 0 }
-}, m = {
-	render: () => /* @__PURE__ */ r("div", { children: [
-		[
-			"xs",
-			"sm",
-			"md",
-			"lg",
-			"xl"
-		].map((t) => /* @__PURE__ */ r("div", { children: [/* @__PURE__ */ r("h3", { children: ["Gap: ", t] }), /* @__PURE__ */ n(e.Container, {
-			row: !0,
-			wrap: !0,
-			gap: t,
-			style: i.container,
-			children: [
-				1,
-				2,
-				3,
-				4,
-				5,
-				6
-			].map((e) => /* @__PURE__ */ r(o, {
-				index: e,
-				children: ["Item ", e]
-			}, e))
-		})] }, t)),
-		/* @__PURE__ */ n("h3", { children: "Different Row and Column Gaps" }),
-		/* @__PURE__ */ n(e.Container, {
-			row: !0,
-			wrap: !0,
-			gapRow: "lg",
-			gapColumn: "sm",
-			style: i.container,
-			children: [
-				1,
-				2,
-				3,
-				4,
-				5,
-				6,
-				7,
-				8,
-				9,
-				10,
-				11,
-				12
-			].map((e) => /* @__PURE__ */ r(o, {
-				index: e,
-				children: ["Item ", e]
-			}, e))
-		})
-	] }),
-	args: { children: void 0 }
-}, h = {
-	render: () => /* @__PURE__ */ r("div", { children: [
-		/* @__PURE__ */ n("h3", { children: "Grow Properties" }),
-		/* @__PURE__ */ r(e.Container, {
-			row: !0,
-			style: i.container,
-			children: [
-				/* @__PURE__ */ n(o, {
-					index: 0,
-					children: "Default"
-				}),
-				/* @__PURE__ */ n(e.Item, {
-					grow: !0,
-					children: /* @__PURE__ */ n("div", {
-						style: {
-							...i.item,
-							backgroundColor: a(1)
-						},
-						children: "Grow"
-					})
-				}),
-				/* @__PURE__ */ n(o, {
-					index: 2,
-					children: "Default"
-				})
-			]
-		}),
-		/* @__PURE__ */ n("h3", { children: "Shrink Properties" }),
-		/* @__PURE__ */ r(e.Container, {
-			row: !0,
-			style: {
-				...i.container,
-				width: "300px"
-			},
-			children: [/* @__PURE__ */ n(e.Item, {
-				shrink: !1,
-				children: /* @__PURE__ */ n("div", {
-					style: {
-						...i.item,
-						backgroundColor: a(0),
-						width: "150px"
-					},
-					children: "No Shrink"
-				})
-			}), /* @__PURE__ */ n(e.Item, { children: /* @__PURE__ */ n("div", {
-				style: {
-					...i.item,
-					backgroundColor: a(1),
-					width: "150px"
-				},
-				children: "Shrink (default)"
-			}) })]
-		}),
-		/* @__PURE__ */ n("h3", { children: "Composite Classes" }),
-		/* @__PURE__ */ r(e.Container, {
-			row: !0,
-			style: i.container,
-			children: [
-				/* @__PURE__ */ n(e.Item, {
-					flex0: !0,
-					children: /* @__PURE__ */ n("div", {
-						style: {
-							...i.item,
-							backgroundColor: a(0)
-						},
-						children: "flex0"
-					})
-				}),
-				/* @__PURE__ */ n(e.Item, {
-					flex1: !0,
-					children: /* @__PURE__ */ n("div", {
-						style: {
-							...i.item,
-							backgroundColor: a(1)
-						},
-						children: "flex1"
-					})
-				}),
-				/* @__PURE__ */ n(e.Item, {
-					flex0: !0,
-					children: /* @__PURE__ */ n("div", {
-						style: {
-							...i.item,
-							backgroundColor: a(2)
-						},
-						children: "flex0"
-					})
-				})
-			]
-		})
-	] }),
-	args: { children: void 0 }
-}, g = {
-	render: () => /* @__PURE__ */ r("div", { children: [
-		/* @__PURE__ */ n("h3", { children: "Center" }),
-		/* @__PURE__ */ n(e.Predefined, {
-			variant: "center",
-			style: {
-				...i.container,
-				height: "100px"
-			},
-			children: /* @__PURE__ */ n(o, {
-				index: 0,
-				children: "Centered Content"
-			})
-		}),
-		/* @__PURE__ */ n("h3", { children: "Center Between" }),
-		/* @__PURE__ */ r(e.Predefined, {
-			variant: "centerBetween",
-			style: i.container,
-			children: [/* @__PURE__ */ n(o, {
-				index: 0,
-				children: "Left"
-			}), /* @__PURE__ */ n(o, {
-				index: 1,
-				children: "Right"
-			})]
-		})
-	] }),
-	args: { children: void 0 }
-}, _ = {
-	render: () => /* @__PURE__ */ r("div", { children: [/* @__PURE__ */ r("p", { children: [
-		"This is text with",
-		/* @__PURE__ */ r(e.Container, {
-			inline: !0,
-			align: "center",
-			gap: "sm",
-			style: { margin: "0 8px" },
-			children: [/* @__PURE__ */ n(o, {
-				index: 0,
-				children: "inline"
-			}), /* @__PURE__ */ n(o, {
-				index: 1,
-				children: "flex"
-			})]
-		}),
-		"elements inside."
-	] }), /* @__PURE__ */ r("p", { children: [
-		"Another example with",
-		/* @__PURE__ */ r(e.Container, {
-			inline: !0,
-			column: !0,
-			gap: "xs",
-			style: { margin: "0 8px" },
-			children: [/* @__PURE__ */ n(o, {
-				index: 2,
-				children: "vertical"
-			}), /* @__PURE__ */ n(o, {
-				index: 3,
-				children: "inline"
-			})]
-		}),
-		"flex."
-	] })] }),
-	args: { children: void 0 }
-}, v = {
-	render: () => /* @__PURE__ */ r("div", { children: [
-		/* @__PURE__ */ n("h3", { children: "Navigation Bar" }),
-		/* @__PURE__ */ r(e.Predefined, {
-			variant: "centerBetween",
-			style: i.container,
-			children: [/* @__PURE__ */ r(e.Container, {
-				row: !0,
-				align: "center",
-				gap: "md",
-				children: [
-					/* @__PURE__ */ n(o, {
-						index: 0,
-						children: "Logo"
-					}),
-					/* @__PURE__ */ n(o, {
-						index: 1,
-						children: "Home"
-					}),
-					/* @__PURE__ */ n(o, {
-						index: 2,
-						children: "About"
-					}),
-					/* @__PURE__ */ n(o, {
-						index: 3,
-						children: "Contact"
-					})
-				]
-			}), /* @__PURE__ */ n(o, {
-				index: 4,
-				children: "Login"
-			})]
-		}),
-		/* @__PURE__ */ n("h3", { children: "Card Layout" }),
-		/* @__PURE__ */ n(e.Container, {
-			row: !0,
-			wrap: !0,
-			gap: "lg",
-			style: i.container,
-			children: [
-				1,
-				2,
-				3,
-				4
-			].map((t) => /* @__PURE__ */ n(e.Item, {
-				flex1: !0,
-				style: { minWidth: "200px" },
-				children: /* @__PURE__ */ r("div", {
-					style: {
-						border: "1px solid #ddd",
-						borderRadius: "8px",
-						padding: "16px",
-						textAlign: "center",
-						backgroundColor: a(t)
-					},
-					children: [/* @__PURE__ */ r("h4", { children: ["Card ", t] }), /* @__PURE__ */ n("p", { children: "Card content goes here" })]
-				})
-			}, t))
-		}),
-		/* @__PURE__ */ n("h3", { children: "Form Layout" }),
-		/* @__PURE__ */ r(e.Container, {
-			column: !0,
-			gap: "md",
-			style: i.container,
-			children: [
-				/* @__PURE__ */ r(e.Container, {
-					row: !0,
-					gap: "md",
-					children: [/* @__PURE__ */ n(e.Item, {
-						flex1: !0,
-						children: /* @__PURE__ */ n(o, {
-							index: 0,
-							children: "First Name"
-						})
-					}), /* @__PURE__ */ n(e.Item, {
-						flex1: !0,
-						children: /* @__PURE__ */ n(o, {
-							index: 1,
-							children: "Last Name"
-						})
-					})]
-				}),
-				/* @__PURE__ */ n(o, {
-					index: 2,
-					children: "Email"
-				}),
-				/* @__PURE__ */ n(o, {
-					index: 3,
-					children: "Message"
-				})
-			]
-		})
-	] }),
-	args: { children: void 0 }
-};
-//#endregion
-export { f as AlignItems, l as BasicColumn, c as BasicRow, u as Directions, h as FlexItems, m as Gaps, _ as InlineFlex, d as JustifyContent, g as Predefined, v as RealWorld, p as Wrapping, s as default };
-
-//# sourceMappingURL=Flex.stories.js.map

package/dist/flex/stories/Flex.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Flex.stories.js","names":[],"sources":["../../../src/flex/stories/Flex.stories.tsx"],"sourcesContent":["// Flex.stories.tsx\nimport React from \"react\";\n\nimport { Flex } from \"../Flex\";\n\nimport type { Meta, StoryObj } from \"@storybook/react-vite\";\n\n// Стили для демонстрационных блоков\nconst demoStyles = {\n\tcontainer: {\n\t\tborder: \"2px dashed var(--border-0)\",\n\t\tpadding: \"2em\",\n\t\tmarginBlock: \"1em\"\n\t},\n\titem: {\n\t\tpadding: \"16px\",\n\t\ttextAlign: \"center\" as const,\n\t\tfontWeight: \"bold\",\n\t\tcolor: \"white\",\n\t\tminHeight: \"5em\",\n\t\tminWidth: \"10em\",\n\t\tdisplay: \"flex\",\n\t\talignItems: \"center\",\n\t\tjustifyContent: \"center\"\n\t},\n\titemColors: [\"#ff6b6b\", \"#4ecdc4\", \"#45b7d1\", \"#96ceb4\", \"#feca57\", \"#ff9ff3\"]\n};\n\nconst getItemColor = (index: number) => demoStyles.itemColors[index % demoStyles.itemColors.length];\n\nconst DemoItem = ({ children, index = 0 }: { children: React.ReactNode; index?: number }) => (\n\t<Flex.Item\n\t\tstyle={{\n\t\t\t...demoStyles.item,\n\t\t\tbackgroundColor: getItemColor(index)\n\t\t}}>\n\t\t{children}\n\t</Flex.Item>\n);\n\nconst meta = {\n\ttitle: \"Shared/Layout/Flex\",\n\tcomponent: Flex.Container,\n\tparameters: {\n\t\tlayout: \"padded\"\n\t},\n\ttags: [\"autodocs\"]\n} satisfies Meta<typeof Flex.Container>;\n\nexport default meta;\ntype Story = StoryObj<typeof meta>;\n\n// Базовые примеры\nexport const BasicRow: Story = {\n\trender: (args) => <Flex.Container {...args} style={demoStyles.container} />,\n\targs: {\n\t\tchildren: (\n\t\t\t<>\n\t\t\t\t<DemoItem index={0}>Item 1</DemoItem>\n\t\t\t\t<DemoItem index={1}>Item 2</DemoItem>\n\t\t\t\t<DemoItem index={2}>Item 3</DemoItem>\n\t\t\t</>\n\t\t),\n\t\trow: true\n\t}\n};\n\nexport const BasicColumn: Story = {\n\trender: (args) => <Flex.Container {...args} style={demoStyles.container} />,\n\targs: {\n\t\tchildren: (\n\t\t\t<>\n\t\t\t\t<DemoItem index={0}>Header</DemoItem>\n\t\t\t\t<DemoItem index={1}>Content</DemoItem>\n\t\t\t\t<DemoItem index={2}>Footer</DemoItem>\n\t\t\t</>\n\t\t),\n\t\tcolumn: true\n\t}\n};\n\n// Направления\nexport const Directions: Story = {\n\trender: () => (\n\t\t<div>\n\t\t\t<h3>Row (default)</h3>\n\t\t\t<Flex.Container row style={demoStyles.container}>\n\t\t\t\t<DemoItem index={0}>1</DemoItem>\n\t\t\t\t<DemoItem index={1}>2</DemoItem>\n\t\t\t\t<DemoItem index={2}>3</DemoItem>\n\t\t\t</Flex.Container>\n\n\t\t\t<h3>Row Reverse</h3>\n\t\t\t<Flex.Container rowReverse style={demoStyles.container}>\n\t\t\t\t<DemoItem index={0}>1</DemoItem>\n\t\t\t\t<DemoItem index={1}>2</DemoItem>\n\t\t\t\t<DemoItem index={2}>3</DemoItem>\n\t\t\t</Flex.Container>\n\n\t\t\t<h3>Column</h3>\n\t\t\t<Flex.Container column style={demoStyles.container}>\n\t\t\t\t<DemoItem index={0}>1</DemoItem>\n\t\t\t\t<DemoItem index={1}>2</DemoItem>\n\t\t\t\t<DemoItem index={2}>3</DemoItem>\n\t\t\t</Flex.Container>\n\n\t\t\t<h3>Column Reverse</h3>\n\t\t\t<Flex.Container columnReverse style={demoStyles.container}>\n\t\t\t\t<DemoItem index={0}>1</DemoItem>\n\t\t\t\t<DemoItem index={1}>2</DemoItem>\n\t\t\t\t<DemoItem index={2}>3</DemoItem>\n\t\t\t</Flex.Container>\n\t\t</div>\n\t),\n\targs: { children: undefined }\n};\n\n// Выравнивание по главной оси\nexport const JustifyContent: Story = {\n\trender: () => (\n\t\t<div>\n\t\t\t{([\"start\", \"center\", \"end\", \"between\", \"around\", \"evenly\"] as const).map((justify) => (\n\t\t\t\t<div key={justify}>\n\t\t\t\t\t<h3>Justify: {justify}</h3>\n\t\t\t\t\t<Flex.Container row justify={justify} style={demoStyles.container}>\n\t\t\t\t\t\t<DemoItem index={0}>Item 1</DemoItem>\n\t\t\t\t\t\t<DemoItem index={1}>Item 2</DemoItem>\n\t\t\t\t\t\t<DemoItem index={2}>Item 3</DemoItem>\n\t\t\t\t\t</Flex.Container>\n\t\t\t\t</div>\n\t\t\t))}\n\t\t</div>\n\t),\n\targs: { children: undefined }\n};\n\n// Выравнивание по поперечной оси\nexport const AlignItems: Story = {\n\trender: () => (\n\t\t<div>\n\t\t\t{([\"start\", \"center\", \"end\", \"stretch\", \"baseline\"] as const).map((align) => (\n\t\t\t\t<div key={align}>\n\t\t\t\t\t<h3>Align: {align}</h3>\n\t\t\t\t\t<Flex.Container\n\t\t\t\t\t\trow\n\t\t\t\t\t\talign={align}\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t...demoStyles.container,\n\t\t\t\t\t\t\theight: \"120px\"\n\t\t\t\t\t\t}}>\n\t\t\t\t\t\t<DemoItem index={0}>\n\t\t\t\t\t\t\t<div>Short</div>\n\t\t\t\t\t\t</DemoItem>\n\t\t\t\t\t\t<DemoItem index={1}>\n\t\t\t\t\t\t\t<div style={{ padding: \"40px\" }}>Tall</div>\n\t\t\t\t\t\t</DemoItem>\n\t\t\t\t\t\t<DemoItem index={2}>\n\t\t\t\t\t\t\t<div style={{ padding: \"24px\" }}>Medium</div>\n\t\t\t\t\t\t</DemoItem>\n\t\t\t\t\t</Flex.Container>\n\t\t\t\t</div>\n\t\t\t))}\n\t\t</div>\n\t),\n\targs: { children: undefined }\n};\n\n// Перенос\nexport const Wrapping: Story = {\n\trender: () => (\n\t\t<div>\n\t\t\t<h3>No Wrap (default)</h3>\n\t\t\t<Flex.Container row nowrap style={demoStyles.container}>\n\t\t\t\t{[1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12].map((i) => (\n\t\t\t\t\t<DemoItem key={i} index={i}>\n\t\t\t\t\t\tItem {i}\n\t\t\t\t\t</DemoItem>\n\t\t\t\t))}\n\t\t\t</Flex.Container>\n\n\t\t\t<h3>Wrap</h3>\n\t\t\t<Flex.Container row wrap style={demoStyles.container}>\n\t\t\t\t{[1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12].map((i) => (\n\t\t\t\t\t<DemoItem key={i} index={i}>\n\t\t\t\t\t\tItem {i}\n\t\t\t\t\t</DemoItem>\n\t\t\t\t))}\n\t\t\t</Flex.Container>\n\n\t\t\t<h3>Wrap Reverse</h3>\n\t\t\t<Flex.Container row wrapReverse style={demoStyles.container}>\n\t\t\t\t{[1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12].map((i) => (\n\t\t\t\t\t<DemoItem key={i} index={i}>\n\t\t\t\t\t\tItem {i}\n\t\t\t\t\t</DemoItem>\n\t\t\t\t))}\n\t\t\t</Flex.Container>\n\t\t</div>\n\t),\n\targs: { children: undefined }\n};\n\n// Gap свойства\nexport const Gaps: Story = {\n\trender: () => (\n\t\t<div>\n\t\t\t{([\"xs\", \"sm\", \"md\", \"lg\", \"xl\"] as const).map((gap) => (\n\t\t\t\t<div key={gap}>\n\t\t\t\t\t<h3>Gap: {gap}</h3>\n\t\t\t\t\t<Flex.Container row wrap gap={gap} style={demoStyles.container}>\n\t\t\t\t\t\t{[1, 2, 3, 4, 5, 6].map((i) => (\n\t\t\t\t\t\t\t<DemoItem key={i} index={i}>\n\t\t\t\t\t\t\t\tItem {i}\n\t\t\t\t\t\t\t</DemoItem>\n\t\t\t\t\t\t))}\n\t\t\t\t\t</Flex.Container>\n\t\t\t\t</div>\n\t\t\t))}\n\n\t\t\t<h3>Different Row and Column Gaps</h3>\n\t\t\t<Flex.Container row wrap gapRow=\"lg\" gapColumn=\"sm\" style={demoStyles.container}>\n\t\t\t\t{[1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12].map((i) => (\n\t\t\t\t\t<DemoItem key={i} index={i}>\n\t\t\t\t\t\tItem {i}\n\t\t\t\t\t</DemoItem>\n\t\t\t\t))}\n\t\t\t</Flex.Container>\n\t\t</div>\n\t),\n\targs: { children: undefined }\n};\n\n// Flex Item свойства\nexport const FlexItems: Story = {\n\trender: () => (\n\t\t<div>\n\t\t\t<h3>Grow Properties</h3>\n\t\t\t<Flex.Container row style={demoStyles.container}>\n\t\t\t\t<DemoItem index={0}>Default</DemoItem>\n\t\t\t\t<Flex.Item grow>\n\t\t\t\t\t<div style={{ ...demoStyles.item, backgroundColor: getItemColor(1) }}>Grow</div>\n\t\t\t\t</Flex.Item>\n\t\t\t\t<DemoItem index={2}>Default</DemoItem>\n\t\t\t</Flex.Container>\n\n\t\t\t<h3>Shrink Properties</h3>\n\t\t\t<Flex.Container row style={{ ...demoStyles.container, width: \"300px\" }}>\n\t\t\t\t<Flex.Item shrink={false}>\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t...demoStyles.item,\n\t\t\t\t\t\t\tbackgroundColor: getItemColor(0),\n\t\t\t\t\t\t\twidth: \"150px\"\n\t\t\t\t\t\t}}>\n\t\t\t\t\t\tNo Shrink\n\t\t\t\t\t</div>\n\t\t\t\t</Flex.Item>\n\t\t\t\t<Flex.Item>\n\t\t\t\t\t<div\n\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t...demoStyles.item,\n\t\t\t\t\t\t\tbackgroundColor: getItemColor(1),\n\t\t\t\t\t\t\twidth: \"150px\"\n\t\t\t\t\t\t}}>\n\t\t\t\t\t\tShrink (default)\n\t\t\t\t\t</div>\n\t\t\t\t</Flex.Item>\n\t\t\t</Flex.Container>\n\n\t\t\t<h3>Composite Classes</h3>\n\t\t\t<Flex.Container row style={demoStyles.container}>\n\t\t\t\t<Flex.Item flex0>\n\t\t\t\t\t<div style={{ ...demoStyles.item, backgroundColor: getItemColor(0) }}>flex0</div>\n\t\t\t\t</Flex.Item>\n\t\t\t\t<Flex.Item flex1>\n\t\t\t\t\t<div style={{ ...demoStyles.item, backgroundColor: getItemColor(1) }}>flex1</div>\n\t\t\t\t</Flex.Item>\n\t\t\t\t<Flex.Item flex0>\n\t\t\t\t\t<div style={{ ...demoStyles.item, backgroundColor: getItemColor(2) }}>flex0</div>\n\t\t\t\t</Flex.Item>\n\t\t\t</Flex.Container>\n\t\t</div>\n\t),\n\targs: { children: undefined }\n};\n\n// Предопределенные композиции\nexport const Predefined: Story = {\n\trender: () => (\n\t\t<div>\n\t\t\t<h3>Center</h3>\n\t\t\t<Flex.Predefined variant=\"center\" style={{ ...demoStyles.container, height: \"100px\" }}>\n\t\t\t\t<DemoItem index={0}>Centered Content</DemoItem>\n\t\t\t</Flex.Predefined>\n\n\t\t\t<h3>Center Between</h3>\n\t\t\t<Flex.Predefined variant=\"centerBetween\" style={demoStyles.container}>\n\t\t\t\t<DemoItem index={0}>Left</DemoItem>\n\t\t\t\t<DemoItem index={1}>Right</DemoItem>\n\t\t\t</Flex.Predefined>\n\t\t</div>\n\t),\n\targs: { children: undefined }\n};\n\n// Inline Flex\nexport const InlineFlex: Story = {\n\trender: () => (\n\t\t<div>\n\t\t\t<p>\n\t\t\t\tThis is text with\n\t\t\t\t<Flex.Container inline align=\"center\" gap=\"sm\" style={{ margin: \"0 8px\" }}>\n\t\t\t\t\t<DemoItem index={0}>inline</DemoItem>\n\t\t\t\t\t<DemoItem index={1}>flex</DemoItem>\n\t\t\t\t</Flex.Container>\n\t\t\t\telements inside.\n\t\t\t</p>\n\n\t\t\t<p>\n\t\t\t\tAnother example with\n\t\t\t\t<Flex.Container inline column gap=\"xs\" style={{ margin: \"0 8px\" }}>\n\t\t\t\t\t<DemoItem index={2}>vertical</DemoItem>\n\t\t\t\t\t<DemoItem index={3}>inline</DemoItem>\n\t\t\t\t</Flex.Container>\n\t\t\t\tflex.\n\t\t\t</p>\n\t\t</div>\n\t),\n\targs: { children: undefined }\n};\n\n// Real World Examples\nexport const RealWorld: Story = {\n\trender: () => (\n\t\t<div>\n\t\t\t<h3>Navigation Bar</h3>\n\t\t\t<Flex.Predefined variant=\"centerBetween\" style={demoStyles.container}>\n\t\t\t\t<Flex.Container row align=\"center\" gap=\"md\">\n\t\t\t\t\t<DemoItem index={0}>Logo</DemoItem>\n\t\t\t\t\t<DemoItem index={1}>Home</DemoItem>\n\t\t\t\t\t<DemoItem index={2}>About</DemoItem>\n\t\t\t\t\t<DemoItem index={3}>Contact</DemoItem>\n\t\t\t\t</Flex.Container>\n\t\t\t\t<DemoItem index={4}>Login</DemoItem>\n\t\t\t</Flex.Predefined>\n\n\t\t\t<h3>Card Layout</h3>\n\t\t\t<Flex.Container row wrap gap=\"lg\" style={demoStyles.container}>\n\t\t\t\t{[1, 2, 3, 4].map((i) => (\n\t\t\t\t\t<Flex.Item key={i} flex1 style={{ minWidth: \"200px\" }}>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tstyle={{\n\t\t\t\t\t\t\t\tborder: \"1px solid #ddd\",\n\t\t\t\t\t\t\t\tborderRadius: \"8px\",\n\t\t\t\t\t\t\t\tpadding: \"16px\",\n\t\t\t\t\t\t\t\ttextAlign: \"center\",\n\t\t\t\t\t\t\t\tbackgroundColor: getItemColor(i)\n\t\t\t\t\t\t\t}}>\n\t\t\t\t\t\t\t<h4>Card {i}</h4>\n\t\t\t\t\t\t\t<p>Card content goes here</p>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</Flex.Item>\n\t\t\t\t))}\n\t\t\t</Flex.Container>\n\n\t\t\t<h3>Form Layout</h3>\n\t\t\t<Flex.Container column gap=\"md\" style={demoStyles.container}>\n\t\t\t\t<Flex.Container row gap=\"md\">\n\t\t\t\t\t<Flex.Item flex1>\n\t\t\t\t\t\t<DemoItem index={0}>First Name</DemoItem>\n\t\t\t\t\t</Flex.Item>\n\t\t\t\t\t<Flex.Item flex1>\n\t\t\t\t\t\t<DemoItem index={1}>Last Name</DemoItem>\n\t\t\t\t\t</Flex.Item>\n\t\t\t\t</Flex.Container>\n\t\t\t\t<DemoItem index={2}>Email</DemoItem>\n\t\t\t\t<DemoItem index={3}>Message</DemoItem>\n\t\t\t</Flex.Container>\n\t\t</div>\n\t),\n\targs: { children: undefined }\n};\n"],"mappings":"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"}

package/dist/grid/stories/Grid.stories.d.ts

@@ -1,24 +0,0 @@
-import React from "react";
-import type { StoryObj } from "@storybook/react-vite";
-declare const meta: {
-    title: string;
-    component: React.ForwardRefExoticComponent<import("../types").GridContainerProps & React.RefAttributes<HTMLElement>>;
-    parameters: {
-        layout: string;
-    };
-    tags: string[];
-};
-export default meta;
-type Story = StoryObj<typeof meta>;
-export declare const BasicGrid: Story;
-export declare const AutoFlow: Story;
-export declare const Alignment: Story;
-export declare const Gaps: Story;
-export declare const PredefinedVariants: Story;
-export declare const ComplexTemplates: Story;
-export declare const GridAreas: Story;
-export declare const ItemPlacement: Story;
-export declare const InlineGrid: Story;
-export declare const RealWorld: Story;
-export declare const Responsive: Story;
-//# sourceMappingURL=Grid.stories.d.ts.map

package/dist/grid/stories/Grid.stories.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"Grid.stories.d.ts","sourceRoot":"","sources":["../../../src/grid/stories/Grid.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,KAAK,EAAQ,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAmC5D,QAAA,MAAM,IAAI;;;;;;;CAO6B,CAAC;AAExC,eAAe,IAAI,CAAC;AACpB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAC;AAGnC,eAAO,MAAM,SAAS,EAAE,KAkBvB,CAAC;AAGF,eAAO,MAAM,QAAQ,EAAE,KAwCtB,CAAC;AAGF,eAAO,MAAM,SAAS,EAAE,KAyCvB,CAAC;AAGF,eAAO,MAAM,IAAI,EAAE,KA2BlB,CAAC;AAGF,eAAO,MAAM,kBAAkB,EAAE,KAyBhC,CAAC;AAGF,eAAO,MAAM,gBAAgB,EAAE,KAuC9B,CAAC;AAGF,eAAO,MAAM,SAAS,EAAE,KA0DvB,CAAC;AAGF,eAAO,MAAM,aAAa,EAAE,KAkD3B,CAAC;AAGF,eAAO,MAAM,UAAU,EAAE,KA2BxB,CAAC;AAGF,eAAO,MAAM,SAAS,EAAE,KAqFvB,CAAC;AAGF,eAAO,MAAM,UAAU,EAAE,KA8BxB,CAAC"}