@pyreon/coolgrid 0.14.0 → 0.15.0

package/lib/index.js

@@ -1,9 +1,11 @@
 import { ALIGN_CONTENT_MAP_X, Provider, context, extendCss, makeItResponsive, value } from "@pyreon/unistyle";
-import { createContext, provide, splitProps, useContext } from "@pyreon/core";
+import { createContext, nativeCompat, provide, splitProps, useContext } from "@pyreon/core";
 import { config, get, omit, pick } from "@pyreon/ui-core";
+import { jsx } from "@pyreon/core/jsx-runtime";
 
 //#region src/constants.ts
 const PKG_NAME = "@pyreon/coolgrid";
+const __DEV__ = process.env.NODE_ENV !== "production";
 /**
 * Grid configuration keys that are passed through context
 * from Container to Row and from Row to Col components.
@@ -142,55 +144,6 @@ var styled_default$2 = styled$2(component$2, { layer: "elements" })`
 })};
 `;
 
-//#endregion
-//#region ../../core/core/lib/jsx-runtime.js
-/**
-* Hyperscript function — the compiled output of JSX.
-* `<div class="x">hello</div>` → `h("div", { class: "x" }, "hello")`
-*
-* Generic on P so TypeScript validates props match the component's signature
-* at the call site, then stores the result in the loosely-typed VNode.
-*/
-/** Shared empty props sentinel — identity-checked in mountElement to skip applyProps. */
-const EMPTY_PROPS = {};
-function h(type, props, ...children) {
-	return {
-		type,
-		props: props ?? EMPTY_PROPS,
-		children: normalizeChildren(children),
-		key: props?.key ?? null
-	};
-}
-function normalizeChildren(children) {
-	for (let i = 0; i < children.length; i++) if (Array.isArray(children[i])) return flattenChildren(children);
-	return children;
-}
-function flattenChildren(children) {
-	const result = [];
-	for (const child of children) if (Array.isArray(child)) result.push(...flattenChildren(child));
-	else result.push(child);
-	return result;
-}
-/**
-* JSX automatic runtime.
-*
-* When tsconfig has `"jsxImportSource": "@pyreon/core"`, the TS/bundler compiler
-* rewrites JSX to imports from this file automatically:
-*   <div class="x" />  →  jsx("div", { class: "x" })
-*/
-function jsx(type, props, key) {
-	const { children, ...rest } = props;
-	const propsWithKey = key != null ? {
-		...rest,
-		key
-	} : rest;
-	if (typeof type === "function") return h(type, children !== void 0 ? {
-		...propsWithKey,
-		children
-	} : propsWithKey);
-	return h(type, propsWithKey, ...children === void 0 ? [] : Array.isArray(children) ? children : [children]);
-}
-
 //#endregion
 //#region src/Col/component.tsx
 /**
@@ -198,7 +151,7 @@ function jsx(type, props, key) {
 * (columns, gap, gutter) and calculates its own width as a fraction
 * of the total columns. Supports responsive size, padding, and visibility.
 */
