lism-css 0.11.0 → 0.12.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lism-css",
-  "version": "0.11.0",
+  "version": "0.12.0",
   "description": "Lism CSS is a layout-first CSS framework for websites.",
   "author": {
     "name": "ddryo",

package/packages/astro/{Decorator → atomic/Decorator}/Decorator.astro

@@ -1,7 +1,7 @@
 ---
 import type { HTMLTag, Polymorphic } from 'astro/types';
 import type { DecoratorProps } from 'lism-css/react/atomic/Decorator/getProps';
-import { Lism } from '../Lism';
+import { Lism } from '../../Lism';
 import getProps from 'lism-css/react/atomic/Decorator/getProps';
 
 type Props<Tag extends HTMLTag = 'div'> = Polymorphic<{ as: Tag }> &

package/packages/astro/{Divider → atomic/Divider}/Divider.astro

@@ -1,7 +1,7 @@
 ---
 import type { HTMLTag, Polymorphic } from 'astro/types';
-import type { AstroLismBaseProps } from '../types';
-import { Lism } from '../Lism';
+import type { AstroLismBaseProps } from '../../types';
+import { Lism } from '../../Lism';
 import { getDividerProps } from 'lism-css/react/atomic/Divider/getProps';
 
 type Props<Tag extends HTMLTag = 'div'> = Polymorphic<{ as: Tag }> & AstroLismBaseProps;

package/packages/astro/{Icon → atomic/Icon}/Icon.astro

@@ -2,7 +2,7 @@
 import type { HTMLTag, Polymorphic } from 'astro/types';
 import type { ElementType } from 'react';
 import type { IconProps, IconOwnProps } from 'lism-css/react/atomic/Icon/getProps';
-import type { AstroLismBaseProps } from '../types';
+import type { AstroLismBaseProps } from '../../types';
 import getLismProps from 'lism-css/lib/getLismProps';
 import getProps from 'lism-css/react/atomic/Icon/getProps';
 import SVG from './SVG.astro';

package/packages/astro/{Spacer → atomic/Spacer}/Spacer.astro

@@ -1,7 +1,7 @@
 ---
 import type { HTMLTag, Polymorphic } from 'astro/types';
-import type { AstroLismBaseProps } from '../types';
-import { Lism } from '../Lism';
+import type { AstroLismBaseProps } from '../../types';
+import { Lism } from '../../Lism';
 import getProps from 'lism-css/react/atomic/Spacer/getProps';
 
 type Props<Tag extends HTMLTag = 'div'> = Polymorphic<{ as: Tag }> & AstroLismBaseProps;

package/packages/astro/index.ts

@@ -3,7 +3,6 @@
  */
 
 export * from './Lism';
-export { default as HTML } from './HTML';
 /** @deprecated DummyText / DummyImage (@lism-css/ui) を使用してください */
 export * from './Dummy';
 
@@ -14,26 +13,31 @@ export * from './Group';
 export * from './Heading';
 export * from './Link';
 export * from './List';
-export * from './Box';
-export * from './Flow';
-export * from './Flex';
-export * from './Cluster';
-export * from './Stack';
-export * from './Grid';
-export * from './FluidCols';
-export * from './SwitchCols';
-export * from './Columns';
-export * from './Center';
-export * from './SideMain';
-export * from './Frame';
+export * from './Media';
 
-export * from './Container';
-export * from './Wrapper';
-export * from './Layer';
-export * from './LinkBox';
+// layout (l--)
+export * from './layout/Box';
+export * from './layout/Center';
+export * from './layout/Cluster';
+export * from './layout/Columns';
+export * from './layout/Flex';
+export * from './layout/Flow';
+export * from './layout/FluidCols';
+export * from './layout/Frame';
+export * from './layout/Grid';
+export * from './layout/SideMain';
+export * from './layout/Stack';
+export * from './layout/SwitchCols';
+export * from './layout/TileGrid';
 
-export * from './Decorator';
-export * from './Divider';
-export * from './Icon';
-export * from './Media';
-export * from './Spacer';
+// state (is--)
+export * from './state/Container';
+export * from './state/Layer';
+export * from './state/LinkBox';
+export * from './state/Wrapper';
+
+// atomic (a--)
+export * from './atomic/Decorator';
+export * from './atomic/Divider';
+export * from './atomic/Icon';
+export * from './atomic/Spacer';

package/packages/astro/{Box → layout/Box}/Box.astro

@@ -1,7 +1,7 @@
 ---
 import type { HTMLTag, Polymorphic } from 'astro/types';
-import type { AstroLismFixedLayoutProps } from '../types';
-import { Lism } from '../Lism';
+import type { AstroLismFixedLayoutProps } from '../../types';
+import { Lism } from '../../Lism';
 
 type Props<Tag extends HTMLTag = 'div'> = Polymorphic<{ as: Tag }> & AstroLismFixedLayoutProps;
 

package/packages/astro/{Center → layout/Center}/Center.astro

@@ -1,7 +1,7 @@
 ---
 import type { HTMLTag, Polymorphic } from 'astro/types';
-import type { AstroLismFixedLayoutProps } from '../types';
-import { Lism } from '../Lism';
+import type { AstroLismFixedLayoutProps } from '../../types';
+import { Lism } from '../../Lism';
 
 type Props<Tag extends HTMLTag = 'div'> = Polymorphic<{ as: Tag }> & AstroLismFixedLayoutProps;
 

package/packages/astro/{Cluster → layout/Cluster}/Cluster.astro

@@ -1,7 +1,7 @@
 ---
 import type { HTMLTag, Polymorphic } from 'astro/types';
-import type { AstroLismFixedLayoutProps } from '../types';
-import { Lism } from '../Lism';
+import type { AstroLismFixedLayoutProps } from '../../types';
+import { Lism } from '../../Lism';
 
 type Props<Tag extends HTMLTag = 'div'> = Polymorphic<{ as: Tag }> & AstroLismFixedLayoutProps;
 

package/packages/astro/{Columns → layout/Columns}/Columns.astro

@@ -1,7 +1,7 @@
 ---
 import type { HTMLTag, Polymorphic } from 'astro/types';
-import type { AstroLismFixedLayoutProps } from '../types';
-import { Lism } from '../Lism';
+import type { AstroLismFixedLayoutProps } from '../../types';
+import { Lism } from '../../Lism';
 
 type Props<Tag extends HTMLTag = 'div'> = Polymorphic<{ as: Tag }> & AstroLismFixedLayoutProps;
 

package/packages/astro/{Flex → layout/Flex}/Flex.astro

@@ -1,7 +1,7 @@
 ---
 import type { HTMLTag, Polymorphic } from 'astro/types';
-import type { AstroLismFixedLayoutProps } from '../types';
-import { Lism } from '../Lism';
+import type { AstroLismFixedLayoutProps } from '../../types';
+import { Lism } from '../../Lism';
 
 type Props<Tag extends HTMLTag = 'div'> = Polymorphic<{ as: Tag }> & AstroLismFixedLayoutProps;
 

package/packages/astro/{Flow → layout/Flow}/Flow.astro

@@ -1,8 +1,8 @@
 ---
 import type { HTMLTag, Polymorphic } from 'astro/types';
-import type { AstroLismFixedLayoutProps } from '../types';
+import type { AstroLismFixedLayoutProps } from '../../types';
 import type { FlowLayoutProps } from 'lism-css/lib/types/LayoutProps';
-import { Lism } from '../Lism';
+import { Lism } from '../../Lism';
 
 type Props<Tag extends HTMLTag = 'div'> = Polymorphic<{ as: Tag }> & AstroLismFixedLayoutProps & Omit<FlowLayoutProps, 'layout'>;
 

package/packages/astro/{FluidCols → layout/FluidCols}/FluidCols.astro

@@ -1,8 +1,8 @@
 ---
 import type { HTMLTag, Polymorphic } from 'astro/types';
-import type { AstroLismFixedLayoutProps } from '../types';
+import type { AstroLismFixedLayoutProps } from '../../types';
 import type { FluidColsProps } from 'lism-css/lib/types/LayoutProps';
-import { Lism } from '../Lism';
+import { Lism } from '../../Lism';
 
 type Props<Tag extends HTMLTag = 'div'> = Polymorphic<{ as: Tag }> & AstroLismFixedLayoutProps & Omit<FluidColsProps, 'layout'>;
 

package/packages/astro/{Frame → layout/Frame}/Frame.astro

@@ -1,7 +1,7 @@
 ---
 import type { HTMLTag, Polymorphic } from 'astro/types';
-import type { AstroLismFixedLayoutProps } from '../types';
-import { Lism } from '../Lism';
+import type { AstroLismFixedLayoutProps } from '../../types';
+import { Lism } from '../../Lism';
 
 type Props<Tag extends HTMLTag = 'div'> = Polymorphic<{ as: Tag }> & AstroLismFixedLayoutProps;
 

package/packages/astro/{Grid → layout/Grid}/Grid.astro

@@ -1,7 +1,7 @@
 ---
 import type { HTMLTag, Polymorphic } from 'astro/types';
-import type { AstroLismFixedLayoutProps } from '../types';
-import { Lism } from '../Lism';
+import type { AstroLismFixedLayoutProps } from '../../types';
+import { Lism } from '../../Lism';
 
 type Props<Tag extends HTMLTag = 'div'> = Polymorphic<{ as: Tag }> & AstroLismFixedLayoutProps;
 

package/packages/astro/{SideMain → layout/SideMain}/SideMain.astro

@@ -1,8 +1,8 @@
 ---
 import type { HTMLTag, Polymorphic } from 'astro/types';
-import type { AstroLismFixedLayoutProps } from '../types';
+import type { AstroLismFixedLayoutProps } from '../../types';
 import type { SideMainProps } from 'lism-css/lib/types/LayoutProps';
-import { Lism } from '../Lism';
+import { Lism } from '../../Lism';
 
 type Props<Tag extends HTMLTag = 'div'> = Polymorphic<{ as: Tag }> & AstroLismFixedLayoutProps & Omit<SideMainProps, 'layout'>;
 

package/packages/astro/{Stack → layout/Stack}/Stack.astro

@@ -1,7 +1,7 @@
 ---
 import type { HTMLTag, Polymorphic } from 'astro/types';
-import type { AstroLismFixedLayoutProps } from '../types';
-import { Lism } from '../Lism';
+import type { AstroLismFixedLayoutProps } from '../../types';
+import { Lism } from '../../Lism';
 
 type Props<Tag extends HTMLTag = 'div'> = Polymorphic<{ as: Tag }> & AstroLismFixedLayoutProps;
 

package/packages/astro/{SwitchCols → layout/SwitchCols}/SwitchCols.astro

@@ -1,8 +1,8 @@
 ---
 import type { HTMLTag, Polymorphic } from 'astro/types';
-import type { AstroLismFixedLayoutProps } from '../types';
+import type { AstroLismFixedLayoutProps } from '../../types';
 import type { SwitchColsProps } from 'lism-css/lib/types/LayoutProps';
-import { Lism } from '../Lism';
+import { Lism } from '../../Lism';
 
 type Props<Tag extends HTMLTag = 'div'> = Polymorphic<{ as: Tag }> & AstroLismFixedLayoutProps & Omit<SwitchColsProps, 'layout'>;
 

package/packages/astro/layout/TileGrid/TileGrid.astro

@@ -0,0 +1,11 @@
+---
+import type { HTMLTag, Polymorphic } from 'astro/types';
+import type { AstroLismFixedLayoutProps } from '../../types';
+import { Lism } from '../../Lism';
+
+type Props<Tag extends HTMLTag = 'div'> = Polymorphic<{ as: Tag }> & AstroLismFixedLayoutProps;
+
+const props = Astro.props;
+---
+
+<Lism layout="tileGrid" {...props}><slot /></Lism>

package/packages/astro/layout/TileGrid/index.ts

@@ -0,0 +1 @@
+export { default as TileGrid } from './TileGrid.astro';

package/packages/astro/{Container → state/Container}/Container.astro

@@ -1,7 +1,7 @@
 ---
 import type { HTMLTag, Polymorphic } from 'astro/types';
-import type { AstroLismBaseProps } from '../types';
-import { Lism } from '../Lism';
+import type { AstroLismBaseProps } from '../../types';
+import { Lism } from '../../Lism';
 
 type Props<Tag extends HTMLTag = 'div'> = Polymorphic<{ as: Tag }> &
   AstroLismBaseProps & {

package/packages/astro/{Layer → state/Layer}/Layer.astro

@@ -1,7 +1,7 @@
 ---
 import type { HTMLTag, Polymorphic } from 'astro/types';
-import type { AstroLismBaseProps } from '../types';
-import { Lism } from '../Lism';
+import type { AstroLismBaseProps } from '../../types';
+import { Lism } from '../../Lism';
 
 type Props<Tag extends HTMLTag = 'div'> = Polymorphic<{ as: Tag }> & AstroLismBaseProps;
 

package/packages/astro/{LinkBox → state/LinkBox}/LinkBox.astro

@@ -1,7 +1,7 @@
 ---
 import type { HTMLTag, Polymorphic } from 'astro/types';
-import type { AstroLismBaseProps } from '../types';
-import { Lism } from '../Lism';
+import type { AstroLismBaseProps } from '../../types';
+import { Lism } from '../../Lism';
 
 type Props<Tag extends HTMLTag = 'a'> = Polymorphic<{ as: Tag }> & AstroLismBaseProps;
 

package/packages/astro/{Wrapper → state/Wrapper}/Wrapper.astro

@@ -1,8 +1,8 @@
 ---
 import type { HTMLTag, Polymorphic } from 'astro/types';
-import type { AstroLismBaseProps } from '../types';
+import type { AstroLismBaseProps } from '../../types';
 import type { LismProps } from 'lism-css/lib/getLismProps';
-import { Lism } from '../Lism';
+import { Lism } from '../../Lism';
 
 type Props<Tag extends HTMLTag = 'div'> = Polymorphic<{ as: Tag }> &
   AstroLismBaseProps & {

package/src/scss/_auto_output.scss

@@ -14,7 +14,7 @@ base_type:
 	    常に変数で管理されるようになるので、他の処理と絡ませることがしやすい。
 	    デメリット: *= は処理負荷が高い。また、途中のBPから使えるようにするにはCSS記述増える）
 
-	3 → BPクラスには変数使わないが、文字数省略のため baseのProp classだけ変数化して *= セレクタ使う
+	3 → BPクラスには変数使わないが、文字数省略のため baseのProperty Classだけ変数化して *= セレクタ使う
 */
 
 // マップから値を取得し、nullの場合はデフォルト値を返す

package/src/scss/_prop-config.scss

@@ -101,7 +101,12 @@ $props: (
     utilities: (
       'none': 'none',
       'block': 'block',
-      'in-flex': 'inline-flex',
+      'flex': 'flex',
+      'inline-flex': 'inline-flex',
+      'grid': 'grid',
+      'inline-grid': 'inline-grid',
+      'inline': 'inline',
+      'inline-block': 'inline-block',
     ),
     bp: 1,
   ),
@@ -290,7 +295,7 @@ $props: (
       'divider': 'var(--divider)',
       'inherit': 'inherit',
       'transparent': 'transparent',
-      'cc': 'currentColor',
+      'current': 'currentColor',
     ),
     isVar: 1,
   ),
@@ -332,8 +337,8 @@ $props: (
       'static': 'static',
       'fixed': 'fixed',
       'sticky': 'sticky',
-      'rel': 'relative',
-      'abs': 'absolute',
+      'relative': 'relative',
+      'absolute': 'absolute',
     ),
   ),
   'z': (
@@ -607,11 +612,11 @@ $props: (
     alwaysVar: 1,
     overwriteBaseVar: 1,
   ),
-  'g-x': (
+  'cg': (
     prop: 'column-gap',
     bp: 1,
   ),
-  'g-y': (
+  'rg': (
     prop: 'row-gap',
     bp: 1,
   ),
@@ -635,9 +640,9 @@ $props: (
   'fxd': (
     prop: 'flex-direction',
     utilities: (
-      'col': 'column',
-      'col-r': 'column-reverse',
-      'row-r': 'row-reverse',
+      'column': 'column',
+      'column-reverse': 'column-reverse',
+      'row-reverse': 'row-reverse',
     ),
     bp: 1,
   ),
@@ -666,13 +671,6 @@ $props: (
   ),
   'gt': (
     prop: 'grid-template',
-    utilities: (
-    ),
-    exUtility: (
-      'repeat': (
-        'grid-template': 'repeat(var(--rows,1), 1fr) / repeat(var(--cols,1), 1fr)',
-      ),
-    ),
     bp: 1,
   ),
   'gta': (
@@ -697,7 +695,7 @@ $props: (
     prop: 'grid-auto-flow',
     utilities: (
       'row': 'row',
-      'col': 'column',
+      'column': 'column',
     ),
     bp: 1,
   ),
@@ -729,8 +727,8 @@ $props: (
       'center': 'center',
       'end': 'end',
       'stretch': 'stretch',
-      'flex-s': 'flex-start',
-      'flex-e': 'flex-end',
+      'flex-start': 'flex-start',
+      'flex-end': 'flex-end',
     ),
     bp: 1,
   ),
@@ -740,8 +738,8 @@ $props: (
       'start': 'start',
       'center': 'center',
       'end': 'end',
-      'flex-s': 'flex-start',
-      'flex-e': 'flex-end',
+      'flex-start': 'flex-start',
+      'flex-end': 'flex-end',
       'between': 'space-between',
     ),
     bp: 1,
@@ -753,8 +751,8 @@ $props: (
       'center': 'center',
       'end': 'end',
       'stretch': 'stretch',
-      'flex-s': 'flex-start',
-      'flex-e': 'flex-end',
+      'flex-start': 'flex-start',
+      'flex-end': 'flex-end',
     ),
     bp: 1,
   ),
@@ -764,8 +762,8 @@ $props: (
       'start': 'start',
       'center': 'center',
       'end': 'end',
-      'flex-s': 'flex-start',
-      'flex-e': 'flex-end',
+      'flex-start': 'flex-start',
+      'flex-end': 'flex-end',
       'between': 'space-between',
     ),
     bp: 1,
@@ -823,7 +821,7 @@ $props: (
   'ovwrap': (
     prop: 'overflow-wrap',
     utilities: (
-      'any': 'anywhere',
+      'anywhere': 'anywhere',
     ),
   ),
   'whspace': (

package/src/scss/_with_layer.scss

@@ -22,10 +22,10 @@
   }
 }
 
-@layer lism-utility {
-  @include meta.load-css('utility');
+/* stylelint-disable-next-line block-no-empty -- ユーザーの独自分類クラス用レイヤー */
+@layer lism-custom {
 }
 
-/* stylelint-disable-next-line block-no-empty -- ユーザーカスタム用レイヤー */
-@layer lism-custom {
+@layer lism-utility {
+  @include meta.load-css('utility');
 }

package/src/scss/base/_html.scss

@@ -68,12 +68,6 @@ sub {
   font-size: 80%;
 }
 
-legend,
-caption,
-figcaption {
-  font-size: var(--fz--s);
-}
-
 code,
 kbd,
 var,
@@ -86,6 +80,12 @@ blockquote {
   padding: var(--s30);
 }
 
+legend,
+caption,
+figcaption {
+  font-size: var(--fz--s);
+}
+
 hr {
   border: none;
   block-size: 0;
@@ -95,11 +95,11 @@ hr {
 /* --------------------------------------------------
   list
 -------------------------------------------------- */
-// classを持たない、もしくは Prop Classしかない(≒ Prop Class で始まる) リスト要素はブラウザ標準のスタイルを復活させる。
+// classを持たない、もしくは Property Classしかない(≒ Property Class で始まる) リスト要素はブラウザ標準のスタイルを復活させる。
 :is(ul, ol):where(:not([class])),
 :is(ul, ol):where([class^='-']) {
   list-style: revert;
-  padding-inline-start: var(--s30);
+  padding-inline-start: var(--list-px-s, var(--s30));
 }
 
 dt {

package/src/scss/base/tokens/_tokens.scss

@@ -72,12 +72,10 @@
   /** 
    * border-radius
    */
-  --bdrs--5: 2px;
   --bdrs--10: 0.25rem; // ≒ 4px
   --bdrs--20: 0.5rem; // ≒ 8px
   --bdrs--30: 1rem; // ≒ 16px
   --bdrs--40: 1.5rem; // ≒ 24px
-  // --bdrs--50: 2rem; // ≒ 32px
   --bdrs--99: 99rem;
 
   /** 

package/src/scss/modules/layout/_grid.scss

@@ -1,10 +1,5 @@
 .l--grid {
-  --gtr: none;
-  --gtc: none;
-  --gta: none;
   display: grid;
-  grid-template: var(--gtr) / var(--gtc);
-  grid-template-areas: var(--gta);
 
   > * {
     min-width: 0;

package/src/scss/modules/layout/_tileGrid.scss

@@ -0,0 +1,4 @@
+.l--tileGrid {
+  display: grid;
+  grid-template: repeat(var(--rows, 1), minmax(0, 1fr)) / repeat(var(--cols, 1), minmax(0, 1fr));
+}

package/src/scss/modules/layout/index.scss

@@ -9,4 +9,5 @@
 @forward './columns';
 @forward './sideMain';
 @forward './switchCols';
+@forward './tileGrid';
 @forward './frame';

package/src/scss/props/index.scss

@@ -9,5 +9,5 @@
 // 自動生成
 @forward '../auto_output';
 
-// Prop Classの最後で読み込む
+// Property Classの最後で読み込む
 @forward './hover';

package/src/scss/utility/_cbox.scss

@@ -1,5 +1,5 @@
 /*
-  Note: Prop Class より優先度が下で定義すること
+  Note: Property Class より優先度が下で定義すること
   Memo: bgcの mix は transparent ではなく --base と混ぜている → 背景メディアがあるときも可読性が落ちないように + chat のように同じ背景色の装飾が一部重なっていても大丈夫なように。
 */
 .u--cbox {

package/src/scss/utility/_clipText.scss

@@ -1,5 +1,5 @@
 .u--clipText {
-  // Memo: Prop Class(s.-bg:`, `.-c:`) に負けないように important つけている
+  // Memo: Property Class(s.-bg:`, `.-c:`) に負けないように important つけている
   background-clip: text !important;
   color: transparent !important;
 }

package/config/helper/getSvgUrl.ts

@@ -1,26 +0,0 @@
-/**
- * svgをcssの image url に変換
- */
-const getSvgUrl = (svg: string, encode = '') => {
-  if (!svg) return '';
-
-  // minify化
-  // svg = minifyHtml(svg);
-
-  if ('base64' === encode) {
-    // memo: btoa() だけだとマルチバイト文字が入った時にエラーになる。
-    // encodeURIComponent() でそれを回避できるがそれだとSVGとして描画できず、 unescape() と組み合わせることで期待する動作になった。 see: https://www.softel.co.jp/blogs/tech/archives/4133
-    // svg = window.btoa(unescape(encodeURIComponent(svg)));
-
-    // memo: Buffer 使えば非推奨な関数を使わなくてもいい see: https://hackersheet.com/naopoyo/sheets/bvtrkwt
-    svg = Buffer.from(svg).toString('base64');
-    return `url(data:image/svg+xml;base64,${svg})`;
-  }
-
-  // シングルクォートをダブルクォートに変換
-  svg = svg.replace(/'/g, '"');
-  // カラーコードの先頭の # → %23 に置換
-  svg = svg.replace(/="#/g, '="%23');
-  return `url('data:image/svg+xml,${svg}')`;
-};
-export default getSvgUrl;

package/dist/components/HTML/HTML.d.ts

@@ -1,26 +0,0 @@
-import { LismComponentProps } from '../Lism';
-/** @deprecated Group を使用してください */
-export declare function div(props: LismComponentProps<'div'>): import("react").JSX.Element;
-/** @deprecated Text を使用してください */
-export declare function p(props: LismComponentProps<'p'>): import("react").JSX.Element;
-/** @deprecated Inline を使用してください */
-export declare function span(props: LismComponentProps<'span'>): import("react").JSX.Element;
-/** @deprecated Link を使用してください */
-export declare function a(props: LismComponentProps<'a'>): import("react").JSX.Element;
-type HeadingLevel = '1' | '2' | '3' | '4' | '5' | '6';
-type HeadingProps = LismComponentProps<'h1'> & {
-    lv?: HeadingLevel;
-};
-/** @deprecated Heading を使用してください */
-export declare function h({ lv, ...props }: HeadingProps): import("react").JSX.Element;
-/** @deprecated Media を使用してください */
-export declare function img(props: LismComponentProps<'img'>): import("react").JSX.Element;
-/** @deprecated List を使用してください */
-export declare function ul(props: LismComponentProps<'ul'>): import("react").JSX.Element;
-/** @deprecated List as="ol" を使用してください */
-export declare function ol(props: LismComponentProps<'ol'>): import("react").JSX.Element;
-/** @deprecated ListItem を使用してください */
-export declare function li(props: LismComponentProps<'li'>): import("react").JSX.Element;
-/** @deprecated Lism as="button" を使用してください */
-export declare function button(props: LismComponentProps<'button'>): import("react").JSX.Element;
-export {};