@niche-works/css-layouts 0.1.0 → 0.2.0

package/stack/stack.cjs

@@ -5,7 +5,6 @@ const require__helpers_hasValue = require('../_helpers/hasValue.cjs');
 const require__helpers_unit = require('../_helpers/unit.cjs');
 const require__helpers_applySpacing = require('../_helpers/applySpacing.cjs');
 const require__helpers_mergeLayoutResults = require('../_helpers/mergeLayoutResults.cjs');
-require('./styles.cjs');
 let _niche_works_utils_object_maybeDefault = require("@niche-works/utils/object/maybeDefault");
 _niche_works_utils_object_maybeDefault = require_runtime.__toESM(_niche_works_utils_object_maybeDefault, 1);
 let clsx = require("clsx");

package/stack/stack.mjs

@@ -4,7 +4,6 @@ import hasValue from "../_helpers/hasValue.mjs";
 import unit from "../_helpers/unit.mjs";
 import applySpacing from "../_helpers/applySpacing.mjs";
 import mergeLayoutResults from "../_helpers/mergeLayoutResults.mjs";
-import "./styles.css";
 import maybeDefault from "@niche-works/utils/object/maybeDefault";
 import clsx from "clsx";
 

package/stack/stack.scss.cjs

@@ -0,0 +1 @@
+require('./stack.cjs');

package/stack/stack.scss.d.cts

@@ -0,0 +1 @@
+export { };

package/stack/stack.scss.d.mts

@@ -0,0 +1 @@
+export { };

package/stack/stack.scss.mjs

@@ -0,0 +1,3 @@
+/* empty css       */
+
+export {  };

package/styles.css

