lism-css 0.23.0 → 0.24.0

package/dist/lib/types/PropValueTypes.d.ts

@@ -2,6 +2,7 @@ import { TOKENS, PROPS } from '../../../config/index';
 import { WithArbitraryString, ArrayElement, ExtractArrayValues, ExtractObjectKeys, ExtractPropertyValue } from './utils';
 import { MakeResponsive } from './ResponsiveProps';
 import { FullModeRegistry } from './FullModeRegistry';
+import { CustomPropValueRegistry } from './CustomPropValueRegistry';
 type PropsConfig = typeof PROPS;
 type TokensConfig = typeof TOKENS;
 /**
@@ -28,12 +29,19 @@ type ExtractTokenValues<T> = ExtractPropertyValue<T, 'token'> extends never ? ne
  * presets の値 + utils のキー + token の値
  */
 type ExtractPropValues<T> = ExtractArrayValues<T, 'presets'> | ExtractObjectKeys<T, 'utils'> | ExtractTokenValues<T>;
+/**
+ * lism.config.js で既定 prop へ追加された値（{@link CustomPropValueRegistry} の拡張分）を取得。
+ * 拡張が無い prop は never（defaults 由来の型のまま）。
+ */
+type UserPropValues<K> = K extends keyof CustomPropValueRegistry ? Extract<CustomPropValueRegistry[K], string> : never;
 /**
  * プロパティの設定から値の型を決定
- * - presets/utils/token がある場合: 具体的な値 + 任意文字列 + number | boolean | null
+ * - presets/utils/token（+ user 追加分）がある場合: 具体的な値 + 任意文字列 + number | boolean | null
  * - ない場合: string | number（フォールバック）
+ *
+ * `[X] extends [never]` の tuple ラップで ExtraValues（naked 型パラメータ）の分配を防ぐ。
  */
-type PropValueType<T> = ExtractPropValues<T> extends never ? string | number | boolean : WithArbitraryString<ExtractPropValues<T>> | number | boolean | null;
+type PropValueType<T, ExtraValues = never> = [ExtractPropValues<T> | ExtraValues] extends [never] ? string | number | boolean : WithArbitraryString<ExtractPropValues<T> | ExtraValues> | number | boolean | null;
 /**
  * bp プロパティでレスポンシブ（配列・オブジェクト形式）が有効かを判定
  * - bp 未設定 / bp: 0 → false
@@ -56,13 +64,13 @@ type PropsWithoutBreakpoint = Exclude<AllPropKeys, PropsWithBreakpoint>;
  * bp が有効なプロパティの型（レスポンシブ対応あり）
  */
 export type ResponsivePropValueTypes = {
-    [K in PropsWithBreakpoint]?: PropValueType<PropsConfig[K]>;
+    [K in PropsWithBreakpoint]?: PropValueType<PropsConfig[K], UserPropValues<K>>;
 };
 /**
  * bp が無効なプロパティの型（レスポンシブ対応なし）
  */
 export type NonResponsivePropValueTypes = {
-    [K in PropsWithoutBreakpoint]?: PropValueType<PropsConfig[K]>;
+    [K in PropsWithoutBreakpoint]?: PropValueType<PropsConfig[K], UserPropValues<K>>;
 };
 /** defaults 由来の Props 型（full モード未適用時のデフォルト） */
 type DefaultPropValueTypes = MakeResponsive<ResponsivePropValueTypes> & NonResponsivePropValueTypes;
@@ -84,9 +92,9 @@ type FullPropsWithBreakpoint = {
 type FullPropsWithoutBreakpoint = Exclude<AllPropKeys, FullPropsWithBreakpoint>;
 /** full モード適用時の Props 型（isVar 系を除く全 props がレスポンシブ） */
 type FullPropValueTypes = MakeResponsive<{
-    [K in FullPropsWithBreakpoint]?: PropValueType<PropsConfig[K]>;
+    [K in FullPropsWithBreakpoint]?: PropValueType<PropsConfig[K], UserPropValues<K>>;
 }> & {
-    [K in FullPropsWithoutBreakpoint]?: PropValueType<PropsConfig[K]>;
+    [K in FullPropsWithoutBreakpoint]?: PropValueType<PropsConfig[K], UserPropValues<K>>;
 };
 /**
  * FullModeRegistry が module augmentation で拡張されている（= キーが1つ以上ある）か。

package/dist/lib/types/ResponsiveProps.d.ts

@@ -1,4 +1,5 @@
 import { LimitedArray } from './utils';
+import { BreakpointSequence } from '../../../config/defaults/breakpoints';
 /**
  * 型が「広告する（補完・許可する）」ブレイクポイントのレジストリ。
  *
@@ -33,8 +34,9 @@ type AdvertisedBpKey = Extract<keyof BreakpointRegistry, string>;
 /**
  * 配列記法の位置順（`base` を除く）。位置は固定の契約（変更しない）。
  * `xs` はこの並びに含めない（= 配列記法では書けず、オブジェクト記法のみ）。
+ * 定義は `config/defaults/breakpoints` の `BREAK_POINTS` を single source とする。
  */
-type ArrayBpSequence = ['sm', 'md', 'lg', 'xl'];
+type ArrayBpSequence = BreakpointSequence;
 /** タプルのうち `Keys` に含まれる要素だけを残す */
 type FilterByKeys<Tuple extends readonly unknown[], Keys, Acc extends unknown[] = []> = Tuple extends readonly [infer Head, ...infer Rest] ? FilterByKeys<Rest, Keys, Head extends Keys ? [...Acc, Head] : Acc> : Acc;
 /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lism-css",
-  "version": "0.23.0",
+  "version": "0.24.0",
   "description": "Lism CSS is a layout-first CSS framework for websites.",
   "author": {
     "name": "ddryo",
@@ -36,6 +36,10 @@
       "import": "./dist/config/default-config.js",
       "types": "./dist/config/default-config.d.ts"
     },
+    "./config-types": {
+      "types": "./dist/config/types.d.ts",
+      "import": "./dist/config/types.js"
+    },
     "./config/helper": {
       "import": "./dist/config/helper.js",
       "types": "./dist/config/helper.d.ts"

package/src/scss/base/_html.scss

@@ -85,8 +85,7 @@ blockquote {
   font-style: italic;
 }
 
-blockquote,
-pre {
+blockquote {
   background-color: var(--base-2);
   padding: var(--s20);
 }

package/src/scss/reset.scss

@@ -48,6 +48,9 @@
   }
 
   body {
+    /* BFCを作り、先頭子要素のmargin-topがbody外へ相殺されてmin-heightと合算スクロールが発生するのを防ぐ (#458) */
+    display: flow-root;
+
     /* htmlから継承する */
     overflow: inherit;
 

package/src/scss/trait/is/_boxLink.scss

@@ -11,7 +11,8 @@
 }
 
 // リンクをクリック可能にするためにz-indexあげる
-.is--boxLink a {
+// :where() で詳細度を 0 にし、no_layer ビルドでもユーティリティ等で上書きしやすくする。
+.is--boxLink :where(a:not(.is--coverLink)) {
   position: relative;
   z-index: 2; // .is--coverLink::before + 1
 }