lism-css 0.13.1 → 0.15.0

package/dist/config/defaults/props.d.ts

@@ -2,7 +2,7 @@
  * isVar: 1 → クラス出力はせずstyle属性での変数出力のみ (--bdw, --keycolor など)
  * bp: 0 → Prop-valユーティリティクラス化されなければ、style属性で出力するだけ。
  * bp: 1 → .-prop と --prop の セットがベースにあり、.-prop_bp と .--prop_bp で ブレイクポイント指定できる。
- *       .-prop{propaty:var(--prop)} が基本で、ユーティリティクラスは .-prop:val{propaty:value} となる。
+ *       .-prop{property:var(--prop)} が基本で、ユーティリティクラスは .-prop:val{property:value} となる。
  *
  * ↓コンポーネント処理で使用される
  * tokenClass: 1 → 対応するトークン値がそのまま全てユーティリティクラス化されるもの。
@@ -10,8 +10,10 @@
  * shorthands: → コンポーネント側で短く書くための設定
  *
  * ↓SCSS出力で使用される
- * alwaysVar: 1 → .-prop,[class*=-prop:] {propaty:var(--prop)} で、ユーティリティクラス時も常に変数管理となる。
- * overwriteBaseVar: 1 → ブレイクポイントクラスで --prop: var(--prop_$bp) がセットされ、常にベース変数の --prop で値が取得できるようになる。
+ * alwaysVar: 1 → state変数扱い。 .-prop,[class*=-prop:] {property:var(--prop)} の base 出力となり、
+ *   ユーティリティクラスは --prop をセットする形になる。
+ *   加えて BPクラスも .-prop_$bp { property: var(--prop); --prop: var(--prop_$bp) !important; } を出力し、
+ *   常に --prop が当該要素の現在値になるよう上書きされる（consumer が --prop を参照できる）。
  * important: 1 → !important を付けて最終的に出力する
  */
 declare const _default: {
@@ -24,7 +26,6 @@ declare const _default: {
         readonly token: "fz";
         readonly tokenClass: 1;
         readonly bp: 1;
-        readonly alwaysVar: 1;
     };
     readonly fw: {
         readonly prop: "fontWeight";
@@ -169,21 +170,21 @@ declare const _default: {
         readonly prop: "maxInlineSize";
         readonly token: "sz";
         readonly tokenClass: 1;
+        readonly presets: readonly ["full"];
         readonly exUtility: {
-            readonly min: "";
             readonly full: "";
             readonly container: "";
         };
     };
-    readonly ysz: {
+    readonly bsz: {
         readonly prop: "blockSize";
         readonly token: "sz";
     };
-    readonly 'min-ysz': {
+    readonly 'min-bsz': {
         readonly prop: "minBlockSize";
         readonly token: "sz";
     };
-    readonly 'max-ysz': {
+    readonly 'max-bsz': {
         readonly prop: "maxBlockSize";
         readonly token: "sz";
     };
@@ -289,7 +290,6 @@ declare const _default: {
         readonly tokenClass: 1;
         readonly bp: 1;
         readonly alwaysVar: 1;
-        readonly overwriteBaseVar: 1;
     };
     readonly 'bdrs-tl': {
         readonly prop: "borderTopLeftRadius";
@@ -331,7 +331,6 @@ declare const _default: {
         readonly token: "bxsh";
         readonly tokenClass: 1;
         readonly bp: 1;
-        readonly alwaysVar: 1;
     };
     readonly pos: {
         readonly prop: "position";
@@ -410,7 +409,6 @@ declare const _default: {
         readonly token: "space";
         readonly tokenClass: 1;
         readonly alwaysVar: 1;
-        readonly overwriteBaseVar: 1;
         readonly bp: 1;
     };
     readonly px: {
@@ -418,7 +416,6 @@ declare const _default: {
         readonly presets: readonly ["0"];
         readonly token: "space";
         readonly tokenClass: 1;
-        readonly alwaysVar: 1;
         readonly bp: 1;
     };
     readonly py: {
@@ -426,7 +423,6 @@ declare const _default: {
         readonly presets: readonly ["0"];
         readonly token: "space";
         readonly tokenClass: 1;
-        readonly alwaysVar: 1;
         readonly bp: 1;
     };
     readonly 'px-s': {
@@ -475,7 +471,6 @@ declare const _default: {
         readonly token: "space";
         readonly tokenClass: 1;
         readonly alwaysVar: 1;
-        readonly overwriteBaseVar: 1;
         readonly bp: 1;
     };
     readonly mx: {
@@ -483,7 +478,6 @@ declare const _default: {
         readonly presets: readonly ["auto", "0"];
         readonly token: "space";
         readonly tokenClass: 1;
-        readonly alwaysVar: 1;
         readonly bp: 1;
     };
     readonly my: {
@@ -491,7 +485,6 @@ declare const _default: {
         readonly presets: readonly ["auto", "0"];
         readonly token: "space";
         readonly tokenClass: 1;
-        readonly alwaysVar: 1;
         readonly bp: 1;
     };
     readonly 'mx-s': {
@@ -549,8 +542,6 @@ declare const _default: {
         };
         readonly token: "space";
         readonly tokenClass: 1;
-        readonly alwaysVar: 1;
-        readonly overwriteBaseVar: 1;
         readonly bp: 1;
     };
     readonly cg: {
@@ -755,11 +746,11 @@ declare const _default: {
         readonly prop: "order";
         readonly presets: readonly ["0", "-1", "1"];
     };
-    readonly ovwrap: {
+    readonly ovw: {
         readonly prop: "overflowWrap";
         readonly presets: readonly ["anywhere"];
     };
-    readonly whspace: {
+    readonly whs: {
         readonly prop: "whiteSpace";
         readonly presets: readonly ["nowrap"];
     };
@@ -771,9 +762,14 @@ declare const _default: {
         readonly prop: "clear";
         readonly presets: readonly ["both"];
     };
-    readonly isolation: {
+    readonly iso: {
         readonly prop: "isolation";
         readonly presets: readonly ["isolate"];
     };
+    readonly wm: {
+        readonly prop: "writingMode";
+        readonly presets: readonly ["vertical-rl"];
+        readonly bp: 1;
+    };
 };
 export default _default;

package/dist/config/defaults/props.js

@@ -1,6 +1,6 @@
-const e = ["start", "center", "end"], r = ["flex-start", "flex-end"], p = { s: "start", e: "end", c: "center", fs: "flex-start", fe: "flex-end" }, o = {
+const e = ["start", "center", "end"], r = ["flex-start", "flex-end"], p = { s: "start", e: "end", c: "center", fs: "flex-start", fe: "flex-end" }, t = {
   f: { prop: "font", presets: ["inherit"] },
-  fz: { prop: "fontSize", token: "fz", tokenClass: 1, bp: 1, alwaysVar: 1 },
+  fz: { prop: "fontSize", token: "fz", tokenClass: 1, bp: 1 },
   fw: {
     prop: "fontWeight",
     token: "fw",
@@ -60,15 +60,15 @@ const e = ["start", "center", "end"], r = ["flex-start", "flex-end"], p = { s: "
     prop: "maxInlineSize",
     token: "sz",
     tokenClass: 1,
+    presets: ["full"],
     exUtility: {
-      min: "",
       full: "",
       container: ""
     }
   },
-  ysz: { prop: "blockSize", token: "sz" },
-  "min-ysz": { prop: "minBlockSize", token: "sz" },
-  "max-ysz": { prop: "maxBlockSize", token: "sz" },
+  bsz: { prop: "blockSize", token: "sz" },
+  "min-bsz": { prop: "minBlockSize", token: "sz" },
+  "max-bsz": { prop: "maxBlockSize", token: "sz" },
   // bg
   bg: { prop: "background", bp: 1 },
   bgi: { prop: "backgroundImage" },
@@ -128,8 +128,7 @@ const e = ["start", "center", "end"], r = ["flex-start", "flex-end"], p = { s: "
     token: "bdrs",
     tokenClass: 1,
     bp: 1,
-    alwaysVar: 1,
-    overwriteBaseVar: 1
+    alwaysVar: 1
   },
   "bdrs-tl": { prop: "borderTopLeftRadius", token: "bdrs" },
   "bdrs-tr": { prop: "borderTopRightRadius", token: "bdrs" },
@@ -139,7 +138,7 @@ const e = ["start", "center", "end"], r = ["flex-start", "flex-end"], p = { s: "
   "bdrs-se": { prop: "borderStartEndRadius", token: "bdrs" },
   "bdrs-es": { prop: "borderEndStartRadius", token: "bdrs" },
   "bdrs-ee": { prop: "borderEndEndRadius", token: "bdrs" },
-  bxsh: { prop: "boxShadow", utils: { 0: "none" }, token: "bxsh", tokenClass: 1, bp: 1, alwaysVar: 1 },
+  bxsh: { prop: "boxShadow", utils: { 0: "none" }, token: "bxsh", tokenClass: 1, bp: 1 },
   // position
   pos: {
     prop: "position",
@@ -164,11 +163,10 @@ const e = ["start", "center", "end"], r = ["flex-start", "flex-end"], p = { s: "
     token: "space",
     tokenClass: 1,
     alwaysVar: 1,
-    overwriteBaseVar: 1,
     bp: 1
   },
-  px: { prop: "paddingInline", presets: ["0"], token: "space", tokenClass: 1, alwaysVar: 1, bp: 1 },
-  py: { prop: "paddingBlock", presets: ["0"], token: "space", tokenClass: 1, alwaysVar: 1, bp: 1 },
+  px: { prop: "paddingInline", presets: ["0"], token: "space", tokenClass: 1, bp: 1 },
+  py: { prop: "paddingBlock", presets: ["0"], token: "space", tokenClass: 1, bp: 1 },
   "px-s": { prop: "paddingInlineStart", token: "space", bp: 1 },
   "px-e": { prop: "paddingInlineEnd", token: "space", bp: 1 },
   "py-s": { prop: "paddingBlockStart", token: "space", bp: 1 },
@@ -183,11 +181,10 @@ const e = ["start", "center", "end"], r = ["flex-start", "flex-end"], p = { s: "
     token: "space",
     tokenClass: 1,
     alwaysVar: 1,
-    overwriteBaseVar: 1,
     bp: 1
   },
-  mx: { prop: "marginInline", presets: ["auto", "0"], token: "space", tokenClass: 1, alwaysVar: 1, bp: 1 },
-  my: { prop: "marginBlock", presets: ["auto", "0"], token: "space", tokenClass: 1, alwaysVar: 1, bp: 1 },
+  mx: { prop: "marginInline", presets: ["auto", "0"], token: "space", tokenClass: 1, bp: 1 },
+  my: { prop: "marginBlock", presets: ["auto", "0"], token: "space", tokenClass: 1, bp: 1 },
   "mx-s": { prop: "marginInlineStart", presets: ["auto"], token: "space", bp: 1 },
   "mx-e": { prop: "marginInlineEnd", presets: ["auto"], token: "space", bp: 1 },
   "my-s": { prop: "marginBlockStart", token: "space", bp: 1, presets: ["auto", "0"], tokenClass: 1 },
@@ -202,8 +199,6 @@ const e = ["start", "center", "end"], r = ["flex-start", "flex-end"], p = { s: "
     exUtility: { inherit: { gap: "inherit" } },
     token: "space",
     tokenClass: 1,
-    alwaysVar: 1,
-    overwriteBaseVar: 1,
     bp: 1
   },
   cg: { prop: "columnGap", token: "space", bp: 1 },
@@ -318,13 +313,14 @@ const e = ["start", "center", "end"], r = ["flex-start", "flex-end"], p = { s: "
   // 	},
   // },
   // others
-  ovwrap: { prop: "overflowWrap", presets: ["anywhere"] },
-  whspace: { prop: "whiteSpace", presets: ["nowrap"] },
+  ovw: { prop: "overflowWrap", presets: ["anywhere"] },
+  whs: { prop: "whiteSpace", presets: ["nowrap"] },
   // wordbreak: { prop: 'wordBreak', utils: { keep: 'keep-all', all: 'break-all' } },
   float: { prop: "float", presets: ["left", "right"] },
   clear: { prop: "clear", presets: ["both"] },
-  isolation: { prop: "isolation", presets: ["isolate"] }
+  iso: { prop: "isolation", presets: ["isolate"] },
+  wm: { prop: "writingMode", presets: ["vertical-rl"], bp: 1 }
 };
 export {
-  o as default
+  t as default
 };

package/dist/config/defaults/tokens.d.ts

@@ -7,8 +7,8 @@ declare const _default: {
     readonly fw: readonly ["light", "normal", "bold"];
     readonly o: readonly ["-10", "-20", "-30"];
     readonly bdrs: readonly ["10", "20", "30", "40", "99", "inner"];
-    readonly bxsh: readonly ["10", "20", "30", "40"];
-    readonly sz: readonly ["xs", "s", "m", "l", "xl", "min", "full", "container"];
+    readonly bxsh: readonly ["10", "20", "30", "40", "50"];
+    readonly sz: readonly ["xs", "s", "m", "l", "xl", "container"];
     readonly ar: readonly ["og"];
     readonly space: {
         readonly pre: "--s";

package/dist/config/defaults/tokens.js

@@ -7,8 +7,8 @@ const e = {
   fw: ["light", "normal", "bold"],
   o: ["-10", "-20", "-30"],
   bdrs: ["10", "20", "30", "40", "99", "inner"],
-  bxsh: ["10", "20", "30", "40"],
-  sz: ["xs", "s", "m", "l", "xl", "min", "full", "container"],
+  bxsh: ["10", "20", "30", "40", "50"],
+  sz: ["xs", "s", "m", "l", "xl", "container"],
   ar: ["og"],
   space: {
     pre: "--s",

package/dist/config/defaults/traits.d.ts

@@ -12,6 +12,9 @@ declare const _default: {
     readonly isCoverLink: "is--coverLink";
     readonly isSide: "is--side";
     readonly isSkipFlow: "is--skipFlow";
-    readonly isVertical: "is--vertical";
+    readonly hasTransition: "has--transition";
+    readonly hasGutter: "has--gutter";
+    readonly hasSnap: "has--snap";
+    readonly hasMask: "has--mask";
 };
 export default _default;

package/dist/config/defaults/traits.js

@@ -1,4 +1,4 @@
-const i = {
+const s = {
   isContainer: "is--container",
   isWrapper: {
     className: "is--wrapper",
@@ -12,8 +12,11 @@ const i = {
   isCoverLink: "is--coverLink",
   isSide: "is--side",
   isSkipFlow: "is--skipFlow",
-  isVertical: "is--vertical"
+  hasTransition: "has--transition",
+  hasGutter: "has--gutter",
+  hasSnap: "has--snap",
+  hasMask: "has--mask"
 };
 export {
-  i as default
+  s as default
 };

package/dist/config/index.d.ts

@@ -8,8 +8,8 @@ export declare const CONFIG: {
         readonly fw: readonly ["light", "normal", "bold"];
         readonly o: readonly ["-10", "-20", "-30"];
         readonly bdrs: readonly ["10", "20", "30", "40", "99", "inner"];
-        readonly bxsh: readonly ["10", "20", "30", "40"];
-        readonly sz: readonly ["xs", "s", "m", "l", "xl", "min", "full", "container"];
+        readonly bxsh: readonly ["10", "20", "30", "40", "50"];
+        readonly sz: readonly ["xs", "s", "m", "l", "xl", "container"];
         readonly ar: readonly ["og"];
         readonly space: {
             readonly pre: "--s";
@@ -36,7 +36,6 @@ export declare const CONFIG: {
             readonly token: "fz";
             readonly tokenClass: 1;
             readonly bp: 1;
-            readonly alwaysVar: 1;
         };
         readonly fw: {
             readonly prop: "fontWeight";
@@ -181,21 +180,21 @@ export declare const CONFIG: {
             readonly prop: "maxInlineSize";
             readonly token: "sz";
             readonly tokenClass: 1;
+            readonly presets: readonly ["full"];
             readonly exUtility: {
-                readonly min: "";
                 readonly full: "";
                 readonly container: "";
             };
         };
-        readonly ysz: {
+        readonly bsz: {
             readonly prop: "blockSize";
             readonly token: "sz";
         };
-        readonly 'min-ysz': {
+        readonly 'min-bsz': {
             readonly prop: "minBlockSize";
             readonly token: "sz";
         };
-        readonly 'max-ysz': {
+        readonly 'max-bsz': {
             readonly prop: "maxBlockSize";
             readonly token: "sz";
         };
@@ -301,7 +300,6 @@ export declare const CONFIG: {
             readonly tokenClass: 1;
             readonly bp: 1;
             readonly alwaysVar: 1;
-            readonly overwriteBaseVar: 1;
         };
         readonly 'bdrs-tl': {
             readonly prop: "borderTopLeftRadius";
@@ -343,7 +341,6 @@ export declare const CONFIG: {
             readonly token: "bxsh";
             readonly tokenClass: 1;
             readonly bp: 1;
-            readonly alwaysVar: 1;
         };
         readonly pos: {
             readonly prop: "position";
@@ -422,7 +419,6 @@ export declare const CONFIG: {
             readonly token: "space";
             readonly tokenClass: 1;
             readonly alwaysVar: 1;
-            readonly overwriteBaseVar: 1;
             readonly bp: 1;
         };
         readonly px: {
@@ -430,7 +426,6 @@ export declare const CONFIG: {
             readonly presets: readonly ["0"];
             readonly token: "space";
             readonly tokenClass: 1;
-            readonly alwaysVar: 1;
             readonly bp: 1;
         };
         readonly py: {
@@ -438,7 +433,6 @@ export declare const CONFIG: {
             readonly presets: readonly ["0"];
             readonly token: "space";
             readonly tokenClass: 1;
-            readonly alwaysVar: 1;
             readonly bp: 1;
         };
         readonly 'px-s': {
@@ -487,7 +481,6 @@ export declare const CONFIG: {
             readonly token: "space";
             readonly tokenClass: 1;
             readonly alwaysVar: 1;
-            readonly overwriteBaseVar: 1;
             readonly bp: 1;
         };
         readonly mx: {
@@ -495,7 +488,6 @@ export declare const CONFIG: {
             readonly presets: readonly ["auto", "0"];
             readonly token: "space";
             readonly tokenClass: 1;
-            readonly alwaysVar: 1;
             readonly bp: 1;
         };
         readonly my: {
@@ -503,7 +495,6 @@ export declare const CONFIG: {
             readonly presets: readonly ["auto", "0"];
             readonly token: "space";
             readonly tokenClass: 1;
-            readonly alwaysVar: 1;
             readonly bp: 1;
         };
         readonly 'mx-s': {
@@ -561,8 +552,6 @@ export declare const CONFIG: {
             };
             readonly token: "space";
             readonly tokenClass: 1;
-            readonly alwaysVar: 1;
-            readonly overwriteBaseVar: 1;
             readonly bp: 1;
         };
         readonly cg: {
@@ -767,11 +756,11 @@ export declare const CONFIG: {
             readonly prop: "order";
             readonly presets: readonly ["0", "-1", "1"];
         };
-        readonly ovwrap: {
+        readonly ovw: {
             readonly prop: "overflowWrap";
             readonly presets: readonly ["anywhere"];
         };
-        readonly whspace: {
+        readonly whs: {
             readonly prop: "whiteSpace";
             readonly presets: readonly ["nowrap"];
         };
@@ -783,10 +772,15 @@ export declare const CONFIG: {
             readonly prop: "clear";
             readonly presets: readonly ["both"];
         };
-        readonly isolation: {
+        readonly iso: {
             readonly prop: "isolation";
             readonly presets: readonly ["isolate"];
         };
+        readonly wm: {
+            readonly prop: "writingMode";
+            readonly presets: readonly ["vertical-rl"];
+            readonly bp: 1;
+        };
     };
     traits: {
         readonly isContainer: "is--container";
@@ -802,7 +796,10 @@ export declare const CONFIG: {
         readonly isCoverLink: "is--coverLink";
         readonly isSide: "is--side";
         readonly isSkipFlow: "is--skipFlow";
-        readonly isVertical: "is--vertical";
+        readonly hasTransition: "has--transition";
+        readonly hasGutter: "has--gutter";
+        readonly hasSnap: "has--snap";
+        readonly hasMask: "has--mask";
     };
 };
 export declare const TOKENS: {
@@ -814,8 +811,8 @@ export declare const TOKENS: {
     readonly fw: readonly ["light", "normal", "bold"];
     readonly o: readonly ["-10", "-20", "-30"];
     readonly bdrs: readonly ["10", "20", "30", "40", "99", "inner"];
-    readonly bxsh: readonly ["10", "20", "30", "40"];
-    readonly sz: readonly ["xs", "s", "m", "l", "xl", "min", "full", "container"];
+    readonly bxsh: readonly ["10", "20", "30", "40", "50"];
+    readonly sz: readonly ["xs", "s", "m", "l", "xl", "container"];
     readonly ar: readonly ["og"];
     readonly space: {
         readonly pre: "--s";
@@ -843,7 +840,6 @@ export declare const PROPS: {
         readonly token: "fz";
         readonly tokenClass: 1;
         readonly bp: 1;
-        readonly alwaysVar: 1;
     };
     readonly fw: {
         readonly prop: "fontWeight";
@@ -988,21 +984,21 @@ export declare const PROPS: {
         readonly prop: "maxInlineSize";
         readonly token: "sz";
         readonly tokenClass: 1;
+        readonly presets: readonly ["full"];
         readonly exUtility: {
-            readonly min: "";
             readonly full: "";
             readonly container: "";
         };
     };
-    readonly ysz: {
+    readonly bsz: {
         readonly prop: "blockSize";
         readonly token: "sz";
     };
-    readonly 'min-ysz': {
+    readonly 'min-bsz': {
         readonly prop: "minBlockSize";
         readonly token: "sz";
     };
-    readonly 'max-ysz': {
+    readonly 'max-bsz': {
         readonly prop: "maxBlockSize";
         readonly token: "sz";
     };
@@ -1108,7 +1104,6 @@ export declare const PROPS: {
         readonly tokenClass: 1;
         readonly bp: 1;
         readonly alwaysVar: 1;
-        readonly overwriteBaseVar: 1;
     };
     readonly 'bdrs-tl': {
         readonly prop: "borderTopLeftRadius";
@@ -1150,7 +1145,6 @@ export declare const PROPS: {
         readonly token: "bxsh";
         readonly tokenClass: 1;
         readonly bp: 1;
-        readonly alwaysVar: 1;
     };
     readonly pos: {
         readonly prop: "position";
@@ -1229,7 +1223,6 @@ export declare const PROPS: {
         readonly token: "space";
         readonly tokenClass: 1;
         readonly alwaysVar: 1;
-        readonly overwriteBaseVar: 1;
         readonly bp: 1;
     };
     readonly px: {
@@ -1237,7 +1230,6 @@ export declare const PROPS: {
         readonly presets: readonly ["0"];
         readonly token: "space";
         readonly tokenClass: 1;
-        readonly alwaysVar: 1;
         readonly bp: 1;
     };
     readonly py: {
@@ -1245,7 +1237,6 @@ export declare const PROPS: {
         readonly presets: readonly ["0"];
         readonly token: "space";
         readonly tokenClass: 1;
-        readonly alwaysVar: 1;
         readonly bp: 1;
     };
     readonly 'px-s': {
@@ -1294,7 +1285,6 @@ export declare const PROPS: {
         readonly token: "space";
         readonly tokenClass: 1;
         readonly alwaysVar: 1;
-        readonly overwriteBaseVar: 1;
         readonly bp: 1;
     };
     readonly mx: {
@@ -1302,7 +1292,6 @@ export declare const PROPS: {
         readonly presets: readonly ["auto", "0"];
         readonly token: "space";
         readonly tokenClass: 1;
-        readonly alwaysVar: 1;
         readonly bp: 1;
     };
     readonly my: {
@@ -1310,7 +1299,6 @@ export declare const PROPS: {
         readonly presets: readonly ["auto", "0"];
         readonly token: "space";
         readonly tokenClass: 1;
-        readonly alwaysVar: 1;
         readonly bp: 1;
     };
     readonly 'mx-s': {
@@ -1368,8 +1356,6 @@ export declare const PROPS: {
         };
         readonly token: "space";
         readonly tokenClass: 1;
-        readonly alwaysVar: 1;
-        readonly overwriteBaseVar: 1;
         readonly bp: 1;
     };
     readonly cg: {
@@ -1574,11 +1560,11 @@ export declare const PROPS: {
         readonly prop: "order";
         readonly presets: readonly ["0", "-1", "1"];
     };
-    readonly ovwrap: {
+    readonly ovw: {
         readonly prop: "overflowWrap";
         readonly presets: readonly ["anywhere"];
     };
-    readonly whspace: {
+    readonly whs: {
         readonly prop: "whiteSpace";
         readonly presets: readonly ["nowrap"];
     };
@@ -1590,10 +1576,15 @@ export declare const PROPS: {
         readonly prop: "clear";
         readonly presets: readonly ["both"];
     };
-    readonly isolation: {
+    readonly iso: {
         readonly prop: "isolation";
         readonly presets: readonly ["isolate"];
     };
+    readonly wm: {
+        readonly prop: "writingMode";
+        readonly presets: readonly ["vertical-rl"];
+        readonly bp: 1;
+    };
 };
 export declare const TRAITS: {
     readonly isContainer: "is--container";
@@ -1609,7 +1600,10 @@ export declare const TRAITS: {
     readonly isCoverLink: "is--coverLink";
     readonly isSide: "is--side";
     readonly isSkipFlow: "is--skipFlow";
-    readonly isVertical: "is--vertical";
+    readonly hasTransition: "has--transition";
+    readonly hasGutter: "has--gutter";
+    readonly hasSnap: "has--snap";
+    readonly hasMask: "has--mask";
 };
 export declare const BREAK_POINTS: readonly ["sm", "md", "lg", "xl"];
 export declare const BREAK_POINTS_ALL: readonly ["base", "sm", "md", "lg", "xl"];

package/dist/css/base/set.css

@@ -1 +1 @@
-:root{--_is_sm:unset;--_is_md:unset}@container (min-width: 480px){.set--bp{--_is_sm: }}@container (min-width: 800px){.set--bp{--_is_md: }}@media (any-hover:hover){.set--hov:hover{--_notHov: }.set--hov:not(:is(:hover,:focus-within)){--_isHov: }}@media (any-hover:none){.set--hov{--_isHov: }}.set--hov:is(:focus-visible,:focus-within){--_notHov: }.set--transition{transition:var(--hov-duration,.25s) var(--hov-ease,linear) var(--hov-delay,0s);transition-property:var(--hov-prop,all)}.set--innerRs{--bdrs--inner:calc(var(--bdrs, 0px) - var(--p, 0px))}.set--plain{background:none;border:none;border-radius:0;color:inherit;font:inherit;height:auto;line-height:calc(1em + var(--hl)*2);margin:0;max-height:none;max-width:none;min-height:0;min-width:0;padding:0;text-decoration:none;width:auto}.set--gutter{padding-inline:var(--gutter-size)}
+@media (any-hover:hover){.set--var\:hov:hover{--_notHov: }.set--var\:hov:not(:is(:hover,:focus-within)){--_isHov: }}@media (any-hover:none){.set--var\:hov{--_isHov: }}.set--var\:hov:is(:focus-visible,:focus-within){--_notHov: }.set--var\:bdrsInner{--bdrs--inner:calc(var(--bdrs, 0px) - var(--p, 0px))}.set--plain{background:none;border:none;border-radius:0;color:inherit;font:inherit;height:auto;line-height:calc(1em + var(--hl)*2);margin:0;max-height:none;max-width:none;min-height:0;min-width:0;padding:0;text-decoration:none;width:auto}:is(ul,ol).set--revert{list-style:revert;padding-inline-start:var(--list-px-s,var(--s30))}

package/dist/css/base.css

@@ -1 +1 @@
-@property --sz--container{syntax:"<length-percentage>";initial-value:100cqi;inherits:true}:root{--sz--xl:1600px;--sz--l:1280px;--sz--m:56rem;--sz--s:42rem;--sz--xs:32rem;--sz--min:18rem;--black:#000;--white:#fff;--L:60%;--C:0.22;--red:oklch(var(--L) var(--C) 20);--orange:oklch(calc(var(--L) + 4%) calc(var(--C) - 0.01) 52);--yellow:oklch(calc(var(--L) + 12%) calc(var(--C) - 0.025) 84);--green:oklch(calc(var(--L) + 4%) calc(var(--C) - 0.02) 152);--blue:oklch(calc(var(--L) - 2%) calc(var(--C) + 0.01) 260);--purple:oklch(calc(var(--L) - 4%) calc(var(--C) + 0.02) 292);--pink:oklch(calc(var(--L) + 2%) calc(var(--C) + 0.02) 348);--gray:oklch(calc(var(--L) - 4%) 0.04 256);--brand:#1e5f8c;--accent:#d94a6a;--base:#fcfcfd;--base-2:#f1f2f3;--text:#141415;--text-2:#4d4f56;--link:oklch(50% 0.3 240);--divider:#dedfe3;--o--n10:0.75;--o--n20:0.5;--o--n30:0.25;--bdrs--10:0.25rem;--bdrs--20:0.5rem;--bdrs--30:1rem;--bdrs--40:1.5rem;--bdrs--99:99rem;--shc:rgba(20,20,21,.05);--shsz--5:0px 1px 3px;--shsz--10:0px 2px 6px;--shsz--20:0px 4px 12px;--shsz--30:0px 8px 24px;--shsz--40:0px 16px 48px;--ar--og:1.91/1;--gutter-size:var(--s30);--vertical-mode:vertical-rl;--REM:clamp(0.95rem,0.915rem + 0.15vw,1.05rem);--fz--base:var(--REM);--fz-mol:8;--fz--5xl:calc(1em*var(--fz-mol)/(var(--fz-mol) - 6));--fz--4xl:calc(1em*var(--fz-mol)/(var(--fz-mol) - 5));--fz--3xl:calc(1em*var(--fz-mol)/(var(--fz-mol) - 4));--fz--2xl:calc(1em*var(--fz-mol)/(var(--fz-mol) - 3));--fz--xl:calc(1em*var(--fz-mol)/(var(--fz-mol) - 2));--fz--l:calc(1em*var(--fz-mol)/(var(--fz-mol) - 1));--fz--m:1em;--fz--s:calc(1em*var(--fz-mol)/(var(--fz-mol) + 1));--fz--xs:calc(1em*var(--fz-mol)/(var(--fz-mol) + 2));--fz--2xs:calc(1em*var(--fz-mol)/(var(--fz-mol) + 3));--ff--base:-apple-system,"BlinkMacSystemFont","Hiragino Sans",sans-serif,"Segoe UI Emoji";--ff--mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;--ff--accent:"Garamond","Baskerville","Times New Roman",serif;--fw--light:300;--fw--normal:400;--fw--bold:600;--lts--base:normal;--lts--s:-0.05em;--lts--l:0.05em;--hl-unit:calc(var(--REM)*0.125);--hl--xs:var(--hl-unit);--hl--s:calc(var(--hl-unit)*2);--hl--base:calc(var(--hl-unit)*3);--hl--l:calc(var(--hl-unit)*4);--s-unit:calc(var(--REM)*0.5);--s5:calc(var(--s-unit)*0.5);--s10:var(--s-unit);--s15:calc(var(--s-unit)*1.5);--s20:calc(var(--s-unit)*2);--s30:calc(var(--s-unit)*3);--s40:calc(var(--s-unit)*5);--s50:calc(var(--s-unit)*8);--s60:calc(var(--s-unit)*13);--s70:calc(var(--s-unit)*21);--s80:calc(var(--s-unit)*34)}@property --hl{syntax:"<length>";inherits:true;initial-value:.25rem}.set--shadow,:root{--sh--5:var(--shsz--5) var(--shc);--sh--10:var(--shsz--10) var(--shc);--sh--20:var(--shsz--20) var(--shc);--sh--30:var(--shsz--30) var(--shc);--sh--40:var(--shsz--40) var(--shc);--bxsh--10:var(--sh--5),var(--sh--10);--bxsh--20:var(--sh--10),var(--sh--20);--bxsh--30:var(--sh--20),var(--sh--30);--bxsh--40:var(--sh--30),var(--sh--40)}body{--hl:var(--hl--base);background-color:var(--base);color:var(--text);font-family:var(--ff--base);font-size:var(--fz--base);letter-spacing:var(--lts--base);text-underline-offset:var(--under-offset,.125em)}*{line-height:calc(1em + var(--hl)*2)}:is(h1,h2,h3,h4,h5,h6){font-family:var(--headings-ff,inherit);font-weight:var(--headings-fw,var(--fw--bold))}h1{font-size:var(--fz--3xl)}h2{font-size:var(--fz--2xl)}h3{font-size:var(--fz--xl)}h4{font-size:var(--fz--l)}h5,h6{font-size:var(--fz--m)}a{color:var(--link-c,var(--link));-webkit-text-decoration:var(--link-td,underline);text-decoration:var(--link-td,underline);text-decoration-color:var(--link-td-color,currentColor);text-decoration-thickness:var(--link-td-thickness,auto)}small{--hl:var(--hl--s);font-size:var(--fz--xs)}b,strong{font-weight:var(--fw--bold)}sub,sup{--hl:var(--hl--xs);font-size:80%}code,kbd,samp,var{font-family:var(--ff--mono)}blockquote{background-color:var(--base-2);padding:var(--s30)}caption,figcaption,legend{font-size:var(--fz--s)}hr{block-size:0;border:none;border-block-start:1px solid var(--divider)}:is(ul,ol):where(:not([class])),:is(ul,ol):where([class^="-"]){list-style:revert;padding-inline-start:var(--list-px-s,var(--s30))}dt{font-weight:var(--fw--bold)}dd+dt{margin-block-start:var(--s20)}table{--td-c:inherit;--td-bgc:transparent;--td-p:var(--s10);--td-min-sz:initial}td{background-color:var(--td-bgc);color:var(--td-c);min-inline-size:var(--td-min-sz);padding:var(--td-p)}th{background-color:var(--th-bgc,var(--td-bgc));color:var(--th-c,var(--td-c));min-inline-size:var(--th-min-sz,var(--td-min-sz));padding:var(--th-p,var(--td-p))}::file-selector-button,button,input,select,textarea{background-color:var(--controls-bgc,var(--base-2));border:1px solid var(--controls-bdc,var(--divider));border-radius:var(--controls-bdrs,var(--bdrs--10));padding:var(--controls-p,var(--s5) var(--s10))}:disabled{opacity:var(--o--n20)}:focus-visible{outline-offset:var(--focus-offset,0)}:root{--_is_sm:unset;--_is_md:unset}@container (min-width: 480px){.set--bp{--_is_sm: }}@container (min-width: 800px){.set--bp{--_is_md: }}@media (any-hover:hover){.set--hov:hover{--_notHov: }.set--hov:not(:is(:hover,:focus-within)){--_isHov: }}@media (any-hover:none){.set--hov{--_isHov: }}.set--hov:is(:focus-visible,:focus-within){--_notHov: }.set--transition{transition:var(--hov-duration,.25s) var(--hov-ease,linear) var(--hov-delay,0s);transition-property:var(--hov-prop,all)}.set--innerRs{--bdrs--inner:calc(var(--bdrs, 0px) - var(--p, 0px))}.set--plain{background:none;border:none;border-radius:0;color:inherit;font:inherit;height:auto;line-height:calc(1em + var(--hl)*2);margin:0;max-height:none;max-width:none;min-height:0;min-width:0;padding:0;text-decoration:none;width:auto}.set--gutter{padding-inline:var(--gutter-size)}
+@property --sz--container{syntax:"<length-percentage>";initial-value:100cqi;inherits:true}:root{--sz--xl:1600px;--sz--l:1280px;--sz--m:56rem;--sz--s:42rem;--sz--xs:32rem;--black:#000;--white:#fff;--L:60%;--C:0.22;--red:oklch(var(--L) var(--C) 20);--orange:oklch(calc(var(--L) + 4%) calc(var(--C) - 0.01) 52);--yellow:oklch(calc(var(--L) + 12%) calc(var(--C) - 0.025) 84);--green:oklch(calc(var(--L) + 4%) calc(var(--C) - 0.02) 152);--blue:oklch(calc(var(--L) - 2%) calc(var(--C) + 0.01) 260);--purple:oklch(calc(var(--L) - 4%) calc(var(--C) + 0.02) 292);--pink:oklch(calc(var(--L) + 2%) calc(var(--C) + 0.02) 348);--gray:oklch(calc(var(--L) - 4%) 0.04 256);--brand:#1e5f8c;--accent:#d94a6a;--base:#fcfcfd;--base-2:#f1f2f3;--text:#141415;--text-2:#4d4f56;--link:oklch(50% 0.3 240);--divider:#dedfe3;--o---10:0.75;--o---20:0.5;--o---30:0.25;--bdrs--10:0.25rem;--bdrs--20:0.5rem;--bdrs--30:1rem;--bdrs--40:1.5rem;--bdrs--99:99rem;--ar--og:1.91/1;--gutter-size:var(--s30);--REM:clamp(0.95rem,0.915rem + 0.15vw,1.05rem);--fz--base:var(--REM);--fz-mol:8;--fz--5xl:calc(1em*var(--fz-mol)/(var(--fz-mol) - 6));--fz--4xl:calc(1em*var(--fz-mol)/(var(--fz-mol) - 5));--fz--3xl:calc(1em*var(--fz-mol)/(var(--fz-mol) - 4));--fz--2xl:calc(1em*var(--fz-mol)/(var(--fz-mol) - 3));--fz--xl:calc(1em*var(--fz-mol)/(var(--fz-mol) - 2));--fz--l:calc(1em*var(--fz-mol)/(var(--fz-mol) - 1));--fz--m:1em;--fz--s:calc(1em*var(--fz-mol)/(var(--fz-mol) + 1));--fz--xs:calc(1em*var(--fz-mol)/(var(--fz-mol) + 2));--fz--2xs:calc(1em*var(--fz-mol)/(var(--fz-mol) + 3));--ff--base:-apple-system,"BlinkMacSystemFont","Hiragino Sans",sans-serif,"Segoe UI Emoji";--ff--mono:ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;--ff--accent:"Garamond","Baskerville","Times New Roman",serif;--fw--light:300;--fw--normal:400;--fw--bold:600;--lts--base:normal;--lts--s:-0.05em;--lts--l:0.05em;--hl-unit:calc(var(--REM)*0.125);--hl--xs:var(--hl-unit);--hl--s:calc(var(--hl-unit)*2);--hl--base:calc(var(--hl-unit)*3);--hl--l:calc(var(--hl-unit)*4);--s-unit:calc(var(--REM)*0.5);--s5:calc(var(--s-unit)*0.5);--s10:var(--s-unit);--s15:calc(var(--s-unit)*1.5);--s20:calc(var(--s-unit)*2);--s30:calc(var(--s-unit)*3);--s40:calc(var(--s-unit)*5);--s50:calc(var(--s-unit)*8);--s60:calc(var(--s-unit)*13);--s70:calc(var(--s-unit)*21);--s80:calc(var(--s-unit)*34);--shc:rgba(20,20,21,.15);--shsz--10:0px 1px 3px;--shsz--20:0px 2px 6px;--shsz--30:0px 4px 12px;--shsz--40:0px 8px 24px;--shsz--50:0px 16px 48px}@property --hl{syntax:"<length>";inherits:true;initial-value:.25rem}.set--var\:bxsh,:root{--bxsh--10:var(--shsz--10) var(--shc);--bxsh--20:var(--shsz--20) var(--shc);--bxsh--30:var(--shsz--30) var(--shc);--bxsh--40:var(--shsz--40) var(--shc);--bxsh--50:var(--shsz--50) var(--shc)}body{--hl:var(--hl--base);background-color:var(--base);color:var(--text);font-family:var(--ff--base);font-size:var(--fz--base);letter-spacing:var(--lts--base);text-underline-offset:var(--under-offset,.125em)}*{line-height:calc(1em + var(--hl)*2)}:is(h1,h2,h3,h4,h5,h6){font-family:var(--headings-ff,inherit);font-weight:var(--headings-fw,var(--fw--bold))}h1{font-size:var(--fz--3xl)}h2{font-size:var(--fz--2xl)}h3{font-size:var(--fz--xl)}h4{font-size:var(--fz--l)}h5,h6{font-size:var(--fz--m)}a{color:var(--link-c,var(--link));-webkit-text-decoration:var(--link-td,underline);text-decoration:var(--link-td,underline);text-decoration-color:var(--link-td-color,currentColor);text-decoration-thickness:var(--link-td-thickness,auto)}small{--hl:var(--hl--s);font-size:var(--fz--xs)}b,strong{font-weight:var(--fw--bold)}sub,sup{--hl:var(--hl--xs);font-size:80%}code,kbd,samp,var{font-family:var(--ff--mono)}blockquote{background-color:var(--base-2);padding:var(--s30)}caption,figcaption,legend{font-size:var(--fz--s)}hr{block-size:0;border:none;border-block-start:1px solid var(--divider)}:is(ul,ol):where(:not([class])){list-style:revert;padding-inline-start:var(--list-px-s,var(--s30))}dt{font-weight:var(--fw--bold)}dd+dt{margin-block-start:var(--s20)}table{--td-c:inherit;--td-bgc:transparent;--td-p:var(--s10);--td-min-sz:initial}td{background-color:var(--td-bgc);color:var(--td-c);min-inline-size:var(--td-min-sz);padding:var(--td-p)}th{background-color:var(--th-bgc,var(--td-bgc));color:var(--th-c,var(--td-c));min-inline-size:var(--th-min-sz,var(--td-min-sz));padding:var(--th-p,var(--td-p))}::file-selector-button,button,input,select,textarea{background-color:var(--controls-bgc,var(--base-2));border:1px solid var(--controls-bdc,var(--divider));border-radius:var(--controls-bdrs,var(--bdrs--10));padding:var(--controls-p,var(--s5) var(--s10))}:disabled{opacity:var(--o---20)}:focus-visible{outline-offset:var(--focus-offset,0)}@media (any-hover:hover){.set--var\:hov:hover{--_notHov: }.set--var\:hov:not(:is(:hover,:focus-within)){--_isHov: }}@media (any-hover:none){.set--var\:hov{--_isHov: }}.set--var\:hov:is(:focus-visible,:focus-within){--_notHov: }.set--var\:bdrsInner{--bdrs--inner:calc(var(--bdrs, 0px) - var(--p, 0px))}.set--plain{background:none;border:none;border-radius:0;color:inherit;font:inherit;height:auto;line-height:calc(1em + var(--hl)*2);margin:0;max-height:none;max-width:none;min-height:0;min-width:0;padding:0;text-decoration:none;width:auto}:is(ul,ol).set--revert{list-style:revert;padding-inline-start:var(--list-px-s,var(--s30))}