@dynshift/layr 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (9) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +268 -0
  3. package/dist/index.cjs +838 -0
  4. package/dist/index.cjs.map +1 -0
  5. package/dist/index.d.cts +1222 -0
  6. package/dist/index.d.ts +1222 -0
  7. package/dist/index.js +807 -0
  8. package/dist/index.js.map +1 -0
  9. package/package.json +95 -0
package/dist/index.cjs.map ADDED
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/components/container.tsx","../src/components/centre.tsx","../src/components/column.tsx","../src/components/row.tsx","../src/components/stack.tsx","../src/components/positioned.tsx","../src/components/positioned-fill.tsx","../src/components/sized-box.tsx","../src/components/padding.tsx"],"names":["BoxShape","jsxs","jsx","MainAxisAlignment","CrossAxisAlignment","MainAxisSize","VerticalDirection","TextDirection","StackFit","Clip","React","normalizeDimension"],"mappings":"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","file":"index.cjs","sourcesContent":["\"use client\";\n\nimport type React from \"react\";\nimport type { CSSProperties, ReactNode } from \"react\";\n\n// ============================================================================\n// ENUMS - Flutter BoxShape\n// ============================================================================\n\nexport enum BoxShape {\n\trectangle = \"rectangle\",\n\tcircle = \"circle\",\n}\n\n// ============================================================================\n// TYPES - Flutter-like API\n// ============================================================================\n\n/**\n * EdgeInsets for padding and margin (Flutter pattern)\n */\nexport type EdgeInsets =\n\t| { all: number }\n\t| { horizontal?: number; vertical?: number }\n\t| { top?: number; right?: number; bottom?: number; left?: number };\n\n/**\n * BoxShadow - Single shadow definition\n */\nexport interface BoxShadow {\n\tcolor?: string;\n\toffset?: { dx: number; dy: number };\n\tblurRadius?: number;\n\tspreadRadius?: number;\n}\n\n/**\n * DecorationImage - Background image configuration\n */\nexport interface DecorationImage {\n\timage: string; // URL or path\n\tfit?: \"cover\" | \"contain\" | \"fill\" | \"none\" | \"scale-down\";\n\talignment?: string; // CSS background-position\n\trepeat?: \"repeat\" | \"no-repeat\" | \"repeat-x\" | \"repeat-y\";\n\topacity?: number;\n}\n\n/**\n * Gradient - Linear or Radial gradient\n */\nexport interface Gradient {\n\ttype?: \"linear\" | \"radial\";\n\tcolors: string[];\n\tstops?: number[]; // 0.0 to 1.0\n\tbegin?: string; // CSS direction (e.g., 'to right', '45deg')\n\tend?: string;\n\tcenter?: string; // For radial gradients\n}\n\n/**\n * BoxBorder - Border configuration\n */\nexport interface BoxBorder {\n\ttop?: { width: number; color: string; style?: \"solid\" | \"dashed\" | \"dotted\" };\n\tbottom?: {\n\t\twidth: number;\n\t\tcolor: string;\n\t\tstyle?: \"solid\" | \"dashed\" | \"dotted\";\n\t};\n\tleft?: {\n\t\twidth: number;\n\t\tcolor: string;\n\t\tstyle?: \"solid\" | \"dashed\" | \"dotted\";\n\t};\n\tright?: {\n\t\twidth: number;\n\t\tcolor: string;\n\t\tstyle?: \"solid\" | \"dashed\" | \"dotted\";\n\t};\n}\n\n/**\n * BoxDecoration - Complete decoration specification (Flutter pattern)\n */\nexport interface BoxDecoration {\n\t// Color (bottom layer)\n\tcolor?: string;\n\n\t// Image (above color)\n\timage?: DecorationImage;\n\n\t// Gradient (above color, below image)\n\tgradient?: Gradient;\n\n\t// Border\n\tborder?: BoxBorder | string; // Can be BoxBorder object or CSS string\n\n\t// Border radius (ignored if shape is circle)\n\tborderRadius?: number | string;\n\n\t// Shape - circle or rectangle\n\tshape?: BoxShape;\n\n\t// Box shadows (array for multiple shadows)\n\tboxShadow?: BoxShadow[];\n\n\t// Blend mode\n\tbackgroundBlendMode?: string;\n\n\t// Quick properties\n\topacity?: number;\n}\n\n/**\n * Box constraints (Flutter pattern)\n */\nexport interface BoxConstraints {\n\tminWidth?: number | string;\n\tmaxWidth?: number | string;\n\tminHeight?: number | string;\n\tmaxHeight?: number | string;\n}\n\n/**\n * Alignment options (Flutter pattern)\n */\nexport type Alignment =\n\t| \"topLeft\"\n\t| \"topCenter\"\n\t| \"topRight\"\n\t| \"centerLeft\"\n\t| \"center\"\n\t| \"centerRight\"\n\t| \"bottomLeft\"\n\t| \"bottomCenter\"\n\t| \"bottomRight\";\n\n/**\n * Container Props - Mirrors Flutter Container API\n */\nexport interface ContainerProps {\n\tchildren?: ReactNode;\n\twidth?: number | string;\n\theight?: number | string;\n\n\t// Padding\n\tpadding?: number | EdgeInsets;\n\tpaddingHorizontal?: number;\n\tpaddingVertical?: number;\n\tpaddingTop?: number;\n\tpaddingBottom?: number;\n\tpaddingLeft?: number;\n\tpaddingRight?: number;\n\n\t// Margin\n\tmargin?: number | EdgeInsets;\n\tmarginHorizontal?: number;\n\tmarginVertical?: number;\n\tmarginTop?: number;\n\tmarginBottom?: number;\n\tmarginLeft?: number;\n\tmarginRight?: number;\n\n\t// Decoration (Flutter BoxDecoration)\n\tdecoration?: BoxDecoration;\n\tforegroundDecoration?: BoxDecoration;\n\tcolor?: string; // Shorthand\n\n\talignment?: Alignment;\n\tconstraints?: BoxConstraints;\n\ttransform?: string;\n\ttransformAlignment?: Alignment;\n\tclipBehavior?: \"none\" | \"hardEdge\" | \"antiAlias\";\n\n\tonTap?: () => void;\n\tonClick?: () => void;\n\tcursor?: \"pointer\" | \"default\" | \"text\" | \"none\";\n\n\tclassName?: string;\n\tstyle?: CSSProperties;\n\tid?: string;\n\trole?: string;\n\tariaLabel?: string;\n}\n\n// ============================================================================\n// HELPER FUNCTIONS\n// ============================================================================\n\n/**\n * Converts EdgeInsets to CSS string\n */\nfunction edgeInsetsToCSS(\n\tinsets: number | EdgeInsets | undefined,\n): string | undefined {\n\tif (insets === undefined) return undefined;\n\tif (typeof insets === \"number\") return `${insets}px`;\n\n\t// Handle 'all' property\n\tif (\"all\" in insets) {\n\t\treturn `${insets.all}px`;\n\t}\n\n\t// Handle 'horizontal' and 'vertical' properties\n\tif (\"horizontal\" in insets || \"vertical\" in insets) {\n\t\tconst horizontal = insets.horizontal ?? 0;\n\t\tconst vertical = insets.vertical ?? 0;\n\t\treturn `${vertical}px ${horizontal}px`;\n\t}\n\n\t// Handle individual sides\n\tif (\n\t\t\"top\" in insets ||\n\t\t\"right\" in insets ||\n\t\t\"bottom\" in insets ||\n\t\t\"left\" in insets\n\t) {\n\t\tconst { top = 0, right = 0, bottom = 0, left = 0 } = insets;\n\t\treturn `${top}px ${right}px ${bottom}px ${left}px`;\n\t}\n\n\t// Fallback\n\treturn \"0px\";\n}\n\n/**\n * Resolves padding with priority\n */\nfunction resolvePadding(props: ContainerProps): {\n\ttop?: number;\n\tright?: number;\n\tbottom?: number;\n\tleft?: number;\n} {\n\tconst base: { top?: number; right?: number; bottom?: number; left?: number } =\n\t\t{};\n\n\tif (typeof props.padding === \"number\") {\n\t\tbase.top = base.bottom = base.left = base.right = props.padding;\n\t} else if (props.padding) {\n\t\t// Handle 'all' property\n\t\tif (\"all\" in props.padding) {\n\t\t\tbase.top = base.bottom = base.left = base.right = props.padding.all;\n\t\t}\n\t\t// Handle 'horizontal' and 'vertical' properties\n\t\telse if (\"horizontal\" in props.padding || \"vertical\" in props.padding) {\n\t\t\tif (props.padding.horizontal !== undefined) {\n\t\t\t\tbase.left = base.right = props.padding.horizontal;\n\t\t\t}\n\t\t\tif (props.padding.vertical !== undefined) {\n\t\t\t\tbase.top = base.bottom = props.padding.vertical;\n\t\t\t}\n\t\t}\n\t\t// Handle individual sides\n\t\telse {\n\t\t\tObject.assign(base, props.padding);\n\t\t}\n\t}\n\n\tif (props.paddingHorizontal !== undefined) {\n\t\tbase.left = base.right = props.paddingHorizontal;\n\t}\n\tif (props.paddingVertical !== undefined) {\n\t\tbase.top = base.bottom = props.paddingVertical;\n\t}\n\n\tif (props.paddingTop !== undefined) base.top = props.paddingTop;\n\tif (props.paddingBottom !== undefined) base.bottom = props.paddingBottom;\n\tif (props.paddingLeft !== undefined) base.left = props.paddingLeft;\n\tif (props.paddingRight !== undefined) base.right = props.paddingRight;\n\n\treturn base;\n}\n\n/**\n * Resolves margin with priority\n */\nfunction resolveMargin(props: ContainerProps): {\n\ttop?: number;\n\tright?: number;\n\tbottom?: number;\n\tleft?: number;\n} {\n\tconst base: { top?: number; right?: number; bottom?: number; left?: number } =\n\t\t{};\n\n\tif (typeof props.margin === \"number\") {\n\t\tbase.top = base.bottom = base.left = base.right = props.margin;\n\t} else if (props.margin) {\n\t\t// Handle 'all' property\n\t\tif (\"all\" in props.margin) {\n\t\t\tbase.top = base.bottom = base.left = base.right = props.margin.all;\n\t\t}\n\t\t// Handle 'horizontal' and 'vertical' properties\n\t\telse if (\"horizontal\" in props.margin || \"vertical\" in props.margin) {\n\t\t\tif (props.margin.horizontal !== undefined) {\n\t\t\t\tbase.left = base.right = props.margin.horizontal;\n\t\t\t}\n\t\t\tif (props.margin.vertical !== undefined) {\n\t\t\t\tbase.top = base.bottom = props.margin.vertical;\n\t\t\t}\n\t\t}\n\t\t// Handle individual sides\n\t\telse {\n\t\t\tObject.assign(base, props.margin);\n\t\t}\n\t}\n\n\tif (props.marginHorizontal !== undefined) {\n\t\tbase.left = base.right = props.marginHorizontal;\n\t}\n\tif (props.marginVertical !== undefined) {\n\t\tbase.top = base.bottom = props.marginVertical;\n\t}\n\n\tif (props.marginTop !== undefined) base.top = props.marginTop;\n\tif (props.marginBottom !== undefined) base.bottom = props.marginBottom;\n\tif (props.marginLeft !== undefined) base.left = props.marginLeft;\n\tif (props.marginRight !== undefined) base.right = props.marginRight;\n\n\treturn base;\n}\n\n/**\n * Maps Flutter Alignment to CSS flexbox\n */\nfunction alignmentToFlexbox(alignment?: Alignment): {\n\tjustifyContent?: string;\n\talignItems?: string;\n\tdisplay?: string;\n} {\n\tif (!alignment) return {};\n\n\tconst map: Record<Alignment, { justifyContent: string; alignItems: string }> =\n\t\t{\n\t\t\ttopLeft: { justifyContent: \"flex-start\", alignItems: \"flex-start\" },\n\t\t\ttopCenter: { justifyContent: \"center\", alignItems: \"flex-start\" },\n\t\t\ttopRight: { justifyContent: \"flex-end\", alignItems: \"flex-start\" },\n\t\t\tcenterLeft: { justifyContent: \"flex-start\", alignItems: \"center\" },\n\t\t\tcenter: { justifyContent: \"center\", alignItems: \"center\" },\n\t\t\tcenterRight: { justifyContent: \"flex-end\", alignItems: \"center\" },\n\t\t\tbottomLeft: { justifyContent: \"flex-start\", alignItems: \"flex-end\" },\n\t\t\tbottomCenter: { justifyContent: \"center\", alignItems: \"flex-end\" },\n\t\t\tbottomRight: { justifyContent: \"flex-end\", alignItems: \"flex-end\" },\n\t\t};\n\n\treturn {\n\t\tdisplay: \"flex\",\n\t\t...map[alignment],\n\t};\n}\n\n/**\n * Converts BoxShadow array to CSS box-shadow string\n */\nfunction boxShadowToCSS(shadows?: BoxShadow[]): string | undefined {\n\tif (!shadows || shadows.length === 0) return undefined;\n\n\treturn shadows\n\t\t.map((shadow) => {\n\t\t\tconst dx = shadow.offset?.dx || 0;\n\t\t\tconst dy = shadow.offset?.dy || 0;\n\t\t\tconst blur = shadow.blurRadius || 0;\n\t\t\tconst spread = shadow.spreadRadius || 0;\n\t\t\tconst color = shadow.color || \"rgba(0, 0, 0, 0.1)\";\n\n\t\t\treturn `${dx}px ${dy}px ${blur}px ${spread}px ${color}`;\n\t\t})\n\t\t.join(\", \");\n}\n\n/**\n * Converts Gradient to CSS gradient string\n */\nfunction gradientToCSS(gradient?: Gradient): string | undefined {\n\tif (!gradient || gradient.colors.length === 0) return undefined;\n\n\tconst { type = \"linear\", colors, stops, begin = \"to right\" } = gradient;\n\n\tlet colorStops: string;\n\tif (stops && stops.length === colors.length) {\n\t\tcolorStops = colors\n\t\t\t.map((color, i) => `${color} ${stops[i] * 100}%`)\n\t\t\t.join(\", \");\n\t} else {\n\t\tcolorStops = colors.join(\", \");\n\t}\n\n\tif (type === \"radial\") {\n\t\treturn `radial-gradient(${gradient.center || \"circle\"}, ${colorStops})`;\n\t}\n\n\treturn `linear-gradient(${begin}, ${colorStops})`;\n}\n\n/**\n * Converts BoxBorder to CSS border string\n */\nfunction borderToCSS(border?: BoxBorder | string): CSSProperties {\n\tif (!border) return {};\n\tif (typeof border === \"string\") return { border };\n\n\tconst styles: CSSProperties = {};\n\n\tif (border.top) {\n\t\tconst { width, color, style = \"solid\" } = border.top;\n\t\tstyles.borderTop = `${width}px ${style} ${color}`;\n\t}\n\tif (border.bottom) {\n\t\tconst { width, color, style = \"solid\" } = border.bottom;\n\t\tstyles.borderBottom = `${width}px ${style} ${color}`;\n\t}\n\tif (border.left) {\n\t\tconst { width, color, style = \"solid\" } = border.left;\n\t\tstyles.borderLeft = `${width}px ${style} ${color}`;\n\t}\n\tif (border.right) {\n\t\tconst { width, color, style = \"solid\" } = border.right;\n\t\tstyles.borderRight = `${width}px ${style} ${color}`;\n\t}\n\n\treturn styles;\n}\n\n/**\n * Builds BoxDecoration CSS (Flutter painting order)\n */\nfunction decorationToCSS(\n\tdecoration?: BoxDecoration,\n\tcolorProp?: string,\n): CSSProperties {\n\tconst styles: CSSProperties = {};\n\n\tif (!decoration && !colorProp) return styles;\n\n\tconst dec = decoration || {};\n\n\t// 1. Background color (bottom layer)\n\tconst bgColor = colorProp || dec.color;\n\tif (bgColor) styles.backgroundColor = bgColor;\n\n\t// 2. Gradient (above color)\n\tconst gradientCSS = gradientToCSS(dec.gradient);\n\tif (gradientCSS) styles.backgroundImage = gradientCSS;\n\n\t// 3. Background image (above gradient)\n\tif (dec.image) {\n\t\tconst img = dec.image;\n\t\tstyles.backgroundImage = `url(${img.image})`;\n\t\tstyles.backgroundSize = img.fit || \"cover\";\n\t\tstyles.backgroundPosition = img.alignment || \"center\";\n\t\tstyles.backgroundRepeat = img.repeat || \"no-repeat\";\n\n\t\tif (img.opacity !== undefined) {\n\t\t\tstyles.opacity = img.opacity;\n\t\t}\n\t}\n\n\t// 4. Shape handling (Flutter spec: circle ignores borderRadius)\n\tif (dec.shape === BoxShape.circle) {\n\t\tstyles.borderRadius = \"50%\"; // Perfect circle\n\t\tstyles.aspectRatio = \"1 / 1\"; // Enforce square for perfect circle\n\t} else if (dec.borderRadius !== undefined) {\n\t\tstyles.borderRadius =\n\t\t\ttypeof dec.borderRadius === \"number\"\n\t\t\t\t? `${dec.borderRadius}px`\n\t\t\t\t: dec.borderRadius;\n\t}\n\n\t// 5. Border (painted above background)\n\tObject.assign(styles, borderToCSS(dec.border));\n\n\t// 6. Box shadow (painted below everything)\n\tconst shadowCSS = boxShadowToCSS(dec.boxShadow);\n\tif (shadowCSS) styles.boxShadow = shadowCSS;\n\n\t// 7. Blend mode\n\tif (dec.backgroundBlendMode) {\n\t\t// biome-ignore lint/suspicious/noExplicitAny: <explanation>\n\t\tstyles.backgroundBlendMode = dec.backgroundBlendMode as any;\n\t}\n\n\t// 8. Opacity\n\tif (dec.opacity !== undefined) {\n\t\tstyles.opacity = dec.opacity;\n\t}\n\n\treturn styles;\n}\n\n/**\n * Normalizes dimension values\n */\nfunction normalizeDimension(value?: number | string): string | undefined {\n\tif (value === undefined) return undefined;\n\treturn typeof value === \"number\" ? `${value}px` : value;\n}\n\n/**\n * Maps alignment to transform-origin\n */\nfunction alignmentToTransformOrigin(alignment: Alignment): string {\n\tconst map: Record<Alignment, string> = {\n\t\ttopLeft: \"top left\",\n\t\ttopCenter: \"top center\",\n\t\ttopRight: \"top right\",\n\t\tcenterLeft: \"center left\",\n\t\tcenter: \"center\",\n\t\tcenterRight: \"center right\",\n\t\tbottomLeft: \"bottom left\",\n\t\tbottomCenter: \"bottom center\",\n\t\tbottomRight: \"bottom right\",\n\t};\n\treturn map[alignment];\n}\n\n// ============================================================================\n// CONTAINER COMPONENT\n// ============================================================================\n\n/**\n * Container - Flutter-style box model component\n *\n * @example Basic usage\n * ```\n * <Container padding={16} color=\"#eb1660\">\n * <Text>Hello</Text>\n * </Container>\n * ```\n *\n * @example Circular container (Flutter BoxShape.circle)\n * ```\n * <Container\n * width={100}\n * height={100}\n * decoration={{\n * color: '#eb1660',\n * shape: BoxShape.circle\n * }}\n * />\n * ```\n *\n * @example Gradient with shadows\n * ```\n * <Container\n * padding={20}\n * decoration={{\n * gradient: {\n * colors: ['#eb1660', '#ff6b9d'],\n * begin: '45deg'\n * },\n * borderRadius: 12,\n * boxShadow: [\n * { color: 'rgba(235, 22, 96, 0.3)', offset: { dx: 0, dy: 4 }, blurRadius: 12 }\n * ]\n * }}\n * />\n * ```\n */\nexport const Container: React.FC<ContainerProps> = ({\n\tchildren,\n\twidth,\n\theight,\n\tpadding,\n\tpaddingHorizontal,\n\tpaddingVertical,\n\tpaddingTop,\n\tpaddingBottom,\n\tpaddingLeft,\n\tpaddingRight,\n\tmargin,\n\tmarginHorizontal,\n\tmarginVertical,\n\tmarginTop,\n\tmarginBottom,\n\tmarginLeft,\n\tmarginRight,\n\tdecoration,\n\tforegroundDecoration,\n\tcolor,\n\talignment,\n\tconstraints,\n\ttransform,\n\ttransformAlignment,\n\tclipBehavior = \"none\",\n\tonTap,\n\tonClick,\n\tcursor,\n\tclassName = \"\",\n\tstyle = {},\n\tid,\n\trole,\n\tariaLabel,\n}) => {\n\tconst resolvedPadding = resolvePadding({\n\t\tpadding,\n\t\tpaddingHorizontal,\n\t\tpaddingVertical,\n\t\tpaddingTop,\n\t\tpaddingBottom,\n\t\tpaddingLeft,\n\t\tpaddingRight,\n\t});\n\n\tconst resolvedMargin = resolveMargin({\n\t\tmargin,\n\t\tmarginHorizontal,\n\t\tmarginVertical,\n\t\tmarginTop,\n\t\tmarginBottom,\n\t\tmarginLeft,\n\t\tmarginRight,\n\t});\n\n\t// Build container styles (Flutter painting order)\n\tconst containerStyles: CSSProperties = {\n\t\t// Margin (outermost)\n\t\tmargin: edgeInsetsToCSS(resolvedMargin),\n\n\t\t// Dimensions\n\t\twidth: normalizeDimension(width),\n\t\theight: normalizeDimension(height),\n\n\t\t// Constraints\n\t\tminWidth: normalizeDimension(constraints?.minWidth),\n\t\tmaxWidth: normalizeDimension(constraints?.maxWidth),\n\t\tminHeight: normalizeDimension(constraints?.minHeight),\n\t\tmaxHeight: normalizeDimension(constraints?.maxHeight),\n\n\t\t// Padding\n\t\tpadding: edgeInsetsToCSS(resolvedPadding),\n\n\t\t// Decoration (background layer)\n\t\t...decorationToCSS(decoration, color),\n\n\t\t// Alignment\n\t\t...alignmentToFlexbox(alignment),\n\n\t\t// Transform\n\t\ttransform: transform,\n\t\ttransformOrigin: transformAlignment\n\t\t\t? alignmentToTransformOrigin(transformAlignment)\n\t\t\t: undefined,\n\n\t\t// Clip behavior\n\t\toverflow: clipBehavior === \"none\" ? \"visible\" : \"hidden\",\n\n\t\t// Cursor\n\t\tcursor: cursor || (onTap || onClick ? \"pointer\" : undefined),\n\n\t\t// Box sizing\n\t\tboxSizing: \"border-box\",\n\n\t\t// Position for stacking\n\t\tposition: \"relative\",\n\n\t\t// Custom styles (escape hatch)\n\t\t...style,\n\t};\n\n\tconst handleClick = onTap || onClick;\n\n\treturn (\n\t\t// biome-ignore lint/a11y/useKeyWithClickEvents: <explanation>\n\t\t<div\n\t\t\tid={id}\n\t\t\tclassName={className}\n\t\t\tstyle={containerStyles}\n\t\t\tonClick={handleClick}\n\t\t\trole={role}\n\t\t\taria-label={ariaLabel}\n\t\t>\n\t\t\t{children}\n\n\t\t\t{/* Foreground decoration (painted on top) */}\n\t\t\t{foregroundDecoration && (\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tposition: \"absolute\",\n\t\t\t\t\t\ttop: 0,\n\t\t\t\t\t\tleft: 0,\n\t\t\t\t\t\tright: 0,\n\t\t\t\t\t\tbottom: 0,\n\t\t\t\t\t\tpointerEvents: \"none\",\n\t\t\t\t\t\t...decorationToCSS(foregroundDecoration),\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n\n// ============================================================================\n// HELPER FUNCTIONS (Flutter-like API)\n// ============================================================================\n\nexport const EdgeInsetsAll = (value: number): EdgeInsets => ({\n\tall: value,\n});\n\nexport const EdgeInsetsSymmetric = ({\n\thorizontal = 0,\n\tvertical = 0,\n}: {\n\thorizontal?: number;\n\tvertical?: number;\n}): EdgeInsets => ({\n\thorizontal,\n\tvertical,\n});\n\nexport const EdgeInsetsOnly = ({\n\ttop,\n\tbottom,\n\tleft,\n\tright,\n}: {\n\ttop?: number;\n\tbottom?: number;\n\tleft?: number;\n\tright?: number;\n}): EdgeInsets => ({\n\ttop,\n\tbottom,\n\tleft,\n\tright,\n});\n\n/**\n * Border.all() - Uniform border on all sides (Flutter API)\n */\nexport const BorderAll = ({\n\twidth = 1,\n\tcolor = \"currentColor\",\n\tstyle = \"solid\" as \"solid\" | \"dashed\" | \"dotted\",\n}): BoxBorder => ({\n\ttop: { width, color, style },\n\tbottom: { width, color, style },\n\tleft: { width, color, style },\n\tright: { width, color, style },\n});\n\n/**\n * BorderRadius.circular() - Uniform circular radius (Flutter API)\n */\nexport const BorderRadiusCircular = (radius: number): number => radius;\n\nexport default Container;\n","\"use client\";\n\nimport type React from \"react\";\nimport type { CSSProperties, ReactNode } from \"react\";\n\n// ============================================================================\n// TYPES\n// ============================================================================\n\n/**\n * Centre Props - Mirrors Flutter Center widget\n */\nexport interface CentreProps {\n\t/**\n\t * The child widget to center\n\t */\n\tchildren?: ReactNode;\n\n\t/**\n\t * If non-null, sets its width to the child's width multiplied by this factor.\n\t *\n\t * For example, if widthFactor is 2.0, the Centre will be twice as wide as its child.\n\t * If null (default), the Centre will be as wide as its parent allows.\n\t *\n\t * @example\n\t * ```\n\t * // Centre will be exactly as wide as the child\n\t * <Centre widthFactor={1.0}>\n\t * <Text>Hello</Text>\n\t * </Centre>\n\t *\n\t * // Centre will be 1.5x wider than the child\n\t * <Centre widthFactor={1.5}>\n\t * <Text>Hello</Text>\n\t * </Centre>\n\t * ```\n\t */\n\twidthFactor?: number;\n\n\t/**\n\t * If non-null, sets its height to the child's height multiplied by this factor.\n\t *\n\t * For example, if heightFactor is 2.0, the Centre will be twice as tall as its child.\n\t * If null (default), the Centre will be as tall as its parent allows.\n\t */\n\theightFactor?: number;\n\n\t/**\n\t * Additional CSS class names (for Tailwind utilities)\n\t */\n\tclassName?: string;\n\n\t/**\n\t * Custom inline styles (escape hatch)\n\t */\n\tstyle?: CSSProperties;\n\n\t/**\n\t * HTML id attribute\n\t */\n\tid?: string;\n}\n\n// ============================================================================\n// CENTRE COMPONENT\n// ============================================================================\n\n/**\n * Centre - Centers its child both horizontally and vertically\n *\n * Behavior (Flutter spec):\n * - If widthFactor and heightFactor are null: expands to fill parent\n * - If widthFactor is set: width = child's width × widthFactor\n * - If heightFactor is set: height = child's height × heightFactor\n * - Always centers the child within the available space\n *\n * @example Basic usage\n * ```\n * <Centre>\n * <Text>Centered text</Text>\n * </Centre>\n * ```\n *\n * @example With size factors\n * ```\n * <Centre widthFactor={1.5} heightFactor={2.0}>\n * <Container width={100} height={50}>\n * <Text>Box</Text>\n * </Container>\n * </Centre>\n * // Result: Centre will be 150px wide (100 × 1.5) and 100px tall (50 × 2.0)\n * ```\n *\n * @example Full screen center\n * ```\n * <Centre style={{ minHeight: '100vh' }}>\n * <Container padding={20}>\n * <Text>Perfectly centered on screen</Text>\n * </Container>\n * </Centre>\n * ```\n */\nexport const Centre: React.FC<CentreProps> = ({\n\tchildren,\n\twidthFactor,\n\theightFactor,\n\tclassName = \"\",\n\tstyle = {},\n\tid,\n}) => {\n\t// Build container styles\n\tconst containerStyles: CSSProperties = {\n\t\t// Always use flexbox for centering\n\t\tdisplay: \"flex\",\n\t\tjustifyContent: \"center\",\n\t\talignItems: \"center\",\n\n\t\t// Size behavior (Flutter spec):\n\t\t// - If factor is null: expand to fill parent (width/height: 100%)\n\t\t// - If factor is set: size will be determined by child (fit-content)\n\t\twidth: widthFactor === undefined ? \"100%\" : \"fit-content\",\n\t\theight: heightFactor === undefined ? \"100%\" : \"fit-content\",\n\n\t\t// Box sizing\n\t\tboxSizing: \"border-box\",\n\n\t\t// Custom styles (escape hatch)\n\t\t...style,\n\t};\n\n\t// If widthFactor or heightFactor is set, we need a wrapper to apply the scaling\n\tif (widthFactor !== undefined || heightFactor !== undefined) {\n\t\treturn (\n\t\t\t<div id={id} className={className} style={containerStyles}>\n\t\t\t\t<div\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\ttransform: `scale(${widthFactor || 1}, ${heightFactor || 1})`,\n\t\t\t\t\t\ttransformOrigin: \"center\",\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{children}\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t);\n\t}\n\n\t// Simple case: no size factors, just center the child\n\treturn (\n\t\t<div id={id} className={className} style={containerStyles}>\n\t\t\t{children}\n\t\t</div>\n\t);\n};\n\n// ============================================================================\n// CONVENIENCE ALIASES\n// ============================================================================\n\n/**\n * Center - American English spelling alias\n */\nexport const Center = Centre;\n\nexport default Centre;\n","\"use client\";\n\nimport type React from \"react\";\nimport type { CSSProperties, ReactNode } from \"react\";\n\n// ============================================================================\n// ENUMS - Flutter Alignment Types\n// ============================================================================\n\n/**\n * MainAxisAlignment - How to distribute children along the main axis (vertical for Column)\n */\nexport enum MainAxisAlignment {\n\t/** Place children at the start (top) */\n\tstart = \"flex-start\",\n\n\t/** Place children at the center */\n\tcenter = \"center\",\n\n\t/** Place children at the end (bottom) */\n\tend = \"flex-end\",\n\n\t/** Distribute remaining space evenly between children */\n\tspaceBetween = \"space-between\",\n\n\t/** Distribute remaining space evenly around children */\n\tspaceAround = \"space-around\",\n\n\t/** Distribute remaining space evenly, including edges */\n\tspaceEvenly = \"space-evenly\",\n}\n\n/**\n * CrossAxisAlignment - How to align children along the cross axis (horizontal for Column)\n */\nexport enum CrossAxisAlignment {\n\t/** Align children to the start (left) */\n\tstart = \"flex-start\",\n\n\t/** Align children to the center */\n\tcenter = \"center\",\n\n\t/** Align children to the end (right) */\n\tend = \"flex-end\",\n\n\t/** Stretch children to fill cross axis */\n\tstretch = \"stretch\",\n\n\t/** Align children by their baseline (for text) */\n\tbaseline = \"baseline\",\n}\n\n/**\n * MainAxisSize - How much space should be occupied in the main axis\n */\nexport enum MainAxisSize {\n\t/** Take up maximum available space */\n\tmax = \"max\",\n\n\t/** Take up minimum space (wrap content) */\n\tmin = \"min\",\n}\n\n/**\n * VerticalDirection - Order of children\n */\nexport enum VerticalDirection {\n\t/** Top to bottom (normal) */\n\tdown = \"down\",\n\n\t/** Bottom to top (reversed) */\n\tup = \"up\",\n}\n\n// ============================================================================\n// TYPES\n// ============================================================================\n\n/**\n * Column Props - Mirrors Flutter Column widget\n */\nexport interface ColumnProps {\n\t/**\n\t * The widgets to display vertically\n\t */\n\tchildren?: ReactNode;\n\n\t/**\n\t * How the children should be placed along the main axis (vertical)\n\t *\n\t * @default MainAxisAlignment.start\n\t *\n\t * @example\n\t * ```\n\t * // Children at top\n\t * <Column mainAxisAlignment={MainAxisAlignment.start}>\n\t *\n\t * // Children centered vertically\n\t * <Column mainAxisAlignment={MainAxisAlignment.center}>\n\t *\n\t * // Space between children\n\t * <Column mainAxisAlignment={MainAxisAlignment.spaceBetween}>\n\t * ```\n\t */\n\tmainAxisAlignment?: MainAxisAlignment;\n\n\t/**\n\t * How the children should be placed along the cross axis (horizontal)\n\t *\n\t * @default CrossAxisAlignment.center\n\t *\n\t * @example\n\t * ```\n\t * // Left-aligned children\n\t * <Column crossAxisAlignment={CrossAxisAlignment.start}>\n\t *\n\t * // Stretch children to full width\n\t * <Column crossAxisAlignment={CrossAxisAlignment.stretch}>\n\t * ```\n\t */\n\tcrossAxisAlignment?: CrossAxisAlignment;\n\n\t/**\n\t * How much space should be occupied in the main axis\n\t *\n\t * @default MainAxisSize.max\n\t *\n\t * @example\n\t * ```\n\t * // Column takes all available height\n\t * <Column mainAxisSize={MainAxisSize.max}>\n\t *\n\t * // Column wraps to fit children height\n\t * <Column mainAxisSize={MainAxisSize.min}>\n\t * ```\n\t */\n\tmainAxisSize?: MainAxisSize;\n\n\t/**\n\t * The direction to lay children (top-to-bottom or bottom-to-top)\n\t *\n\t * @default VerticalDirection.down\n\t */\n\tverticalDirection?: VerticalDirection;\n\n\t/**\n\t * How much space to place between children in the main axis\n\t *\n\t * @default 0\n\t *\n\t * @example\n\t * ```\n\t * // 16px gap between all children\n\t * <Column spacing={16}>\n\t * <Container>Child 1</Container>\n\t * <Container>Child 2</Container>\n\t * </Column>\n\t * ```\n\t */\n\tspacing?: number;\n\n\t/**\n\t * Whether to clip children that overflow the column\n\t *\n\t * @default 'visible'\n\t */\n\tclipBehavior?: \"visible\" | \"hidden\" | \"scroll\";\n\n\t/**\n\t * Additional CSS class names (for Tailwind utilities)\n\t */\n\tclassName?: string;\n\n\t/**\n\t * Custom inline styles (escape hatch)\n\t */\n\tstyle?: CSSProperties;\n\n\t/**\n\t * HTML id attribute\n\t */\n\tid?: string;\n\n\t/**\n\t * Click handler\n\t */\n\tonTap?: () => void;\n\tonClick?: () => void;\n}\n\n// ============================================================================\n// COLUMN COMPONENT\n// ============================================================================\n\n/**\n * Column - Displays children in a vertical array\n *\n * Layout algorithm (Flutter spec):\n * 1. Layout non-flex children with unbounded vertical constraints\n * 2. Divide remaining vertical space among flex children (Expanded)\n * 3. Width = maximum width of children\n * 4. Height = determined by mainAxisSize (max = fill parent, min = wrap content)\n * 5. Position children according to mainAxisAlignment and crossAxisAlignment\n *\n * @example Basic vertical layout\n * ```\n * <Column>\n * <Text>First</Text>\n * <Text>Second</Text>\n * <Text>Third</Text>\n * </Column>\n * ```\n *\n * @example Centered with spacing\n * ```\n * <Column\n * mainAxisAlignment={MainAxisAlignment.center}\n * crossAxisAlignment={CrossAxisAlignment.center}\n * spacing={16}\n * >\n * <Container padding={10}>Box 1</Container>\n * <Container padding={10}>Box 2</Container>\n * <Container padding={10}>Box 3</Container>\n * </Column>\n * ```\n *\n * @example Left-aligned, wrapping content\n * ```\n * <Column\n * mainAxisSize={MainAxisSize.min}\n * crossAxisAlignment={CrossAxisAlignment.start}\n * spacing={8}\n * >\n * <Text>Line 1</Text>\n * <Text>Line 2</Text>\n * <Text>Line 3</Text>\n * </Column>\n * ```\n *\n * @example Space between items\n * ```\n * <Column\n * mainAxisAlignment={MainAxisAlignment.spaceBetween}\n * style={{ height: '100vh' }}\n * >\n * <Header />\n * <Content />\n * <Footer />\n * </Column>\n * ```\n */\nexport const Column: React.FC<ColumnProps> = ({\n\tchildren,\n\tmainAxisAlignment = MainAxisAlignment.start,\n\tcrossAxisAlignment = CrossAxisAlignment.center,\n\tmainAxisSize = MainAxisSize.max,\n\tverticalDirection = VerticalDirection.down,\n\tspacing = 0,\n\tclipBehavior = \"visible\",\n\tclassName = \"\",\n\tstyle = {},\n\tid,\n\tonTap,\n\tonClick,\n}) => {\n\t// Build column styles\n\tconst columnStyles: CSSProperties = {\n\t\t// Flexbox for vertical layout\n\t\tdisplay: \"flex\",\n\t\tflexDirection:\n\t\t\tverticalDirection === VerticalDirection.down\n\t\t\t\t? \"column\"\n\t\t\t\t: \"column-reverse\",\n\n\t\t// Main axis alignment (vertical)\n\t\tjustifyContent: mainAxisAlignment,\n\n\t\t// Cross axis alignment (horizontal)\n\t\talignItems: crossAxisAlignment,\n\n\t\t// Main axis size behavior\n\t\theight: mainAxisSize === MainAxisSize.max ? \"100%\" : \"auto\",\n\t\tminHeight: mainAxisSize === MainAxisSize.min ? \"auto\" : undefined,\n\n\t\t// Spacing between children (CSS gap for clean implementation)\n\t\tgap: spacing > 0 ? `${spacing}px` : undefined,\n\n\t\t// Clip behavior\n\t\toverflow: clipBehavior,\n\n\t\t// Box sizing\n\t\tboxSizing: \"border-box\",\n\n\t\t// Width behavior (Flutter spec: width = max width of children)\n\t\twidth: \"100%\", // Default to full width, children can control their own width\n\n\t\t// Custom styles (escape hatch)\n\t\t...style,\n\t};\n\n\tconst handleClick = onTap || onClick;\n\n\treturn (\n\t\t// biome-ignore lint/a11y/useKeyWithClickEvents: <explanation>\n\t\t<div\n\t\t\tid={id}\n\t\t\tclassName={className}\n\t\t\tstyle={columnStyles}\n\t\t\tonClick={handleClick}\n\t\t>\n\t\t\t{children}\n\t\t</div>\n\t);\n};\n\nexport default Column;\n","\"use client\";\n\nimport type React from \"react\";\nimport type { CSSProperties, ReactNode } from \"react\";\n\n// ============================================================================\n// ENUMS - Re-export from Column for consistency\n// ============================================================================\n\n/**\n * MainAxisAlignment - How to distribute children along the main axis (horizontal for Row)\n */\nexport enum MainAxisAlignment {\n\t/** Place children at the start (left for LTR, right for RTL) */\n\tstart = \"flex-start\",\n\n\t/** Place children at the center */\n\tcenter = \"center\",\n\n\t/** Place children at the end (right for LTR, left for RTL) */\n\tend = \"flex-end\",\n\n\t/** Distribute remaining space evenly between children */\n\tspaceBetween = \"space-between\",\n\n\t/** Distribute remaining space evenly around children */\n\tspaceAround = \"space-around\",\n\n\t/** Distribute remaining space evenly, including edges */\n\tspaceEvenly = \"space-evenly\",\n}\n\n/**\n * CrossAxisAlignment - How to align children along the cross axis (vertical for Row)\n */\nexport enum CrossAxisAlignment {\n\t/** Align children to the start (top) */\n\tstart = \"flex-start\",\n\n\t/** Align children to the center */\n\tcenter = \"center\",\n\n\t/** Align children to the end (bottom) */\n\tend = \"flex-end\",\n\n\t/** Stretch children to fill cross axis */\n\tstretch = \"stretch\",\n\n\t/** Align children by their baseline (for text) */\n\tbaseline = \"baseline\",\n}\n\n/**\n * MainAxisSize - How much space should be occupied in the main axis\n */\nexport enum MainAxisSize {\n\t/** Take up maximum available space */\n\tmax = \"max\",\n\n\t/** Take up minimum space (wrap content) */\n\tmin = \"min\",\n}\n\n/**\n * TextDirection - Horizontal layout direction\n */\nexport enum TextDirection {\n\t/** Left to right (default for most languages) */\n\tltr = \"ltr\",\n\n\t/** Right to left (for Arabic, Hebrew, etc.) */\n\trtl = \"rtl\",\n}\n\n// ============================================================================\n// TYPES\n// ============================================================================\n\n/**\n * Row Props - Mirrors Flutter Row widget\n */\nexport interface RowProps {\n\t/**\n\t * The widgets to display horizontally\n\t */\n\tchildren?: ReactNode;\n\n\t/**\n\t * How the children should be placed along the main axis (horizontal)\n\t *\n\t * @default MainAxisAlignment.start\n\t *\n\t * @example\n\t * ```\n\t * // Children at left (LTR) or right (RTL)\n\t * <Row mainAxisAlignment={MainAxisAlignment.start}>\n\t *\n\t * // Children centered horizontally\n\t * <Row mainAxisAlignment={MainAxisAlignment.center}>\n\t *\n\t * // Space between children\n\t * <Row mainAxisAlignment={MainAxisAlignment.spaceBetween}>\n\t * ```\n\t */\n\tmainAxisAlignment?: MainAxisAlignment;\n\n\t/**\n\t * How the children should be placed along the cross axis (vertical)\n\t *\n\t * @default CrossAxisAlignment.center\n\t *\n\t * @example\n\t * ```\n\t * // Top-aligned children\n\t * <Row crossAxisAlignment={CrossAxisAlignment.start}>\n\t *\n\t * // Stretch children to full height\n\t * <Row crossAxisAlignment={CrossAxisAlignment.stretch}>\n\t *\n\t * // Baseline-aligned text\n\t * <Row crossAxisAlignment={CrossAxisAlignment.baseline}>\n\t * ```\n\t */\n\tcrossAxisAlignment?: CrossAxisAlignment;\n\n\t/**\n\t * How much space should be occupied in the main axis\n\t *\n\t * @default MainAxisSize.max\n\t *\n\t * @example\n\t * ```\n\t * // Row takes all available width\n\t * <Row mainAxisSize={MainAxisSize.max}>\n\t *\n\t * // Row wraps to fit children width\n\t * <Row mainAxisSize={MainAxisSize.min}>\n\t * ```\n\t */\n\tmainAxisSize?: MainAxisSize;\n\n\t/**\n\t * The direction to lay children (left-to-right or right-to-left)\n\t *\n\t * @default TextDirection.ltr\n\t *\n\t * @example\n\t * ```\n\t * // Left to right (English, Spanish, etc.)\n\t * <Row textDirection={TextDirection.ltr}>\n\t *\n\t * // Right to left (Arabic, Hebrew, etc.)\n\t * <Row textDirection={TextDirection.rtl}>\n\t * ```\n\t */\n\ttextDirection?: TextDirection;\n\n\t/**\n\t * How much space to place between children in the main axis\n\t *\n\t * @default 0\n\t *\n\t * @example\n\t * ```\n\t * // 16px gap between all children\n\t * <Row spacing={16}>\n\t * <Container>Child 1</Container>\n\t * <Container>Child 2</Container>\n\t * </Row>\n\t * ```\n\t */\n\tspacing?: number;\n\n\t/**\n\t * Whether to clip children that overflow the row\n\t *\n\t * @default 'visible'\n\t */\n\tclipBehavior?: \"visible\" | \"hidden\" | \"scroll\";\n\n\t/**\n\t * Additional CSS class names (for Tailwind utilities)\n\t */\n\tclassName?: string;\n\n\t/**\n\t * Custom inline styles (escape hatch)\n\t */\n\tstyle?: CSSProperties;\n\n\t/**\n\t * HTML id attribute\n\t */\n\tid?: string;\n\n\t/**\n\t * Click handler\n\t */\n\tonTap?: () => void;\n\tonClick?: () => void;\n}\n\n// ============================================================================\n// ROW COMPONENT\n// ============================================================================\n\n/**\n * Row - Displays children in a horizontal array\n *\n * Layout algorithm (Flutter spec):\n * 1. Layout non-flex children with unbounded horizontal constraints\n * 2. Divide remaining horizontal space among flex children (Expanded)\n * 3. Height = maximum height of children\n * 4. Width = determined by mainAxisSize (max = fill parent, min = wrap content)\n * 5. Position children according to mainAxisAlignment and crossAxisAlignment\n *\n * **Important:** Row does not scroll. If children overflow, consider using ListView.\n *\n * @example Basic horizontal layout\n * ```\n * <Row>\n * <Container padding={10}>Box 1</Container>\n * <Container padding={10}>Box 2</Container>\n * <Container padding={10}>Box 3</Container>\n * </Row>\n * ```\n *\n * @example Centered with spacing\n * ```\n * <Row\n * mainAxisAlignment={MainAxisAlignment.center}\n * crossAxisAlignment={CrossAxisAlignment.center}\n * spacing={16}\n * >\n * <Container padding={10}>Box 1</Container>\n * <Container padding={10}>Box 2</Container>\n * </Row>\n * ```\n *\n * @example Space between items (navbar pattern)\n * ```\n * <Row mainAxisAlignment={MainAxisAlignment.spaceBetween}>\n * <Logo />\n * <NavLinks />\n * <AuthButtons />\n * </Row>\n * ```\n *\n * @example Right-to-left layout\n * ```\n * <Row textDirection={TextDirection.rtl}>\n * <Text>مرحبا</Text>\n * <Text>بالعالم</Text>\n * </Row>\n * ```\n *\n * @example Icon + Text pattern\n * ```\n * <Row spacing={8} crossAxisAlignment={CrossAxisAlignment.center}>\n * <Icon name=\"star\" />\n * <Text>Premium</Text>\n * </Row>\n * ```\n */\nexport const Row: React.FC<RowProps> = ({\n\tchildren,\n\tmainAxisAlignment = MainAxisAlignment.start,\n\tcrossAxisAlignment = CrossAxisAlignment.center,\n\tmainAxisSize = MainAxisSize.max,\n\ttextDirection = TextDirection.ltr,\n\tspacing = 0,\n\tclipBehavior = \"visible\",\n\tclassName = \"\",\n\tstyle = {},\n\tid,\n\tonTap,\n\tonClick,\n}) => {\n\t// Build row styles\n\tconst rowStyles: CSSProperties = {\n\t\t// Flexbox for horizontal layout\n\t\tdisplay: \"flex\",\n\t\tflexDirection: textDirection === TextDirection.ltr ? \"row\" : \"row-reverse\",\n\n\t\t// Main axis alignment (horizontal)\n\t\tjustifyContent: mainAxisAlignment,\n\n\t\t// Cross axis alignment (vertical)\n\t\talignItems: crossAxisAlignment,\n\n\t\t// Main axis size behavior\n\t\twidth: mainAxisSize === MainAxisSize.max ? \"100%\" : \"auto\",\n\t\tminWidth: mainAxisSize === MainAxisSize.min ? \"auto\" : undefined,\n\n\t\t// Spacing between children (CSS gap for clean implementation)\n\t\tgap: spacing > 0 ? `${spacing}px` : undefined,\n\n\t\t// Clip behavior\n\t\toverflow: clipBehavior,\n\n\t\t// Box sizing\n\t\tboxSizing: \"border-box\",\n\n\t\t// Height behavior (Flutter spec: height = max height of children)\n\t\theight: \"auto\", // Default to auto, children control their own height\n\n\t\t// Custom styles (escape hatch)\n\t\t...style,\n\t};\n\n\tconst handleClick = onTap || onClick;\n\n\treturn (\n\t\t// biome-ignore lint/a11y/useKeyWithClickEvents: <explanation>\n\t\t<div\n\t\t\tid={id}\n\t\t\tclassName={className}\n\t\t\tstyle={rowStyles}\n\t\t\tonClick={handleClick}\n\t\t\tdir={textDirection} // HTML dir attribute for proper text rendering\n\t\t>\n\t\t\t{children}\n\t\t</div>\n\t);\n};\n\nexport default Row;\n","\"use client\";\n\nimport React, { type CSSProperties, type ReactNode } from \"react\";\n\n// ============================================================================\n// ENUMS - Flutter Stack Types\n// ============================================================================\n\n/**\n * StackFit - How to size non-positioned children in the stack\n */\nexport enum StackFit {\n\t/** Non-positioned children are as large as the stack allows (default in web) */\n\texpand = \"expand\",\n\n\t/** Non-positioned children are allowed to be as large as they want */\n\tloose = \"loose\",\n\n\t/** Non-positioned children are forced to be as small as possible */\n\tpassthrough = \"passthrough\",\n}\n\n/**\n * Clip - How content outside bounds should be treated\n */\nexport enum Clip {\n\t/** Clip, but without anti-aliasing */\n\thardEdge = \"hidden\",\n\n\t/** Clip with anti-aliasing */\n\tantiAlias = \"hidden\",\n\n\t/** Clip with anti-aliasing and save layer */\n\tantiAliasWithSaveLayer = \"hidden\",\n\n\t/** Do not clip */\n\tnone = \"visible\",\n}\n\n// ============================================================================\n// TYPES - Stack Alignment\n// ============================================================================\n\n/**\n * Alignment - Predefined alignment positions (Flutter pattern)\n */\nexport type StackAlignment =\n\t| \"topLeft\"\n\t| \"topCenter\"\n\t| \"topRight\"\n\t| \"centerLeft\"\n\t| \"center\"\n\t| \"centerRight\"\n\t| \"bottomLeft\"\n\t| \"bottomCenter\"\n\t| \"bottomRight\";\n\n/**\n * TextDirection - For resolving alignment in RTL contexts\n */\nexport enum TextDirection {\n\tltr = \"ltr\",\n\trtl = \"rtl\",\n}\n\n// ============================================================================\n// TYPES - Stack Props\n// ============================================================================\n\n/**\n * Stack Props - Mirrors Flutter Stack widget\n */\nexport interface StackProps {\n\t/**\n\t * The widgets to stack (painted in order: first = bottom, last = top)\n\t */\n\tchildren?: ReactNode;\n\n\t/**\n\t * How to align non-positioned and partially-positioned children\n\t *\n\t * @default 'topLeft' (LTR) or 'topRight' (RTL)\n\t *\n\t * @example\n\t * ```\n\t * // Center all non-positioned children\n\t * <Stack alignment=\"center\">\n\t * <Container>Background</Container>\n\t * <Container>Centered on top</Container>\n\t * </Stack>\n\t * ```\n\t */\n\talignment?: StackAlignment;\n\n\t/**\n\t * How to size non-positioned children in the stack\n\t *\n\t * @default StackFit.loose\n\t *\n\t * @example\n\t * ```\n\t * // Force children to fill the stack\n\t * <Stack fit={StackFit.expand}>\n\t *\n\t * // Let children size themselves\n\t * <Stack fit={StackFit.loose}>\n\t * ```\n\t */\n\tfit?: StackFit;\n\n\t/**\n\t * Text direction for resolving alignment\n\t *\n\t * @default TextDirection.ltr\n\t */\n\ttextDirection?: TextDirection;\n\n\t/**\n\t * How to clip content that overflows the stack\n\t *\n\t * @default Clip.hardEdge\n\t */\n\tclipBehavior?: Clip;\n\n\t/**\n\t * Additional CSS class names\n\t */\n\tclassName?: string;\n\n\t/**\n\t * Custom inline styles\n\t */\n\tstyle?: CSSProperties;\n\n\t/**\n\t * HTML id attribute\n\t */\n\tid?: string;\n\n\t/**\n\t * Click handler\n\t */\n\tonTap?: () => void;\n\tonClick?: () => void;\n}\n\n// ============================================================================\n// HELPER FUNCTIONS\n// ============================================================================\n\n/**\n * Maps StackAlignment to CSS positioning values\n */\nfunction alignmentToPosition(\n\talignment: StackAlignment,\n\ttextDirection: TextDirection,\n): CSSProperties {\n\t// For RTL, topLeft becomes topRight and vice versa\n\tconst isRTL = textDirection === TextDirection.rtl;\n\n\tconst alignmentMap: Record<StackAlignment, CSSProperties> = {\n\t\ttopLeft: {\n\t\t\ttop: 0,\n\t\t\tleft: isRTL ? undefined : 0,\n\t\t\tright: isRTL ? 0 : undefined,\n\t\t},\n\t\ttopCenter: {\n\t\t\ttop: 0,\n\t\t\tleft: \"50%\",\n\t\t\ttransform: \"translateX(-50%)\",\n\t\t},\n\t\ttopRight: {\n\t\t\ttop: 0,\n\t\t\tright: isRTL ? undefined : 0,\n\t\t\tleft: isRTL ? 0 : undefined,\n\t\t},\n\t\tcenterLeft: {\n\t\t\ttop: \"50%\",\n\t\t\tleft: isRTL ? undefined : 0,\n\t\t\tright: isRTL ? 0 : undefined,\n\t\t\ttransform: \"translateY(-50%)\",\n\t\t},\n\t\tcenter: {\n\t\t\ttop: \"50%\",\n\t\t\tleft: \"50%\",\n\t\t\ttransform: \"translate(-50%, -50%)\",\n\t\t},\n\t\tcenterRight: {\n\t\t\ttop: \"50%\",\n\t\t\tright: isRTL ? undefined : 0,\n\t\t\tleft: isRTL ? 0 : undefined,\n\t\t\ttransform: \"translateY(-50%)\",\n\t\t},\n\t\tbottomLeft: {\n\t\t\tbottom: 0,\n\t\t\tleft: isRTL ? undefined : 0,\n\t\t\tright: isRTL ? 0 : undefined,\n\t\t},\n\t\tbottomCenter: {\n\t\t\tbottom: 0,\n\t\t\tleft: \"50%\",\n\t\t\ttransform: \"translateX(-50%)\",\n\t\t},\n\t\tbottomRight: {\n\t\t\tbottom: 0,\n\t\t\tright: isRTL ? undefined : 0,\n\t\t\tleft: isRTL ? 0 : undefined,\n\t\t},\n\t};\n\n\treturn alignmentMap[alignment];\n}\n\n// ============================================================================\n// STACK COMPONENT\n// ============================================================================\n\n/**\n * Stack - Positions children relative to the edges of its box\n *\n * Layout behavior (Flutter spec):\n * 1. Non-positioned children are positioned according to `alignment`\n * 2. Stack sizes itself to contain all non-positioned children\n * 3. Positioned children are placed relative to stack edges\n * 4. Children are painted in order (first = bottom, last = top)\n *\n * **Important:** Stack children are painted in order. To change z-index, reorder children.\n *\n * @example Basic layering\n * ```\n * <Stack>\n * <Container width={100} height={100} color=\"red\" />\n * <Container width={80} height={80} color=\"green\" />\n * <Container width={60} height={60} color=\"blue\" />\n * </Stack>\n * ```\n *\n * @example Positioned children\n * ```\n * <Stack style={{ width: 300, height: 300 }}>\n * <Container color=\"white\" />\n * <Positioned top={10} left={10}>\n * <Container padding={10} color=\"red\">\n * <p>Top Left</p>\n * </Container>\n * </Positioned>\n * <Positioned bottom={10} right={10}>\n * <Container padding={10} color=\"blue\">\n * <p>Bottom Right</p>\n * </Container>\n * </Positioned>\n * </Stack>\n * ```\n *\n * @example Image with gradient overlay (your hero pattern)\n * ```\n * <Stack style={{ width: '100%', height: '100vh' }}>\n * <Container\n * decoration={{\n * image: {\n * image: '/hero-bg.jpg',\n * fit: 'cover',\n * },\n * }}\n * />\n * <Container\n * decoration={{\n * gradient: {\n * type: 'linear',\n * colors: ['rgba(13, 13, 13, 0)', 'rgba(13, 13, 13, 0.9)'],\n * begin: 'to bottom',\n * },\n * }}\n * />\n * <Positioned bottom={40}>\n * <Container padding={40}>\n * <h1>Hero Title</h1>\n * </Container>\n * </Positioned>\n * </Stack>\n * ```\n */\nexport const Stack: React.FC<StackProps> = ({\n\tchildren,\n\talignment = \"topLeft\",\n\tfit = StackFit.loose,\n\ttextDirection = TextDirection.ltr,\n\tclipBehavior = Clip.hardEdge,\n\tclassName = \"\",\n\tstyle = {},\n\tid,\n\tonTap,\n\tonClick,\n}) => {\n\t// Build stack styles\n\tconst stackStyles: CSSProperties = {\n\t\t// Position context for children\n\t\tposition: \"relative\",\n\n\t\t// Sizing behavior based on fit\n\t\tdisplay: fit === StackFit.expand ? \"flex\" : \"block\",\n\t\twidth: fit === StackFit.expand ? \"100%\" : \"auto\",\n\t\theight: fit === StackFit.expand ? \"100%\" : \"auto\",\n\n\t\t// Clip behavior\n\t\toverflow: clipBehavior,\n\n\t\t// Box sizing\n\t\tboxSizing: \"border-box\",\n\n\t\t// Text direction (for alignment resolution)\n\t\tdirection: textDirection,\n\n\t\t// Custom styles\n\t\t...style,\n\t};\n\n\tconst handleClick = onTap || onClick;\n\n\t// Process children to apply alignment to non-positioned children\n\tconst processedChildren = React.Children.map(children, (child, index) => {\n\t\tif (!React.isValidElement(child)) return child;\n\n\t\t// Check if child is a Positioned component\n\t\t// biome-ignore lint/suspicious/noExplicitAny: <explanation>\n\t\tconst isPositioned = (child.type as any)?.displayName === \"Positioned\";\n\n\t\tif (isPositioned) {\n\t\t\t// Let Positioned handle its own positioning\n\t\t\treturn child;\n\t\t}\n\n\t\t// Apply alignment to non-positioned children\n\t\tconst childStyles: CSSProperties = {\n\t\t\tposition: \"absolute\",\n\t\t\t...alignmentToPosition(alignment, textDirection),\n\n\t\t\t// Sizing based on fit\n\t\t\t...(fit === StackFit.expand && {\n\t\t\t\twidth: \"100%\",\n\t\t\t\theight: \"100%\",\n\t\t\t}),\n\n\t\t\t// Z-index based on order (first = bottom)\n\t\t\tzIndex: index,\n\t\t};\n\n\t\treturn (\n\t\t\t// biome-ignore lint/suspicious/noArrayIndexKey: <explanation>\n\t\t\t<div style={childStyles} key={index}>\n\t\t\t\t{child}\n\t\t\t</div>\n\t\t);\n\t});\n\n\treturn (\n\t\t// biome-ignore lint/a11y/useKeyWithClickEvents: <explanation>\n\t\t<div\n\t\t\tid={id}\n\t\t\tclassName={className}\n\t\t\tstyle={stackStyles}\n\t\t\tonClick={handleClick}\n\t\t>\n\t\t\t{processedChildren}\n\t\t</div>\n\t);\n};\n\nexport default Stack;\n","\"use client\";\n\nimport type React from \"react\";\nimport type { CSSProperties, ReactNode } from \"react\";\n\n// ============================================================================\n// TYPES - Positioned Props\n// ============================================================================\n\n/**\n * Positioned Props - Mirrors Flutter Positioned widget\n */\nexport interface PositionedProps {\n\t/**\n\t * The child widget to position\n\t */\n\tchildren?: ReactNode;\n\n\t/**\n\t * Distance from top edge of stack\n\t *\n\t * @example\n\t * ```\n\t * <Positioned top={20}>\n\t * <Container>20px from top</Container>\n\t * </Positioned>\n\t * ```\n\t */\n\ttop?: number | string;\n\n\t/**\n\t * Distance from bottom edge of stack\n\t */\n\tbottom?: number | string;\n\n\t/**\n\t * Distance from left edge of stack (in LTR mode)\n\t */\n\tleft?: number | string;\n\n\t/**\n\t * Distance from right edge of stack (in LTR mode)\n\t */\n\tright?: number | string;\n\n\t/**\n\t * Width of the positioned child\n\t *\n\t * @example\n\t * ```\n\t * <Positioned left={0} right={0} width=\"100%\">\n\t * <Container>Full width</Container>\n\t * </Positioned>\n\t * ```\n\t */\n\twidth?: number | string;\n\n\t/**\n\t * Height of the positioned child\n\t */\n\theight?: number | string;\n\n\t/**\n\t * Additional CSS class names\n\t */\n\tclassName?: string;\n\n\t/**\n\t * Custom inline styles\n\t */\n\tstyle?: CSSProperties;\n}\n\n// ============================================================================\n// HELPER FUNCTIONS\n// ============================================================================\n\n/**\n * Normalizes dimension values (number to px string)\n */\nfunction normalizeDimension(value?: number | string): string | undefined {\n\tif (value === undefined) return undefined;\n\treturn typeof value === \"number\" ? `${value}px` : value;\n}\n\n// ============================================================================\n// POSITIONED COMPONENT\n// ============================================================================\n\n/**\n * Positioned - Controls where a child of Stack is positioned\n *\n * Must be a direct child of Stack. At least one of top, bottom, left, or right\n * must be non-null.\n *\n * @example Basic positioning\n * ```\n * <Stack style={{ width: 300, height: 300 }}>\n * <Positioned top={10} left={10}>\n * <Container>Top Left</Container>\n * </Positioned>\n * <Positioned bottom={10} right={10}>\n * <Container>Bottom Right</Container>\n * </Positioned>\n * </Stack>\n * ```\n *\n * @example Full width at bottom\n * ```\n * <Stack style={{ width: '100%', height: '100vh' }}>\n * <Positioned left={0} right={0} bottom={0}>\n * <Container padding={20} color=\"rgba(0,0,0,0.8)\">\n * <p>Footer overlay</p>\n * </Container>\n * </Positioned>\n * </Stack>\n * ```\n *\n * @example Centered with specific size\n * ```\n * <Stack style={{ width: 400, height: 400 }}>\n * <Positioned\n * top=\"50%\"\n * left=\"50%\"\n * width={200}\n * height={200}\n * style={{ transform: 'translate(-50%, -50%)' }}\n * >\n * <Container color=\"blue\">Centered</Container>\n * </Positioned>\n * </Stack>\n * ```\n *\n * @example Privogram hero badge (your design)\n * ```\n * <Stack style={{ width: '100%', height: '100vh' }}>\n * <Container decoration={{ image: { image: '/bg.jpg', fit: 'cover' } }} />\n *\n * <Positioned top={20} right={20}>\n * <Container\n * padding={8}\n * paddingHorizontal={16}\n * decoration={{\n * color: 'rgba(13, 13, 13, 0.6)',\n * borderRadius: 99,\n * }}\n * >\n * <span style={{ color: '#eb1660' }}>Early Access</span>\n * </Container>\n * </Positioned>\n * </Stack>\n * ```\n */\nexport const Positioned: React.FC<PositionedProps> = ({\n\tchildren,\n\ttop,\n\tbottom,\n\tleft,\n\tright,\n\twidth,\n\theight,\n\tclassName = \"\",\n\tstyle = {},\n}) => {\n\t// Build positioned styles\n\tconst positionedStyles: CSSProperties = {\n\t\tposition: \"absolute\",\n\n\t\t// Position from edges\n\t\ttop: normalizeDimension(top),\n\t\tbottom: normalizeDimension(bottom),\n\t\tleft: normalizeDimension(left),\n\t\tright: normalizeDimension(right),\n\n\t\t// Explicit dimensions\n\t\twidth: normalizeDimension(width),\n\t\theight: normalizeDimension(height),\n\n\t\t// Box sizing\n\t\tboxSizing: \"border-box\",\n\n\t\t// Custom styles\n\t\t...style,\n\t};\n\n\treturn (\n\t\t<div className={className} style={positionedStyles}>\n\t\t\t{children}\n\t\t</div>\n\t);\n};\n\n// Display name for Stack to detect positioned children\nPositioned.displayName = \"Positioned\";\n\nexport default Positioned;\n","\"use client\";\n\nimport type React from \"react\";\nimport { Positioned, type PositionedProps } from \"./positioned\";\n\n// ============================================================================\n// POSITIONED.FILL COMPONENT\n// ============================================================================\n\n/**\n * PositionedFill - Shorthand for Positioned that fills the entire stack\n *\n * Equivalent to: Positioned(top: 0, bottom: 0, left: 0, right: 0)\n *\n * @example Background overlay\n * ```\n * <Stack style={{ width: '100%', height: '100vh' }}>\n * <Container decoration={{ image: { image: '/bg.jpg', fit: 'cover' } }} />\n *\n * <PositionedFill>\n * <Container decoration={{\n * gradient: {\n * colors: ['rgba(13,13,13,0)', 'rgba(13,13,13,0.9)'],\n * begin: 'to bottom',\n * },\n * }} />\n * </PositionedFill>\n * </Stack>\n * ```\n */\nexport const PositionedFill: React.FC<\n\tOmit<PositionedProps, \"top\" | \"bottom\" | \"left\" | \"right\">\n> = ({ children, width, height, className, style }) => {\n\treturn (\n\t\t<Positioned\n\t\t\ttop={0}\n\t\t\tbottom={0}\n\t\t\tleft={0}\n\t\t\tright={0}\n\t\t\twidth={width}\n\t\t\theight={height}\n\t\t\tclassName={className}\n\t\t\tstyle={style}\n\t\t>\n\t\t\t{children}\n\t\t</Positioned>\n\t);\n};\n\nPositionedFill.displayName = \"Positioned\";\n\nexport default PositionedFill;\n","\"use client\";\n\n// biome-ignore lint/style/useImportType: <explanation>\nimport React, { CSSProperties, ReactNode } from \"react\";\n\n// ============================================================================\n// TYPES - SizedBox Props\n// ============================================================================\n\n/**\n * SizedBox Props - Mirrors Flutter SizedBox widget\n */\nexport interface SizedBoxProps {\n\t/**\n\t * The widget below this widget in the tree\n\t */\n\tchildren?: ReactNode;\n\n\t/**\n\t * If non-null, requires the child to have exactly this width\n\t *\n\t * @example\n\t * ```\n\t * <SizedBox width={200}>\n\t * <p>200px wide</p>\n\t * </SizedBox>\n\t * ```\n\t */\n\twidth?: number | string;\n\n\t/**\n\t * If non-null, requires the child to have exactly this height\n\t *\n\t * @example\n\t * ```\n\t * <SizedBox height={100}>\n\t * <p>100px tall</p>\n\t * </SizedBox>\n\t * ```\n\t */\n\theight?: number | string;\n\n\t/**\n\t * Additional CSS class names\n\t */\n\tclassName?: string;\n\n\t/**\n\t * Custom inline styles (escape hatch)\n\t */\n\tstyle?: CSSProperties;\n\n\t/**\n\t * HTML id attribute\n\t */\n\tid?: string;\n}\n\n// ============================================================================\n// HELPER FUNCTIONS\n// ============================================================================\n\n/**\n * Normalizes dimension values (number to px string)\n */\nfunction normalizeDimension(value?: number | string): string | undefined {\n\tif (value === undefined) return undefined;\n\treturn typeof value === \"number\" ? `${value}px` : value;\n}\n\n// ============================================================================\n// SIZEDBOX COMPONENT\n// ============================================================================\n\n/**\n * SizedBox - A box with a specified size\n *\n * If given a child, forces it to have a specific width/height.\n * If width or height is null, tries to match the child's size in that dimension.\n * If not given a child, tries to size itself as close to specified dimensions as possible.\n *\n * **Lightweight alternative to Container when you only need sizing.**\n *\n * @example Fixed size box\n * ```\n * <SizedBox width={200} height={300}>\n * <Card>\n * <Text>Hello World!</Text>\n * </Card>\n * </SizedBox>\n * ```\n *\n * @example Width only (height wraps content)\n * ```\n * <SizedBox width={400}>\n * <p>This text is constrained to 400px width</p>\n * </SizedBox>\n * ```\n *\n * @example Spacer (empty box)\n * ```\n * <Column>\n * <p>Top</p>\n * <SizedBox height={20} />\n * <p>Bottom (20px below)</p>\n * </Column>\n * ```\n *\n * @example Responsive width with fixed height\n * ```\n * <SizedBox width=\"100%\" height={200}>\n * <Container color=\"#eb1660\" />\n * </SizedBox>\n * ```\n */\nconst SizedBoxBase: React.FC<SizedBoxProps> = ({\n\tchildren,\n\twidth,\n\theight,\n\tclassName = \"\",\n\tstyle = {},\n\tid,\n}) => {\n\t// Build sized box styles\n\tconst boxStyles: CSSProperties = {\n\t\t// Explicit dimensions\n\t\twidth: normalizeDimension(width),\n\t\theight: normalizeDimension(height),\n\n\t\t// Minimal styling (no decoration, just sizing)\n\t\tboxSizing: \"border-box\",\n\t\tflexShrink: 0, // Prevent shrinking in flex layouts (Flutter behavior)\n\n\t\t// Custom styles\n\t\t...style,\n\t};\n\n\treturn (\n\t\t<div id={id} className={className} style={boxStyles}>\n\t\t\t{children}\n\t\t</div>\n\t);\n};\n\n// ============================================================================\n// SIZEDBOX VARIANTS (Static Methods)\n// ============================================================================\n\n/**\n * SizedBox.expand - Creates a box that fills all available space\n *\n * Equivalent to: SizedBox(width: double.infinity, height: double.infinity)\n *\n * @example Fill parent container\n * ```\n * <Container width={400} height={400}>\n * <SizedBox.expand>\n * <Container color=\"#eb1660\" />\n * </SizedBox.expand>\n * </Container>\n * ```\n */\nconst SizedBoxExpand: React.FC<Omit<SizedBoxProps, \"width\" | \"height\">> = (\n\tprops,\n) => <SizedBoxBase width=\"100%\" height=\"100%\" {...props} />;\n\n/**\n * SizedBox.shrink - Creates a box that tries to be as small as possible\n *\n * Equivalent to: SizedBox(width: 0, height: 0)\n *\n * @example Conditional spacer (collapsed when not needed)\n * ```\n * {showSpacer ? <SizedBox height={20} /> : <SizedBox.shrink />}\n * ```\n */\nconst SizedBoxShrink: React.FC<Omit<SizedBoxProps, \"width\" | \"height\">> = (\n\tprops,\n) => <SizedBoxBase width={0} height={0} {...props} />;\n\n/**\n * SizedBox.square - Creates a box with equal width and height\n *\n * @example 100x100 square\n * ```\n * <SizedBox.square dimension={100}>\n * <Container color=\"#eb1660\" />\n * </SizedBox.square>\n * ```\n */\nconst SizedBoxSquare: React.FC<\n\tOmit<SizedBoxProps, \"width\" | \"height\"> & { dimension?: number | string }\n> = ({ dimension, ...props }) => (\n\t<SizedBoxBase width={dimension} height={dimension} {...props} />\n);\n\n// ============================================================================\n// EXPORT WITH STATIC METHODS\n// ============================================================================\n\n/**\n * SizedBox component with static methods\n */\ninterface SizedBoxComponent extends React.FC<SizedBoxProps> {\n\texpand: typeof SizedBoxExpand;\n\tshrink: typeof SizedBoxShrink;\n\tsquare: typeof SizedBoxSquare;\n}\n\nexport const SizedBox = SizedBoxBase as SizedBoxComponent;\n\n// Attach static methods\nSizedBox.expand = SizedBoxExpand;\nSizedBox.shrink = SizedBoxShrink;\nSizedBox.square = SizedBoxSquare;\n\nexport default SizedBox;\n","\"use client\";\n\nimport type React from \"react\";\nimport type { CSSProperties, ReactNode } from \"react\";\nimport type { EdgeInsets } from \"./container\";\n\n// ============================================================================\n// TYPES - Padding Props\n// ============================================================================\n\n/**\n * Padding Props - Mirrors Flutter Padding widget\n */\nexport interface PaddingProps {\n\t/**\n\t * The widget below this widget in the tree\n\t */\n\tchildren?: ReactNode;\n\n\t/**\n\t * The amount of space by which to inset the child\n\t *\n\t * @example\n\t * ```\n\t * // All sides 16px\n\t * <Padding padding={16}>\n\t *\n\t * // Symmetric padding\n\t * <Padding padding={{ horizontal: 20, vertical: 10 }}>\n\t *\n\t * // Individual sides\n\t * <Padding padding={{ top: 10, left: 20, right: 20, bottom: 10 }}>\n\t * ```\n\t */\n\tpadding: number | EdgeInsets;\n\n\t/**\n\t * Additional CSS class names\n\t */\n\tclassName?: string;\n\n\t/**\n\t * Custom inline styles (escape hatch)\n\t */\n\tstyle?: CSSProperties;\n\n\t/**\n\t * HTML id attribute\n\t */\n\tid?: string;\n}\n\n// ============================================================================\n// HELPER FUNCTIONS\n// ============================================================================\n\n/**\n * Converts EdgeInsets to CSS padding values\n */\nfunction edgeInsetsToPadding(insets: number | EdgeInsets): string {\n\t// If number, apply to all sides\n\tif (typeof insets === \"number\") {\n\t\treturn `${insets}px`;\n\t}\n\n\t// If EdgeInsets object\n\tif (\"all\" in insets && insets.all !== undefined) {\n\t\t// EdgeInsets.all(value)\n\t\treturn `${insets.all}px`;\n\t}\n\n\t// Check for symmetric padding (horizontal/vertical)\n\tconst hasHorizontal = \"horizontal\" in insets;\n\tconst hasVertical = \"vertical\" in insets;\n\n\tif (hasHorizontal || hasVertical) {\n\t\t// EdgeInsets.symmetric\n\t\t// biome-ignore lint/suspicious/noExplicitAny: <explanation>\n\t\tconst v = (insets as any).vertical ?? 0;\n\t\t// biome-ignore lint/suspicious/noExplicitAny: <explanation>\n\t\tconst h = (insets as any).horizontal ?? 0;\n\t\treturn `${v}px ${h}px`;\n\t}\n\n\t// EdgeInsets.only - handle individual sides with type guard\n\tif (\n\t\t\"top\" in insets ||\n\t\t\"right\" in insets ||\n\t\t\"bottom\" in insets ||\n\t\t\"left\" in insets\n\t) {\n\t\tconst top = insets.top ?? 0;\n\t\tconst right = insets.right ?? 0;\n\t\tconst bottom = insets.bottom ?? 0;\n\t\tconst left = insets.left ?? 0;\n\t\treturn `${top}px ${right}px ${bottom}px ${left}px`;\n\t}\n\n\t// Fallback\n\treturn \"0px\";\n}\n\n// ============================================================================\n// PADDING COMPONENT\n// ============================================================================\n\n/**\n * Padding - A widget that insets its child by the given padding\n *\n * When passing layout constraints to its child, padding shrinks the constraints\n * by the given padding. Padding then sizes itself to its child's size, inflated\n * by the padding.\n *\n * **Lightweight alternative to Container when you only need padding.**\n *\n * @example All sides equal\n * ```\n * <Padding padding={16}>\n * <Text>Hello World!</Text>\n * </Padding>\n * ```\n *\n * @example Symmetric padding\n * ```\n * <Padding padding={{ horizontal: 20, vertical: 10 }}>\n * <Text>Hello World!</Text>\n * </Padding>\n * ```\n *\n * @example Individual sides\n * ```\n * <Padding padding={{ top: 10, left: 20, right: 20, bottom: 30 }}>\n * <Text>Hello World!</Text>\n * </Padding>\n * ```\n *\n * @example Card with padding (Flutter pattern)\n * ```\n * <Container\n * decoration={{\n * color: '#1a1a1a',\n * borderRadius: 16,\n * }}\n * >\n * <Padding padding={20}>\n * <Column spacing={8}>\n * <h3>Card Title</h3>\n * <p>Card content goes here</p>\n * </Column>\n * </Padding>\n * </Container>\n * ```\n */\nexport const Padding: React.FC<PaddingProps> = ({\n\tchildren,\n\tpadding,\n\tclassName = \"\",\n\tstyle = {},\n\tid,\n}) => {\n\t// Build padding styles\n\tconst paddingStyles: CSSProperties = {\n\t\t// Apply padding\n\t\tpadding: edgeInsetsToPadding(padding),\n\n\t\t// Minimal styling (no decoration, just padding)\n\t\tboxSizing: \"border-box\",\n\n\t\t// Custom styles\n\t\t...style,\n\t};\n\n\treturn (\n\t\t<div id={id} className={className} style={paddingStyles}>\n\t\t\t{children}\n\t\t</div>\n\t);\n};\n\nexport default Padding;\n"]}