@bedrock-layout/solid 0.11.2 → 0.11.5

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.
package/lib/index.cjs.js CHANGED
@@ -1,4 +1,4 @@
1
- "use strict";var H=Object.defineProperty,F=Object.defineProperties;var G=Object.getOwnPropertyDescriptors;var p=Object.getOwnPropertySymbols;var I=Object.prototype.hasOwnProperty,j=Object.prototype.propertyIsEnumerable;var M=(e,t,n)=>t in e?H(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,f=(e,t)=>{for(var n in t||(t={}))I.call(t,n)&&M(e,n,t[n]);if(p)for(var n of p(t))j.call(t,n)&&M(e,n,t[n]);return e},m=(e,t)=>F(e,G(t));var P=(e,t)=>{var n={};for(var r in e)I.call(e,r)&&t.indexOf(r)<0&&(n[r]=e[r]);if(e!=null&&p)for(var r of p(e))t.indexOf(r)<0&&j.call(e,r)&&(n[r]=e[r]);return n};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});var o=require("solid-styled-components"),v=require("@bedrock-layout/register-resize-callback"),s=require("solid-js");function A(e){return typeof e!="string"?!1:[/^[0-9]{0,10000}\.?[0-9]{1,10000}(vmin|vmax|vh|vw|%|ch|ex|em|rem|in|cm|mm|pt|pc|px)$/,/^var\(--\D{1,100}\)$/].some(t=>t.test(e))}const R={none:"0px",xxs:"0.0625rem",xs:"0.125rem",sm:"0.25rem",md:"0.5rem",mdLg:"0.75rem",lg:"1rem",lgXl:"1.5rem",xl:"2rem",xlXXl:"3rem",xxl:"4rem"};function N(e){return e.reduce((t,[n,r])=>m(f({},t),{[n]:r}),{})}const d=(e,t)=>{var a,l;const n=(l=(a=t==null?void 0:t.space)!=null?a:t==null?void 0:t.spacing)!=null?l:R,i=N(Object.entries(n).map(([u,g])=>[u,typeof g=="number"?`${g}px`:g]))[e];return A(i)?i:void 0};function _(e){return e===void 0?"100%":typeof e=="number"?`${e}px`:e}const q=o.styled.div`
1
+ "use strict";var H=Object.defineProperty,F=Object.defineProperties;var G=Object.getOwnPropertyDescriptors;var p=Object.getOwnPropertySymbols;var j=Object.prototype.hasOwnProperty,I=Object.prototype.propertyIsEnumerable;var M=(e,t,n)=>t in e?H(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,f=(e,t)=>{for(var n in t||(t={}))j.call(t,n)&&M(e,n,t[n]);if(p)for(var n of p(t))I.call(t,n)&&M(e,n,t[n]);return e},m=(e,t)=>F(e,G(t));var P=(e,t)=>{var n={};for(var r in e)j.call(e,r)&&t.indexOf(r)<0&&(n[r]=e[r]);if(e!=null&&p)for(var r of p(e))t.indexOf(r)<0&&I.call(e,r)&&(n[r]=e[r]);return n};Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});var o=require("solid-styled-components"),v=require("@bedrock-layout/register-resize-callback"),s=require("solid-js");function A(e){return typeof e!="string"?!1:[/^[0-9]{0,10000}\.?[0-9]{1,10000}(vmin|vmax|vh|vw|%|ch|ex|em|rem|in|cm|mm|pt|pc|px)$/,/^var\(--\D{1,100}\)$/].some(t=>t.test(e))}const R={none:"0px",xxs:"0.0625rem",xs:"0.125rem",sm:"0.25rem",md:"0.5rem",mdLg:"0.75rem",lg:"1rem",lgXl:"1.5rem",xl:"2rem",xlXXl:"3rem",xxl:"4rem"};function N(e){return e.reduce((t,[n,r])=>m(f({},t),{[n]:r}),{})}const d=(e,t)=>{var a,l;const n=(l=(a=t==null?void 0:t.space)!=null?a:t==null?void 0:t.spacing)!=null?l:R,i=N(Object.entries(n).map(([u,g])=>[u,typeof g=="number"?`${g}px`:g]))[e];return A(i)?i:void 0};function _(e){return e===void 0?"100%":typeof e=="number"?`${e}px`:e}const q=o.styled.div`
2
2
  @property --maxWidth {
3
3
  syntax: "<length-percentage>";
4
4
  inherits: false;
@@ -26,11 +26,11 @@
26
26
  ${e=>e.centerText?o.css`
27
27
  text-align: center;
28
28
  `:""}
29
- `;function Q(e){return e===void 0?"100%":typeof e=="number"?`${e}px`:e}const U=o.styled("div")`
29
+ `;function Q(e){return e===void 0?"159px":typeof e=="number"?`${e}px`:e}const U=o.styled("div")`
30
30
  @property --basis {
31
31
  syntax: "<length-percentage>";
32
32
  inherits: true;
33
- initial-value: 100%;
33
+ initial-value: 159px;
34
34
  }
35
35
 
36
36
  @property --gutter {
@@ -45,15 +45,16 @@
45
45
  box-sizing: border-box;
46
46
  > * {
47
47
  margin: 0;
48
- flex-basis: var(--basis, 100%);
48
+ flex-basis: var(--basis, 159px);
49
49
  flex-grow: ${e=>e.noStretchedColumns?"0":"1"};
50
50
  flex-shrink: 1;
51
51
  }
52
52
 
53
53
  display: flex;
54
54
  flex-wrap: wrap;
55
+ justify-content: center;
55
56
  gap: var(--gutter, 0px);
56
- `;function $(e){throw new Error(e)}function J(e){typeof e!="number"&&!Array.isArray(e)&&$("width must be a number or an array of two numbers"),Array().concat(e).some(n=>n<1)&&$("width value(s) must be greater than 0"),Array.isArray(e)&&(e.length!==2||e[0]>e[1])&&$(`The second width value, ${e[1]}, is not larger than ${e[0]}. Please provide a value greater than first width value`)}function k(e,t){J(e);const[n,r]=s.createSignal(!1),[i,c]=s.createSignal();return s.onMount(()=>{v.init()}),s.createEffect(()=>{if(i(),i()===void 0||i()===null)return;t&&t(i());const a=v.registerCallback(i(),l=>{var g,y;const u=(y=(g=l.borderBoxSize)==null?void 0:g.inlineSize)!=null?y:l.contentRect.width;if(u>0){const S=Array.isArray(e)?u>=e[0]&&u<=e[1]:u<=e;r(S)}});s.onCleanup(a)}),[n,c]}function K(e){return Array.isArray(e)&&e.length===2&&e.every(Number.isFinite)||typeof e=="string"&&/^\d{1,1000} {0,1}\/ {0,1}\d{1,1000}$/.test(e)}function Y(e){return Array.isArray(e)?e.join("/"):e}function Z(e){return K(e)?Y(e):void 0}const ee=o.styled.div`
57
+ `;function $(e){throw new Error(e)}function J(e){typeof e!="number"&&!Array.isArray(e)&&$("width must be a number or an array of two numbers"),Array().concat(e).some(n=>n<0)&&$("width value(s) must be 0 or greater"),Array.isArray(e)&&(e.length!==2||e[0]>e[1])&&$(`The second width value, ${e[1]}, is not larger than ${e[0]}. Please provide a value greater than first width value`)}function k(e,t){J(e);const[n,r]=s.createSignal(!1),[i,c]=s.createSignal();return s.onMount(()=>{v.init()}),s.createEffect(()=>{if(i(),i()===void 0||i()===null)return;t&&t(i());const a=v.registerCallback(i(),l=>{var g,y;const u=(y=(g=l.borderBoxSize)==null?void 0:g.inlineSize)!=null?y:l.contentRect.width;if(u>0){const S=Array.isArray(e)?u>=e[0]&&u<=e[1]:u<=e;r(S)}});s.onCleanup(a)}),[n,c]}function K(e){return Array.isArray(e)&&e.length===2&&e.every(Number.isFinite)||typeof e=="string"&&/^\d{1,1000} {0,1}\/ {0,1}\d{1,1000}$/.test(e)}function Y(e){return Array.isArray(e)?e.join("/"):e}function Z(e){return K(e)?Y(e):void 0}const ee=o.styled.div`
57
58
  box-sizing: border-box;
58
59
  display: block;
59
60
  inline-size: 100%;
@@ -116,14 +117,14 @@
116
117
  auto-fit,
117
118
  minmax(min(var(--minItemWidth, 639px), 100%), 1fr)
118
119
  );
119
- `,h=96;function O(e){var r;e=String(e);const t=parseFloat(e),[,n]=(r=e.match(/[\d.\-+]*\s*(.*)/))!=null?r:["",""];return[t,n]}function x(e,t){if(!e)return null;const n=t!=null?t:document.body,r=(e!=null?e:"px").trim().toLowerCase();switch(r){case"vmin":case"vmax":case"vh":case"vw":case"%":return null;case"ch":case"ex":return te(r,n);case"em":return C(n,"font-size");case"rem":return C(document.body,"font-size");case"in":return h;case"cm":return h/2.54;case"mm":return h/25.4;case"pt":return h/72;case"pc":return h/6;case"px":return 1;default:{const[i,c]=O(r);if(isNaN(i))return null;if(!c)return i;const a=x(c,t);return typeof a=="number"?i*a:null}}}function C(e,t){var i;const[n,r]=O(getComputedStyle(e).getPropertyValue(t));return n*((i=x(r,e))!=null?i:1)}function te(e,t){const n=document.createElement("div");n.style.height="128"+e,t.appendChild(n);const r=C(n,"height")/128;return t.removeChild(n),r}const ne=typeof window=="object"&&typeof document=="object"&&document.nodeType===9,re=o.styled.div`
120
+ `,x=96;function O(e){var r;e=String(e);const t=parseFloat(e),[,n]=(r=e.match(/[\d.\-+]*\s*(.*)/))!=null?r:["",""];return[t,n]}function h(e,t){if(!e)return null;const n=t!=null?t:document.body,r=(e!=null?e:"px").trim().toLowerCase();switch(r){case"vmin":case"vmax":case"vh":case"vw":case"%":return null;case"ch":case"ex":return te(r,n);case"em":return C(n,"font-size");case"rem":return C(document.body,"font-size");case"in":return x;case"cm":return x/2.54;case"mm":return x/25.4;case"pt":return x/72;case"pc":return x/6;case"px":return 1;default:{const[i,c]=O(r);if(isNaN(i))return null;if(!c)return i;const a=h(c,t);return typeof a=="number"?i*a:null}}}function C(e,t){var i;const[n,r]=O(getComputedStyle(e).getPropertyValue(t));return n*((i=h(r,e))!=null?i:1)}function te(e,t){const n=document.createElement("div");n.style.height="128"+e,t.appendChild(n);const r=C(n,"height")/128;return t.removeChild(n),r}const ne=typeof window=="object"&&typeof document=="object"&&document.nodeType===9,re=o.styled.div`
120
121
  grid-row: span var(--rows, 1);
121
122
 
122
123
  > * {
123
124
  display: block;
124
125
  height: 100%;
125
126
  }
126
- `,ie=e=>{const[t,n]=s.createSignal(1),[r,i]=s.createSignal(),c=o.useTheme();return s.onMount(()=>{v.init()}),s.createEffect(()=>{const a=r();if(a==null)return;const l=v.registerCallback(a,({target:u})=>{var z;n(1);const g=e.gutter&&(z=d(e.gutter,c))!=null?z:"1px",y=ne?x(g,u):null,S=Math.max(y!=null?y:1,1),[L]=Array.from(u.children),D=1+Math.min(u.scrollHeight,L.scrollHeight),X=Math.ceil(D/S);n(X)});s.onCleanup(l)}),React.createElement(re,{style:`--rows: ${t()}`,ref:i},e.children)},ae=o.styled(T)`
127
+ `,ie=e=>{const[t,n]=s.createSignal(1),[r,i]=s.createSignal(),c=o.useTheme();return s.onMount(()=>{v.init()}),s.createEffect(()=>{const a=r();if(a==null)return;const l=v.registerCallback(a,({target:u})=>{var z;n(1);const g=e.gutter&&(z=d(e.gutter,c))!=null?z:"1px",y=ne?h(g,u):null,S=Math.max(y!=null?y:1,1),[L]=Array.from(u.children),D=1+Math.min(u.scrollHeight,L.scrollHeight),X=Math.ceil(D/S);n(X)});s.onCleanup(l)}),React.createElement(re,{style:`--rows: ${t()}`,ref:i},e.children)},ae=o.styled(T)`
127
128
  grid-template-rows: 1px;
128
129
  `,oe=e=>{const t=s.children(()=>e.children),r=[].concat(t()).filter(Boolean).map(i=>React.createElement(ie,{gutter:e.gutter},i));return React.createElement(ae,f({},e),r)},b={start:"flex-start",end:"flex-end",center:"center"},w=m(f({},b),{stretch:"stretch"}),V=o.styled.div`
129
130
  --gutter: ${e=>{var t;return e.gutter&&(t=d(e.gutter,e.theme))!=null?t:"0px"}};
@@ -148,7 +149,15 @@
148
149
  }
