@lism-css/mcp 0.14.0 → 0.15.1

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.
Files changed (51) hide show
  1. package/dist/data/docs-index.json +152 -82
  2. package/dist/data/guides/SKILL.md +43 -19
  3. package/dist/data/guides/antipatterns.md +147 -0
  4. package/dist/data/guides/base-styles.md +3 -1
  5. package/dist/data/guides/components-core.md +21 -17
  6. package/dist/data/guides/components-ui.md +18 -13
  7. package/dist/data/guides/css-rules.md +43 -34
  8. package/dist/data/guides/customize.md +220 -0
  9. package/dist/data/guides/naming.md +26 -7
  10. package/dist/data/guides/primitive-class.md +82 -30
  11. package/dist/data/guides/primitives/a--decorator.md +2 -2
  12. package/dist/data/guides/primitives/a--divider.md +1 -1
  13. package/dist/data/guides/primitives/a--icon.md +1 -1
  14. package/dist/data/guides/primitives/a--spacer.md +1 -1
  15. package/dist/data/guides/primitives/l--autoColumns.md +71 -0
  16. package/dist/data/guides/primitives/l--box.md +2 -2
  17. package/dist/data/guides/primitives/l--center.md +1 -1
  18. package/dist/data/guides/primitives/l--cluster.md +2 -2
  19. package/dist/data/guides/primitives/l--columns.md +3 -3
  20. package/dist/data/guides/primitives/l--flex.md +2 -2
  21. package/dist/data/guides/primitives/l--flow.md +5 -5
  22. package/dist/data/guides/primitives/l--frame.md +2 -2
  23. package/dist/data/guides/primitives/l--grid.md +2 -2
  24. package/dist/data/guides/primitives/l--stack.md +1 -1
  25. package/dist/data/guides/primitives/{l--switchCols.md → l--switchColumns.md} +18 -18
  26. package/dist/data/guides/primitives/l--tileGrid.md +2 -2
  27. package/dist/data/guides/primitives/{l--sideMain.md → l--withSide.md} +42 -20
  28. package/dist/data/guides/prop-responsive.md +29 -4
  29. package/dist/data/guides/property-class/bd.md +127 -0
  30. package/dist/data/guides/property-class/hov.md +140 -0
  31. package/dist/data/guides/property-class/max-sz.md +99 -0
  32. package/dist/data/guides/property-class.md +49 -83
  33. package/dist/data/guides/set-class.md +65 -80
  34. package/dist/data/guides/tokens.md +26 -13
  35. package/dist/data/guides/trait-class/has--gutter.md +48 -0
  36. package/dist/data/guides/trait-class/has--mask.md +66 -0
  37. package/dist/data/guides/trait-class/has--snap.md +68 -0
  38. package/dist/data/guides/trait-class/has--transition.md +73 -0
  39. package/dist/data/guides/{primitives → trait-class}/is--boxLink.md +8 -8
  40. package/dist/data/guides/{primitives → trait-class}/is--container.md +11 -5
  41. package/dist/data/guides/{primitives → trait-class}/is--layer.md +5 -5
  42. package/dist/data/guides/{primitives → trait-class}/is--wrapper.md +8 -8
  43. package/dist/data/guides/trait-class.md +77 -0
  44. package/dist/data/guides/utility-class.md +9 -9
  45. package/dist/data/meta.js +2 -2
  46. package/dist/lib/load-markdown.js +1 -1
  47. package/dist/lib/search.js +8 -5
  48. package/dist/tools/get-component.js +4 -3
  49. package/dist/tools/get-guide.js +9 -2
  50. package/package.json +2 -2
  51. package/dist/data/guides/primitives/l--fluidCols.md +0 -71
package/dist/data/guides/primitives/l--fluidCols.md DELETED
@@ -1,71 +0,0 @@
1
- # l--fluidCols / `<FluidCols>`
2
-
3
- カラム要素が指定した幅より小さくならないように自動で折り返す、**ブレイクポイント非依存の段組みクラス**。`auto-fit` / `auto-fill` を使った流動カラムを簡潔に記述できます。
4
-
5
- ## 基本情報
6
-
7
- - クラス名: `l--fluidCols`
8
- - コンポーネント: `<FluidCols>`
9
- - SCSSソース: https://raw.githubusercontent.com/lism-css/lism-css/main/packages/lism-css/src/scss/primitives/layout/_fluidCols.scss
10
- - ドキュメント（人間向け）: https://lism-css.com/docs/primitives/l--fluidCols/
11
-
12
- ## 専用Props
13
-
14
- | Prop | CSS変数 | 説明 |
15
- |------|--------|------|
16
- | `cols` | `--cols` | カラムが維持する最小幅を指定（`16em`, `320px` など） |
17
- | `autoFill` | `--autoMode` | `auto-fill` モードに切り替え（デフォルトは `auto-fit`） |
18
-
19
- ## Usage
20
-
21
- ### `--cols`でサイズを指定する
22
-
23
- ```jsx
24
- <FluidCols cols="16em" g="20">
25
- <Lism as="div" p="20" bd>Item A</Lism>
26
- <Lism as="div" p="20" bd>Item B</Lism>
27
- <Lism as="div" p="20" bd>Item C</Lism>
28
- <Lism as="div" p="20" bd>Item D</Lism>
29
- </FluidCols>
30
- ```
31
-
32
- ```html
33
- <div class="l--fluidCols -g:20" style="--cols: 16em">
34
- <div class="-p:20 -bd">Item A</div>
35
- <div class="-p:20 -bd">Item B</div>
36
- <div class="-p:20 -bd">Item C</div>
37
- <div class="-p:20 -bd">Item D</div>
38
- </div>
39
- ```
40
-
41
- ### `auto-fill`を使用する
42
-
43
- `l--fluidCols` では、`grid-template-columns` の `repeat()` 関数の第一引数を `--autoMode` で指定できます（デフォルトは `auto-fit`）。`--autoMode:auto-fill`（`autoFill`）を指定することで、要素数が少ない時の挙動が変わります。
44
-
45
- ```jsx
46
- <FluidCols cols="12em" autoFill g="20" fz="s">
47
- <Lism as="div" p="20" bd>auto-fill</Lism>
48
- <Lism as="div" p="20" bd>auto-fill</Lism>
49
- </FluidCols>
50
- <FluidCols cols="12em" g="20" fz="s">
51
- <Lism as="div" p="20" bd>auto-fit</Lism>
52
- <Lism as="div" p="20" bd>auto-fit</Lism>
53
- </FluidCols>
54
- ```
55
-
56
- ```html
57
- <div class="l--fluidCols -g:20 -fz:s" style="--cols:12em; --autoMode:auto-fill">
58
- <div class="-p:20 -bd">auto-fill</div>
59
- <div class="-p:20 -bd">auto-fill</div>
60
- </div>
61
- <div class="l--fluidCols -g:20 -fz:s" style="--cols:12em">
62
- <div class="-p:20 -bd">auto-fit</div>
63
- <div class="-p:20 -bd">auto-fit</div>
64
- </div>
65
- ```
66
-
67
- ## 関連プリミティブ
68
-
69
- - [l--columns](./l--columns.md) — ブレイクポイント指定の等幅カラム
70
- - [l--switchCols](./l--switchCols.md) — 複数列 ↔ 1列の2段階切り替え
71
- - [l--sideMain](./l--sideMain.md) — メイン幅ベースの2カラム自動切替