cirrojs 0.0.13 → 0.0.14

package/CHANGELOG.md

@@ -13,6 +13,11 @@ and this project adheres to [Semantic Versioning](http://semver.org/).
 
 ## [Unreleased]
 
+## [0.0.14] - 2026-06-28
+
+### Added
+- A new optional `centerGutters` field on `LayoutDefaults`. When `center` is called without a `gutters` option, it now applies `centerGutters` as the default inline padding.
+
 ## [0.0.13] - 2026-06-28
 
 ### Changed
@@ -104,7 +109,8 @@ and this project adheres to [Semantic Versioning](http://semver.org/).
 ## 0.0.1 - 2026-06-15
 - initial release
 
-[Unreleased]: https://github.com/osawa-naotaka/cirro/compare/v0.0.13...HEAD
+[Unreleased]: https://github.com/osawa-naotaka/cirro/compare/v0.0.14...HEAD
+[0.0.14]: https://github.com/osawa-naotaka/cirro/compare/v0.0.13...v0.0.14
 [0.0.13]: https://github.com/osawa-naotaka/cirro/compare/v0.0.12...v0.0.13
 [0.0.12]: https://github.com/osawa-naotaka/cirro/compare/v0.0.11...v0.0.12
 [0.0.11]: https://github.com/osawa-naotaka/cirro/compare/v0.0.10...v0.0.11

package/dist/layout.d.ts

@@ -14,6 +14,7 @@ interface LayoutDefaults {
   clusterJustify: Properties["justify_content"];
   clusterAlign: Properties["align_items"];
   centerMax: string;
+  centerGutters?: string;
   gridMin: string;
   switcherThreshold: string;
   switcherLimit: number;

package/dist/layout.js

@@ -1 +1 @@
-import{n as e}from"./css-CPDjsrSK.js";import{jsx as t}from"react/jsx-runtime";const n={gap:`1rem`,clusterJustify:`flex-start`,clusterAlign:`center`,centerMax:`60ch`,gridMin:`16rem`,switcherThreshold:`30rem`,switcherLimit:4,sidebarContentMin:`65ch`,sidebarSideWidth:`30ch`,coverMinHeight:`100vh`,frameRatio:`16 / 9`};function r(...e){return e.filter(Boolean).join(` `)}function i(i={}){let a=i.css??e({layer:`low`}),o={...n,...i.defaults};function s(e){return a({display:`flex`,flex_direction:`column`,gap:e?.gap??o.stackGap??o.gap},{name:`stack`})}function c(e){return a({display:`flex`,flex_wrap:e?.wrap??o.clusterWrap??`wrap`,gap:e?.gap??o.clusterGap??o.gap,justify_content:e?.justify??o.clusterJustify,align_items:e?.align??o.clusterAlign},{name:`cluster`})}function l(e){return r(a({box_sizing:`border-box`,margin_inline:`auto`,max_inline_size:e?.max??o.centerMax},{name:`center`}),e?.gutters?a({padding_inline:e.gutters},{name:`center-gutters`}):``,e?.intrinsic?a({display:`flex`,flex_direction:`column`,align_items:`center`},{name:`center-intrinsic`}):``,e?.andText?a({text_align:`center`},{name:`center-andText`}):``)}function u(e){let t=e?.min??o.gridMin;return a({display:`grid`,gap:e?.gap??o.gridGap??o.gap,grid_template_columns:`repeat(auto-fit, minmax(min(${t}, 100%), 1fr))`},{name:`grid`})}function d(e){let t=e?.threshold??o.switcherThreshold,n=e?.limit??o.switcherLimit;return r(a({display:`flex`,flex_wrap:`wrap`,gap:e?.gap??o.switcherGap??o.gap},{name:`switcher`}),a({flex_grow:`1`,flex_basis:`calc((${t} - 100%) * 999)`},{selector:`& > *`,name:`switcher-item`}),a({flex_basis:`100%`},{selector:`& > :nth-last-child(n+${n+1})`,name:`switcher-item-last`}),a({flex_basis:`100%`},{selector:`& > :nth-last-child(n+${n+1}) ~ *`,name:`switcher-item-last-child`}))}function f(e){return{root:a({display:`flex`,flex_wrap:`wrap`,gap:e?.gap??o.sidebarGap??o.gap},{name:`sidebar`}),side:a({flex_grow:`1`,flex_basis:e?.sideWidth??o.sidebarSideWidth??`auto`},{name:`sidebar-side`}),content:a({flex_grow:`999`,flex_basis:`0`,min_inline_size:e?.contentMin??o.sidebarContentMin},{name:`sidebar-content`})}}function p(e){let t=e?.gap??o.gap,n=a({margin_block:`auto`},{name:`cover-centered`});return{root:r(a({display:`flex`,flex_direction:`column`,min_block_size:e?.minHeight??o.coverMinHeight,padding:e?.padding??t},{name:`cover`}),a({margin_block:t},{selector:`& > :not(.${n})`,name:`cover-gap`}),a({margin_block_start:`0`},{selector:`& > :first-child:not(.${n})`,name:`cover-gap-first`}),a({margin_block_end:`0`},{selector:`& > :last-child:not(.${n})`,name:`cover-gap-last`})),centered:n}}function m(e){return r(a({aspect_ratio:e?.ratio??o.frameRatio,overflow:`hidden`,display:`flex`,justify_content:`center`,align_items:`center`},{name:`frame`}),a({inline_size:`100%`,block_size:`100%`,object_fit:`cover`},{selector:`& > img, & > video`,name:`frame-img`}))}function h(e){return r(a({display:`flex`,block_size:e?.height??`auto`,overflow_x:`auto`,overflow_y:`hidden`,gap:e?.gap??o.gap},{name:`reel`}),a({flex:`0 0 ${e?.itemWidth??`auto`}`},{selector:`& > *`,name:`reel-child`}),a({block_size:`100%`,flex_basis:`auto`,inline_size:`auto`},{selector:`& > img`,name:`reel-img`}))}function g(e){let t=e?.margin??`0px`;return r(a({position:e?.fixed?`fixed`:`absolute`,inset_block_start:`50%`,inset_inline_start:`50%`,transform:`translate(-50%, -50%)`},{name:`imposter`}),e?.contain?a({overflow:`auto`,max_inline_size:`calc(100% - (${t} * 2))`,max_block_size:`calc(100% - (${t} * 2))`},{name:`imposter-contain`}):``)}function _(e){return r(a({box_sizing:`border-box`,padding:e?.padding??o.boxPadding??o.gap},{name:`box`}),e?.border?a({border:e.border},{name:`box-border`}):``)}function v({gap:e,className:n,children:i,...a}={}){return t(`div`,{className:r(s({gap:e}),n),...a,children:i})}function y({gap:e,wrap:n,justify:i,align:a,className:o,children:s,...l}={}){return t(`div`,{className:r(c({gap:e,wrap:n,justify:i,align:a}),o),...l,children:s})}function b({max:e,gutters:n,intrinsic:i,andText:a,className:o,children:s,...c}={}){return t(`div`,{className:r(l({max:e,gutters:n,intrinsic:i,andText:a}),o),...c,children:s})}function x({gap:e,min:n,className:i,children:a,...o}={}){return t(`div`,{className:r(u({gap:e,min:n}),i),...o,children:a})}function S({threshold:e,gap:n,limit:i,className:a,children:o,...s}={}){return t(`div`,{className:r(d({threshold:e,gap:n,limit:i}),a),...s,children:o})}function C({ratio:e,className:n,children:i,...a}={}){return t(`div`,{className:r(m({ratio:e}),n),...a,children:i})}function w({itemWidth:e,height:n,gap:i,className:a,children:o,...s}={}){return t(`div`,{className:r(h({itemWidth:e,height:n,gap:i}),a),...s,children:o})}function T({fixed:e,contain:n,margin:i,className:a,children:o,...s}={}){return t(`div`,{className:r(g({fixed:e,contain:n,margin:i}),a),...s,children:o})}function E({padding:e,border:n,className:i,children:a,...o}={}){return t(`div`,{className:r(_({padding:e,border:n}),i),...o,children:a})}return{stack:s,cluster:c,center:l,grid:u,switcher:d,sidebar:f,cover:p,frame:m,reel:h,imposter:g,box:_,Stack:v,Cluster:y,Center:b,Grid:x,Switcher:S,Frame:C,Reel:w,Imposter:T,Box:E}}export{i as createLayout,r as cx};
+import{n as e}from"./css-CPDjsrSK.js";import{jsx as t}from"react/jsx-runtime";const n={gap:`1rem`,clusterJustify:`flex-start`,clusterAlign:`center`,centerMax:`60ch`,gridMin:`16rem`,switcherThreshold:`30rem`,switcherLimit:4,sidebarContentMin:`65ch`,sidebarSideWidth:`30ch`,coverMinHeight:`100vh`,frameRatio:`16 / 9`};function r(...e){return e.filter(Boolean).join(` `)}function i(i={}){let a=i.css??e({layer:`low`}),o={...n,...i.defaults};function s(e){return a({display:`flex`,flex_direction:`column`,gap:e?.gap??o.stackGap??o.gap},{name:`stack`})}function c(e){return a({display:`flex`,flex_wrap:e?.wrap??o.clusterWrap??`wrap`,gap:e?.gap??o.clusterGap??o.gap,justify_content:e?.justify??o.clusterJustify,align_items:e?.align??o.clusterAlign},{name:`cluster`})}function l(e){return r(a({box_sizing:`border-box`,margin_inline:`auto`,max_inline_size:e?.max??o.centerMax},{name:`center`}),e?.gutters?a({padding_inline:e.gutters},{name:`center-gutters`}):o.centerGutters?a({padding_inline:o.centerGutters},{name:`center-gutters`}):``,e?.intrinsic?a({display:`flex`,flex_direction:`column`,align_items:`center`},{name:`center-intrinsic`}):``,e?.andText?a({text_align:`center`},{name:`center-andText`}):``)}function u(e){let t=e?.min??o.gridMin;return a({display:`grid`,gap:e?.gap??o.gridGap??o.gap,grid_template_columns:`repeat(auto-fit, minmax(min(${t}, 100%), 1fr))`},{name:`grid`})}function d(e){let t=e?.threshold??o.switcherThreshold,n=e?.limit??o.switcherLimit;return r(a({display:`flex`,flex_wrap:`wrap`,gap:e?.gap??o.switcherGap??o.gap},{name:`switcher`}),a({flex_grow:`1`,flex_basis:`calc((${t} - 100%) * 999)`},{selector:`& > *`,name:`switcher-item`}),a({flex_basis:`100%`},{selector:`& > :nth-last-child(n+${n+1})`,name:`switcher-item-last`}),a({flex_basis:`100%`},{selector:`& > :nth-last-child(n+${n+1}) ~ *`,name:`switcher-item-last-child`}))}function f(e){return{root:a({display:`flex`,flex_wrap:`wrap`,gap:e?.gap??o.sidebarGap??o.gap},{name:`sidebar`}),side:a({flex_grow:`1`,flex_basis:e?.sideWidth??o.sidebarSideWidth??`auto`},{name:`sidebar-side`}),content:a({flex_grow:`999`,flex_basis:`0`,min_inline_size:e?.contentMin??o.sidebarContentMin},{name:`sidebar-content`})}}function p(e){let t=e?.gap??o.gap,n=a({margin_block:`auto`},{name:`cover-centered`});return{root:r(a({display:`flex`,flex_direction:`column`,min_block_size:e?.minHeight??o.coverMinHeight,padding:e?.padding??t},{name:`cover`}),a({margin_block:t},{selector:`& > :not(.${n})`,name:`cover-gap`}),a({margin_block_start:`0`},{selector:`& > :first-child:not(.${n})`,name:`cover-gap-first`}),a({margin_block_end:`0`},{selector:`& > :last-child:not(.${n})`,name:`cover-gap-last`})),centered:n}}function m(e){return r(a({aspect_ratio:e?.ratio??o.frameRatio,overflow:`hidden`,display:`flex`,justify_content:`center`,align_items:`center`},{name:`frame`}),a({inline_size:`100%`,block_size:`100%`,object_fit:`cover`},{selector:`& > img, & > video`,name:`frame-img`}))}function h(e){return r(a({display:`flex`,block_size:e?.height??`auto`,overflow_x:`auto`,overflow_y:`hidden`,gap:e?.gap??o.gap},{name:`reel`}),a({flex:`0 0 ${e?.itemWidth??`auto`}`},{selector:`& > *`,name:`reel-child`}),a({block_size:`100%`,flex_basis:`auto`,inline_size:`auto`},{selector:`& > img`,name:`reel-img`}))}function g(e){let t=e?.margin??`0px`;return r(a({position:e?.fixed?`fixed`:`absolute`,inset_block_start:`50%`,inset_inline_start:`50%`,transform:`translate(-50%, -50%)`},{name:`imposter`}),e?.contain?a({overflow:`auto`,max_inline_size:`calc(100% - (${t} * 2))`,max_block_size:`calc(100% - (${t} * 2))`},{name:`imposter-contain`}):``)}function _(e){return r(a({box_sizing:`border-box`,padding:e?.padding??o.boxPadding??o.gap},{name:`box`}),e?.border?a({border:e.border},{name:`box-border`}):``)}function v({gap:e,className:n,children:i,...a}={}){return t(`div`,{className:r(s({gap:e}),n),...a,children:i})}function y({gap:e,wrap:n,justify:i,align:a,className:o,children:s,...l}={}){return t(`div`,{className:r(c({gap:e,wrap:n,justify:i,align:a}),o),...l,children:s})}function b({max:e,gutters:n,intrinsic:i,andText:a,className:o,children:s,...c}={}){return t(`div`,{className:r(l({max:e,gutters:n,intrinsic:i,andText:a}),o),...c,children:s})}function x({gap:e,min:n,className:i,children:a,...o}={}){return t(`div`,{className:r(u({gap:e,min:n}),i),...o,children:a})}function S({threshold:e,gap:n,limit:i,className:a,children:o,...s}={}){return t(`div`,{className:r(d({threshold:e,gap:n,limit:i}),a),...s,children:o})}function C({ratio:e,className:n,children:i,...a}={}){return t(`div`,{className:r(m({ratio:e}),n),...a,children:i})}function w({itemWidth:e,height:n,gap:i,className:a,children:o,...s}={}){return t(`div`,{className:r(h({itemWidth:e,height:n,gap:i}),a),...s,children:o})}function T({fixed:e,contain:n,margin:i,className:a,children:o,...s}={}){return t(`div`,{className:r(g({fixed:e,contain:n,margin:i}),a),...s,children:o})}function E({padding:e,border:n,className:i,children:a,...o}={}){return t(`div`,{className:r(_({padding:e,border:n}),i),...o,children:a})}return{stack:s,cluster:c,center:l,grid:u,switcher:d,sidebar:f,cover:p,frame:m,reel:h,imposter:g,box:_,Stack:v,Cluster:y,Center:b,Grid:x,Switcher:S,Frame:C,Reel:w,Imposter:T,Box:E}}export{i as createLayout,r as cx};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cirrojs",
-  "version": "0.0.13",
+  "version": "0.0.14",
   "description": "React islands SSG with strict CSP (no unsafe-inline). Vite-based, MPA-first.",
   "license": "MIT",
   "type": "module",