149
150
 
150
151
  flex-wrap: nowrap;
151
- ${e=>e.stretch==="all"?"& > * { flex: 1 }":e.stretch==="start"?"& > :first-child { flex: 1 }":e.stretch==="end"?"& > :last-child { flex: 1 }":typeof e.stretch=="number"?`& > :nth-child(${e.stretch+1}) { flex: 1 }`:""}
152
+ ${e=>e.stretch==="all"?`& > * {
153
+ flex: 1;
154
+ }`:e.stretch==="start"?`& > :first-child {
155
+ flex: 1;
156
+ }`:e.stretch==="end"?`& > :last-child {
157
+ flex: 1;
158
+ }`:typeof e.stretch=="number"?`& > :nth-child(${e.stretch+1}) {
159
+ flex: 1;
160
+ }`:""}
152
161
 
153
162
  ${e=>se(e.switchAt)?`
154
163
  --switchAt: ${typeof e.switchAt=="string"?e.switchAt:`${e.switchAt}px`};
@@ -210,7 +219,7 @@
210
219
  display: grid;
211
220
  gap: var(--gutter, 0px);
212
221
  grid-template-columns: ${({fraction:e="1/2"})=>{var t;return(t=B[e])!=null?t:B["1/2"]}}};
213
- `,ye=e=>{const t=typeof e.switchAt=="string"?x(e.switchAt):e.switchAt,n=t&&t>-1?t:0,[r,i]=k(n,e.ref);return React.createElement(s.Switch,null,React.createElement(s.Match,{when:r()===!1},React.createElement(me,m(f({fraction:e.fraction},e),{ref:i}))),React.createElement(s.Match,{when:r()===!0},React.createElement(E,m(f({},e),{ref:i}))))};function he(e){return typeof e=="number"?`${e}px`:e&&A(e)?e:"100vh"}const xe=o.styled.div`
222
+ `,ye=e=>{const t=typeof e.switchAt=="string"?h(e.switchAt):e.switchAt,n=t&&t>-1?t:0,[r,i]=k(n,e.ref);return React.createElement(s.Switch,null,React.createElement(s.Match,{when:r()===!1},React.createElement(me,m(f({fraction:e.fraction},e),{ref:i}))),React.createElement(s.Match,{when:r()===!0},React.createElement(E,m(f({},e),{ref:i}))))};function xe(e){return typeof e=="number"?`${e}px`:e&&A(e)?e:"100vh"}const he=o.styled.div`
214
223
  @property --gutter {
215
224
  syntax: "<length-percentage>";
216
225
  inherits: false;
@@ -225,7 +234,7 @@
225
234
 
226
235
  --gutter: ${e=>{var t;return e.gutter&&(t=d(e.gutter,e.theme))!=null?t:"0px"}};
227
236
 
228
- --minHeight: ${e=>he(e.minHeight)};
237
+ --minHeight: ${e=>xe(e.minHeight)};
229
238
 
230
239
  > * {
231
240
  margin: 0;
@@ -250,7 +259,7 @@
250
259
  }
251
260
  `:""};