-const DEV_PROPS$2 = process.env.NODE_ENV !== "production" ? { "data-coolgrid": "col" } : {};
+const DEV_PROPS$2 = __DEV__ ? { "data-coolgrid": "col" } : {};
 const Component$2 = (props) => {
 	const [own, rest] = splitProps(props, [
 		"children",
@@ -269,7 +222,7 @@ var styled_default$1 = styled$1(component$1, { layer: "elements" })`
 * components via ContainerContext, and renders a styled wrapper with
 * responsive max-width.
 */
-const DEV_PROPS$1 = process.env.NODE_ENV !== "production" ? { "data-coolgrid": "container" } : {};
+const DEV_PROPS$1 = __DEV__ ? { "data-coolgrid": "container" } : {};
 const Component$1 = (props) => {
 	const [own, rest] = splitProps(props, [
 		"children",
@@ -311,6 +264,7 @@ const name$1 = `${PKG_NAME}/Container`;
 Component$1.displayName = name$1;
 Component$1.pkgName = PKG_NAME;
 Component$1.PYREON__COMPONENT = name$1;
+nativeCompat(Component$1);
 
 //#endregion
 //#region src/Container/index.ts
@@ -371,7 +325,7 @@ var styled_default = styled(component, { layer: "elements" })`
 * gap, gutter) to Col children via RowContext. Renders a flex-wrap container
 * with negative margins to offset column gutters.
 */
-const DEV_PROPS = process.env.NODE_ENV !== "production" ? { "data-coolgrid": "row" } : {};
+const DEV_PROPS = __DEV__ ? { "data-coolgrid": "row" } : {};
 const Component = (props) => {
 	const [own, rest] = splitProps(props, [
 		"children",
@@ -413,6 +367,7 @@ const name = `${PKG_NAME}/Row`;
 Component.displayName = name;
 Component.pkgName = PKG_NAME;
 Component.PYREON__COMPONENT = name;
+nativeCompat(Component);
 
 //#endregion
 //#region src/Row/index.ts

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pyreon/coolgrid",
-  "version": "0.14.0",
+  "version": "0.15.0",
   "description": "Responsive grid system for Pyreon",
   "license": "MIT",
   "repository": {
@@ -10,6 +10,7 @@
   },
   "files": [
     "lib",
+    "!lib/**/*.map",
     "!lib/analysis",
     "README.md",
     "LICENSE",
@@ -42,17 +43,17 @@
   },
   "devDependencies": {
     "@pyreon/test-utils": "^0.13.2",
-    "@pyreon/typescript": "^0.14.0",
-    "@pyreon/ui-core": "^0.14.0",
+    "@pyreon/typescript": "^0.15.0",
+    "@pyreon/ui-core": "^0.15.0",
     "@vitest/browser-playwright": "^4.1.4",
-    "@vitus-labs/tools-rolldown": "^1.15.3"
+    "@vitus-labs/tools-rolldown": "^2.3.0"
   },
   "peerDependencies": {
-    "@pyreon/core": "^0.14.0",
-    "@pyreon/reactivity": "^0.14.0",
-    "@pyreon/styler": "^0.14.0",
-    "@pyreon/ui-core": "^0.14.0",
-    "@pyreon/unistyle": "^0.14.0"
+    "@pyreon/core": "^0.15.0",
+    "@pyreon/reactivity": "^0.15.0",
+    "@pyreon/styler": "^0.15.0",
+    "@pyreon/ui-core": "^0.15.0",
+    "@pyreon/unistyle": "^0.15.0"
   },
   "engines": {
     "node": ">= 22"

package/src/Col/component.tsx

@@ -1,5 +1,5 @@
 import { splitProps, useContext } from '@pyreon/core'
-import { PKG_NAME } from '../constants'
+import { __DEV__, PKG_NAME } from '../constants'
 import { RowContext } from '../context'
 import type { ElementType } from '../types'
 import useGridContext from '../useContext'
@@ -12,8 +12,7 @@ import Styled from './styled'
  * of the total columns. Supports responsive size, padding, and visibility.
  */
 
-const DEV_PROPS: Record<string, string> =
-  process.env.NODE_ENV !== 'production' ? { 'data-coolgrid': 'col' } : {}
+const DEV_PROPS: Record<string, string> = __DEV__ ? { 'data-coolgrid': 'col' } : {}
 
 const Component: ElementType<
   [

package/src/Container/component.tsx

@@ -1,5 +1,5 @@
-import { provide, splitProps } from '@pyreon/core'
-import { PKG_NAME } from '../constants'
+import { nativeCompat, provide, splitProps } from '@pyreon/core'
+import { __DEV__, PKG_NAME } from '../constants'
 import ContainerContext from '../context/ContainerContext'
 import type { ElementType } from '../types'
 import useGridContext from '../useContext'
@@ -13,8 +13,7 @@ import Styled from './styled'
  * responsive max-width.
  */
 
-const DEV_PROPS: Record<string, string> =
-  process.env.NODE_ENV !== 'production' ? { 'data-coolgrid': 'container' } : {}
+const DEV_PROPS: Record<string, string> = __DEV__ ? { 'data-coolgrid': 'container' } : {}
 
 const Component: ElementType<['containerWidth']> = (props) => {
   const [own, rest] = splitProps(props, ['children', 'component', 'css', 'width'])
@@ -74,4 +73,8 @@ Component.displayName = name
 Component.pkgName = PKG_NAME
 Component.PYREON__COMPONENT = name
 
+// Mark as native — compat-mode jsx() runtimes skip wrapCompatComponent so
+// Container's provide(ContainerContext, ...) reaches descendant Row/Col.
+nativeCompat(Component)
+
 export default Component

package/src/Row/component.tsx

@@ -1,5 +1,5 @@
-import { provide, splitProps, useContext } from '@pyreon/core'
-import { PKG_NAME } from '../constants'
+import { nativeCompat, provide, splitProps, useContext } from '@pyreon/core'
+import { __DEV__, PKG_NAME } from '../constants'
 import { ContainerContext, RowContext } from '../context'
 import type { ElementType } from '../types'
 import useGridContext from '../useContext'
@@ -13,8 +13,7 @@ import Styled from './styled'
  * with negative margins to offset column gutters.
  */
 
-const DEV_PROPS: Record<string, string> =
-  process.env.NODE_ENV !== 'production' ? { 'data-coolgrid': 'row' } : {}
+const DEV_PROPS: Record<string, string> = __DEV__ ? { 'data-coolgrid': 'row' } : {}
 
 const Component: ElementType<['containerWidth', 'width', 'rowComponent', 'rowCss']> = (props) => {
   const [own, rest] = splitProps(props, ['children', 'component', 'css', 'contentAlignX'])
@@ -71,4 +70,9 @@ Component.displayName = name
 Component.pkgName = PKG_NAME
 Component.PYREON__COMPONENT = name
 
+// Mark as native — compat-mode jsx() runtimes skip wrapCompatComponent so
+// Row's useContext(ContainerContext) read + provide(RowContext, ...) reach
+// Pyreon's setup frame.
+nativeCompat(Component)
+
 export default Component

package/src/__tests__/native-markers.test.ts

@@ -0,0 +1,13 @@
+import { isNativeCompat } from '@pyreon/core'
+import { describe, expect, it } from 'vitest'
+import Container from '../Container/component'
+import Row from '../Row/component'
+
+describe('native-compat markers — @pyreon/coolgrid', () => {
+  it('Container is marked native', () => {
+    expect(isNativeCompat(Container)).toBe(true)
+  })
+  it('Row is marked native', () => {
+    expect(isNativeCompat(Row)).toBe(true)
+  })
+})

package/src/constants.ts

@@ -1,5 +1,11 @@
 export const PKG_NAME = '@pyreon/coolgrid'
 
+// Dev-mode gate. `import.meta.env.DEV` is literal-replaced by Vite at build
+// time and tree-shakes to zero bytes in prod. The previous
+// `process.env.NODE_ENV !== 'production'` form was dead code in real Vite
+// browser bundles (Vite does not polyfill `process`).
+export const __DEV__ = process.env.NODE_ENV !== 'production'
+
 /**
  * Grid configuration keys that are passed through context
  * from Container to Row and from Row to Col components.

package/src/env.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Minimal process type — just enough for `process.env.NODE_ENV` checks.
+ * Avoids requiring @types/node in consumers that import pyreon source
+ * via the `"bun"` export condition.
+ */
+declare var process: { env: { NODE_ENV?: string } }

package/lib/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index2.d.ts","names":[],"sources":["../../src/types.ts","../../src/Col/component.tsx","../../src/Container/component.tsx","../../src/Row/component.tsx","../../src/theme.ts"],"mappings":";;;;;KAWK,eAAA,MAAqB,CAAA,GAAI,CAAA,KAAM,OAAA,CAAQ,MAAA,CAAO,cAAA,EAAgB,CAAA;AAAA,KAGvD,KAAA;AAAA,KACA,GAAA,GAAM,UAAA,QAAkB,SAAA;AAAA,KACxB,WAAA,GAAc,eAAA,CAAgB,GAAA;AAAA,KAI9B,SAAA,GAAY,eAAA;AAAA,KACZ,cAAA,GAAiB,eAAA,CAAgB,KAAA;AAAA,KAEjC,aAAA;AAAA,KAQA,kBAAA,GAAqB,OAAA;EAC/B,IAAA,EAAM,SAAA;EACN,OAAA,EAAS,SAAA;EACT,GAAA,EAAK,SAAA;EACL,MAAA,EAAQ,SAAA;EACR,OAAA,EAAS,SAAA;EACT,MAAA,EAAQ,WAAA;EACR,MAAA,EAAQ,WAAA;EACR,YAAA,EAAc,WAAA;EACd,YAAA,EAAc,WAAA;EACd,aAAA,EAAe,aAAA;EACf,cAAA,EAAgB,cAAA;EAChB,KAAA,EAAO,cAAA,KAAmB,MAAA,EAAQ,MAAA,kBAAwB,cAAA;AAAA;AAAA,KAGhD,cAAA,GAAiB,kBAAA,GAC3B,OAAA;EACE,SAAA,EAAW,WAAA;EACX,GAAA,EAAK,WAAA;AAAA;AAAA,KAcG,WAAA,uBAAkC,WAAA,CAC5C,IAAA,CAAK,cAAA,EAAgB,CAAA,YAAa,MAAA;EAA4B,QAAA,GAAW,UAAA;AAAA;EAEzE,WAAA;EACA,OAAA;EACA,iBAAA;AAAA;;;cCnDI,SAAA,EAAW,WAAA;;;cCCX,WAAA,EAAW,WAAA;;;cCAX,WAAA,EAAW,WAAA"}

package/lib/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","names":["spacingStyles","styles","component","DEV_PROPS","Component","RowContext","Styled","name","component","styles","component","DEV_PROPS","Component","ContainerContext","Styled","name","component","ContainerContext","RowContext","Styled","component"],"sources":["../src/constants.ts","../src/context/ContainerContext.ts","../src/context/RowContext.ts","../src/useContext.tsx","../src/utils.ts","../src/Col/styled.ts","../../../core/core/lib/jsx-runtime.js","../src/Col/component.tsx","../src/Col/index.ts","../src/Container/styled.ts","../src/Container/component.tsx","../src/Container/index.ts","../src/Row/styled.ts","../src/Row/component.tsx","../src/Row/index.ts","../src/theme.ts"],"sourcesContent":["export const PKG_NAME = '@pyreon/coolgrid'\n\n/**\n * Grid configuration keys that are passed through context\n * from Container to Row and from Row to Col components.\n */\nexport const CONTEXT_KEYS = [\n  // 'breakpoints',\n  // 'rootSize',\n  'columns',\n  'size',\n  'gap',\n  'padding',\n  'gutter',\n  'colCss',\n  'colComponent',\n  'rowCss',\n  'rowComponent',\n  'contentAlignX',\n]\n","import { createContext } from '@pyreon/core'\nimport type { Context as ContextType } from '../types'\n\n/**\n * Context for container-level grid configuration.\n * Provided by the Container component and consumed by Row children\n * to inherit columns, gap, gutter, and other grid settings.\n */\nexport default createContext<ContextType>({})\n","import { createContext } from '@pyreon/core'\nimport type { Context as ContextType } from '../types'\n\n/**\n * Context for row-level grid configuration.\n * Provided by the Row component and consumed by Col children\n * to inherit columns, gap, gutter, and sizing for width calculations.\n */\nexport default createContext<ContextType>({})\n","import { useContext } from '@pyreon/core'\nimport { get, pick } from '@pyreon/ui-core'\nimport { context } from '@pyreon/unistyle'\nimport { CONTEXT_KEYS } from './constants'\nimport type { Context, Obj, ValueType } from './types'\n\n/**\n * Picks only the recognized grid configuration keys from a props object,\n * filtering out any non-grid props before they enter context resolution.\n */\nexport type PickThemeProps = <T extends Record<string, unknown>>(\n  props: T,\n  keywords: Array<keyof T>,\n) => ReturnType<typeof pick>\nconst pickThemeProps: PickThemeProps = (props, keywords) => pick(props, keywords)\n\n/**\n * Resolves grid columns and container width using a three-layer fallback:\n * 1. Explicit component props (e.g. `columns={6}`)\n * 2. `theme.grid.columns` / `theme.grid.container`\n * 3. `theme.coolgrid.columns` / `theme.coolgrid.container`\n */\ntype GetGridContext = (\n  props: Obj,\n  theme: Obj,\n) => {\n  columns?: ValueType\n  containerWidth?: Record<string, number>\n}\n\nexport const getGridContext: GetGridContext = (props = {}, theme = {}) => ({\n  columns: (get(props, 'columns') ||\n    get(theme, 'grid.columns') ||\n    get(theme, 'coolgrid.columns')) as ValueType,\n  containerWidth: (get(props, 'width') ||\n    get(theme, 'grid.container') ||\n    get(theme, 'coolgrid.container')) as Record<string, number>,\n})\n\n/**\n * Hook that reads the unistyle theme context and merges it with the\n * component's own props to produce the final grid configuration.\n * Applies the three-layer resolution (props -> grid.* -> coolgrid.*).\n */\ntype UseGridContext = (props: Obj) => Context\nconst useGridContext: UseGridContext = (props) => {\n  const getCtx = useContext(context)\n  const { theme } = getCtx()\n  const ctxProps = pickThemeProps(props, CONTEXT_KEYS)\n  const gridContext = getGridContext(ctxProps, theme as Record<string, unknown>)\n\n  return { ...gridContext, ...ctxProps }\n}\n\nexport default useGridContext\n","import { omit } from '@pyreon/ui-core'\nimport { CONTEXT_KEYS } from './constants'\n\n/** Checks whether a value is a finite number. */\nexport const isNumber = (value: unknown): value is number => Number.isFinite(value)\n\n/** Checks whether a value is a finite number greater than zero. */\nexport const hasValue = (value: unknown): boolean => isNumber(value) && value > 0\n\n/**\n * Determines if a column should be visible. A column is visible when its\n * size is undefined (auto) or a non-zero number. Size 0 hides the column.\n */\nexport const isVisible = (value: unknown): boolean =>\n  (isNumber(value) && value !== 0) || value === undefined\n\n/** Returns true when both size and columns are positive numbers, indicating an explicit width can be calculated. */\ntype HasWidth = (size: unknown, columns: unknown) => boolean\nexport const hasWidth: HasWidth = (size, columns) => !!(hasValue(size) && hasValue(columns))\n\n/** Strips grid context keys from a props object so they are not forwarded to the DOM element. */\ntype OmitCtxKeys = (props?: Record<string, any>) => ReturnType<typeof omit>\nexport const omitCtxKeys: OmitCtxKeys = (props) => omit(props, CONTEXT_KEYS)\n","import { config } from '@pyreon/ui-core'\nimport type { MakeItResponsiveStyles } from '@pyreon/unistyle'\nimport { extendCss, makeItResponsive, value } from '@pyreon/unistyle'\nimport type { CssOutput, StyledTypes } from '../types'\nimport { hasValue, isNumber, isVisible } from '../utils'\n\nconst { styled, css, component } = config\n\ntype HasWidth = (size?: number, columns?: number) => boolean\n\n/** Returns true when both size and columns are valid, enabling explicit width calculation. */\nconst hasWidth: HasWidth = (size, columns) => hasValue(size) && hasValue(columns)\n\ntype WidthStyles = (\n  props: Pick<StyledTypes, 'size' | 'columns' | 'gap'>,\n  defaults: { rootSize?: number | undefined },\n) => CssOutput\n\n/**\n * Calculates column width as a percentage of total columns, subtracting\n * the gap when present. Uses `calc(%)` for web.\n */\nconst widthStyles: WidthStyles = ({ size, columns, gap }, { rootSize }) => {\n  if (!hasWidth(size, columns)) {\n    return ''\n  }\n\n  const s = size as number\n  const c = columns as number\n  const g = gap as number\n\n  // calculate % of width\n  const width = (s / c) * 100\n\n  const hasGap = hasValue(gap)\n\n  const val = hasGap ? `calc(${width}% - ${g}px)` : `${width}%`\n\n  const v = value(val, rootSize)\n\n  return css`\n    flex-grow: 0;\n    flex-shrink: 0;\n    max-width: ${v};\n    flex-basis: ${v};\n  `\n}\n\ntype SpacingStyles = (type: 'margin' | 'padding', param?: number, rootSize?: number) => CssOutput\n/** Applies half of the given value as either margin or padding (used for gap and padding distribution). */\nconst spacingStyles: SpacingStyles = (type, param, rootSize) => {\n  if (!isNumber(param)) {\n    return ''\n  }\n\n  const finalStyle = `${type}: ${value((param as number) / 2, rootSize)}`\n\n  return css`\n    ${finalStyle};\n  `\n}\n\n/**\n * Main responsive style block for Col. When the column is visible, applies\n * width, padding, margin, and extra CSS. When hidden (size === 0), moves\n * the element off-screen with fixed positioning.\n */\nconst styles: MakeItResponsiveStyles<StyledTypes> = ({ theme, css: cssFn, rootSize }) => {\n  const { size, columns, gap, padding, extraStyles } = theme\n  const renderStyles = isVisible(size)\n\n  if (renderStyles) {\n    return cssFn`\n      left: initial;\n      position: relative;\n      ${widthStyles({ size, columns, gap }, { rootSize })};\n      ${spacingStyles('padding', padding, rootSize)};\n      ${spacingStyles('margin', gap, rootSize)};\n      ${extendCss(extraStyles)};\n    `\n  }\n\n  return cssFn`\n    left: -9999px;\n    position: fixed;\n    margin: 0;\n    padding: 0;\n  `\n}\n\nexport default styled(component, { layer: 'elements' })`\n  box-sizing: border-box;\n  justify-content: stretch;\n\n  position: relative;\n  display: flex;\n  flex-basis: 0;\n  flex-grow: 1;\n  flex-direction: column;\n\n  ${makeItResponsive({\n    key: '$coolgrid',\n    styles,\n    css,\n    normalize: true,\n  })};\n`\n","//#region src/h.ts\n/** Marker for fragment nodes — renders children without a wrapper element */\nconst Fragment = Symbol(\"Pyreon.Fragment\");\n/**\n* Hyperscript function — the compiled output of JSX.\n* `<div class=\"x\">hello</div>` → `h(\"div\", { class: \"x\" }, \"hello\")`\n*\n* Generic on P so TypeScript validates props match the component's signature\n* at the call site, then stores the result in the loosely-typed VNode.\n*/\n/** Shared empty props sentinel — identity-checked in mountElement to skip applyProps. */\nconst EMPTY_PROPS = {};\nfunction h(type, props, ...children) {\n\treturn {\n\t\ttype,\n\t\tprops: props ?? EMPTY_PROPS,\n\t\tchildren: normalizeChildren(children),\n\t\tkey: props?.key ?? null\n\t};\n}\nfunction normalizeChildren(children) {\n\tfor (let i = 0; i < children.length; i++) if (Array.isArray(children[i])) return flattenChildren(children);\n\treturn children;\n}\nfunction flattenChildren(children) {\n\tconst result = [];\n\tfor (const child of children) if (Array.isArray(child)) result.push(...flattenChildren(child));\n\telse result.push(child);\n\treturn result;\n}\n\n//#endregion\n//#region src/jsx-runtime.ts\n/**\n* JSX automatic runtime.\n*\n* When tsconfig has `\"jsxImportSource\": \"@pyreon/core\"`, the TS/bundler compiler\n* rewrites JSX to imports from this file automatically:\n*   <div class=\"x\" />  →  jsx(\"div\", { class: \"x\" })\n*/\nfunction jsx(type, props, key) {\n\tconst { children, ...rest } = props;\n\tconst propsWithKey = key != null ? {\n\t\t...rest,\n\t\tkey\n\t} : rest;\n\tif (typeof type === \"function\") return h(type, children !== void 0 ? {\n\t\t...propsWithKey,\n\t\tchildren\n\t} : propsWithKey);\n\treturn h(type, propsWithKey, ...children === void 0 ? [] : Array.isArray(children) ? children : [children]);\n}\nconst jsxs = jsx;\n\n//#endregion\nexport { Fragment, jsx, jsxs };\n//# sourceMappingURL=jsx-runtime.js.map","import { splitProps, useContext } from '@pyreon/core'\nimport { PKG_NAME } from '../constants'\nimport { RowContext } from '../context'\nimport type { ElementType } from '../types'\nimport useGridContext from '../useContext'\nimport { omitCtxKeys } from '../utils'\nimport Styled from './styled'\n\n/**\n * Col (column) component that reads grid settings from RowContext\n * (columns, gap, gutter) and calculates its own width as a fraction\n * of the total columns. Supports responsive size, padding, and visibility.\n */\n\nconst DEV_PROPS: Record<string, string> =\n  process.env.NODE_ENV !== 'production' ? { 'data-coolgrid': 'col' } : {}\n\nconst Component: ElementType<\n  [\n    'containerWidth',\n    'width',\n    'rowComponent',\n    'rowCss',\n    'colCss',\n    'colComponent',\n    'columns',\n    'gap',\n    'gutter',\n    'contentAlignX',\n  ]\n> = (props) => {\n  const [own, rest] = splitProps(props, ['children', 'component', 'css'])\n  const parentCtx = useContext(RowContext)\n  const { colCss, colComponent, columns, gap, size, padding } = useGridContext({\n    ...parentCtx,\n    ...rest,\n  })\n\n  const finalProps = {\n    $coolgrid: {\n      columns,\n      gap,\n      size,\n      padding,\n      extraStyles: own.css ?? colCss,\n    },\n  }\n\n  return (\n    <Styled {...omitCtxKeys(rest)} as={own.component ?? colComponent} {...finalProps} {...DEV_PROPS}>\n      {own.children}\n    </Styled>\n  )\n}\n\nconst name = `${PKG_NAME}/Col`\n\nComponent.displayName = name\nComponent.pkgName = PKG_NAME\nComponent.PYREON__COMPONENT = name\n\nexport default Component\n","import component from './component'\n\nexport default component\n","import { config } from '@pyreon/ui-core'\nimport type { MakeItResponsiveStyles } from '@pyreon/unistyle'\nimport { extendCss, makeItResponsive, value } from '@pyreon/unistyle'\nimport type { StyledTypes } from '../types'\n\nconst { styled, css, component } = config\n\n/** Responsive styles that apply the container's max-width and any extra CSS at each breakpoint. */\nconst styles: MakeItResponsiveStyles<Pick<StyledTypes, 'width' | 'extraStyles'>> = ({\n  theme: t,\n  css: cssFn,\n  rootSize,\n}) => {\n  const w = t.width != null && typeof t.width !== 'object' ? t.width : null\n\n  return cssFn`\n    ${w != null ? `max-width: ${value(w, rootSize)};` : ''};\n    ${extendCss(t.extraStyles)};\n  `\n}\n\n/** Styled Container element. Centered via auto margins with responsive max-width. */\nexport default styled(component, { layer: 'elements' })`\n  display: flex;\n  flex-direction: column;\n  box-sizing: border-box;\n  width: 100%;\n  margin-right: auto;\n  margin-left: auto;\n\n  ${makeItResponsive({\n    key: '$coolgrid',\n    styles,\n    css,\n    normalize: true,\n  })};\n`\n","import { provide, splitProps } from '@pyreon/core'\nimport { PKG_NAME } from '../constants'\nimport ContainerContext from '../context/ContainerContext'\nimport type { ElementType } from '../types'\nimport useGridContext from '../useContext'\nimport { omitCtxKeys } from '../utils'\nimport Styled from './styled'\n\n/**\n * Container component that establishes the outermost grid boundary.\n * Resolves grid config from the theme, provides it to descendant Row/Col\n * components via ContainerContext, and renders a styled wrapper with\n * responsive max-width.\n */\n\nconst DEV_PROPS: Record<string, string> =\n  process.env.NODE_ENV !== 'production' ? { 'data-coolgrid': 'container' } : {}\n\nconst Component: ElementType<['containerWidth']> = (props) => {\n  const [own, rest] = splitProps(props, ['children', 'component', 'css', 'width'])\n  const {\n    containerWidth,\n    columns,\n    size,\n    gap,\n    padding,\n    gutter,\n    colCss,\n    colComponent,\n    rowCss,\n    rowComponent,\n    contentAlignX,\n  } = useGridContext(rest)\n\n  const context = {\n    columns,\n    size,\n    gap,\n    padding,\n    gutter,\n    colCss,\n    colComponent,\n    rowCss,\n    rowComponent,\n    contentAlignX,\n  }\n\n  const finalWidth = (() => {\n    if (!own.width) return containerWidth\n    if (typeof own.width === 'function') return own.width(containerWidth as Record<string, any>)\n    return own.width\n  })()\n\n  const finalProps = {\n    $coolgrid: {\n      width: finalWidth,\n      extraStyles: own.css,\n    },\n  }\n\n  // Provide container context to descendant Row/Col components\n  provide(ContainerContext, context)\n\n  return (\n    <Styled {...omitCtxKeys(rest)} as={own.component} {...finalProps} {...DEV_PROPS}>\n      {own.children}\n    </Styled>\n  )\n}\n\nconst name = `${PKG_NAME}/Container`\n\nComponent.displayName = name\nComponent.pkgName = PKG_NAME\nComponent.PYREON__COMPONENT = name\n\nexport default Component\n","import component from './component'\n\nexport default component\n","import { config } from '@pyreon/ui-core'\nimport type { MakeItResponsiveStyles } from '@pyreon/unistyle'\nimport { ALIGN_CONTENT_MAP_X, extendCss, makeItResponsive, value } from '@pyreon/unistyle'\nimport type { CssOutput, StyledTypes } from '../types'\nimport { isNumber } from '../utils'\n\nconst { styled, css, component } = config\n\n/**\n * Computes negative horizontal margins to compensate for column gap,\n * and vertical margins that account for gutter (inter-row spacing).\n * This creates the classic grid pattern where column gaps cancel out\n * at the row edges.\n */\ntype SpacingStyles = (\n  props: Pick<StyledTypes, 'gap' | 'gutter'>,\n  { rootSize }: { rootSize?: number | undefined },\n) => CssOutput\n\nconst spacingStyles: SpacingStyles = ({ gap, gutter }, { rootSize }) => {\n  if (!isNumber(gap)) return ''\n\n  const g = gap as number\n  const getValue = (param: string | number | null | undefined) => value(param, rootSize)\n\n  const spacingX = (g / 2) * -1\n  const spacingY = isNumber(gutter) ? (gutter as number) - g / 2 : g / 2\n\n  return css`\n    margin: ${getValue(spacingY)} ${getValue(spacingX)};\n  `\n}\n\n/** Maps the contentAlignX prop to a CSS justify-content value. */\nconst contentAlign = (align?: StyledTypes['contentAlignX']) => {\n  if (!align) return ''\n\n  return css`\n    justify-content: ${ALIGN_CONTENT_MAP_X[align]};\n  `\n}\n\n/** Composes spacing, alignment, and extra CSS into a single responsive style block for the Row. */\nconst styles: MakeItResponsiveStyles<\n  Pick<StyledTypes, 'gap' | 'gutter' | 'contentAlignX' | 'extraStyles'>\n> = ({ theme, css: cssFn, rootSize }) => {\n  const { gap, gutter, contentAlignX, extraStyles } = theme\n\n  return cssFn`\n    ${spacingStyles({ gap, gutter }, { rootSize })};\n    ${contentAlign(contentAlignX)};\n    ${extendCss(extraStyles)};\n  `\n}\n\nexport default styled(component, { layer: 'elements' })`\n  box-sizing: border-box;\n\n  display: flex;\n  flex-wrap: wrap;\n  align-self: stretch;\n  flex-direction: row;\n\n  ${makeItResponsive({\n    key: '$coolgrid',\n    styles,\n    css,\n    normalize: true,\n  })};\n`\n","import { provide, splitProps, useContext } from '@pyreon/core'\nimport { PKG_NAME } from '../constants'\nimport { ContainerContext, RowContext } from '../context'\nimport type { ElementType } from '../types'\nimport useGridContext from '../useContext'\nimport { omitCtxKeys } from '../utils'\nimport Styled from './styled'\n\n/**\n * Row component that reads inherited config from ContainerContext, merges\n * it with its own props, and provides the resolved grid settings (columns,\n * gap, gutter) to Col children via RowContext. Renders a flex-wrap container\n * with negative margins to offset column gutters.\n */\n\nconst DEV_PROPS: Record<string, string> =\n  process.env.NODE_ENV !== 'production' ? { 'data-coolgrid': 'row' } : {}\n\nconst Component: ElementType<['containerWidth', 'width', 'rowComponent', 'rowCss']> = (props) => {\n  const [own, rest] = splitProps(props, ['children', 'component', 'css', 'contentAlignX'])\n  const parentCtx = useContext(ContainerContext)\n\n  const {\n    columns,\n    gap,\n    gutter,\n    rowComponent,\n    rowCss,\n    contentAlignX,\n    containerWidth,\n    size,\n    padding,\n    colCss,\n    colComponent,\n  } = useGridContext({ ...parentCtx, ...rest })\n\n  const context = {\n    containerWidth,\n    size,\n    padding,\n    colCss,\n    colComponent,\n    columns,\n    gap,\n    gutter,\n  }\n\n  const finalProps = {\n    $coolgrid: {\n      contentAlignX: own.contentAlignX || contentAlignX,\n      columns,\n      gap,\n      gutter,\n      extraStyles: own.css || rowCss,\n    },\n  }\n\n  // Provide row context to Col children\n  provide(RowContext, context)\n\n  return (\n    <Styled {...omitCtxKeys(rest)} as={own.component || rowComponent} {...finalProps} {...DEV_PROPS}>\n      {own.children}\n    </Styled>\n  )\n}\n\nconst name = `${PKG_NAME}/Row`\n\nComponent.displayName = name\nComponent.pkgName = PKG_NAME\nComponent.PYREON__COMPONENT = name\n\nexport default Component\n","import component from './component'\n\nexport default component\n","/**\n * Default Bootstrap-like grid configuration. Provides 5 breakpoints (xs-xl),\n * a 12-column grid, and responsive container max-widths matching Bootstrap 4.\n */\nexport default {\n  rootSize: 16,\n  breakpoints: {\n    xs: 0,\n    sm: 576,\n    md: 768,\n    lg: 992,\n    xl: 1200,\n  },\n  grid: {\n    columns: 12,\n    container: {\n      xs: '100%',\n      sm: 540,\n      md: 720,\n      lg: 960,\n      xl: 1140,\n    },\n  },\n} as const\n\nexport const defaultBreakpoints: Record<string, number> = {\n  xs: 0,\n  sm: 576,\n  md: 768,\n  lg: 992,\n  xl: 1200,\n}\n\nexport const defaultContainerWidths: Record<string, string | number> = {\n  xs: '100%',\n  sm: 540,\n  md: 720,\n  lg: 960,\n  xl: 1140,\n}\n"],"mappings":"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"}