@@ -0,0 +1,653 @@
+.nws-layout-stack {
+  --nws-layout-spacingX: 0px;
+  --nws-layout-spacingY: 0px;
+  --nws-layout-childSizeX: auto;
+  --nws-layout-childSizeY: auto;
+  display: flex;
+}
+.nws-layout-stack.nws-layout-spacingX {
+  column-gap: var(--nws-layout-spacingX);
+}
+.nws-layout-stack.nws-layout-spacingY {
+  row-gap: var(--nws-layout-spacingY);
+}
+.nws-layout-stack.nws-layout-direction-x {
+  flex-direction: row;
+}
+.nws-layout-stack.nws-layout-direction-x.nws-layout-alignX-left {
+  justify-content: flex-start;
+}
+.nws-layout-stack.nws-layout-direction-x.nws-layout-alignX-center {
+  justify-content: center;
+}
+.nws-layout-stack.nws-layout-direction-x.nws-layout-alignX-right {
+  justify-content: flex-end;
+}
+.nws-layout-stack.nws-layout-direction-x.nws-layout-alignX-spaceBetween {
+  justify-content: space-between;
+}
+.nws-layout-stack.nws-layout-direction-x.nws-layout-alignX-spaceAround {
+  justify-content: space-around;
+}
+.nws-layout-stack.nws-layout-direction-x.nws-layout-alignX-spaceEvenly {
+  justify-content: space-evenly;
+}
+.nws-layout-stack.nws-layout-direction-x.nws-layout-alignY-top {
+  align-items: flex-start;
+}
+.nws-layout-stack.nws-layout-direction-x.nws-layout-alignY-middle {
+  align-items: center;
+}
+.nws-layout-stack.nws-layout-direction-x.nws-layout-alignY-bottom {
+  align-items: flex-end;
+}
+.nws-layout-stack.nws-layout-direction-x > * {
+  flex-grow: 0;
+  flex-shrink: 0;
+  min-width: 0;
+}
+.nws-layout-stack.nws-layout-direction-x.nws-layout-childSizeX > * {
+  flex-basis: var(--nws-layout-childSizeX);
+}
+.nws-layout-stack.nws-layout-direction-x.nws-layout-adjustX-fit {
+  justify-content: flex-start;
+}
+.nws-layout-stack.nws-layout-direction-x.nws-layout-adjustX-fit > * {
+  flex-grow: 1;
+  flex-shrink: 1;
+  flex-basis: auto;
+  min-width: 0;
+}
+.nws-layout-stack.nws-layout-direction-x.nws-layout-adjustX-fit.nws-layout-childSizeX > * {
+  flex-basis: var(--nws-layout-childSizeX);
+}
+.nws-layout-stack.nws-layout-direction-x.nws-layout-adjustX-grow > * {
+  flex-grow: 1;
+}
+.nws-layout-stack.nws-layout-direction-x.nws-layout-adjustX-shrink > * {
+  flex-shrink: 1;
+}
+.nws-layout-stack.nws-layout-direction-x > * {
+  min-height: 0;
+}
+.nws-layout-stack.nws-layout-direction-x.nws-layout-childSizeY > * {
+  height: var(--nws-layout-childSizeY);
+}
+.nws-layout-stack.nws-layout-direction-x.nws-layout-adjustY-fit {
+  align-items: stretch;
+}
+.nws-layout-stack.nws-layout-direction-x.nws-layout-adjustY-fit > * {
+  min-height: 100%;
+  max-height: 100%;
+}
+.nws-layout-stack.nws-layout-direction-x.nws-layout-adjustY-fit.nws-layout-childSizeY > * {
+  height: auto;
+}
+.nws-layout-stack.nws-layout-direction-x.nws-layout-adjustY-grow > * {
+  min-height: 100%;
+}
+.nws-layout-stack.nws-layout-direction-x.nws-layout-adjustY-shrink > * {
+  min-height: 0;
+  max-height: 100%;
+}
+.nws-layout-stack.nws-layout-direction-y {
+  flex-direction: column;
+}
+.nws-layout-stack.nws-layout-direction-y.nws-layout-alignX-left {
+  align-items: flex-start;
+}
+.nws-layout-stack.nws-layout-direction-y.nws-layout-alignX-center {
+  align-items: center;
+}
+.nws-layout-stack.nws-layout-direction-y.nws-layout-alignX-right {
+  align-items: flex-end;
+}
+.nws-layout-stack.nws-layout-direction-y.nws-layout-alignY-top {
+  justify-content: flex-start;
+}
+.nws-layout-stack.nws-layout-direction-y.nws-layout-alignY-middle {
+  justify-content: center;
+}
+.nws-layout-stack.nws-layout-direction-y.nws-layout-alignY-bottom {
+  justify-content: flex-end;
+}
+.nws-layout-stack.nws-layout-direction-y.nws-layout-alignY-spaceBetween {
+  justify-content: space-between;
+}
+.nws-layout-stack.nws-layout-direction-y.nws-layout-alignY-spaceAround {
+  justify-content: space-around;
+}
+.nws-layout-stack.nws-layout-direction-y.nws-layout-alignY-spaceEvenly {
+  justify-content: space-evenly;
+}
+.nws-layout-stack.nws-layout-direction-y > * {
+  min-width: 0;
+}
+.nws-layout-stack.nws-layout-direction-y.nws-layout-childSizeX > * {
+  width: var(--nws-layout-childSizeX);
+}
+.nws-layout-stack.nws-layout-direction-y.nws-layout-adjustX-fit {
+  align-items: stretch;
+}
+.nws-layout-stack.nws-layout-direction-y.nws-layout-adjustX-fit > * {
+  min-width: 100%;
+  max-width: 100%;
+}
+.nws-layout-stack.nws-layout-direction-y.nws-layout-adjustX-fit.nws-layout-childSizeX > * {
+  width: auto;
+}
+.nws-layout-stack.nws-layout-direction-y.nws-layout-adjustX-grow > * {
+  min-width: 100%;
+}
+.nws-layout-stack.nws-layout-direction-y.nws-layout-adjustX-shrink > * {
+  min-width: 0;
+  max-width: 100%;
+}
+.nws-layout-stack.nws-layout-direction-y > * {
+  flex-grow: 0;
+  flex-shrink: 0;
+  min-height: 0;
+}
+.nws-layout-stack.nws-layout-direction-y.nws-layout-childSizeY > * {
+  flex-basis: var(--nws-layout-childSizeY);
+}
+.nws-layout-stack.nws-layout-direction-y.nws-layout-adjustY-fit {
+  justify-content: flex-start;
+}
+.nws-layout-stack.nws-layout-direction-y.nws-layout-adjustY-fit > * {
+  flex-grow: 1;
+  flex-shrink: 1;
+  flex-basis: auto;
+  min-height: 0;
+}
+.nws-layout-stack.nws-layout-direction-y.nws-layout-adjustY-fit.nws-layout-childSizeY > * {
+  flex-basis: var(--nws-layout-childSizeY);
+}
+.nws-layout-stack.nws-layout-direction-y.nws-layout-adjustY-grow > * {
+  flex-grow: 1;
+}
+.nws-layout-stack.nws-layout-direction-y.nws-layout-adjustY-shrink > * {
+  flex-shrink: 1;
+}
+
+.nws-layout-flow {
+  --nws-layout-spacingX: 0px;
+  --nws-layout-spacingY: 0px;
+  --nws-layout-childSizeX: auto;
+  --nws-layout-childSizeY: auto;
+  display: flex;
+  flex-wrap: wrap;
+}
+.nws-layout-flow.nws-layout-spacingX {
+  column-gap: var(--nws-layout-spacingX);
+}
+.nws-layout-flow.nws-layout-spacingY {
+  row-gap: var(--nws-layout-spacingY);
+}
+.nws-layout-flow.nws-layout-direction-x {
+  flex-direction: row;
+}
+.nws-layout-flow.nws-layout-direction-x.nws-layout-alignX-left {
+  justify-content: flex-start;
+}
+.nws-layout-flow.nws-layout-direction-x.nws-layout-alignX-center {
+  justify-content: center;
+}
+.nws-layout-flow.nws-layout-direction-x.nws-layout-alignX-right {
+  justify-content: flex-end;
+}
+.nws-layout-flow.nws-layout-direction-x.nws-layout-alignX-spaceBetween {
+  justify-content: space-between;
+}
+.nws-layout-flow.nws-layout-direction-x.nws-layout-alignX-spaceAround {
+  justify-content: space-around;
+}
+.nws-layout-flow.nws-layout-direction-x.nws-layout-alignX-spaceEvenly {
+  justify-content: space-evenly;
+}
+.nws-layout-flow.nws-layout-direction-x.nws-layout-alignY-top {
+  align-items: flex-start;
+  align-content: flex-start;
+}
+.nws-layout-flow.nws-layout-direction-x.nws-layout-alignY-middle {
+  align-items: center;
+  align-content: center;
+}
+.nws-layout-flow.nws-layout-direction-x.nws-layout-alignY-bottom {
+  align-items: flex-end;
+  align-content: flex-end;
+}
+.nws-layout-flow.nws-layout-direction-x.nws-layout-alignY-spaceBetween {
+  align-content: space-between;
+}
+.nws-layout-flow.nws-layout-direction-x.nws-layout-alignY-spaceAround {
+  align-content: space-around;
+}
+.nws-layout-flow.nws-layout-direction-x.nws-layout-alignY-spaceEvenly {
+  align-content: space-evenly;
+}
+.nws-layout-flow.nws-layout-direction-x > * {
+  flex-grow: 0;
+  flex-shrink: 0;
+  min-width: 0;
+}
+.nws-layout-flow.nws-layout-direction-x.nws-layout-childSizeX > * {
+  flex-basis: var(--nws-layout-childSizeX);
+}
+.nws-layout-flow.nws-layout-direction-x.nws-layout-adjustX-fit {
+  justify-content: flex-start;
+}
+.nws-layout-flow.nws-layout-direction-x.nws-layout-adjustX-fit > * {
+  flex-grow: 1;
+  flex-shrink: 1;
+  flex-basis: auto;
+  min-width: 0;
+}
+.nws-layout-flow.nws-layout-direction-x.nws-layout-adjustX-fit.nws-layout-childSizeX > * {
+  flex-basis: var(--nws-layout-childSizeX);
+}
+.nws-layout-flow.nws-layout-direction-x.nws-layout-adjustX-grow > * {
+  flex-grow: 1;
+}
+.nws-layout-flow.nws-layout-direction-x.nws-layout-adjustX-shrink > * {
+  flex-shrink: 1;
+}
+.nws-layout-flow.nws-layout-direction-x > * {
+  min-height: 0;
+}
+.nws-layout-flow.nws-layout-direction-x.nws-layout-childSizeY > * {
+  height: var(--nws-layout-childSizeY);
+}
+.nws-layout-flow.nws-layout-direction-y {
+  flex-direction: column;
+}
+.nws-layout-flow.nws-layout-direction-y.nws-layout-alignX-left {
+  align-items: flex-start;
+  align-content: flex-start;
+}
+.nws-layout-flow.nws-layout-direction-y.nws-layout-alignX-center {
+  align-items: center;
+  align-content: center;
+}
+.nws-layout-flow.nws-layout-direction-y.nws-layout-alignX-right {
+  align-items: flex-end;
+  align-content: flex-end;
+}
+.nws-layout-flow.nws-layout-direction-y.nws-layout-alignX-spaceBetween {
+  align-content: space-between;
+}
+.nws-layout-flow.nws-layout-direction-y.nws-layout-alignX-spaceAround {
+  align-content: space-around;
+}
+.nws-layout-flow.nws-layout-direction-y.nws-layout-alignX-spaceEvenly {
+  align-content: space-evenly;
+}
+.nws-layout-flow.nws-layout-direction-y.nws-layout-alignY-top {
+  justify-content: flex-start;
+}
+.nws-layout-flow.nws-layout-direction-y.nws-layout-alignY-middle {
+  justify-content: center;
+}
+.nws-layout-flow.nws-layout-direction-y.nws-layout-alignY-bottom {
+  justify-content: flex-end;
+}
+.nws-layout-flow.nws-layout-direction-y.nws-layout-alignY-spaceBetween {
+  justify-content: space-between;
+}
+.nws-layout-flow.nws-layout-direction-y.nws-layout-alignY-spaceAround {
+  justify-content: space-around;
+}
+.nws-layout-flow.nws-layout-direction-y.nws-layout-alignY-spaceEvenly {
+  justify-content: space-evenly;
+}
+.nws-layout-flow.nws-layout-direction-y > * {
+  min-width: 0;
+}
+.nws-layout-flow.nws-layout-direction-y.nws-layout-childSizeX > * {
+  width: var(--nws-layout-childSizeX);
+}
+.nws-layout-flow.nws-layout-direction-y > * {
+  flex-grow: 0;
+  flex-shrink: 0;
+  min-height: 0;
+}
+.nws-layout-flow.nws-layout-direction-y.nws-layout-childSizeY > * {
+  flex-basis: var(--nws-layout-childSizeY);
+}
+.nws-layout-flow.nws-layout-direction-y.nws-layout-adjustY-fit {
+  justify-content: flex-start;
+}
+.nws-layout-flow.nws-layout-direction-y.nws-layout-adjustY-fit > * {
+  flex-grow: 1;
+  flex-shrink: 1;
+  flex-basis: auto;
+  min-height: 0;
+}
+.nws-layout-flow.nws-layout-direction-y.nws-layout-adjustY-fit.nws-layout-childSizeY > * {
+  flex-basis: var(--nws-layout-childSizeY);
+}
+.nws-layout-flow.nws-layout-direction-y.nws-layout-adjustY-grow > * {
+  flex-grow: 1;
+}
+.nws-layout-flow.nws-layout-direction-y.nws-layout-adjustY-shrink > * {
+  flex-shrink: 1;
+}
+
+.nws-layout-matrix {
+  --nws-layout-childX: none;
+  --nws-layout-childY: none;
+  --nws-layout-spacingX: 0px;
+  --nws-layout-spacingY: 0px;
+  display: grid;
+}
+.nws-layout-matrix.nws-layout-spacingX {
+  column-gap: var(--nws-layout-spacingX);
+}
+.nws-layout-matrix.nws-layout-spacingY {
+  row-gap: var(--nws-layout-spacingY);
+}
+.nws-layout-matrix.nws-layout-direction-x {
+  grid-auto-flow: row;
+  grid-template-columns: var(--nws-layout-childX);
+  grid-template-rows: var(--nws-layout-childY);
+}
+.nws-layout-matrix.nws-layout-direction-y {
+  grid-auto-flow: column;
+  grid-template-columns: var(--nws-layout-childX);
+  grid-template-rows: var(--nws-layout-childY);
+}
+.nws-layout-matrix.nws-layout-alignX-left {
+  justify-content: flex-start;
+}
+.nws-layout-matrix.nws-layout-alignX-center {
+  justify-content: center;
+}
+.nws-layout-matrix.nws-layout-alignX-right {
+  justify-content: flex-end;
+}
+.nws-layout-matrix.nws-layout-alignX-spaceBetween {
+  justify-content: space-between;
+}
+.nws-layout-matrix.nws-layout-alignX-spaceAround {
+  justify-content: space-around;
+}
+.nws-layout-matrix.nws-layout-alignX-spaceEvenly {
+  justify-content: space-evenly;
+}
+.nws-layout-matrix.nws-layout-alignY-top {
+  align-content: flex-start;
+}
+.nws-layout-matrix.nws-layout-alignY-middle {
+  align-content: center;
+}
+.nws-layout-matrix.nws-layout-alignY-bottom {
+  align-content: flex-end;
+}
+.nws-layout-matrix.nws-layout-alignY-spaceBetween {
+  align-content: space-between;
+}
+.nws-layout-matrix.nws-layout-alignY-spaceAround {
+  align-content: space-around;
+}
+.nws-layout-matrix.nws-layout-alignY-spaceEvenly {
+  align-content: space-evenly;
+}
+
+.nws-layout-tile {
+  --nws-layout-childX: none;
+  --nws-layout-childY: none;
+  --nws-layout-autoTracX: auto;
+  --nws-layout-autoTracY: auto;
+  --nws-layout-spacingX: 0px;
+  --nws-layout-spacingY: 0px;
+  --nws-layout-childSizeX: auto;
+  --nws-layout-childSizeY: auto;
+  display: grid;
+}
+.nws-layout-tile.nws-layout-spacingX {
+  column-gap: var(--nws-layout-spacingX);
+}
+.nws-layout-tile.nws-layout-spacingY {
+  row-gap: var(--nws-layout-spacingY);
+}
+.nws-layout-tile.nws-layout-direction-x {
+  grid-auto-flow: row;
+  grid-template-columns: var(--nws-layout-childX);
+  grid-auto-rows: var(--nws-layout-autoTracY);
+}
+.nws-layout-tile.nws-layout-direction-y {
+  grid-auto-flow: column;
+  grid-auto-columns: var(--nws-layout-autoTracX);
+  grid-template-rows: var(--nws-layout-childY);
+}
+.nws-layout-tile.nws-layout-alignX-left {
+  justify-content: flex-start;
+}
+.nws-layout-tile.nws-layout-alignX-center {
+  justify-content: center;
+}
+.nws-layout-tile.nws-layout-alignX-right {
+  justify-content: flex-end;
+}
+.nws-layout-tile.nws-layout-alignX-spaceBetween {
+  justify-content: space-between;
+}
+.nws-layout-tile.nws-layout-alignX-spaceAround {
+  justify-content: space-around;
+}
+.nws-layout-tile.nws-layout-alignX-spaceEvenly {
+  justify-content: space-evenly;
+}
+.nws-layout-tile.nws-layout-alignY-top {
+  align-content: flex-start;
+}
+.nws-layout-tile.nws-layout-alignY-middle {
+  align-content: center;
+}
+.nws-layout-tile.nws-layout-alignY-bottom {
+  align-content: flex-end;
+}
+.nws-layout-tile.nws-layout-alignY-spaceBetween {
+  align-content: space-between;
+}
+.nws-layout-tile.nws-layout-alignY-spaceAround {
+  align-content: space-around;
+}
+.nws-layout-tile.nws-layout-alignY-spaceEvenly {
+  align-content: space-evenly;
+}
+.nws-layout-tile > * {
+  min-width: 0;
+}
+.nws-layout-tile.nws-layout-childSizeX > * {
+  width: var(--nws-layout-childSizeX);
+}
+.nws-layout-tile.nws-layout-adjustX-fit > * {
+  width: auto;
+}
+.nws-layout-tile.nws-layout-adjustX-grow > * {
+  width: auto;
+}
+.nws-layout-tile.nws-layout-adjustX-shrink > * {
+  width: auto;
+}
+.nws-layout-tile > * {
+  min-height: 0;
+}
+.nws-layout-tile.nws-layout-childSizeY > * {
+  height: var(--nws-layout-childSizeY);
+}
+.nws-layout-tile.nws-layout-adjustY-fit {
+  align-content: stretch;
+}
+.nws-layout-tile.nws-layout-adjustY-fit > * {
+  height: auto;
+}
+.nws-layout-tile.nws-layout-adjustY-grow > * {
+  max-height: 100%;
+  height: 100%;
+}
+.nws-layout-tile.nws-layout-adjustY-grow.nws-layout-childSizeY > * {
+  min-height: var(--nws-layout-childSizeY);
+}
+.nws-layout-tile.nws-layout-adjustY-shrink > * {
+  min-height: 100%;
+  height: 100%;
+}
+.nws-layout-tile.nws-layout-adjustY-shrink.nws-layout-childSizeY > * {
+  max-height: var(--nws-layout-childSizeY);
+}
+
+.nws-layout-balance {
+  --nws-layout-spacingX: 0px;
+  --nws-layout-spacingY: 0px;
+  --nws-layout-childSizeX: auto;
+  --nws-layout-childSizeY: auto;
+  display: grid;
+}
+.nws-layout-balance.nws-layout-spacingX {
+  column-gap: var(--nws-layout-spacingX);
+}
+.nws-layout-balance.nws-layout-spacingY {
+  row-gap: var(--nws-layout-spacingY);
+}
+.nws-layout-balance.nws-layout-direction-x {
+  grid-auto-flow: column;
+}
+.nws-layout-balance.nws-layout-direction-y {
+  grid-auto-flow: row;
+}
+.nws-layout-balance.nws-layout-alignX-left {
+  justify-items: flex-start;
+}
+.nws-layout-balance.nws-layout-alignX-center {
+  justify-items: center;
+}
+.nws-layout-balance.nws-layout-alignX-right {
+  justify-items: flex-end;
+}
+.nws-layout-balance.nws-layout-alignX-spaceBetween {
+  justify-items: space-between;
+}
+.nws-layout-balance.nws-layout-alignX-spaceAround {
+  justify-items: space-around;
+}
+.nws-layout-balance.nws-layout-alignX-spaceEvenly {
+  justify-items: space-evenly;
+}
+.nws-layout-balance.nws-layout-alignY-top {
+  align-items: flex-start;
+}
+.nws-layout-balance.nws-layout-alignY-middle {
+  align-items: center;
+}
+.nws-layout-balance.nws-layout-alignY-bottom {
+  align-items: flex-end;
+}
+.nws-layout-balance.nws-layout-alignY-spaceBetween {
+  align-items: space-between;
+}
+.nws-layout-balance.nws-layout-alignY-spaceAround {
+  align-items: space-around;
+}
+.nws-layout-balance.nws-layout-alignY-spaceEvenly {
+  align-items: space-evenly;
+}
+.nws-layout-balance > * {
+  min-width: 0;
+}
+.nws-layout-balance.nws-layout-childSizeX > * {
+  width: var(--nws-layout-childSizeX);
+}
+.nws-layout-balance.nws-layout-adjustX-fit {
+  justify-items: stretch;
+}
+.nws-layout-balance.nws-layout-adjustX-fit > * {
+  width: auto;
+}
+.nws-layout-balance.nws-layout-adjustX-fit.nws-layout-childSizeX > * {
+  width: auto;
+}
+.nws-layout-balance.nws-layout-adjustX-grow > * {
+  width: 100%;
+}
+.nws-layout-balance.nws-layout-adjustX-grow.nws-layout-childSizeX > * {
+  min-width: var(--nws-layout-childSizeX);
+}
+.nws-layout-balance.nws-layout-adjustX-shrink > * {
+  width: 100%;
+}
+.nws-layout-balance.nws-layout-adjustX-shrink.nws-layout-childSizeX > * {
+  max-width: var(--nws-layout-childSizeX);
+}
+.nws-layout-balance > * {
+  min-height: 0;
+}
+.nws-layout-balance.nws-layout-childSizeY > * {
+  height: var(--nws-layout-childSizeY);
+}
+.nws-layout-balance.nws-layout-adjustY-fit {
+  align-items: stretch;
+}
+.nws-layout-balance.nws-layout-adjustY-fit > * {
+  height: auto;
+}
+.nws-layout-balance.nws-layout-adjustY-fit.nws-layout-childSizeY > * {
+  height: auto;
+}
+.nws-layout-balance.nws-layout-adjustY-grow > * {
+  height: 100%;
+}
+.nws-layout-balance.nws-layout-adjustY-grow.nws-layout-childSizeY > * {
+  min-height: var(--nws-layout-childSizeY);
+}
+.nws-layout-balance.nws-layout-adjustY-shrink > * {
+  height: 100%;
+}
+.nws-layout-balance.nws-layout-adjustY-shrink.nws-layout-childSizeY > * {
+  max-height: var(--nws-layout-childSizeY);
+}
+
+.nws-layout-pack {
+  --nws-layout-spacingX: 0px;
+  --nws-layout-spacingY: 0px;
+  display: grid;
+}
+.nws-layout-pack.nws-layout-spacingX {
+  column-gap: var(--nws-layout-spacingX);
+}
+.nws-layout-pack.nws-layout-spacingY {
+  row-gap: var(--nws-layout-spacingY);
+}
+.nws-layout-pack.nws-layout-direction-x {
+  grid-auto-flow: column;
+  grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
+  grid-template-rows: auto;
+}
+.nws-layout-pack.nws-layout-direction-y {
+  grid-auto-flow: row;
+  grid-template-columns: auto;
+  grid-template-rows: repeat(auto-fit, minmax(0, 1fr));
+}
+.nws-layout-pack > * {
+  height: auto;
+  width: auto;
+  min-height: 0;
+  min-width: 0;
+}
+
+.nws-layout-pin {
+  --nws-layout-childSizeX: auto;
+  --nws-layout-childSizeY: auto;
+  display: block;
+  position: relative;
+}
+.nws-layout-pin > * {
+  position: absolute;
+}
+.nws-layout-pin.nws-layout-childSizeX > * {
+  width: var(--nws-layout-childSizeX);
+}
+.nws-layout-pin.nws-layout-childSizeY > * {
+  height: var(--nws-layout-childSizeY);
+}

package/styles.scss.cjs

@@ -0,0 +1 @@
+require('./styles.cjs');

package/styles.scss.d.cts

@@ -0,0 +1 @@
+export { };

package/styles.scss.d.mts

@@ -0,0 +1 @@
+export { };

package/styles.scss.mjs

@@ -0,0 +1,3 @@
+/* empty css        */
+
+export {  };

package/tile/tile.cjs

@@ -6,7 +6,6 @@ const require__helpers_unit = require('../_helpers/unit.cjs');
 const require__helpers_applyChildSize = require('../_helpers/applyChildSize.cjs');
 const require__helpers_applySpacing = require('../_helpers/applySpacing.cjs');
 const require__helpers_mergeLayoutResults = require('../_helpers/mergeLayoutResults.cjs');
-require('./styles.cjs');
 let _niche_works_utils_object_maybeDefault = require("@niche-works/utils/object/maybeDefault");
 _niche_works_utils_object_maybeDefault = require_runtime.__toESM(_niche_works_utils_object_maybeDefault, 1);
 let clsx = require("clsx");