252
261
  }
253
- `,pe=e=>{const c=e,{top:t,bottom:n,children:r}=c,i=P(c,["top","bottom","children"]);return React.createElement(xe,f({},i),e.top,React.createElement("div",{"data-bedrock-cover-centered":!0},e.children),e.bottom)},be=o.styled.div`
262
+ `,pe=e=>{const c=e,{top:t,bottom:n,children:r}=c,i=P(c,["top","bottom","children"]);return React.createElement(he,f({},i),e.top,React.createElement("div",{"data-bedrock-cover-centered":!0},e.children),e.bottom)},be=o.styled.div`
254
263
  @property --gutter {
255
264
  syntax: "<length-percentage>";
256
265
  inherits: false;
@@ -275,7 +284,7 @@
275
284
  grid-template-columns: repeat(var(--columns, 1), 1fr);
276
285
  gap: var(--gutter, 0px);
277
286
  grid-auto-flow: row ${({dense:e=!1})=>e===!0?"dense":""};
278
- `,ve=e=>{const t=typeof e.switchAt=="string"?x(e.switchAt):e.switchAt,n=t&&t>-1?t:0,[r,i]=k(n),c=a=>{var l;i(a),(l=e.ref)==null||l.call(e,a)};return React.createElement(s.Switch,null,React.createElement(s.Match,{when:r()===!1},React.createElement(be,m(f({},e),{ref:c}))),React.createElement(s.Match,{when:r()===!0},React.createElement(E,m(f({},e),{ref:c}))))},Se=e=>typeof e=="number"?e:1,$e=o.styled.div`
287
+ `,ve=e=>{const t=typeof e.switchAt=="string"?h(e.switchAt):e.switchAt,n=t&&t>-1?t:0,[r,i]=k(n),c=a=>{var l;i(a),(l=e.ref)==null||l.call(e,a)};return React.createElement(s.Switch,null,React.createElement(s.Match,{when:r()===!1},React.createElement(be,m(f({},e),{ref:c}))),React.createElement(s.Match,{when:r()===!0},React.createElement(E,m(f({},e),{ref:c}))))},Se=e=>typeof e=="number"?e:1,$e=o.styled.div`
279
288
  @property --span {
280
289
  syntax: "<number>";
281
290
  inherits: true;
package/lib/index.m.js CHANGED
@@ -107,7 +107,7 @@ const Center = styled.div`
107
107
  `;
108
108
  function getSafeBasis(basis) {
109
109
  if (basis === void 0)
110
- return "100%";
110
+ return "159px";
111
111
  if (typeof basis === "number")
112
112
  return `${basis}px`;
113
113
  return basis;
@@ -116,7 +116,7 @@ const ColumnDrop = styled("div")`
116
116
  @property --basis {
117
117
  syntax: "<length-percentage>";
118
118
  inherits: true;
119
- initial-value: 100%;
119
+ initial-value: 159px;
120
120
  }
121
121
 
122
122
  @property --gutter {
@@ -134,13 +134,14 @@ const ColumnDrop = styled("div")`
134
134
  box-sizing: border-box;
135
135
  > * {
136
136
  margin: 0;
137
- flex-basis: var(--basis, 100%);
137
+ flex-basis: var(--basis, 159px);
138
138
  flex-grow: ${(props) => props.noStretchedColumns ? "0" : "1"};
139
139
  flex-shrink: 1;
140
140
  }
141
141
 
142
142
  display: flex;
143
143
  flex-wrap: wrap;
144
+ justify-content: center;
144
145
  gap: var(--gutter, 0px);
145
146
  `;
146
147
  function fail(msg) {
@@ -150,8 +151,8 @@ function assertIsValidWidth(width) {
150
151
  if (typeof width !== "number" && !Array.isArray(width)) {
151
152
  fail("width must be a number or an array of two numbers");
152
153
  }
153
- if (Array().concat(width).some((w) => w < 1)) {
154
- fail("width value(s) must be greater than 0");
154
+ if (Array().concat(width).some((w) => w < 0)) {
155
+ fail("width value(s) must be 0 or greater");
155
156
  }
156
157
  const isInvalidArray = Array.isArray(width) && (width.length !== 2 || width[0] > width[1]);
157
158
  if (isInvalidArray) {
@@ -428,7 +429,15 @@ const Inline = styled(InlineCluster)`
428
429
  }
429
430
 
430
431
  flex-wrap: nowrap;
431
- ${(props) => props.stretch === "all" ? `& > * { flex: 1 }` : props.stretch === "start" ? `& > :first-child { flex: 1 }` : props.stretch === "end" ? `& > :last-child { flex: 1 }` : typeof props.stretch === "number" ? `& > :nth-child(${props.stretch + 1}) { flex: 1 }` : ""}
432
+ ${(props) => props.stretch === "all" ? `& > * {
433
+ flex: 1;
434
+ }` : props.stretch === "start" ? `& > :first-child {
435
+ flex: 1;
436
+ }` : props.stretch === "end" ? `& > :last-child {
437
+ flex: 1;
438
+ }` : typeof props.stretch === "number" ? `& > :nth-child(${props.stretch + 1}) {
439
+ flex: 1;
440
+ }` : ""}
432
441
 
433
442
  ${(props) => shouldUseSwitch(props.switchAt) ? `
434
443
  --switchAt: ${typeof props.switchAt === "string" ? props.switchAt : `${props.switchAt}px`};
package/lib/index.umd.js CHANGED
@@ -26,11 +26,11 @@ var $e=Object.defineProperty,we=Object.defineProperties;var Se=Object.getOwnProp
26
26
  ${e=>e.centerText?r.css`
27
27
  text-align: center;
28
28
  `:""}
29
- `;function F(e){return e===void 0?"100%":typeof e=="number"?`${e}px`:e}const G=r.styled("div")`
29
+ `;function F(e){return e===void 0?"159px":typeof e=="number"?`${e}px`:e}const G=r.styled("div")`
30
30
  @property --basis {
31
31
  syntax: "<length-percentage>";
32
32
  inherits: true;
33
- initial-value: 100%;
33
+ initial-value: 159px;
34
34
  }
35
35
 
36
36
  @property --gutter {
@@ -45,15 +45,16 @@ var $e=Object.defineProperty,we=Object.defineProperties;var Se=Object.getOwnProp
45
45
  box-sizing: border-box;
46
46
  > * {
47
47
  margin: 0;
48
- flex-basis: var(--basis, 100%);
48
+ flex-basis: var(--basis, 159px);
49
49
  flex-grow: ${e=>e.noStretchedColumns?"0":"1"};
50
50
  flex-shrink: 1;
51
51
  }
52
52
 
53
53
  display: flex;
54
54
  flex-wrap: wrap;
55
+ justify-content: center;
55
56
  gap: var(--gutter, 0px);
56
- `;function A(e){throw new Error(e)}function N(e){typeof e!="number"&&!Array.isArray(e)&&A("width must be a number or an array of two numbers"),Array().concat(e).some(i=>i<1)&&A("width value(s) must be greater than 0"),Array.isArray(e)&&(e.length!==2||e[0]>e[1])&&A(`The second width value, ${e[1]}, is not larger than ${e[0]}. Please provide a value greater than first width value`)}function k(e,t){N(e);const[i,o]=c.createSignal(!1),[a,u]=c.createSignal();return c.onMount(()=>{l.init()}),c.createEffect(()=>{if(a(),a()===void 0||a()===null)return;t&&t(a());const s=l.registerCallback(a(),f=>{var h,x;const g=(x=(h=f.borderBoxSize)==null?void 0:h.inlineSize)!=null?x:f.contentRect.width;if(g>0){const M=Array.isArray(e)?g>=e[0]&&g<=e[1]:g<=e;o(M)}});c.onCleanup(s)}),[i,u]}function _(e){return Array.isArray(e)&&e.length===2&&e.every(Number.isFinite)||typeof e=="string"&&/^\d{1,1000} {0,1}\/ {0,1}\d{1,1000}$/.test(e)}function q(e){return Array.isArray(e)?e.join("/"):e}function Q(e){return _(e)?q(e):void 0}const U=r.styled.div`
57
+ `;function A(e){throw new Error(e)}function N(e){typeof e!="number"&&!Array.isArray(e)&&A("width must be a number or an array of two numbers"),Array().concat(e).some(i=>i<0)&&A("width value(s) must be 0 or greater"),Array.isArray(e)&&(e.length!==2||e[0]>e[1])&&A(`The second width value, ${e[1]}, is not larger than ${e[0]}. Please provide a value greater than first width value`)}function k(e,t){N(e);const[i,o]=c.createSignal(!1),[a,u]=c.createSignal();return c.onMount(()=>{l.init()}),c.createEffect(()=>{if(a(),a()===void 0||a()===null)return;t&&t(a());const s=l.registerCallback(a(),f=>{var h,x;const g=(x=(h=f.borderBoxSize)==null?void 0:h.inlineSize)!=null?x:f.contentRect.width;if(g>0){const j=Array.isArray(e)?g>=e[0]&&g<=e[1]:g<=e;o(j)}});c.onCleanup(s)}),[i,u]}function _(e){return Array.isArray(e)&&e.length===2&&e.every(Number.isFinite)||typeof e=="string"&&/^\d{1,1000} {0,1}\/ {0,1}\d{1,1000}$/.test(e)}function q(e){return Array.isArray(e)?e.join("/"):e}function Q(e){return _(e)?q(e):void 0}const U=r.styled.div`
57
58
  box-sizing: border-box;
58
59
  display: block;
59
60
  inline-size: 100%;
@@ -88,7 +89,7 @@ var $e=Object.defineProperty,we=Object.defineProperties;var Se=Object.getOwnProp
88
89
  object-fit: cover;
89
90
  object-position: ${e=>typeof e.position=="string"?e.position:"50%"};
90
91
  }
91
- `,j=r.styled("div")`
92
+ `,M=r.styled("div")`
92
93
  @property --gutter {
93
94
  syntax: "<length-percentage>";
94
95
  inherits: false;
@@ -123,7 +124,7 @@ var $e=Object.defineProperty,we=Object.defineProperties;var Se=Object.getOwnProp
123
124
  display: block;
124
125
  height: 100%;
125
126
  }
126
- `,J=e=>{const[t,i]=c.createSignal(1),[o,a]=c.createSignal(),u=r.useTheme();return c.onMount(()=>{l.init()}),c.createEffect(()=>{const s=o();if(s==null)return;const f=l.registerCallback(s,({target:g})=>{var W;i(1);const h=e.gutter&&(W=d(e.gutter,u))!=null?W:"1px",x=Y?v(h,g):null,M=Math.max(x!=null?x:1,1),[be]=Array.from(g.children),ve=1+Math.min(g.scrollHeight,be.scrollHeight),pe=Math.ceil(ve/M);i(pe)});c.onCleanup(f)}),React.createElement(Z,{style:`--rows: ${t()}`,ref:a},e.children)},ee=r.styled(j)`
127
+ `,J=e=>{const[t,i]=c.createSignal(1),[o,a]=c.createSignal(),u=r.useTheme();return c.onMount(()=>{l.init()}),c.createEffect(()=>{const s=o();if(s==null)return;const f=l.registerCallback(s,({target:g})=>{var W;i(1);const h=e.gutter&&(W=d(e.gutter,u))!=null?W:"1px",x=Y?v(h,g):null,j=Math.max(x!=null?x:1,1),[be]=Array.from(g.children),ve=1+Math.min(g.scrollHeight,be.scrollHeight),pe=Math.ceil(ve/j);i(pe)});c.onCleanup(f)}),React.createElement(Z,{style:`--rows: ${t()}`,ref:a},e.children)},ee=r.styled(M)`
127
128
  grid-template-rows: 1px;
128
129
  `,te=e=>{const t=c.children(()=>e.children),o=[].concat(t()).filter(Boolean).map(a=>React.createElement(J,{gutter:e.gutter},a));return React.createElement(ee,m({},e),o)},p={start:"flex-start",end:"flex-end",center:"center"},E=y(m({},p),{stretch:"stretch"}),C=r.styled.div`
129
130
  --gutter: ${e=>{var t;return e.gutter&&(t=d(e.gutter,e.theme))!=null?t:"0px"}};
@@ -148,7 +149,15 @@ var $e=Object.defineProperty,we=Object.defineProperties;var Se=Object.getOwnProp
148
149
  }
149
150
 
150
151
  flex-wrap: nowrap;
151
- ${e=>e.stretch==="all"?"& > * { flex: 1 }":e.stretch==="start"?"& > :first-child { flex: 1 }":e.stretch==="end"?"& > :last-child { flex: 1 }":typeof e.stretch=="number"?`& > :nth-child(${e.stretch+1}) { flex: 1 }`:""}
152
+ ${e=>e.stretch==="all"?`& > * {
153
+ flex: 1;
154
+ }`:e.stretch==="start"?`& > :first-child {
155
+ flex: 1;
156
+ }`:e.stretch==="end"?`& > :last-child {
157
+ flex: 1;
158
+ }`:typeof e.stretch=="number"?`& > :nth-child(${e.stretch+1}) {
159
+ flex: 1;
160
+ }`:""}
152
161
 
153
162
  ${e=>ne(e.switchAt)?`
154
163
  --switchAt: ${typeof e.switchAt=="string"?e.switchAt:`${e.switchAt}px`};
@@ -306,4 +315,4 @@ ${e=>e.offsetEnd&&e.offsetEnd>0?`
306
315
  grid-column: span min(${e.offsetEnd}, var(--columns, 1));
307
316
  }
308
317
  `:""}
309
- `;n.Center=H,n.Column=xe,n.ColumnDrop=G,n.Columns=he,n.Cover=de,n.Frame=U,n.Grid=j,n.Inline=re,n.InlineCluster=C,n.MasonryGrid=te,n.PadBox=oe,n.Reel=se,n.Split=ue,n.Stack=z,n.checkIsCSSLength=w,n.createContainerQuery=k,n.getSpacingValue=d,n.spacing=S,Object.defineProperties(n,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
318
+ `;n.Center=H,n.Column=xe,n.ColumnDrop=G,n.Columns=he,n.Cover=de,n.Frame=U,n.Grid=M,n.Inline=re,n.InlineCluster=C,n.MasonryGrid=te,n.PadBox=oe,n.Reel=se,n.Split=ue,n.Stack=z,n.checkIsCSSLength=w,n.createContainerQuery=k,n.getSpacingValue=d,n.spacing=S,Object.defineProperties(n,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bedrock-layout/solid",
3
- "version": "0.11.2",
3
+ "version": "0.11.5",
4
4
  "description": "solid.js port of bedrock-layout primitives",
5
5
  "sideEffects": false,
6
6
  "private": false,
@@ -62,5 +62,5 @@
62
62
  "bugs": {
63
63
  "url": "https://github.com/Bedrock-Layouts/Solid-Bedrock/issues"
64
64
  },
65
- "gitHead": "08838917ec582dd6347cb73327d66514da013ca9"
65
+ "gitHead": "1950423d7074884b63905120f8ddc251c6f7b194"
66
66
  }