amotify 0.2.21 → 0.2.23

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 (68) hide show
  1. package/demo/esbuild/public/index.css +1 -1
  2. package/demo/esbuild/public/index.js +89 -89
  3. package/dist/@declares/property.d.ts +26 -23
  4. package/dist/@styles/style.css +1 -1
  5. package/dist/@styles/var.css +1 -1
  6. package/dist/@utils/GenerateClassName.js +1 -1
  7. package/dist/atoms/FAI.js +1 -1
  8. package/dist/atoms/Flex.js +1 -1
  9. package/dist/atoms/Grid.js +1 -1
  10. package/dist/atoms/Logo.js +4 -4
  11. package/dist/atoms/Placeholder.js +1 -1
  12. package/dist/fn/Button.d.ts +1 -1
  13. package/dist/fn/Button.js +1 -1
  14. package/dist/fn/Cropper.js +1 -1
  15. package/dist/fn/Effect/Fade.js +1 -1
  16. package/dist/fn/Input/AutoHeightText.js +1 -1
  17. package/dist/fn/Input/Chips/Selector.js +1 -1
  18. package/dist/fn/Input/Chips/index.js +1 -1
  19. package/dist/fn/Input/Contenteditable.js +1 -1
  20. package/dist/fn/Input/DigitCharacters.d.ts +1 -1
  21. package/dist/fn/Input/DigitCharacters.js +1 -1
  22. package/dist/fn/Input/Filer.js +1 -1
  23. package/dist/fn/Input/List.d.ts +3 -3
  24. package/dist/fn/Input/List.js +1 -1
  25. package/dist/fn/Input/Parts.js +1 -1
  26. package/dist/fn/Input/RichSelect.d.ts +3 -3
  27. package/dist/fn/Input/RichSelect.js +1 -1
  28. package/dist/fn/Input/Search.js +1 -1
  29. package/dist/fn/Input/Segmented.js +1 -1
  30. package/dist/fn/Input/Select.d.ts +1 -1
  31. package/dist/fn/Input/Select.js +1 -1
  32. package/dist/fn/Input/Slider.js +1 -1
  33. package/dist/fn/Input/Switch.js +1 -1
  34. package/dist/fn/Input/Text.js +1 -1
  35. package/dist/fn/Input/TextArea.js +1 -1
  36. package/dist/fn/Input/Time/Picker.js +1 -1
  37. package/dist/fn/Input/Time/index.js +1 -1
  38. package/dist/fn/Input/core.d.ts +3 -3
  39. package/dist/fn/Input/core.js +1 -1
  40. package/dist/fn/Input/index.d.ts +1 -1
  41. package/dist/fn/Loader/corner.js +1 -1
  42. package/dist/fn/Loader/mini.js +1 -1
  43. package/dist/fn/PageNotFound.js +1 -1
  44. package/dist/fn/Plate.js +1 -1
  45. package/dist/fn/RootViewController.d.ts +2 -4
  46. package/dist/fn/RootViewController.js +1 -1
  47. package/dist/fn/Sheet.js +1 -1
  48. package/dist/fn/Snackbar.js +1 -1
  49. package/dist/fn/SwipeView.js +1 -1
  50. package/dist/fn/TabBar.js +1 -1
  51. package/dist/fn/Table/Data.d.ts +2 -2
  52. package/dist/fn/Table/Data.js +1 -1
  53. package/dist/fn/Table/Drag.js +1 -1
  54. package/dist/fn/Table/Normal.js +1 -1
  55. package/dist/fn/Table/Parts.js +1 -1
  56. package/dist/fn/Table/Wrapper.js +1 -1
  57. package/dist/fn/Table/cellStyling.d.ts +1 -6
  58. package/dist/fn/Table/cellStyling.js +1 -1
  59. package/dist/fn/Table/index.d.ts +2 -2
  60. package/dist/fn/Tooltips.js +1 -1
  61. package/dist/mols/Accordion.js +1 -1
  62. package/dist/mols/Column.js +1 -1
  63. package/dist/mols/List.d.ts +1 -1
  64. package/dist/mols/List.js +1 -1
  65. package/dist/mols/Row.js +1 -1
  66. package/dist/mols/Text.js +1 -1
  67. package/dist/temps/designBook.js +20 -20
  68. package/package.json +2 -2
@@ -1,9 +1,4 @@
1
1
  import { TagProperty } from '../../@declares';
2
2
  import { TableTypes } from '.';
3
3
  export declare const DefaultCellStyles: (type: TableTypes.Types, tone: TableTypes.Tones) => TagProperty.States;
4
- export declare const DefaultCellSystemStyles: (args: {
5
- top: boolean;
6
- bottom: boolean;
7
- left: boolean;
8
- right: boolean;
9
- }) => TagProperty.States;
4
+ export declare const DefaultCellSystemStyles: (args: TableTypes.StylesCallbackInput) => TagProperty.Properties;
@@ -1 +1 @@
1
- import{b as o}from"../../chunk-C5N2D3ZX.js";const a=(t,e)=>{if(e=="plain")return{};let r={};return t=="drag"&&(r.padding=1),["border","rowBorder","cellBorder"].includes(e)&&(r.borderBottom="2.normal"),["border","cellBorder"].includes(e)&&(r.borderRight="2.normal"),o({padding:"3/4",backgroundColor:"layer.1",transition:"short",textAlign:"center"},r)},b=t=>{let e={};return t.right&&(e.borderRight="unset"),t.top&&(t.left&&(e.borderTopLeftRadius="inherit"),t.right&&(e.borderTopRightRadius="inherit")),t.bottom&&(e.borderBottom="unset",t.left&&(e.borderBottomLeftRadius="inherit"),t.right&&(e.borderBottomRightRadius="inherit")),e};export{a as DefaultCellStyles,b as DefaultCellSystemStyles};
1
+ import{b as o}from"../../chunk-C5N2D3ZX.js";const p=(r,e)=>{if(e=="plain")return{};let t={};return r=="drag"&&(t.padding=1),["border","rowBorder","cellBorder"].includes(e)&&(t.borderBottom="2.normal"),["border","cellBorder"].includes(e)&&(t.borderRight="2.normal"),o({padding:"3/4",backgroundColor:"layer.1",transition:"short",textAlign:"center"},t)},s=r=>{let e={};return r.right&&(e.borderRight="unset"),r.top&&(r.left&&(e.borderTopLeftRadius="inherit"),r.right&&(e.borderTopRightRadius="inherit")),r.bottom&&(e.borderBottom="unset",r.left&&(e.borderBottomLeftRadius="inherit"),r.right&&(e.borderBottomRightRadius="inherit")),e};export{p as DefaultCellStyles,s as DefaultCellSystemStyles};
@@ -18,10 +18,10 @@ export declare namespace TableTypes {
18
18
  tableID?: string;
19
19
  tone?: Tones;
20
20
  colLength: number;
21
- cellStyles?: TagProperty.States;
21
+ cellStyles?: TagProperty.PropsNFreeCSS;
22
22
  cellClassName?: string;
23
23
  cellStylesCallback?: {
24
- (p: StylesCallbackInput): TagProperty.States;
24
+ (p: StylesCallbackInput): TagProperty.PropsNFreeCSS;
25
25
  };
26
26
  className?: string;
27
27
  } & TagProperty.States;
@@ -1 +1 @@
1
- import{b as e,c as n,d as p}from"../chunk-C5N2D3ZX.js";import{jsx as c}from"react/jsx-runtime";import i from"@mingoo/jsmin";import d from"../atoms/Box";import t from"./Sheet";const l={__memoryID:i.uuid.gen(),open:o=>{let s=o,{tipsID:a=i.uuid.gen(),tipsGroups:u=[]}=s,r=p(s,["tipsID","tipsGroups"]);t.open(n(e({sheetID:a,sheetGroups:["tooltips",...u]},r),{type:"custom",close_option:e({aroundClick:!0,parentBlur:!0,escapeKeyDown:!0,pageTransit:!0},r.close_option)}))},close:o=>{o&&t.close(o)},closeALL:()=>{t.closeGroup("tooltips")},Comps:{Body:o=>c(d,e({padding:"1/2",backgroundColor:"dark",borderRadius:"2.tone.secondary",fontColor:"white",boxShadow:"0.normal"},o))}};export{l as Tooltips,l as default};
1
+ import{b as e,c as t,d as p}from"../chunk-C5N2D3ZX.js";import{jsx as c}from"react/jsx-runtime";import i from"@mingoo/jsmin";import d from"../atoms/Box";import s from"./Sheet";const l={__memoryID:i.uuid.gen(),open:o=>{let n=o,{tipsID:a=i.uuid.gen(),tipsGroups:u=[]}=n,r=p(n,["tipsID","tipsGroups"]);s.open(t(e({sheetID:a,sheetGroups:["tooltips",...u]},r),{type:"custom",close_option:e({aroundClick:!0,parentBlur:!0,escapeKeyDown:!0,pageTransit:!0},r.close_option)}))},close:o=>{o&&s.close(o)},closeALL:()=>{s.closeGroup("tooltips")},Comps:{Body:o=>c(d,t(e({},o),{styles:e({padding:"1/2",backgroundColor:"dark",borderRadius:"2.tone.secondary",fontColor:"white",boxShadow:"0.normal"},o.styles)}))}};export{l as Tooltips,l as default};
@@ -1 +1 @@
1
- import{b as g,d as H}from"../chunk-C5N2D3ZX.js";import{jsx as D}from"react/jsx-runtime";import{useState as m,useEffect as w,useRef as R}from"react";import c from"@mingoo/jsmin";import{$$fromRoot as r,useStore as l}from"../@utils";import{Box as A}from"../atoms/Box";import{AccordionClasses as I}from"../@styles/componentClasses";const _=o=>{o=g({},o);let v=o,{accordionID:t="",slideAnimation:x="fast",defaultOpen:f=!1,override:y=!1}=v,C=H(v,["accordionID","slideAnimation","defaultOpen","override"]),[d]=m(c.uuid.gen()),[p]=m(c.uuid.gen()),[s,a]=m(f);s!=f&&y&&a(f);const h=R(!1);return w(()=>{let n=r('[data-accordion-content-id="'+p+'"]')[0];if(n){let i=n.offsetHeight,e=0;x=="fast"?(e=i/1e3,e=Math.max(e,.2)):x=="slow"&&(e=i/300),r("#"+d).css({transition:e+"s"})}},[]),w(()=>{let n=r("#"+d),i=r('[data-accordion-content-id="'+p+'"]')[0];if(h.current){if(i){let e=i.offsetHeight;c.is.exist(e)&&(s?n.css({maxHeight:e+1+"px"}).await(200).css({maxHeight:"unset",overflow:o.overflow||"unset"}):n.css({maxHeight:e+1+"px"}).await(100).css({maxHeight:"0px",overflow:"hidden"}))}}else if(h.current=!0,i){let e=i.offsetHeight;c.is.exist(e)&&(s?n.css({maxHeight:e+1+"px"}).await(200).css({maxHeight:"unset",overflow:o.overflow||"unset"}):n.css({maxHeight:"0px",overflow:"hidden"}))}},[s]),t&&l.set({["Accordion-"+t]:{open:()=>{a(!0)},close:()=>{a(!1)},toggle:()=>{a(!s)}}}),D(A,{className:[I("Wrap"),I("Open_"+s)].join(" "),id:d,children:D(A,g({"data-accordion-content-id":p},C))})},u=_;u.fn={open:o=>{let t=l.get("Accordion-"+o);!t||t.open()},close:o=>{let t=l.get("Accordion-"+o);!t||t.close()},toggle:o=>{let t=l.get("Accordion-"+o);!t||t.toggle()}};export{u as Accordion,u as default};
1
+ import{b as p,d as A}from"../chunk-C5N2D3ZX.js";import{jsx as C}from"react/jsx-runtime";import{useState as u,useEffect as I,useRef as E}from"react";import r from"@mingoo/jsmin";import{$$fromRoot as l,useStore as f}from"../@utils";import{Box as y}from"../atoms/Box";import{AccordionClasses as D}from"../@styles/componentClasses";const F=e=>{e=p({},e);let H=e,{accordionID:o="",slideAnimation:h="fast",defaultOpen:d=!1,override:R=!1}=H,_=A(H,["accordionID","slideAnimation","defaultOpen","override"]),[g]=u(r.uuid.gen()),[m]=u(r.uuid.gen()),[s,c]=u(d);s!=d&&R&&c(d);const v=E(!1);return I(()=>{let n=l('[data-accordion-content-id="'+m+'"]')[0];if(n){let i=n.offsetHeight,t=0;h=="fast"?(t=i/1e3,t=Math.max(t,.2)):h=="slow"&&(t=i/300),l("#"+g).css({transition:t+"s"})}},[]),I(()=>{var t,w;let n=l("#"+g),i=l('[data-accordion-content-id="'+m+'"]')[0];if(v.current){if(i){let a=i.offsetHeight;r.is.exist(a)&&(s?n.css({maxHeight:a+1+"px"}).await(200).css({maxHeight:"unset",overflow:((t=e==null?void 0:e.styles)==null?void 0:t.overflow)||"unset"}):n.css({maxHeight:a+1+"px"}).await(100).css({maxHeight:"0px",overflow:"hidden"}))}}else if(v.current=!0,i){let a=i.offsetHeight;r.is.exist(a)&&(s?n.css({maxHeight:a+1+"px"}).await(200).css({maxHeight:"unset",overflow:((w=e==null?void 0:e.styles)==null?void 0:w.overflow)||"unset"}):n.css({maxHeight:"0px",overflow:"hidden"}))}},[s]),o&&f.set({["Accordion-"+o]:{open:()=>{c(!0)},close:()=>{c(!1)},toggle:()=>{c(!s)}}}),C(y,{className:[D("Wrap"),D("Open_"+s)].join(" "),id:g,children:C(y,p({"data-accordion-content-id":m},_))})},x=F;x.fn={open:e=>{let o=f.get("Accordion-"+e);!o||o.open()},close:e=>{let o=f.get("Accordion-"+e);!o||o.close()},toggle:e=>{let o=f.get("Accordion-"+e);!o||o.toggle()}};export{x as Accordion,x as default};
@@ -1 +1 @@
1
- import{b as p}from"../chunk-C5N2D3ZX.js";import{jsx as t}from"react/jsx-runtime";import{Flex as l}from"../atoms/Flex";const e=o=>t(l,p({flexType:"col",gap:1},o));export{e as Column,e as default};
1
+ import{b as e,c as t}from"../chunk-C5N2D3ZX.js";import{jsx as n}from"react/jsx-runtime";import{Flex as p}from"../atoms/Flex";const o=l=>n(p,t(e({},l),{styles:e({flexType:"col",gap:1},l.styles)}));export{o as Column,o as default};
@@ -3,7 +3,7 @@ import React from 'react';
3
3
  import { Flex } from '../atoms/Flex';
4
4
  declare namespace List {
5
5
  type Input = TagProperty.BasicElement & {
6
- rowStyles?: TagProperty.BasicElement;
6
+ rowStyles?: TagProperty.PropsNFreeCSS;
7
7
  rows: Flex.Input[];
8
8
  };
9
9
  }
package/dist/mols/List.js CHANGED
@@ -1 +1 @@
1
- import{b as e,c as t,d as r}from"../chunk-C5N2D3ZX.js";import{jsx as a}from"react/jsx-runtime";import{Flex as p}from"../atoms/Flex";const s=n=>{let o=n,{rows:i,rowStyles:y}=o,c=r(o,["rows","rowStyles"]),m=i.map((f,u)=>{let l=f,{children:w}=l,h=r(l,["children"]);return a(p,t(e(e({},y),h),{children:w}),u)});return a(p,t(e({},c),{flexType:"col",children:m}))};export{s as List,s as default};
1
+ import{b as e,c as o,d as s}from"../chunk-C5N2D3ZX.js";import{jsx as S}from"react/jsx-runtime";import{Flex as a}from"../atoms/Flex";const n=i=>{let p=i,{rows:m,rowStyles:r}=p,l=s(p,["rows","rowStyles"]),c=m.map((f,x)=>{let y=f,{children:C}=y,t=s(y,["children"]);return S(a,o(e({},t),{styles:e(e({},r),t.styles),freeCSS:e(e({},r==null?void 0:r.freeCSS),t.freeCSS),children:C}),x)});return S(a,o(e({},l),{styles:e({flexType:"col"},l.styles),children:c}))};export{n as List,n as default};
package/dist/mols/Row.js CHANGED
@@ -1 +1 @@
1
- import{b as t}from"../chunk-C5N2D3ZX.js";import{jsx as a}from"react/jsx-runtime";import{Flex as l}from"../atoms/Flex";const n={Center:e=>a(l,t({horizontalAlign:"center",verticalAlign:"center",flexWrap:!1,gap:1},e)),Left:e=>a(l,t({horizontalAlign:"left",verticalAlign:"center",flexWrap:!1,gap:1},e)),Right:e=>a(l,t({horizontalAlign:"right",verticalAlign:"center",flexWrap:!1,gap:1},e)),Separate:e=>a(l,t({horizontalAlign:"between",verticalAlign:"center",flexWrap:!1,gap:1},e))};export{n as Row,n as default};
1
+ import{b as t,c as l}from"../chunk-C5N2D3ZX.js";import{jsx as n}from"react/jsx-runtime";import{Flex as a}from"../atoms/Flex";const r={Center:e=>n(a,l(t({},e),{styles:t({horizontalAlign:"center",verticalAlign:"center",flexWrap:!1,gap:1},e.styles)})),Left:e=>n(a,l(t({},e),{styles:t({horizontalAlign:"left",verticalAlign:"center",flexWrap:!1,gap:1},e.styles)})),Right:e=>n(a,l(t({},e),{styles:t({horizontalAlign:"right",verticalAlign:"center",flexWrap:!1,gap:1},e.styles)})),Separate:e=>n(a,l(t({},e),{styles:t({horizontalAlign:"between",verticalAlign:"center",flexWrap:!1,gap:1},e.styles)}))};export{r as Row,r as default};
package/dist/mols/Text.js CHANGED
@@ -1 +1 @@
1
- import{b as e,c as n}from"../chunk-C5N2D3ZX.js";import{jsx as o}from"react/jsx-runtime";import{Box as p}from"../atoms/Box";import{Span as i}from"../atoms/Span";const a={Title:t=>o(p,e({fontSize:"6.title",fontWeight:"3.semiBold"},t)),SubTitle:t=>o(p,e({fontSize:"5.subTitle",fontWeight:"3.semiBold"},t)),ThirdTitle:t=>o(p,e({fontSize:"4.thirdTitle",fontWeight:"3.semiBold"},t)),Paragraph:t=>o(p,e({fontSize:"3.paragraph",fontWeight:"3.semiBold"},t)),Normal:t=>o(p,e({},t)),Description:t=>o(p,n(e({},t),{freeCSS:e({whiteSpace:"pre-wrap"},t.freeCSS)})),Supplement:t=>o(p,e({fontSize:"1.mini"},t)),NowrapSpan:t=>o(i,n(e({},t),{freeCSS:e({whiteSpace:"nowrap"},t.freeCSS)}))};export{a as Text,a as default};
1
+ import{b as e,c as o}from"../chunk-C5N2D3ZX.js";import{jsx as n}from"react/jsx-runtime";import{Box as p}from"../atoms/Box";import{Span as i}from"../atoms/Span";const a={Title:t=>n(p,o(e({},t),{styles:e({fontSize:"6.title",fontWeight:"3.semiBold"},t.styles)})),SubTitle:t=>n(p,o(e({},t),{styles:e({fontSize:"5.subTitle",fontWeight:"3.semiBold"},t.styles)})),ThirdTitle:t=>n(p,o(e({},t),{styles:e({fontSize:"4.thirdTitle",fontWeight:"3.semiBold"},t.styles)})),Paragraph:t=>n(p,o(e({},t),{styles:e({fontSize:"3.paragraph",fontWeight:"3.semiBold"},t.styles)})),Normal:t=>n(p,e({},t)),Description:t=>n(p,o(e({},t),{freeCSS:e({whiteSpace:"pre-wrap"},t.freeCSS)})),Supplement:t=>n(p,o(e({},t),{styles:e({fontSize:"1.mini"},t.styles)})),NowrapSpan:t=>n(i,o(e({},t),{freeCSS:e({whiteSpace:"nowrap"},t.freeCSS)}))};export{a as Text,a as default};
@@ -1,14 +1,14 @@
1
- import{b as E,c as M,e as A}from"../chunk-C5N2D3ZX.js";import{Fragment as u,jsx as e,jsxs as t}from"react/jsx-runtime";import{useState as D,useEffect as N}from"react";import S from"@mingoo/jsmin";import{Config as R,ThemeColors as Y}from"../@utils";import{Box as o,Span as J,Grid as p,Flex as h,FAI as c,Img as w,Logo as a,Placeholder as K}from"../atoms";import{List as y,LinkifyText as j,Accordion as H,Row as B,Column as x,Text as l}from"../mols";import{PageViewController as X,SwipeView as $,TabBar as Q,Plate as _,Table as C,Input as d,Button as r,Sheet as b,Snackbar as G,Tooltips as k,Loader as z,Effect as Z,Cropper as ee,RootViewController as oe}from"../fn";const v={index:()=>t(u,{children:[t(h,{gap:1,children:[e(o,{flexCenter:!0,children:e(K,{unitWidth:6,unitHeight:6,children:"Placeholder",isRounded:!0})}),t(p,{gridCols:3,gap:1,flexSizing:"auto",children:[e(o,{backgroundColor:"layer.1",padding:2}),e(o,{backgroundColor:"layer.2",padding:2}),e(o,{backgroundColor:"layer.3",padding:2}),e(o,{backgroundColor:"layer.4",padding:2}),e(o,{backgroundColor:"layer.5",padding:2}),e(o,{backgroundColor:"layer.6",padding:2})]}),t(p,{gridCols:3,gap:"1/2",flexSizing:"auto",ssCardBox:!0,children:[e(o,{flexCenter:!0,fontColor:"1.clear",children:"FontColor1"}),e(o,{flexCenter:!0,fontColor:"2.normal",children:"FontColor2"}),e(o,{flexCenter:!0,fontColor:"3.blur",children:"FontColor3"}),e(o,{flexCenter:!0,fontColor:"4.thin",children:"FontColor4"}),e(o,{flexCenter:!0,fontColor:"5.translucent",children:"FontColor5"})]})]}),e(v.Fonts,{}),e(v.Box,{}),e(v.Flex,{}),e(v.Grid,{}),e(v.Others,{})]}),Fonts:()=>t(o,{ssCardBox:!0,children:[e(l.SubTitle,{padding:1,borderBottom:!0,children:"Font"}),t(o,{overflow:"auto",padding:1,children:[e(l.Description,{padding:1,children:`<Box
1
+ import{b as I,c as N,e as G}from"../chunk-C5N2D3ZX.js";import{Fragment as u,jsx as e,jsxs as o}from"react/jsx-runtime";import{useState as D,useEffect as W}from"react";import b from"@mingoo/jsmin";import{Config as T,ThemeColors as Y}from"../@utils";import{Box as t,Span as J,Grid as p,Flex as g,FAI as x,Img as R,Logo as s,Placeholder as K}from"../atoms";import{List as z,LinkifyText as j,Accordion as V,Row as B,Column as c,Text as n}from"../mols";import{PageViewController as X,SwipeView as $,TabBar as Q,Plate as _,Table as C,Input as i,Button as r,Sheet as y,Snackbar as O,Tooltips as w,Loader as P,Effect as Z,Cropper as ee,RootViewController as te}from"../fn";const k={index:()=>o(u,{children:[o(g,{styles:{gap:1},children:[e(t,{styles:{flexCenter:!0},children:e(K,{styles:{unitWidth:6,unitHeight:6,isRounded:!0},children:"Placeholder"})}),o(p,{styles:{gridCols:3,gap:1,flexSizing:"auto"},children:[e(t,{styles:{backgroundColor:"layer.1",padding:2}}),e(t,{styles:{backgroundColor:"layer.2",padding:2}}),e(t,{styles:{backgroundColor:"layer.3",padding:2}}),e(t,{styles:{backgroundColor:"layer.4",padding:2}}),e(t,{styles:{backgroundColor:"layer.5",padding:2}}),e(t,{styles:{backgroundColor:"layer.6",padding:2}})]}),o(p,{styles:{gridCols:3,gap:"1/2",flexSizing:"auto",ssCardBox:!0},children:[e(t,{styles:{flexCenter:!0,fontColor:"1.clear"},children:"FontColor1"}),e(t,{styles:{flexCenter:!0,fontColor:"2.normal"},children:"FontColor2"}),e(t,{styles:{flexCenter:!0,fontColor:"3.blur"},children:"FontColor3"}),e(t,{styles:{flexCenter:!0,fontColor:"4.thin"},children:"FontColor4"}),e(t,{styles:{flexCenter:!0,fontColor:"5.translucent"},children:"FontColor5"})]})]}),e(k.Fonts,{}),e(k.Box,{}),e(k.Flex,{}),e(k.Grid,{}),e(k.Others,{})]}),Fonts:()=>o(t,{styles:{ssCardBox:!0},children:[e(n.SubTitle,{styles:{padding:1,borderBottom:!0},children:"Font"}),o(t,{styles:{overflow:"auto",padding:1},children:[e(n.Description,{styles:{padding:1},children:`<Box
2
2
  fontSize={ 0 ~ 8 }
3
3
  >
4
4
  some text
5
- </Box>`}),e(y,{rowStyles:{flexType:"col",borderBottom:!0,padding:1,flexWrap:!1,gap:"1/2"},rows:[{children:t(u,{children:["\u30FB Landing",t(o,{fontSize:"7.landing",isSemiBoldFont:!0,children:["Visualize Your ",e(J,{fontColor:"theme",children:"Colors"})," On a Real Website"]})]})},{children:t(u,{children:["\u30FB Title",e(o,{fontSize:"6.title",children:"\u4EE4\u548C\uFF14\u5E74\u5EA6\u306E\u56FD\u6C11\u8CA0\u62C5\u7387\u3092\u516C\u8868\u3057\u307E\u3059"})]})},{children:t(u,{children:["\u30FB SubTitle",e(o,{fontSize:"5.subTitle",children:"\u652F\u6255\u3044\u3092\u53D7\u3051\u4ED8\u3051\u308B"})]})},{children:t(u,{children:["\u30FB ThirdTitle",e(o,{fontSize:"4.thirdTitle",children:"\u79DF\u7A0E\u8CA0\u62C5\u7387\u3068\u793E\u4F1A\u4FDD\u969C\u8CA0\u62C5\u7387\u3092\u5408\u8A08\u3057\u305F\u56FD\u6C11\u8CA0\u62C5\u7387\u306B\u3064\u3044\u3066\u3001\u4EE4\u548C\uFF14\u5E74\u5EA6\u306E\u898B\u901A\u3057\u3092\u63A8\u8A08\u3057\u307E\u3057\u305F\u306E\u3067\u3001\u516C\u8868\u3057\u307E\u3059\u3002"})]})},{children:t(u,{children:["\u30FB Paragraph",e(l.Description,{fontSize:"3.paragraph",children:e(j,{text:`
5
+ </Box>`}),e(z,{rowStyles:{flexType:"col",borderBottom:!0,padding:1,flexWrap:!1,gap:"1/2"},rows:[{children:o(u,{children:["\u30FB Landing",o(t,{styles:{fontSize:"7.landing",isSemiBoldFont:!0},children:["Visualize Your ",e(J,{styles:{fontColor:"theme"},children:"Colors"})," On a Real Website"]})]})},{children:o(u,{children:["\u30FB Title",e(t,{styles:{fontSize:"6.title"},children:"\u4EE4\u548C\uFF14\u5E74\u5EA6\u306E\u56FD\u6C11\u8CA0\u62C5\u7387\u3092\u516C\u8868\u3057\u307E\u3059"})]})},{children:o(u,{children:["\u30FB SubTitle",e(t,{styles:{fontSize:"5.subTitle"},children:"\u652F\u6255\u3044\u3092\u53D7\u3051\u4ED8\u3051\u308B"})]})},{children:o(u,{children:["\u30FB ThirdTitle",e(t,{styles:{fontSize:"4.thirdTitle"},children:"\u79DF\u7A0E\u8CA0\u62C5\u7387\u3068\u793E\u4F1A\u4FDD\u969C\u8CA0\u62C5\u7387\u3092\u5408\u8A08\u3057\u305F\u56FD\u6C11\u8CA0\u62C5\u7387\u306B\u3064\u3044\u3066\u3001\u4EE4\u548C\uFF14\u5E74\u5EA6\u306E\u898B\u901A\u3057\u3092\u63A8\u8A08\u3057\u307E\u3057\u305F\u306E\u3067\u3001\u516C\u8868\u3057\u307E\u3059\u3002"})]})},{children:o(u,{children:["\u30FB Paragraph",e(n.Description,{styles:{fontSize:"3.paragraph"},children:e(j,{text:`
6
6
  This article discusses performance best practices for fonts.
7
- There are a variety of ways in which web fonts impact performance`})})]})},{children:t(u,{children:["\u30FB Normal",e(o,{fontSize:"2.normal",children:"\u52B9\u7387\u7684\u3067\u6301\u7D9A\u53EF\u80FD\u306A\u8CA1\u653F\u3078\u306E\u8EE2\u63DB\u3092\u56F3\u308A\u3001\u3053\u306E\u8CA1\u653F\u69CB\u9020\u3092\u5404\u822C\u306E\u69CB\u9020\u6539\u9769\u3068\u3068\u3082\u306B\u63A8\u9032\u3059\u308B\u3053\u3068\u3067\u3001\u6C11\u9593\u9700\u8981\u4E3B\u5C0E\u306E\u6301\u7D9A\u7684\u7D4C\u6E08\u6210\u9577\u306E\u5B9F\u73FE\u3092\u76EE\u6307\u3057\u307E\u3059\u3002 \u5C11\u5B50\u30FB\u9AD8\u9F62\u5316\u3001\u56FD\u969B\u5316\u306A\u3069\u7D4C\u6E08\u793E\u4F1A\u306E\u69CB\u9020\u5909\u5316\u306B\u5BFE\u5FDC\u3067\u304D\u308B21\u4E16\u7D00\u306E\u3042\u308B\u3079\u304D\u7A0E\u5236\u3092\u304D\u305A\u304D\u307E\u3059\u3002 \u8CA1\u653F\u6295\u878D\u8CC7\u306F\u3001\u884C\u8CA1\u653F\u6539\u9769\u306E\u8DA3\u65E8\u3092\u8E0F\u307E\u3048\u3001\u6C11\u9593\u3067\u306F\u3067\u304D\u306A\u3044\u5206\u91CE\u30FB\u4E8B\u696D\u306A\u3069\u306B\u91CD\u70B9\u5316\u3092\u884C\u3044\u3001\u771F\u306B\u653F\u7B56\u7684\u306B\u5FC5\u8981\u306A\u8CC7\u91D1\u9700\u8981\u306B\u306F\u7684\u78BA\u306B\u5BFE\u5FDC\u3057\u307E\u3059\u3002 \u91D1\u878D\u5E81\u3068\u5354\u529B\u3057\u3001\u91D1\u878D\u306E\u30BB\u30FC\u30D5\u30C6\u30A3\u30CD\u30C3\u30C8\u3092\u6574\u5099\u3057\u3001\u91D1\u878D\u5371\u6A5F\u306B\u7D20\u65E9\u304F\u5BFE\u5FDC\u3059\u308B\u306A\u3069\u3001\u91D1\u878D\u30B7\u30B9\u30C6\u30E0\u306E\u5B89\u5B9A\u306E\u78BA\u4FDD\u3092\u76EE\u6307\u3057\u307E\u3059\u3002 \u56FD\u969B\u7684\u306A\u5354\u529B\u7B49\u306B\u7A4D\u6975\u7684\u306B\u53D6\u308A\u7D44\u3080\u3053\u3068\u306B\u3088\u308A\u3001\u56FD\u969B\u901A\u8CA8\u30B7\u30B9\u30C6\u30E0\u306E\u5B89\u5B9A\u30FB\u56FD\u969B\u8CBF\u6613\u306E\u79E9\u5E8F\u3042\u308B\u767A\u5C55\u3092\u76EE\u6307\u3057\u307E\u3059\u3002"})]})},{children:t(u,{children:["\u30FB Mini",e(o,{fontSize:"1.mini",children:"Copyright \xA9 Ministry of Finance Japan. All Rights Reserved."})]})}]})]})]}),Box:()=>t(o,{ssCardBox:!0,children:[e(l.SubTitle,{padding:1,borderBottom:!0,children:"Box"}),e(o,{padding:1,overflow:"auto",children:e(C.Normal,{ssCardBox:!1,tone:"cellBorder",borderRadius:0,height:1,colLength:2,head:!1,rows:[[{children:e(l.Description,{children:`<Box>
7
+ There are a variety of ways in which web fonts impact performance`})})]})},{children:o(u,{children:["\u30FB Normal",e(t,{styles:{fontSize:"2.normal"},children:"\u52B9\u7387\u7684\u3067\u6301\u7D9A\u53EF\u80FD\u306A\u8CA1\u653F\u3078\u306E\u8EE2\u63DB\u3092\u56F3\u308A\u3001\u3053\u306E\u8CA1\u653F\u69CB\u9020\u3092\u5404\u822C\u306E\u69CB\u9020\u6539\u9769\u3068\u3068\u3082\u306B\u63A8\u9032\u3059\u308B\u3053\u3068\u3067\u3001\u6C11\u9593\u9700\u8981\u4E3B\u5C0E\u306E\u6301\u7D9A\u7684\u7D4C\u6E08\u6210\u9577\u306E\u5B9F\u73FE\u3092\u76EE\u6307\u3057\u307E\u3059\u3002 \u5C11\u5B50\u30FB\u9AD8\u9F62\u5316\u3001\u56FD\u969B\u5316\u306A\u3069\u7D4C\u6E08\u793E\u4F1A\u306E\u69CB\u9020\u5909\u5316\u306B\u5BFE\u5FDC\u3067\u304D\u308B21\u4E16\u7D00\u306E\u3042\u308B\u3079\u304D\u7A0E\u5236\u3092\u304D\u305A\u304D\u307E\u3059\u3002 \u8CA1\u653F\u6295\u878D\u8CC7\u306F\u3001\u884C\u8CA1\u653F\u6539\u9769\u306E\u8DA3\u65E8\u3092\u8E0F\u307E\u3048\u3001\u6C11\u9593\u3067\u306F\u3067\u304D\u306A\u3044\u5206\u91CE\u30FB\u4E8B\u696D\u306A\u3069\u306B\u91CD\u70B9\u5316\u3092\u884C\u3044\u3001\u771F\u306B\u653F\u7B56\u7684\u306B\u5FC5\u8981\u306A\u8CC7\u91D1\u9700\u8981\u306B\u306F\u7684\u78BA\u306B\u5BFE\u5FDC\u3057\u307E\u3059\u3002 \u91D1\u878D\u5E81\u3068\u5354\u529B\u3057\u3001\u91D1\u878D\u306E\u30BB\u30FC\u30D5\u30C6\u30A3\u30CD\u30C3\u30C8\u3092\u6574\u5099\u3057\u3001\u91D1\u878D\u5371\u6A5F\u306B\u7D20\u65E9\u304F\u5BFE\u5FDC\u3059\u308B\u306A\u3069\u3001\u91D1\u878D\u30B7\u30B9\u30C6\u30E0\u306E\u5B89\u5B9A\u306E\u78BA\u4FDD\u3092\u76EE\u6307\u3057\u307E\u3059\u3002 \u56FD\u969B\u7684\u306A\u5354\u529B\u7B49\u306B\u7A4D\u6975\u7684\u306B\u53D6\u308A\u7D44\u3080\u3053\u3068\u306B\u3088\u308A\u3001\u56FD\u969B\u901A\u8CA8\u30B7\u30B9\u30C6\u30E0\u306E\u5B89\u5B9A\u30FB\u56FD\u969B\u8CBF\u6613\u306E\u79E9\u5E8F\u3042\u308B\u767A\u5C55\u3092\u76EE\u6307\u3057\u307E\u3059\u3002"})]})},{children:o(u,{children:["\u30FB Mini",e(t,{styles:{fontSize:"1.mini"},children:"Copyright \xA9 Ministry of Finance Japan. All Rights Reserved."})]})}]})]})]}),Box:()=>o(t,{styles:{ssCardBox:!0},children:[e(n.SubTitle,{styles:{padding:1,borderBottom:!0},children:"Box"}),e(t,{styles:{padding:1,overflow:"auto"},children:e(C.Normal,{styles:{ssCardBox:!1,borderRadius:0,height:1},tone:"cellBorder",colLength:2,head:!1,rows:[[{children:e(n.Description,{children:`<Box>
8
8
  helloWorld!!
9
- </Box>`})},{children:e(o,{children:" helloWorld!! "})}],[{children:e(l.Description,{children:`<Box
9
+ </Box>`})},{children:e(t,{children:" helloWorld!! "})}],[{children:e(n.Description,{children:`<Box
10
10
  children={ 'helloWorld!!' }
11
- />`})},{children:e(o,{children:"helloWorld!!"})}],[{children:e(l.Description,{children:`<Box
11
+ />`})},{children:e(t,{children:"helloWorld!!"})}],[{children:e(n.Description,{children:`<Box
12
12
  fontColor={ '4.thin' }
13
13
  padding={ 1 }
14
14
  margin={ 1 }
@@ -17,29 +17,29 @@ borderRadius={ 2 }
17
17
  border={ 'normal' }
18
18
  children={ 'styleBox' }
19
19
  />
20
- `})},{children:e(o,{fontColor:"4.thin",padding:1,margin:1,textAlign:"center",borderRadius:2,border:!0,children:"styleBox"})}]]})})]}),Flex:()=>t(o,{ssCardBox:!0,children:[e(l.SubTitle,{padding:1,borderBottom:!0,children:"Flex"}),e(o,{padding:1,overflow:"auto",children:e(C.Normal,{ssCardBox:!1,colLength:2,tone:"cellBorder",borderRadius:0,height:1,head:!1,rows:[[{children:e(l.Description,{children:`<Flex flexType='row' gap={ 1 }>
20
+ `})},{children:e(t,{styles:{fontColor:"4.thin",padding:1,margin:1,textAlign:"center",borderRadius:2,border:!0},children:"styleBox"})}]]})})]}),Flex:()=>o(t,{styles:{ssCardBox:!0},children:[e(n.SubTitle,{styles:{padding:1,borderBottom:!0},children:"Flex"}),e(t,{styles:{padding:1,overflow:"auto"},children:e(C.Normal,{styles:{ssCardBox:!1,borderRadius:0,height:1},colLength:2,tone:"cellBorder",head:!1,rows:[[{children:e(n.Description,{children:`<Flex flexType='row' gap={ 1 }>
21
21
  <Box children={ 'FlexBox1' } />
22
22
  <Box children={ 'FlexBox2' } />
23
23
  <Box children={ 'FlexBox3' } />
24
- </Flex>`})},{children:t(h,{flexType:"row",gap:1,fontColor:"theme",children:[e(o,{padding:1,borderRadius:1,flexCenter:!0,children:"FlexBox1",backgroundColor:"theme.opa.low"}),e(o,{padding:1,borderRadius:1,flexCenter:!0,children:"FlexBox2",backgroundColor:"theme.opa.middle"}),e(o,{padding:1,borderRadius:1,flexCenter:!0,children:"FlexBox3",backgroundColor:"theme.opa.high"})]})}],[{children:e(l.Description,{textAlign:"left",children:`<Flex
24
+ </Flex>`})},{children:o(g,{styles:{flexType:"row",gap:1,fontColor:"theme"},children:[e(t,{styles:{padding:1,borderRadius:1,flexCenter:!0,backgroundColor:"theme.opa.low"},children:"FlexBox1"}),e(t,{styles:{padding:1,borderRadius:1,flexCenter:!0,backgroundColor:"theme.opa.middle"},children:"FlexBox2"}),e(t,{styles:{padding:1,borderRadius:1,flexCenter:!0,backgroundColor:"theme.opa.high"},children:"FlexBox3"})]})}],[{children:e(n.Description,{styles:{textAlign:"left"},children:`<Flex
25
25
  flexType='col'
26
26
  flexChilds={ 'auto' }
27
27
  >
28
28
  <Box />
29
29
  <Box />
30
30
  ...
31
- </Flex>`})},{children:t(u,{children:[t(h,{gap:1,flexCenter:!0,children:[e(o,{flexCenter:!0,unitWidth:3,unitHeight:3,isRounded:!0,boxShadow:"0.normal",backgroundColor:"theme.lightest"}),e(o,{flexCenter:!0,unitWidth:3,unitHeight:3,isRounded:!0,boxShadow:"0.normal",backgroundColor:"theme.lighter"}),e(o,{flexCenter:!0,unitWidth:3,unitHeight:3,isRounded:!0,boxShadow:"0.normal",backgroundColor:"theme.lighten"}),e(o,{flexCenter:!0,unitWidth:3,unitHeight:3,isRounded:!0,boxShadow:"0.normal",backgroundColor:"theme"}),e(o,{flexCenter:!0,unitWidth:3,unitHeight:3,isRounded:!0,boxShadow:"0.normal",backgroundColor:"theme.darken"}),e(o,{flexCenter:!0,unitWidth:3,unitHeight:3,isRounded:!0,boxShadow:"0.normal",backgroundColor:"theme.darker"}),e(o,{flexCenter:!0,unitWidth:3,unitHeight:3,isRounded:!0,boxShadow:"0.normal",backgroundColor:"theme.darkest"})]}),t(h,{gap:1,flexCenter:!0,children:[e(o,{flexCenter:!0,unitWidth:3,unitHeight:3,isRounded:!0,boxShadow:"0.normal",backgroundColor:"layer.1"}),e(o,{flexCenter:!0,unitWidth:3,unitHeight:3,isRounded:!0,boxShadow:"0.normal",backgroundColor:"layer.2"}),e(o,{flexCenter:!0,unitWidth:3,unitHeight:3,isRounded:!0,boxShadow:"0.normal",backgroundColor:"layer.3"}),e(o,{flexCenter:!0,unitWidth:3,unitHeight:3,isRounded:!0,boxShadow:"0.normal",backgroundColor:"layer.4"}),e(o,{flexCenter:!0,unitWidth:3,unitHeight:3,isRounded:!0,boxShadow:"0.normal",backgroundColor:"layer.5"}),e(o,{flexCenter:!0,unitWidth:3,unitHeight:3,isRounded:!0,boxShadow:"0.normal",backgroundColor:"layer.6"})]})]})}],[{children:e(l.Description,{children:`<Flex gap={ 1 }>
31
+ </Flex>`})},{children:o(u,{children:[o(g,{styles:{gap:1,flexCenter:!0},children:[e(t,{styles:{flexCenter:!0,ssSphere:3,boxShadow:"0.normal",backgroundColor:"theme.lightest"}}),e(t,{styles:{flexCenter:!0,ssSphere:3,boxShadow:"0.normal",backgroundColor:"theme.lighter"}}),e(t,{styles:{flexCenter:!0,ssSphere:3,boxShadow:"0.normal",backgroundColor:"theme.lighten"}}),e(t,{styles:{flexCenter:!0,ssSphere:3,boxShadow:"0.normal",backgroundColor:"theme"}}),e(t,{styles:{flexCenter:!0,ssSphere:3,boxShadow:"0.normal",backgroundColor:"theme.darken"}}),e(t,{styles:{flexCenter:!0,ssSphere:3,boxShadow:"0.normal",backgroundColor:"theme.darker"}}),e(t,{styles:{flexCenter:!0,ssSphere:3,boxShadow:"0.normal",backgroundColor:"theme.darkest"}})]}),o(g,{styles:{gap:1,flexCenter:!0},children:[e(t,{styles:{flexCenter:!0,ssSphere:3,boxShadow:"0.normal",backgroundColor:"layer.1"}}),e(t,{styles:{flexCenter:!0,ssSphere:3,boxShadow:"0.normal",backgroundColor:"layer.2"}}),e(t,{styles:{flexCenter:!0,ssSphere:3,boxShadow:"0.normal",backgroundColor:"layer.3"}}),e(t,{styles:{flexCenter:!0,ssSphere:3,boxShadow:"0.normal",backgroundColor:"layer.4"}}),e(t,{styles:{flexCenter:!0,ssSphere:3,boxShadow:"0.normal",backgroundColor:"layer.5"}}),e(t,{styles:{flexCenter:!0,ssSphere:3,boxShadow:"0.normal",backgroundColor:"layer.6"}})]})]})}],[{children:e(n.Description,{children:`<Flex gap={ 1 }>
32
32
  <Box flexGrid={ 2 } ... />
33
33
  <Box flexGrid={ 3 } ... />
34
34
  <Box flexGrid={ 4 } ... />
35
- </Flex>`})},{children:t(h,{gap:1,fontColor:"white",children:[e(o,{padding:1,flexCenter:!0,borderRadius:1,backgroundColor:"posi",flexGrid:2,children:"Box1"}),e(o,{padding:1,flexCenter:!0,borderRadius:1,backgroundColor:"nega",flexGrid:3,children:"Box2"}),e(o,{padding:1,flexCenter:!0,borderRadius:1,backgroundColor:"warn",flexGrid:4,children:"Box3"})]})}]]})})]}),Grid:()=>t(o,{ssCardBox:!0,children:[e(l.SubTitle,{padding:1,borderBottom:!0,children:"Grid"}),e(o,{padding:1,overflow:"auto",children:e(C.Normal,{ssCardBox:!1,colLength:2,tone:"cellBorder",height:1,backgroundColor:"nega",borderRadius:0,head:!1,rows:[[{children:e(l.Description,{children:`<Grid gridCols={ 3 } gap={ 1 }>
35
+ </Flex>`})},{children:o(g,{styles:{gap:1,fontColor:"white"},children:[e(t,{styles:{padding:1,flexCenter:!0,borderRadius:1,backgroundColor:"posi",flexGrid:2},children:"Box1"}),e(t,{styles:{padding:1,flexCenter:!0,borderRadius:1,backgroundColor:"nega",flexGrid:3},children:"Box2"}),e(t,{styles:{padding:1,flexCenter:!0,borderRadius:1,backgroundColor:"warn",flexGrid:4},children:"Box3"})]})}]]})})]}),Grid:()=>o(t,{styles:{ssCardBox:!0},children:[e(n.SubTitle,{styles:{padding:1,borderBottom:!0},children:"Grid"}),e(t,{style:{padding:1,overflow:"auto"},children:e(C.Normal,{styles:{ssCardBox:!1,height:1,backgroundColor:"nega",borderRadius:0},colLength:2,tone:"cellBorder",head:!1,rows:[[{children:e(n.Description,{children:`<Grid gridCols={ 3 } gap={ 1 }>
36
36
  <Box children={ 'GridBox1' } />
37
37
  <Box children={ 'GridBox2' } />
38
38
  <Box children={ 'GridBox3' } />
39
39
  <Box children={ 'GridBox4' } />
40
40
  <Box children={ 'GridBox5' } />
41
41
  <Box children={ 'GridBox6' } />
42
- </Grid>`})},{children:t(p,{gridCols:3,gap:1,children:[e(o,{border:!0,padding:1,backgroundColor:"layer.1",children:"GridBox1"}),e(o,{border:!0,padding:1,backgroundColor:"layer.2",children:"GridBox2"}),e(o,{border:!0,padding:1,backgroundColor:"layer.3",children:"GridBox3"}),e(o,{border:!0,padding:1,backgroundColor:"layer.4",children:"GridBox4"}),e(o,{border:!0,padding:1,backgroundColor:"layer.5",children:"GridBox5"}),e(o,{border:!0,padding:1,backgroundColor:"layer.6",children:"GridBox6"})]})}]]})})]}),Others:()=>t(o,{ssCardBox:!0,children:[e(l.SubTitle,{padding:1,borderBottom:!0,children:"Others"}),e(o,{padding:1,overflow:"auto",children:e(C.Normal,{ssCardBox:!1,colLength:2,tone:"cellBorder",height:1,borderRadius:0,head:!1,rows:[[{children:e(u,{children:e(l.Description,{children:`
42
+ </Grid>`})},{children:o(p,{styles:{gridCols:3,gap:1},children:[e(t,{styles:{border:!0,padding:1,backgroundColor:"layer.1"},children:"GridBox1"}),e(t,{styles:{border:!0,padding:1,backgroundColor:"layer.2"},children:"GridBox2"}),e(t,{styles:{border:!0,padding:1,backgroundColor:"layer.3"},children:"GridBox3"}),e(t,{styles:{border:!0,padding:1,backgroundColor:"layer.4"},children:"GridBox4"}),e(t,{styles:{border:!0,padding:1,backgroundColor:"layer.5"},children:"GridBox5"}),e(t,{styles:{border:!0,padding:1,backgroundColor:"layer.6"},children:"GridBox6"})]})}]]})})]}),Others:()=>o(t,{styles:{ssCardBox:!0},children:[e(n.SubTitle,{styles:{padding:1,borderBottom:!0},children:"Others"}),e(t,{styles:{padding:1,overflow:"auto"},children:e(C.Normal,{styles:{ssCardBox:!1,height:1,borderRadius:0},colLength:2,tone:"cellBorder",head:!1,rows:[[{children:e(u,{children:e(n.Description,{children:`
43
43
  <Button.Label
44
44
  htmlFor='testAccordion'
45
45
  type='sub'
@@ -53,27 +53,27 @@ children={
53
53
  in Accordion Element
54
54
  </>
55
55
  }
56
- />`})})},{children:t(u,{children:[e(r.Label.Sub.R,{children:"ToggleButton",onClick:()=>{H.fn.toggle("testAccordion")}}),e(H,{accordionID:"testAccordion",defaultOpen:!0,children:"in Accordion Element"})]})}],[{children:e(l.Description,{children:`
56
+ />`})})},{children:o(u,{children:[e(r.Label.Sub.R,{children:"ToggleButton",onClick:()=>{V.fn.toggle("testAccordion")}}),e(V,{accordionID:"testAccordion",defaultOpen:!0,children:"in Accordion Element"})]})}],[{children:e(n.Description,{children:`
57
57
  <Img
58
58
  maxheight={ 8 }
59
59
  maxWidth={ 8 }
60
60
  src='...'
61
61
  alt='noImage'
62
62
  />
63
- `})},{children:e(w,{src:a.Images.defaultIcon("user"),alt:"noImage",freeCSS:{maxHeight:12*8,maxWidth:12*8}})}]]})})]})},f={index:()=>t(u,{children:[e(f.Comun,{}),e(f.Mingoo,{}),e(f.Google,{}),e(f.Facebook,{}),e(f.Line,{}),e(f.Twitter,{})]}),Comun:()=>t(o,{ssCardBox:!0,children:[e(l.SubTitle,{padding:1,borderBottom:!0,children:"Comun"}),e(o,{padding:1,overflow:"auto",children:t(x,{padding:2,children:[t(B.Left,{gap:2,children:[e(a.Brands.ComunIcon,{size:"S"}),e(a.Brands.ComunIcon,{size:"R"}),e(a.Brands.ComunIcon,{size:"L"}),e(a.Brands.ComunIcon,{size:"2L"}),e(a.Brands.ComunIcon,{size:"3L"})]}),t(B.Left,{gap:2,children:[e(a.Brands.ComunTitle,{size:"S"}),e(a.Brands.ComunTitle,{size:"R"}),e(a.Brands.ComunTitle,{size:"L"}),e(a.Brands.ComunTitle,{size:"2L"}),e(a.Brands.ComunTitle,{size:"3L"})]}),t(B.Left,{gap:2,children:[e(a.Brands.ComunLogoH,{size:"S"}),e(a.Brands.ComunLogoH,{size:"R"}),e(a.Brands.ComunLogoH,{size:"L"}),e(a.Brands.ComunLogoH,{size:"2L"}),e(a.Brands.ComunLogoH,{size:"3L"})]}),t(B.Left,{gap:2,children:[e(a.Brands.ComunLogoV,{size:"S"}),e(a.Brands.ComunLogoV,{size:"R"}),e(a.Brands.ComunLogoV,{size:"L"}),e(a.Brands.ComunLogoV,{size:"2L"}),e(a.Brands.ComunLogoV,{size:"3L"})]})]})})]}),Mingoo:()=>t(o,{ssCardBox:!0,children:[e(l.SubTitle,{padding:1,borderBottom:!0,children:"Mingoo"}),e(o,{padding:1,overflow:"auto",children:t(B.Center,{flexType:"col",gap:2,padding:2,children:[e(a.Brands.MingooIcon,{size:"S"}),e(a.Brands.MingooIcon,{size:"R"}),e(a.Brands.MingooIcon,{size:"L"}),e(a.Brands.MingooIcon,{size:"2L"}),e(a.Brands.MingooIcon,{size:"3L"})]})})]}),Google:()=>t(o,{ssCardBox:!0,children:[e(l.SubTitle,{padding:1,borderBottom:!0,children:"Google"}),e(o,{padding:1,overflow:"auto",children:t(B.Center,{flexType:"col",gap:2,padding:2,children:[e(a.Brands.Google,{size:"S"}),e(a.Brands.Google,{size:"R"}),e(a.Brands.Google,{size:"L"}),e(a.Brands.Google,{size:"2L"}),e(a.Brands.Google,{size:"3L"})]})})]}),Facebook:()=>t(o,{ssCardBox:!0,children:[e(l.SubTitle,{padding:1,borderBottom:!0,children:"Facebook"}),e(o,{padding:1,overflow:"auto",children:t(B.Center,{flexType:"col",gap:2,padding:2,children:[e(a.Brands.Facebook,{size:"S"}),e(a.Brands.Facebook,{size:"R"}),e(a.Brands.Facebook,{size:"L"}),e(a.Brands.Facebook,{size:"2L"}),e(a.Brands.Facebook,{size:"3L"})]})})]}),Line:()=>t(o,{ssCardBox:!0,children:[e(l.SubTitle,{padding:1,borderBottom:!0,children:"LINE"}),e(o,{padding:1,overflow:"auto",children:t(B.Center,{flexType:"col",gap:2,padding:2,children:[e(a.Brands.LINE,{size:"S"}),e(a.Brands.LINE,{size:"R"}),e(a.Brands.LINE,{size:"L"}),e(a.Brands.LINE,{size:"2L"}),e(a.Brands.LINE,{size:"3L"})]})})]}),Twitter:()=>t(o,{ssCardBox:!0,children:[e(l.SubTitle,{padding:1,borderBottom:!0,children:"Twitter"}),e(o,{padding:1,overflow:"auto",children:t(B.Center,{flexType:"col",gap:2,padding:2,children:[e(a.Brands.Twitter,{size:"S"}),e(a.Brands.Twitter,{size:"R"}),e(a.Brands.Twitter,{size:"L"}),e(a.Brands.Twitter,{size:"2L"}),e(a.Brands.Twitter,{size:"3L"})]})})]})},P={index:()=>t(u,{children:[e(P.Ripple,{}),e(P.Variables,{}),e(P.Tooltips,{}),e(P.Snackbar,{})]}),Ripple:()=>t(o,{ssCardBox:!0,children:[e(l.SubTitle,{padding:1,borderBottom:!0,children:"Ripple"}),t(x,{padding:2,children:[e(l.Description,{children:`<Element
63
+ `})},{children:e(R,{src:s.Images.defaultIcon("user"),alt:"noImage",freeCSS:{maxHeight:12*8,maxWidth:12*8}})}]]})})]})},S={index:()=>o(u,{children:[e(S.Comun,{}),e(S.Mingoo,{}),e(S.Google,{}),e(S.Facebook,{}),e(S.Line,{}),e(S.Twitter,{})]}),Comun:()=>o(t,{styles:{ssCardBox:!0},children:[e(n.SubTitle,{styles:{padding:1,borderBottom:!0},children:"Comun"}),e(t,{styles:{padding:1,overflow:"auto"},children:o(c,{styles:{padding:2},children:[o(B.Left,{styles:{gap:2},children:[e(s.Brands.ComunIcon,{size:"S"}),e(s.Brands.ComunIcon,{size:"R"}),e(s.Brands.ComunIcon,{size:"L"}),e(s.Brands.ComunIcon,{size:"2L"}),e(s.Brands.ComunIcon,{size:"3L"})]}),o(B.Left,{styles:{gap:2},children:[e(s.Brands.ComunTitle,{size:"S"}),e(s.Brands.ComunTitle,{size:"R"}),e(s.Brands.ComunTitle,{size:"L"}),e(s.Brands.ComunTitle,{size:"2L"}),e(s.Brands.ComunTitle,{size:"3L"})]}),o(B.Left,{styles:{gap:2},children:[e(s.Brands.ComunLogoH,{size:"S"}),e(s.Brands.ComunLogoH,{size:"R"}),e(s.Brands.ComunLogoH,{size:"L"}),e(s.Brands.ComunLogoH,{size:"2L"}),e(s.Brands.ComunLogoH,{size:"3L"})]}),o(B.Left,{styles:{gap:2},children:[e(s.Brands.ComunLogoV,{size:"S"}),e(s.Brands.ComunLogoV,{size:"R"}),e(s.Brands.ComunLogoV,{size:"L"}),e(s.Brands.ComunLogoV,{size:"2L"}),e(s.Brands.ComunLogoV,{size:"3L"})]})]})})]}),Mingoo:()=>o(t,{styles:{ssCardBox:!0},children:[e(n.SubTitle,{styles:{padding:1,borderBottom:!0},children:"Mingoo"}),e(t,{styles:{padding:1,overflow:"auto"},children:o(B.Center,{styles:{flexType:"col",gap:2,padding:2},children:[e(s.Brands.MingooIcon,{size:"S"}),e(s.Brands.MingooIcon,{size:"R"}),e(s.Brands.MingooIcon,{size:"L"}),e(s.Brands.MingooIcon,{size:"2L"}),e(s.Brands.MingooIcon,{size:"3L"})]})})]}),Google:()=>o(t,{styles:{ssCardBox:!0},children:[e(n.SubTitle,{styles:{padding:1,borderBottom:!0},children:"Google"}),e(t,{styles:{padding:1,overflow:"auto"},children:o(B.Center,{styles:{flexType:"col",gap:2,padding:2},children:[e(s.Brands.Google,{size:"S"}),e(s.Brands.Google,{size:"R"}),e(s.Brands.Google,{size:"L"}),e(s.Brands.Google,{size:"2L"}),e(s.Brands.Google,{size:"3L"})]})})]}),Facebook:()=>o(t,{styles:{ssCardBox:!0},children:[e(n.SubTitle,{styles:{padding:1,borderBottom:!0},children:"Facebook"}),e(t,{styles:{padding:1,overflow:"auto"},children:o(B.Center,{styles:{flexType:"col",gap:2,padding:2},children:[e(s.Brands.Facebook,{size:"S"}),e(s.Brands.Facebook,{size:"R"}),e(s.Brands.Facebook,{size:"L"}),e(s.Brands.Facebook,{size:"2L"}),e(s.Brands.Facebook,{size:"3L"})]})})]}),Line:()=>o(t,{styles:{ssCardBox:!0},children:[e(n.SubTitle,{styles:{padding:1,borderBottom:!0},children:"LINE"}),e(t,{styles:{padding:1,overflow:"auto"},children:o(B.Center,{styles:{flexType:"col",gap:2,padding:2},children:[e(s.Brands.LINE,{size:"S"}),e(s.Brands.LINE,{size:"R"}),e(s.Brands.LINE,{size:"L"}),e(s.Brands.LINE,{size:"2L"}),e(s.Brands.LINE,{size:"3L"})]})})]}),Twitter:()=>o(t,{styles:{ssCardBox:!0},children:[e(n.SubTitle,{styles:{padding:1,borderBottom:!0},children:"Twitter"}),e(t,{styles:{padding:1,overflow:"auto"},children:o(B.Center,{styles:{flexType:"col",gap:2,padding:2},children:[e(s.Brands.Twitter,{size:"S"}),e(s.Brands.Twitter,{size:"R"}),e(s.Brands.Twitter,{size:"L"}),e(s.Brands.Twitter,{size:"2L"}),e(s.Brands.Twitter,{size:"3L"})]})})]})},F={index:()=>o(u,{children:[e(F.Ripple,{}),e(F.Variables,{}),e(F.Tooltips,{}),e(F.Snackbar,{})]}),Ripple:()=>o(t,{styles:{ssCardBox:!0},children:[e(n.SubTitle,{styles:{padding:1,borderBottom:!0},children:"Ripple"}),o(c,{styles:{padding:2},children:[e(n.Description,{children:`<Element
64
64
  ssEffectsOnActive={ 'ripple.( cloud | theme | nega | posi | warn )' }
65
- />`}),t(B.Center,{children:[e(r.Button.Prime.R,{ssEffectsOnActive:["ripple.white"],children:"White"}),e(r.Button.Border.R,{ssEffectsOnActive:["ripple.cloud"],children:"Cloud"}),e(r.Button.Border.R,{children:"Theme",ssEffectsOnActive:["ripple.theme"]})]})]})]}),Variables:()=>t(o,{ssCardBox:!0,children:[e(l.SubTitle,{padding:1,borderBottom:!0,children:"Effects"}),t(x,{padding:2,children:[e(l.Description,{children:`<Button
65
+ />`}),o(B.Center,{children:[e(r.Button.Prime.R,{styles:{ssEffectsOnActive:["ripple.white"]},children:"White"}),e(r.Button.Border.R,{styles:{ssEffectsOnActive:["ripple.cloud"]},children:"Cloud"}),e(r.Button.Border.R,{styles:{ssEffectsOnActive:["ripple.theme"]},children:"Theme"})]})]})]}),Variables:()=>o(t,{styles:{ssCardBox:!0},children:[e(n.SubTitle,{styles:{padding:1,borderBottom:!0},children:"Effects"}),o(c,{styles:{padding:2},children:[e(n.Description,{children:`<Button
66
66
  ssEffectsOnActive={ 'shrink' }
67
- />`}),e(B.Left,{children:e(r.Button.Prime.R,{onClick:()=>{z.fn.mini.active("testLoadingKey"),setTimeout(()=>{z.fn.stopALL()},5e3)},children:t(B.Center,{gap:0,children:[e(z.White.S,{loaderID:"testLoadingKey",marginRight:1}),e(o,{textAlign:"left",children:"Launch Mini Loader"})]})})}),t(B.Left,{children:[e(r.Button.Border.R,{children:"Shrink",ssEffectsOnActive:"shrink"}),e(r.Button.Border.R,{children:"Pudding",ssEffectsOnActive:"pudding"}),e(r.Button.Border.R,{children:"Expand",ssEffectsOnActive:"expand"}),e(r.Button.Border.R,{children:"corner Loader",onClick:()=>{z.fn.corner.active(),setTimeout(()=>{z.fn.corner.stop()},3e3)}})]})]})]}),Tooltips:()=>t(o,{ssCardBox:!0,children:[e(l.SubTitle,{padding:1,borderBottom:!0,children:"Tooltips"}),t(x,{padding:2,children:[t(r.Button.Prime.R,{onContextMenu:n=>{n.preventDefault(),k.open({tipsID:"testTooltips",event:n,nextToCursor:!0,gravityPoint:10,padding:0,close_option:{parentBlur:!1},freeCSS:{minWidth:12*16},content:t(x,{ssCardBox:!0,gap:0,borderRadius:"3.tone.tertiary",padding:"1/2",children:[e(r.Button.Clear.S,{color:"cloud",fontColor:"2.normal",textAlign:"left",children:"Button Label1"}),e(r.Button.Clear.S,{color:"cloud",fontColor:"2.normal",textAlign:"left",children:"Button Label2"}),e(r.Button.Clear.S,{color:"cloud",fontColor:"2.normal",textAlign:"left",children:"Button Label3"}),e(r.Button.Clear.S,{color:"cloud",fontColor:"2.normal",textAlign:"left",children:"Button Label4"}),e(r.Button.Clear.S,{color:"cloud",fontColor:"2.normal",textAlign:"left",children:"Button Label5"})]})})},children:["OpenTooltips next to cursor",e("br",{}),"( onContextMenu )"]}),e(p,{gridCols:5,gap:1,children:Array.from({length:25}).map((n,i)=>e(r.Button.Border.R,{onMouseOver:s=>{k.open({tipsID:"tips-"+(i+1),event:s,gravityPoint:i+1,padding:0,close_option:{parentBlur:!1},content:e(k.Comps.Body,{children:i},i)})},children:i+1},i))})]})]}),Snackbar:()=>t(o,{ssCardBox:!0,children:[e(l.SubTitle,{padding:1,borderBottom:!0,children:"Snackbars"}),t(B.Center,{padding:2,children:[e(r.Button.Prime.R,{onClick:()=>{G.add({secondsToClose:3,children:"hello World!!"})},children:"Add Normal Snackbar"}),e(r.Button.Prime.R,{onClick:()=>{G.add({snackID:"testSnackID1",secondsToClose:30,children:t(B.Separate,{verticalAlign:"baseline",paddingLeft:"2/3",children:["\u4E88\u7D04\u6642\u9593\u304C\u66F4\u65B0\u3055\u308C\u307E\u3057\u305F",e(r.Button.Clear.S,{color:"white",fontColor:"posi",children:"\u5143\u306B\u623B\u3059"})]})})},children:"Notices"}),e(r.Button.Prime.R,{onClick:()=>{let n=S.uuid.gen();G.add({snackID:n,children:t(x,{padding:1,children:[t(B.Left,{verticalAlign:"top",children:[e(w,{src:a.Images.defaultIcon("user"),ssSphere:4}),e(l.Description,{children:`Some Text
67
+ />`}),e(B.Left,{children:e(r.Button.Prime.R,{onClick:()=>{P.fn.mini.active("testLoadingKey"),setTimeout(()=>{P.fn.stopALL()},5e3)},children:o(B.Center,{styles:{gap:0},children:[e(P.White.S,{loaderID:"testLoadingKey",styles:{marginRight:1}}),e(t,{styles:{textAlign:"left"},children:"Launch Mini Loader"})]})})}),o(B.Left,{children:[e(r.Button.Border.R,{styles:{ssEffectsOnActive:"shrink"},children:"Shrink"}),e(r.Button.Border.R,{styles:{ssEffectsOnActive:"pudding"},children:"Pudding"}),e(r.Button.Border.R,{styles:{ssEffectsOnActive:"expand"},children:"Expand"}),e(r.Button.Border.R,{children:"corner Loader",onClick:()=>{P.fn.corner.active(),setTimeout(()=>{P.fn.corner.stop()},3e3)}})]})]})]}),Tooltips:()=>o(t,{styles:{ssCardBox:!0},children:[e(n.SubTitle,{styles:{padding:1,borderBottom:!0},children:"Tooltips"}),o(c,{styles:{padding:2},children:[o(r.Button.Prime.R,{onContextMenu:l=>{l.preventDefault(),w.open({tipsID:"testTooltips",event:l,nextToCursor:!0,gravityPoint:10,close_option:{parentBlur:!1},styles:{padding:0},freeCSS:{minWidth:12*16},content:o(c,{styles:{ssCardBox:!0,gap:0,borderRadius:"3.tone.tertiary",padding:"1/2"},children:[e(r.Button.Clear.S,{color:"cloud",styles:{fontColor:"2.normal",textAlign:"left"},children:"Button Label1"}),e(r.Button.Clear.S,{color:"cloud",styles:{fontColor:"2.normal",textAlign:"left"},children:"Button Label2"}),e(r.Button.Clear.S,{color:"cloud",styles:{fontColor:"2.normal",textAlign:"left"},children:"Button Label3"}),e(r.Button.Clear.S,{color:"cloud",styles:{fontColor:"2.normal",textAlign:"left"},children:"Button Label4"}),e(r.Button.Clear.S,{color:"cloud",styles:{fontColor:"2.normal",textAlign:"left"},children:"Button Label5"})]})})},children:["OpenTooltips next to cursor",e("br",{}),"( onContextMenu )"]}),e(p,{styles:{gridCols:5,gap:1},children:Array.from({length:25}).map((l,a)=>e(r.Button.Border.R,{onMouseOver:d=>{w.open({tipsID:"tips-"+(a+1),event:d,gravityPoint:a+1,close_option:{parentBlur:!1},styles:{padding:0},content:e(w.Comps.Body,{children:a},a)})},children:a+1},a))})]})]}),Snackbar:()=>o(t,{styles:{ssCardBox:!0},children:[e(n.SubTitle,{styles:{padding:1,borderBottom:!0},children:"Snackbars"}),o(B.Center,{styles:{padding:2},children:[e(r.Button.Prime.R,{onClick:()=>{O.add({secondsToClose:3,children:"hello World!!"})},children:"Add Normal Snackbar"}),e(r.Button.Prime.R,{onClick:()=>{O.add({snackID:"testSnackID1",secondsToClose:30,children:o(B.Separate,{styles:{verticalAlign:"baseline",paddingLeft:"2/3"},children:["\u4E88\u7D04\u6642\u9593\u304C\u66F4\u65B0\u3055\u308C\u307E\u3057\u305F",e(r.Button.Clear.S,{color:"white",styles:{fontColor:"posi"},children:"\u5143\u306B\u623B\u3059"})]})})},children:"Notices"}),e(r.Button.Prime.R,{onClick:()=>{let l=b.uuid.gen();O.add({snackID:l,children:o(c,{styles:{padding:1},children:[o(B.Left,{styles:{verticalAlign:"top"},children:[e(R,{src:s.Images.defaultIcon("user"),styles:{ssSphere:4}}),e(n.Description,{children:`Some Text
68
68
  Some Text
69
- Some Text`})]}),t(B.Separate,{children:[e(r.Button.Sub.S,{color:"white",onClick:()=>{G.remove(n)},children:"\u9589\u3058\u308B"}),e(r.Anchor.Prime.S,{href:"",children:"\u8A73\u7D30"})]})]})})},children:"Message"})]})]})},O={index:()=>t(u,{children:[e(O.Types,{}),e(O.Tone,{}),e(O.Segmented,{})]}),Tone:()=>t(o,{ssCardBox:!0,children:[e(l.SubTitle,{padding:1,borderBottom:!0,children:"Tone"}),e(o,{padding:1,overflow:"auto",children:t(p,{gridCols:2,gap:2,children:[t(o,{children:[e(o,{padding:1,fontSize:"3.paragraph",isBoldFont:!0,children:"\u30FBPrime"}),t(p,{gridCols:3,gap:1,padding:1,children:[e(r.Button.Prime.R,{color:"theme",children:"theme"}),e(r.Button.Prime.R,{color:"coffee",children:"posi"}),e(r.Button.Prime.R,{color:"ninja",children:"nega"}),e(r.Button.Prime.R,{color:"droplet",children:"warn"}),e(r.Button.Prime.R,{color:"googleBlue",children:"mono"}),e(r.Button.Prime.R,{color:"poizon",children:"pozion"})]})]}),t(o,{children:[e(o,{padding:1,fontSize:"3.paragraph",isBoldFont:!0,children:"\u30FBSub"}),t(p,{gridCols:3,gap:1,padding:1,children:[e(r.Button.Sub.R,{color:"theme",children:"theme"}),e(r.Button.Sub.R,{color:"posi",children:"posi"}),e(r.Button.Sub.R,{color:"nega",children:"nega"}),e(r.Button.Sub.R,{color:"warn",children:"warn"}),e(r.Button.Sub.R,{color:"cloud",children:"cloud"})]}),t(p,{gridCols:3,gap:1,padding:1,backgroundColor:"dark",ssCardBox:!0,children:[e(r.Button.Sub.R,{color:"white",children:"white"}),e(r.Button.Sub.R,{color:"cloud",children:"cloud"})]})]}),t(o,{children:[e(o,{padding:1,fontSize:"3.paragraph",isBoldFont:!0,children:"\u30FBClear"}),t(p,{gridCols:3,gap:1,padding:1,children:[e(r.Button.Clear.R,{color:"theme",children:"theme"}),e(r.Button.Clear.R,{color:"posi",children:"posi"}),e(r.Button.Clear.R,{color:"nega",children:"nega"}),e(r.Button.Clear.R,{color:"warn",children:"warn"}),e(r.Button.Clear.R,{color:"cloud",children:"cloud"})]}),t(p,{gridCols:3,gap:1,padding:1,backgroundColor:"dark",ssCardBox:!0,children:[e(r.Button.Clear.R,{color:"white",children:"white"}),e(r.Button.Clear.R,{color:"cloud",children:"cloud"})]})]}),t(o,{children:[e(o,{padding:1,fontSize:"3.paragraph",isBoldFont:!0,children:"\u30FBFillToBorder"}),t(p,{gridCols:3,gap:1,padding:1,children:[e(r.Button.FillToBorder.R,{color:"theme",children:"theme"}),e(r.Button.FillToBorder.R,{color:"posi",children:"posi"}),e(r.Button.FillToBorder.R,{color:"nega",children:"nega"}),e(r.Button.FillToBorder.R,{color:"warn",children:"warn"})]}),t(p,{gridCols:3,gap:1,padding:1,backgroundColor:"dark",ssCardBox:!0,children:[e(r.Button.FillToBorder.R,{color:"white",children:"white"}),e(r.Button.FillToBorder.R,{color:"cloud",children:"cloud"})]})]}),t(o,{children:[e(o,{padding:1,fontSize:"3.paragraph",isBoldFont:!0,children:"\u30FBBorderToFill"}),t(p,{gridCols:3,gap:1,padding:1,children:[e(r.Button.BorderToFill.R,{color:"theme",fontColor:"nega",children:e(o,{children:"theme"})}),e(r.Button.BorderToFill.R,{color:"posi",children:"posi"}),e(r.Button.BorderToFill.R,{color:"nega",children:"nega"}),e(r.Button.BorderToFill.R,{color:"warn",children:"warn"})]}),t(p,{gridCols:3,gap:1,padding:1,backgroundColor:"dark",ssCardBox:!0,children:[e(r.Button.BorderToFill.R,{color:"white",children:"white"}),e(r.Button.BorderToFill.R,{color:"cloud",children:"cloud"})]})]}),t(o,{children:[e(o,{padding:1,fontSize:"3.paragraph",isBoldFont:!0,children:"\u30FBOthers"}),t(p,{gridCols:3,gap:1,padding:1,children:[e(r.Button.Border.R,{children:"Border"}),e(r.Button.Normal.R,{children:"Normal"}),e(r.Button.Link,{children:"Link"}),e(r.Button.Plain,{children:"Plain"})]})]})]})})]}),Types:()=>t(h,{gap:2,flexChilds:"auto",children:[t(o,{ssCardBox:!0,children:[e(l.ThirdTitle,{padding:1,borderBottom:!0,children:"\u30FBButton"}),e(o,{padding:1,overflow:"auto",children:e(y,{rowStyles:{padding:[1,0],horizontalAlign:"between",borderBottom:"2.normal"},rows:[{children:t(u,{children:[e(o,{children:"<Button.Button.Prime ... />"}),e(o,{children:e(r.Button.Prime.R,{children:"Button.Prime"})})]})},{children:t(u,{children:[e(o,{children:"<Button.Button.Sub ... />"}),e(o,{children:e(r.Button.Sub.R,{children:"Button.Sub AAAA"})})]})},{children:t(u,{children:[e(o,{children:"<Button.Button.Border ... />"}),e(o,{children:e(r.Button.Border.R,{children:"Button.Border"})})]}),borderBottom:"unset"}]})})]}),t(o,{ssCardBox:!0,children:[e(l.ThirdTitle,{padding:1,borderBottom:!0,children:"\u30FBLabel"}),e(o,{padding:1,overflow:"auto",children:e(y,{rowStyles:{padding:[1,0],horizontalAlign:"between",borderBottom:"2.normal"},rows:[{children:t(u,{children:[e(o,{children:"<Button.Label.Prime ... />"}),e(o,{children:e(r.Label.Prime.R,{children:"Label.Prime"})})]})},{children:t(u,{children:[e(o,{children:"<Button.Label.Sub ... />"}),e(o,{children:e(r.Label.Sub.R,{children:"Label.Sub"})})]})},{children:t(u,{children:[e(o,{children:"<Button.Label.Border ... />"}),e(o,{children:e(r.Label.Border.R,{children:"Label.Border"})})]}),borderBottom:"unset"}]})})]}),t(o,{ssCardBox:!0,children:[e(l.ThirdTitle,{padding:1,borderBottom:!0,children:"\u30FBAnchor"}),e(o,{padding:1,overflow:"auto",children:e(y,{rowStyles:{padding:[1,0],horizontalAlign:"between",borderBottom:"2.normal"},rows:[{children:t(u,{children:[e(o,{children:"<Button.Anchor.Prime ... />"}),e(o,{children:e(r.Anchor.Prime.R,{href:"",children:"Anchor.Prime"})})]})},{children:t(u,{children:[e(o,{children:"<Button.Anchor.Sub ... />"}),e(o,{children:e(r.Anchor.Sub.R,{href:"",children:"Anchor.Sub"})})]})},{children:t(u,{children:[e(o,{children:"<Button.Anchor.Border ... />"}),e(o,{children:e(r.Anchor.Border.R,{href:"",children:"Anchor.Border"})})]}),borderBottom:"unset"}]})})]}),t(o,{ssCardBox:!0,children:[e(l.ThirdTitle,{padding:1,borderBottom:!0,children:"\u30FBSizes"}),t(p,{gridCols:2,padding:1,gap:2,children:[e(o,{flexCenter:!0,children:e(r.Button.Prime.XS,{children:'size="XS"'})}),e(o,{flexCenter:!0,children:e(r.Button.Prime.S,{children:'size="S"'})}),e(o,{flexCenter:!0,children:e(r.Button.Prime.R,{children:'size="R"'})}),e(o,{flexCenter:!0,children:e(r.Button.Prime.L,{children:'size="L"'})})]})]})]}),Segmented:()=>t(o,{ssCardBox:!0,children:[e(l.ThirdTitle,{padding:1,borderBottom:!0,children:"Segmented"}),t(h,{overflow:"auto",gap:2,padding:3,children:[e(d.Segmented.Auto,{tone:"cloud",value:1,options:[{value:0,label:e(c.AngleLeft,{})},{value:1,label:e(c.AngleRight,{})},{value:2,label:e(c.AngleUp,{})},{value:3,label:e(c.AngleDown,{})}]}),e(d.Segmented.Cloud,{value:1,options:[{value:0,label:e(c.AngleLeft,{})},{value:1,label:e(c.AngleRight,{})},{value:2,label:e(c.AngleUp,{})},{value:3,label:e(c.AngleDown,{})}]}),e(d.Segmented.Cloud2,{value:1,options:[{value:0,label:e(c.AngleLeft,{})},{value:1,label:e(c.AngleRight,{})},{value:2,label:e(c.AngleUp,{})},{value:3,label:e(c.AngleDown,{})}]}),e(d.Segmented.Cloud3,{value:1,options:[{value:0,label:e(c.AngleLeft,{})},{value:1,label:e(c.AngleRight,{})},{value:2,label:e(c.AngleUp,{})},{value:3,label:e(c.AngleDown,{})}]}),e(d.Segmented.Border,{value:1,options:[{value:0,label:"On"},{value:1,label:"Off"}]}),e(d.Segmented.Border2,{value:1,options:[{value:0,label:"On"},{value:1,label:"Off"}]}),e(d.Segmented.BottomLine,{value:1,options:[{value:0,label:"Takana"},{value:1,label:"Mentai"},{value:2,label:"Mayo"},{value:3,label:"Gyudon"}]})]})]})},te={index:()=>{let n=i=>e(o,E({flexCenter:!0,ssCardBox:"layer",textAlign:"center",padding:2},i));return t(x,{gap:4,children:[t(x,{children:[e(l.Paragraph,{children:"Shadows"}),t(p,{gap:2,gridCols:4,children:[e(n,{boxShadow:"0.min",children:"0.min"}),e(n,{boxShadow:"0.normal",children:"0.normal"}),e(n,{boxShadow:"0.remark",children:"0.remark"}),e(n,{boxShadow:"0.max",children:"0.max"}),e(n,{boxShadow:"1.min",children:"1.min"}),e(n,{boxShadow:"1.normal",children:"1.normal"}),e(n,{boxShadow:"1.remark",children:"1.remark"}),e(n,{boxShadow:"1.max",children:"1.max"}),e(n,{boxShadow:"2.min",children:"2.min"}),e(n,{boxShadow:"2.normal",children:"2.normal"}),e(n,{boxShadow:"2.remark",children:"2.remark"}),e(n,{boxShadow:"2.max",children:"2.max"}),e(n,{boxShadow:"3.min",children:"3.min"}),e(n,{boxShadow:"3.normal",children:"3.normal"}),e(n,{boxShadow:"3.remark",children:"3.remark"}),e(n,{boxShadow:"3.max",children:"3.max"}),e(n,{boxShadow:"4.min",children:"4.min"}),e(n,{boxShadow:"4.normal",children:"4.normal"}),e(n,{boxShadow:"4.remark",children:"4.remark"}),e(n,{boxShadow:"4.max",children:"4.max"}),e(n,{boxShadow:"5.min",children:"5.min"}),e(n,{boxShadow:"5.normal",children:"5.normal"}),e(n,{boxShadow:"5.remark",children:"5.remark"}),e(n,{boxShadow:"5.max",children:"5.max"})]})]}),t(x,{children:[e(l.Paragraph,{children:"Inset Shadows"}),t(p,{gap:2,gridCols:4,children:[e(n,{boxShadow:"0.min.inset",children:"0.min.inset"}),e(n,{boxShadow:"0.normal.inset",children:"0.normal.inset"}),e(n,{boxShadow:"0.remark.inset",children:"0.remark.inset"}),e(n,{boxShadow:"0.max.inset",children:"0.max.inset"}),e(n,{boxShadow:"1.min.inset",children:"1.min.inset"}),e(n,{boxShadow:"1.normal.inset",children:"1.normal.inset"}),e(n,{boxShadow:"1.remark.inset",children:"1.remark.inset"}),e(n,{boxShadow:"1.max.inset",children:"1.max.inset"}),e(n,{boxShadow:"2.min.inset",children:"2.min.inset"}),e(n,{boxShadow:"2.normal.inset",children:"2.normal.inset"}),e(n,{boxShadow:"2.remark.inset",children:"2.remark.inset"}),e(n,{boxShadow:"2.max.inset",children:"2.max.inset"}),e(n,{boxShadow:"3.min.inset",children:"3.min.inset"}),e(n,{boxShadow:"3.normal.inset",children:"3.normal.inset"}),e(n,{boxShadow:"3.remark.inset",children:"3.remark.inset"}),e(n,{boxShadow:"3.max.inset",children:"3.max.inset"})]})]})]})}},re=()=>{const n={Basic:()=>t(o,{ssCardBox:!0,children:[e(l.Paragraph,{padding:1,borderBottom:!0,children:"TextInput"}),t(o,{padding:1,children:[t(B.Separate,{marginBottom:2,children:[e(l.Description,{children:`<Input.Text
69
+ Some Text`})]}),o(B.Separate,{children:[e(r.Button.Sub.S,{color:"white",onClick:()=>{O.remove(l)},children:"\u9589\u3058\u308B"}),e(r.Anchor.Prime.S,{href:"",children:"\u8A73\u7D30"})]})]})})},children:"Message"})]})]})},E={index:()=>o(u,{children:[e(E.Types,{}),e(E.Tone,{}),e(E.Segmented,{})]}),Tone:()=>o(t,{styles:{ssCardBox:!0},children:[e(n.SubTitle,{styles:{padding:1,borderBottom:!0},children:"Tone"}),e(t,{styles:{padding:1,overflow:"auto"},children:o(p,{styles:{gridCols:2,gap:2},children:[o(t,{children:[e(t,{styles:{padding:1,fontSize:"3.paragraph",isBoldFont:!0},children:"\u30FBPrime"}),o(p,{styles:{gridCols:3,gap:1,padding:1},children:[e(r.Button.Prime.R,{color:"theme",children:"theme"}),e(r.Button.Prime.R,{color:"coffee",children:"posi"}),e(r.Button.Prime.R,{color:"ninja",children:"nega"}),e(r.Button.Prime.R,{color:"droplet",children:"warn"}),e(r.Button.Prime.R,{color:"googleBlue",children:"mono"}),e(r.Button.Prime.R,{color:"poizon",children:"pozion"})]})]}),o(t,{children:[e(t,{styles:{padding:1,fontSize:"3.paragraph",isBoldFont:!0},children:"\u30FBSub"}),o(p,{styles:{gridCols:3,gap:1,padding:1},children:[e(r.Button.Sub.R,{color:"theme",children:"theme"}),e(r.Button.Sub.R,{color:"posi",children:"posi"}),e(r.Button.Sub.R,{color:"nega",children:"nega"}),e(r.Button.Sub.R,{color:"warn",children:"warn"}),e(r.Button.Sub.R,{color:"cloud",children:"cloud"})]}),o(p,{styles:{gridCols:3,gap:1,padding:1,backgroundColor:"dark",ssCardBox:!0},children:[e(r.Button.Sub.R,{color:"white",children:"white"}),e(r.Button.Sub.R,{color:"cloud",children:"cloud"})]})]}),o(t,{children:[e(t,{styles:{padding:1,fontSize:"3.paragraph",isBoldFont:!0},children:"\u30FBClear"}),o(p,{styles:{gridCols:3,gap:1,padding:1},children:[e(r.Button.Clear.R,{color:"theme",children:"theme"}),e(r.Button.Clear.R,{color:"posi",children:"posi"}),e(r.Button.Clear.R,{color:"nega",children:"nega"}),e(r.Button.Clear.R,{color:"warn",children:"warn"}),e(r.Button.Clear.R,{color:"cloud",children:"cloud"})]}),o(p,{styles:{gridCols:3,gap:1,padding:1,backgroundColor:"dark",ssCardBox:!0},children:[e(r.Button.Clear.R,{color:"white",children:"white"}),e(r.Button.Clear.R,{color:"cloud",children:"cloud"})]})]}),o(t,{children:[e(t,{styles:{padding:1,fontSize:"3.paragraph",isBoldFont:!0},children:"\u30FBFillToBorder"}),o(p,{styles:{gridCols:3,gap:1,padding:1},children:[e(r.Button.FillToBorder.R,{color:"theme",children:"theme"}),e(r.Button.FillToBorder.R,{color:"posi",children:"posi"}),e(r.Button.FillToBorder.R,{color:"nega",children:"nega"}),e(r.Button.FillToBorder.R,{color:"warn",children:"warn"})]}),o(p,{styles:{gridCols:3,gap:1,padding:1,backgroundColor:"dark",ssCardBox:!0},children:[e(r.Button.FillToBorder.R,{color:"white",children:"white"}),e(r.Button.FillToBorder.R,{color:"cloud",children:"cloud"})]})]}),o(t,{children:[e(t,{styles:{padding:1,fontSize:"3.paragraph",isBoldFont:!0},children:"\u30FBBorderToFill"}),o(p,{styles:{gridCols:3,gap:1,padding:1},children:[e(r.Button.BorderToFill.R,{color:"theme",styles:{fontColor:"nega"},children:e(t,{children:"theme"})}),e(r.Button.BorderToFill.R,{color:"posi",children:"posi"}),e(r.Button.BorderToFill.R,{color:"nega",children:"nega"}),e(r.Button.BorderToFill.R,{color:"warn",children:"warn"})]}),o(p,{styles:{gridCols:3,gap:1,padding:1,backgroundColor:"dark",ssCardBox:!0},children:[e(r.Button.BorderToFill.R,{color:"white",children:"white"}),e(r.Button.BorderToFill.R,{color:"cloud",children:"cloud"})]})]}),o(t,{children:[e(t,{styles:{padding:1,fontSize:"3.paragraph",isBoldFont:!0},children:"\u30FBOthers"}),o(p,{styles:{gridCols:3,gap:1,padding:1},children:[e(r.Button.Border.R,{children:"Border"}),e(r.Button.Normal.R,{children:"Normal"}),e(r.Button.Link,{children:"Link"}),e(r.Button.Plain,{children:"Plain"})]})]})]})})]}),Types:()=>o(g,{styles:{gap:2,flexChilds:"auto"},children:[o(t,{styles:{ssCardBox:!0},children:[e(n.ThirdTitle,{styles:{padding:1,borderBottom:!0},children:"\u30FBButton"}),e(t,{styles:{padding:1,overflow:"auto"},children:e(z,{rowStyles:{padding:[1,0],horizontalAlign:"between",borderBottom:"2.normal"},rows:[{children:o(u,{children:[e(t,{children:"<Button.Button.Prime ... />"}),e(t,{children:e(r.Button.Prime.R,{children:"Button.Prime"})})]})},{children:o(u,{children:[e(t,{children:"<Button.Button.Sub ... />"}),e(t,{children:e(r.Button.Sub.R,{children:"Button.Sub AAAA"})})]})},{children:o(u,{children:[e(t,{children:"<Button.Button.Border ... />"}),e(t,{children:e(r.Button.Border.R,{children:"Button.Border"})})]}),styles:{borderBottom:"unset"}}]})})]}),o(t,{styles:{ssCardBox:!0},children:[e(n.ThirdTitle,{styles:{padding:1,borderBottom:!0},children:"\u30FBLabel"}),e(t,{styles:{padding:1,overflow:"auto"},children:e(z,{rowStyles:{padding:[1,0],horizontalAlign:"between",borderBottom:"2.normal"},rows:[{children:o(u,{children:[e(t,{children:"<Button.Label.Prime ... />"}),e(t,{children:e(r.Label.Prime.R,{children:"Label.Prime"})})]})},{children:o(u,{children:[e(t,{children:"<Button.Label.Sub ... />"}),e(t,{children:e(r.Label.Sub.R,{children:"Label.Sub"})})]})},{children:o(u,{children:[e(t,{children:"<Button.Label.Border ... />"}),e(t,{children:e(r.Label.Border.R,{children:"Label.Border"})})]}),styles:{borderBottom:"unset"}}]})})]}),o(t,{styles:{ssCardBox:!0},children:[e(n.ThirdTitle,{styles:{padding:1,borderBottom:!0},children:"\u30FBAnchor"}),e(t,{styles:{padding:1,overflow:"auto"},children:e(z,{rowStyles:{padding:[1,0],horizontalAlign:"between",borderBottom:"2.normal"},rows:[{children:o(u,{children:[e(t,{children:"<Button.Anchor.Prime ... />"}),e(t,{children:e(r.Anchor.Prime.R,{href:"",children:"Anchor.Prime"})})]})},{children:o(u,{children:[e(t,{children:"<Button.Anchor.Sub ... />"}),e(t,{children:e(r.Anchor.Sub.R,{href:"",children:"Anchor.Sub"})})]})},{children:o(u,{children:[e(t,{children:"<Button.Anchor.Border ... />"}),e(t,{children:e(r.Anchor.Border.R,{href:"",children:"Anchor.Border"})})]}),styles:{borderBottom:"unset"}}]})})]}),o(t,{styles:{ssCardBox:!0},children:[e(n.ThirdTitle,{styles:{padding:1,borderBottom:!0},children:"\u30FBSizes"}),o(p,{styles:{gridCols:2,padding:1,gap:2},children:[e(t,{styles:{flexCenter:!0},children:e(r.Button.Prime.XS,{children:'size="XS"'})}),e(t,{styles:{flexCenter:!0},children:e(r.Button.Prime.S,{children:'size="S"'})}),e(t,{styles:{flexCenter:!0},children:e(r.Button.Prime.R,{children:'size="R"'})}),e(t,{styles:{flexCenter:!0},children:e(r.Button.Prime.L,{children:'size="L"'})})]})]})]}),Segmented:()=>o(t,{styles:{ssCardBox:!0},children:[e(n.ThirdTitle,{styles:{padding:1,borderBottom:!0},children:"Segmented"}),o(g,{styles:{overflow:"auto",gap:2,padding:3},children:[e(i.Segmented.Auto,{tone:"cloud",value:1,options:[{value:0,label:e(x.AngleLeft,{})},{value:1,label:e(x.AngleRight,{})},{value:2,label:e(x.AngleUp,{})},{value:3,label:e(x.AngleDown,{})}]}),e(i.Segmented.Cloud,{value:1,options:[{value:0,label:e(x.AngleLeft,{})},{value:1,label:e(x.AngleRight,{})},{value:2,label:e(x.AngleUp,{})},{value:3,label:e(x.AngleDown,{})}]}),e(i.Segmented.Cloud2,{value:1,options:[{value:0,label:e(x.AngleLeft,{})},{value:1,label:e(x.AngleRight,{})},{value:2,label:e(x.AngleUp,{})},{value:3,label:e(x.AngleDown,{})}]}),e(i.Segmented.Cloud3,{value:1,options:[{value:0,label:e(x.AngleLeft,{})},{value:1,label:e(x.AngleRight,{})},{value:2,label:e(x.AngleUp,{})},{value:3,label:e(x.AngleDown,{})}]}),e(i.Segmented.Border,{value:1,options:[{value:0,label:"On"},{value:1,label:"Off"}]}),e(i.Segmented.Border2,{value:1,options:[{value:0,label:"On"},{value:1,label:"Off"}]}),e(i.Segmented.BottomLine,{value:1,options:[{value:0,label:"Takana"},{value:1,label:"Mentai"},{value:2,label:"Mayo"},{value:3,label:"Gyudon"}]})]})]})},oe={index:()=>{let l=a=>e(t,N(I({},a),{styles:I({flexCenter:!0,ssCardBox:"layer",textAlign:"center",padding:2},a.styles)}));return o(c,{styles:{gap:4},children:[o(c,{children:[e(n.Paragraph,{children:"Shadows"}),o(p,{styles:{gap:2,gridCols:4},children:[e(l,{styles:{boxShadow:"0.min"},children:"0.min"}),e(l,{styles:{boxShadow:"0.normal"},children:"0.normal"}),e(l,{styles:{boxShadow:"0.remark"},children:"0.remark"}),e(l,{styles:{boxShadow:"0.max"},children:"0.max"}),e(l,{styles:{boxShadow:"1.min"},children:"1.min"}),e(l,{styles:{boxShadow:"1.normal"},children:"1.normal"}),e(l,{styles:{boxShadow:"1.remark"},children:"1.remark"}),e(l,{styles:{boxShadow:"1.max"},children:"1.max"}),e(l,{styles:{boxShadow:"2.min"},children:"2.min"}),e(l,{styles:{boxShadow:"2.normal"},children:"2.normal"}),e(l,{styles:{boxShadow:"2.remark"},children:"2.remark"}),e(l,{styles:{boxShadow:"2.max"},children:"2.max"}),e(l,{styles:{boxShadow:"3.min"},children:"3.min"}),e(l,{styles:{boxShadow:"3.normal"},children:"3.normal"}),e(l,{styles:{boxShadow:"3.remark"},children:"3.remark"}),e(l,{styles:{boxShadow:"3.max"},children:"3.max"}),e(l,{styles:{boxShadow:"4.min"},children:"4.min"}),e(l,{styles:{boxShadow:"4.normal"},children:"4.normal"}),e(l,{styles:{boxShadow:"4.remark"},children:"4.remark"}),e(l,{styles:{boxShadow:"4.max"},children:"4.max"}),e(l,{styles:{boxShadow:"5.min"},children:"5.min"}),e(l,{styles:{boxShadow:"5.normal"},children:"5.normal"}),e(l,{styles:{boxShadow:"5.remark"},children:"5.remark"}),e(l,{styles:{boxShadow:"5.max"},children:"5.max"})]})]}),o(c,{children:[e(n.Paragraph,{children:"Inset Shadows"}),o(p,{styles:{gap:2,gridCols:4},children:[e(l,{styles:{boxShadow:"0.min.inset"},children:"0.min.inset"}),e(l,{styles:{boxShadow:"0.normal.inset"},children:"0.normal.inset"}),e(l,{styles:{boxShadow:"0.remark.inset"},children:"0.remark.inset"}),e(l,{styles:{boxShadow:"0.max.inset"},children:"0.max.inset"}),e(l,{styles:{boxShadow:"1.min.inset"},children:"1.min.inset"}),e(l,{styles:{boxShadow:"1.normal.inset"},children:"1.normal.inset"}),e(l,{styles:{boxShadow:"1.remark.inset"},children:"1.remark.inset"}),e(l,{styles:{boxShadow:"1.max.inset"},children:"1.max.inset"}),e(l,{styles:{boxShadow:"2.min.inset"},children:"2.min.inset"}),e(l,{styles:{boxShadow:"2.normal.inset"},children:"2.normal.inset"}),e(l,{styles:{boxShadow:"2.remark.inset"},children:"2.remark.inset"}),e(l,{styles:{boxShadow:"2.max.inset"},children:"2.max.inset"}),e(l,{styles:{boxShadow:"3.min.inset"},children:"3.min.inset"}),e(l,{styles:{boxShadow:"3.normal.inset"},children:"3.normal.inset"}),e(l,{styles:{boxShadow:"3.remark.inset"},children:"3.remark.inset"}),e(l,{styles:{boxShadow:"3.max.inset"},children:"3.max.inset"})]})]})]})}},re=()=>{const l={Basic:()=>o(t,{styles:{ssCardBox:!0},children:[e(n.Paragraph,{styles:{padding:1,borderBottom:!0},children:"TextInput"}),o(t,{styles:{padding:1},children:[o(B.Separate,{styles:{marginBottom:2},children:[e(n.Description,{children:`<Input.Text
70
70
  required
71
71
  value={ 'hello React!!' }
72
- />`}),t(x,{gap:"1/2",children:[t(o,{children:["testInputLabel ",e(d.Comps.RequiredSign,{})]}),e(d.Text.Normal,{required:!0,value:"helloReact"})]})]}),t(h,{gap:2,flexChilds:"auto",children:[t(o,{children:["Input.Text.Email",e(d.Text.Email,{autoComplete:"off",name:"emailInput",value:"******@gmail.com"})]}),t(o,{children:["Input.Text.Number",e(d.Text.Number,{value:"324"})]}),t(o,{children:["Input.Text.Number(zero)",e(d.Text.Normal,{restrict:"number.zeroStart",value:"0324"})]}),t(o,{children:["Input.DigitCharacters",e(d.DigitCharacters,{numericOnly:!0,value:"0324",digits:6})]}),t(o,{children:["Input.Text.Tel",e(d.Text.Tel,{value:"080-6995-2229"})]}),t(o,{children:["Input.Text.Money.JPY",e(d.Text.Money.JPY,{value:"3000"})]}),t(o,{children:["Input.Text.Url",e(d.Text.Url,{value:"http://google.com"})]}),t(o,{children:["Input.Text.Postal",t(B.Right,{children:[e(o,{flexSizing:0,children:e(d.Text.Postal,{override:"force"})}),e(r.Button.Border.R,{onClick:()=>A(void 0,null,function*(){}),children:"\u73FE\u5728\u5730\u3092\u53D6\u5F97"})]}),e(o,{id:"postalResult",padding:1,textAlign:"left"})]}),t(o,{children:["Input.Text.Password",e(d.Text.Password,{value:"onigiriUmai"})]}),t(o,{flexNewLine:!0,children:["Input.TextArea",e(d.TextArea,{value:`text1
72
+ />`}),o(c,{styles:{gap:"1/2"},children:[o(t,{children:["testInputLabel ",e(i.Comps.RequiredSign,{})]}),e(i.Text.Normal,{required:!0,value:"helloReact"})]})]}),o(g,{styles:{gap:2,flexChilds:"auto"},children:[o(t,{children:["Input.Text.Email",e(i.Text.Email,{autoComplete:"off",name:"emailInput",value:"******@gmail.com"})]}),o(t,{children:["Input.Text.Number",e(i.Text.Number,{value:"324"})]}),o(t,{children:["Input.Text.Number(zero)",e(i.Text.Normal,{restrict:"number.zeroStart",value:"0324"})]}),o(t,{children:["Input.DigitCharacters",e(i.DigitCharacters,{numericOnly:!0,value:"0324",digits:6})]}),o(t,{children:["Input.Text.Tel",e(i.Text.Tel,{value:"080-6995-2229"})]}),o(t,{children:["Input.Text.Money.JPY",e(i.Text.Money.JPY,{value:"3000"})]}),o(t,{children:["Input.Text.Url",e(i.Text.Url,{value:"http://google.com"})]}),o(t,{children:["Input.Text.Postal",o(B.Right,{children:[e(t,{styles:{flexSizing:0},children:e(i.Text.Postal,{override:"force"})}),e(r.Button.Border.R,{onClick:()=>G(void 0,null,function*(){}),children:"\u73FE\u5728\u5730\u3092\u53D6\u5F97"})]}),e(t,{id:"postalResult",styles:{padding:1,textAlign:"left"}})]}),o(t,{children:["Input.Text.Password",e(i.Text.Password,{value:"onigiriUmai"})]}),o(t,{styles:{flexNewLine:!0},children:["Input.TextArea",e(i.TextArea,{value:`text1
73
73
  text2
74
74
  text3
75
75
  text4
76
- text5`,rows:5})]})]})]})]}),Time:()=>e(u,{children:t(o,{ssCardBox:!0,children:[e(l.Paragraph,{padding:1,borderBottom:!0,children:"Time Input"}),e(o,{padding:1,children:t(h,{gap:2,flexChilds:"auto",children:[t(o,{children:["Input.Time.Clock",e(d.Time.Clock,{})]}),t(o,{children:["Input.Time.Date",e(d.Time.Date,{})]}),t(o,{children:["Input.Time.Week",e(d.Time.Week,{})]}),t(o,{children:["Input.Time.Month",e(d.Time.Month,{})]}),t(o,{children:["Input.Time.Year",e(d.Time.Year,{})]}),t(o,{children:["Input.Time.Periods.Date",e(d.Time.Periods.Date,{})]}),t(o,{children:["Input.Time.Periods.Month",e(d.Time.Periods.Month,{})]}),t(o,{children:["Input.Time.DateWareki",e(d.Time.DateWareki,{})]}),t(o,{children:["Input.Time.picker",e(d.Select,{id:"timePicker",options:[{value:"clock",label:"clock"},{value:"date",label:"date"},{value:"week",label:"week"},{value:"month",label:"month"},{value:"year",label:"year"},{value:"dates",label:"dates"},{value:"months",label:"months"},{value:"dateWareki",label:"dateWareki"}],onUpdateValidValue:({value:i})=>{d.Time.fn.picker.launch({parent:"#timePicker",restrict:i,defaultValue:"",onValueUpdate:s=>{console.log(s)}})}})]})]})})]})}),List:()=>e(u,{children:t(o,{ssCardBox:!0,children:[e(l.Paragraph,{padding:1,borderBottom:!0,children:"Radio & Checkbox Input"}),e(o,{padding:1,children:t(x,{children:[t(h,{gap:2,flexChilds:"auto",children:[t(o,{children:["Input.Radio",e(d.Radio,{value:[1],options:[{value:1,label:"option1"},{value:2,label:"option2"},{value:3,label:"option3"},{value:4,label:"option4"},{value:5,label:"option5"}]})]}),t(o,{children:["Input.Checkbox",e(d.Checkbox,{value:[2,"3"],options:[{value:"1",label:"option1"},{value:"2",label:"option2"},{value:"3",label:"option3"}]})]})]}),t(x,{children:[e(l.Paragraph,{children:"Tones"}),t(h,{gap:2,flexChilds:"auto",children:[e(d.Radio,{tone:"plain",value:[1],gap:1,options:[{value:1,label:"Option1"},{value:2,label:"Option2"},{value:3,label:"Option3"}]}),e(d.Radio,{tone:"normal",value:[1],options:[{value:1,label:"Option1"},{value:2,label:"Option2"},{value:3,label:"Option3"}]}),e(d.Radio,{tone:"cloud",value:[1],options:[{value:1,label:"Option1"},{value:2,label:"Option2"},{value:3,label:"Option3"}]}),e(d.Radio,{tone:"border",value:[1],options:[{value:1,label:"Option1"},{value:2,label:"Option2"},{value:3,label:"Option3"}]}),e(d.Radio,{tone:"vivid",value:[1],options:[{value:1,label:"Option1"},{value:2,label:"Option2"},{value:3,label:"Option3"}]})]})]})]})})]})}),Select:()=>e(u,{children:t(o,{ssCardBox:!0,children:[e(l.Paragraph,{padding:1,borderBottom:!0,children:"Select,Search,Chips Input"}),e(o,{padding:1,children:e(x,{children:t(h,{gap:2,flexChilds:"auto",children:[t(o,{children:["Input.Select",e(d.Select,{required:!0,value:3,options:[{value:1,label:"option1"},{value:2,label:"option2"},{value:3,label:"option3a"},{value:4,label:"option4"}]})]}),t(o,{children:["Input.Search",e(d.Search,{required:!0,defaultOptions:[{value:1,label:"1"},{value:{value1:2,value2:3},label:"Object"},{value:3,label:"3"},{value:101,label:"101"},{value:102,label:"102"}],onDynamicSearch:(...i)=>A(void 0,null,function*(){let s=[];for(let g=0;g<100;g++)s.push({value:g,label:String(g)});return{options:s}})})]}),t(o,{flexNewLine:!0,children:["Input.Chips",e(d.Chips,{limit:5,value:[{value:"option3",label:"option3"}],onUpdateValidValue:({value:i})=>{console.log(i)},defaultOptions:[{value:1,label:"option1"},{value:2,label:"option2"},{value:3,label:"option3"},{value:4,label:"option4"}]})]})]})})})]})}),Variables:()=>e(u,{children:t(o,{ssCardBox:!0,children:[e(l.Paragraph,{padding:1,borderBottom:!0,children:"Variables"}),e(o,{padding:1,children:e(x,{children:t(h,{gap:2,flexChilds:"auto",children:[t(o,{children:["Input.File",e(d.Filer,{limit:3})]}),t(o,{children:["Input.Switch",t(h,{gap:2,children:[e(d.Switch,{}),e(d.Switch,{appearance:"applely",color:"icicles",value:!0}),e(d.Switch,{appearance:"applely",icon:e(c.Check,{}),color:"warn",value:!0})]})]}),t(o,{flexNewLine:!0,children:["Input.Slider",e(d.Slider,{color:"battery",name:"sliderInput",value:40,step:10,min:0,max:100})]})]})})})]})})};return e(u,{children:e(_,{size:"L",children:t(p,{gap:2,gridCols:2,children:[e(n.Basic,{}),e(n.Select,{}),e(n.Time,{}),e(n.List,{}),e(n.Variables,{})]})})})},ne=()=>{const n=i=>{let s="testModal2";b.open({type:i,sheetID:s,size:"S",padding:2,content:t(b.Comps.Body,{padding:1,children:[e(o,{padding:2,children:"Content"}),e(B.Right,{children:e(r.Button.Prime.R,{onClick:()=>{b.close(s)},children:"\u9589\u3058\u308B"})})]})})};return t(u,{children:[t(o,{ssCardBox:!0,children:[e(l.SubTitle,{padding:1,borderBottom:!0,children:"CardBox"}),e(o,{padding:1,overflow:"auto",children:e(l.Description,{children:`<Box ssCardBox>
76
+ text5`,rows:5})]}),o(t,{styles:{flexNewLine:!0},children:["Input.AutoHeightText",e(i.AutoHeightText,{value:"",freeCSS:{minHeight:72},onUpdateValidValue:a=>{console.log(a)}})]})]})]})]}),Time:()=>e(u,{children:o(t,{styles:{ssCardBox:!0},children:[e(n.Paragraph,{styles:{padding:1,borderBottom:!0},children:"Time Input"}),e(t,{styles:{padding:1},children:o(g,{styles:{gap:2,flexChilds:"auto"},children:[o(t,{children:["Input.Time.Clock",e(i.Time.Clock,{})]}),o(t,{children:["Input.Time.Date",e(i.Time.Date,{})]}),o(t,{children:["Input.Time.Week",e(i.Time.Week,{})]}),o(t,{children:["Input.Time.Month",e(i.Time.Month,{})]}),o(t,{children:["Input.Time.Year",e(i.Time.Year,{})]}),o(t,{children:["Input.Time.Periods.Date",e(i.Time.Periods.Date,{})]}),o(t,{children:["Input.Time.Periods.Month",e(i.Time.Periods.Month,{})]}),o(t,{children:["Input.Time.DateWareki",e(i.Time.DateWareki,{})]}),o(t,{children:["Input.Time.picker",e(i.Select,{id:"timePicker",options:[{value:"clock",label:"clock"},{value:"date",label:"date"},{value:"week",label:"week"},{value:"month",label:"month"},{value:"year",label:"year"},{value:"dates",label:"dates"},{value:"months",label:"months"},{value:"dateWareki",label:"dateWareki"}],onUpdateValidValue:({value:a})=>{i.Time.fn.picker.launch({parent:"#timePicker",restrict:a,defaultValue:"",onValueUpdate:d=>{console.log(d)}})}})]})]})})]})}),List:()=>e(u,{children:o(t,{styles:{ssCardBox:!0},children:[e(n.Paragraph,{styles:{padding:1,borderBottom:!0},children:"Radio & Checkbox Input"}),e(t,{styles:{padding:1},children:o(c,{children:[o(g,{styles:{gap:2,flexChilds:"auto"},children:[o(t,{children:["Input.Radio",e(i.Radio,{value:[1],options:[{value:1,label:"option1"},{value:2,label:"option2"},{value:3,label:"option3"},{value:4,label:"option4"},{value:5,label:"option5"}]})]}),o(t,{children:["Input.Checkbox",e(i.Checkbox,{value:[2,"3"],minSelect:2,hideInput:!0,options:[{value:"1",label:"option1"},{value:"2",label:"option2"},{value:"3",label:"option3"}]})]})]}),o(c,{children:[e(n.Paragraph,{children:"Tones"}),o(g,{styles:{gap:2,flexChilds:"auto"},children:[e(i.Radio,{tone:"plain",value:[1],styles:{gap:1},options:[{value:1,label:"Option1"},{value:2,label:"Option2"},{value:3,label:"Option3"}]}),e(i.Radio,{tone:"normal",value:[1],options:[{value:1,label:"Option1"},{value:2,label:"Option2"},{value:3,label:"Option3"}]}),e(i.Radio,{tone:"cloud",value:[1],options:[{value:1,label:"Option1"},{value:2,label:"Option2"},{value:3,label:"Option3"}]}),e(i.Radio,{tone:"border",value:[1],options:[{value:1,label:"Option1"},{value:2,label:"Option2"},{value:3,label:"Option3"}]}),e(i.Radio,{tone:"vivid",value:[1],options:[{value:1,label:"Option1"},{value:2,label:"Option2"},{value:3,label:"Option3"}]})]})]})]})})]})}),Select:()=>e(u,{children:o(t,{styles:{ssCardBox:!0},children:[e(n.Paragraph,{styles:{padding:1,borderBottom:!0},children:"Select,Search,Chips Input"}),e(t,{styles:{padding:1},children:e(c,{children:o(g,{styles:{gap:2,flexChilds:"auto"},children:[o(t,{children:["Input.Select",e(i.Select,{required:!0,value:3,options:[{value:1,label:"option1"},{value:2,label:"option2"},{value:3,label:"option3a"},{value:4,label:"option4"}]})]}),o(t,{children:["Input.Search",e(i.Search,{required:!0,defaultOptions:[{value:1,label:"1"},{value:{value1:2,value2:3},label:"Object"},{value:3,label:"3"},{value:101,label:"101"},{value:102,label:"102"}],onDynamicSearch:(...a)=>G(void 0,null,function*(){let d=[];for(let h=0;h<100;h++)d.push({value:h,label:String(h)});return{options:d}})})]}),o(t,{styles:{flexNewLine:!0},children:["Input.Chips",e(i.Chips,{limit:5,value:[{value:"option3",label:"option3"}],onUpdateValidValue:({value:a})=>{console.log(a)},defaultOptions:[{value:1,label:"option1"},{value:2,label:"option2"},{value:3,label:"option3"},{value:4,label:"option4"}]})]})]})})})]})}),Variables:()=>e(u,{children:o(t,{styles:{ssCardBox:!0},children:[e(n.Paragraph,{styles:{padding:1,borderBottom:!0},children:"Variables"}),e(t,{styles:{padding:1},children:e(c,{children:o(g,{styles:{gap:2,flexChilds:"auto"},children:[o(t,{children:["Input.File",e(i.Filer,{limit:3})]}),o(t,{children:["Input.Switch",o(g,{styles:{gap:2},children:[e(i.Switch,{}),e(i.Switch,{appearance:"applely",color:"icicles",value:!0}),e(i.Switch,{appearance:"applely",icon:e(x.Check,{}),color:"warn",value:!0})]})]}),o(t,{styles:{flexNewLine:!0},children:["Input.Slider",e(i.Slider,{color:"battery",name:"sliderInput",value:40,step:10,min:0,max:100})]})]})})})]})})};return e(u,{children:e(_,{size:"L",children:o(p,{styles:{gap:2,gridCols:2},children:[e(l.Basic,{}),e(l.Select,{}),e(l.Time,{}),e(l.List,{}),e(l.Variables,{})]})})})},le=()=>{const l=a=>{let d="testModal2";y.open({type:a,sheetID:d,size:"S",styles:{padding:2},content:o(y.Comps.Body,{styles:{padding:1},children:[e(t,{styles:{padding:2},children:"Content"}),e(B.Right,{children:e(r.Button.Prime.R,{onClick:()=>{y.close(d)},children:"\u9589\u3058\u308B"})})]})})};return o(u,{children:[o(t,{styles:{ssCardBox:!0},children:[e(n.SubTitle,{styles:{padding:1,borderBottom:!0},children:"CardBox"}),e(t,{styles:{padding:1,overflow:"auto"},children:e(n.Description,{children:`<Box styles={{ssCardBox:true}}>
77
77
  <Box>
78
78
  Header
79
79
  </Box>
@@ -84,16 +84,16 @@ text5`,rows:5})]})]})]})]}),Time:()=>e(u,{children:t(o,{ssCardBox:!0,children:[e
84
84
  <Box>
85
85
  Footer
86
86
  </Box>
87
- </Box>`})}),e(o,{padding:2,children:t(o,{ssCardBox:!0,children:[e(l.SubTitle,{padding:1,borderBottom:!0,children:"Header"}),e(o,{padding:1,overflow:"auto",children:"Body"}),e(o,{padding:1,children:"Footer"})]})})]}),t(o,{ssCardBox:!0,children:[e(l.SubTitle,{padding:1,borderBottom:!0,children:"List"}),e(o,{padding:1,overflow:"auto",children:e(l.Description,{children:`<List
87
+ </Box>`})}),e(t,{styles:{padding:2},children:o(t,{styles:{ssCardBox:!0},children:[e(n.SubTitle,{styles:{padding:1,borderBottom:!0},children:"Header"}),e(t,{styles:{padding:1,overflow:"auto"},children:"Body"}),e(t,{styles:{padding:1},children:"Footer"})]})})]}),o(t,{styles:{ssCardBox:!0},children:[e(n.SubTitle,{styles:{padding:1,borderBottom:!0},children:"List"}),e(t,{styles:{padding:1,overflow:"auto"},children:e(n.Description,{children:`<List
88
88
  options={ [
89
89
  {
90
90
  title?: LeftSideReactComponent,
91
91
  content: RightSideReactComponent
92
92
  }
93
93
  ] }
94
- />`})}),e(o,{padding:2,overflow:"auto",children:e(y,{border:!0,rowStyles:{padding:1,borderBottom:!0},rows:[{children:t(u,{children:[e(o,{children:"Title1"}),e(o,{children:e(o,{children:"Content1"})})]}),horizontalAlign:"between"},{children:t(u,{children:[e(o,{flexGrid:1,children:"Title2"}),e(o,{flexGrid:2,children:e(o,{children:"Content2"})})]})},{children:t(u,{children:[e(o,{children:"Title3"}),e(o,{children:e(o,{children:"Content3"})})]}),flexType:"col"},{children:e(u,{children:e(o,{children:e(o,{children:"Content4"})})}),borderBottom:"unset"}]})})]}),t(o,{ssCardBox:!0,children:[e(l.SubTitle,{padding:1,borderBottom:!0,children:"Sheet"}),e(o,{padding:1,overflow:"auto",children:e(l.Description,{children:`Sheet.open( {
94
+ />`})}),e(t,{styles:{padding:2,overflow:"auto"},children:e(z,{styles:{border:!0},rowStyles:{padding:1,borderBottom:!0},rows:[{children:o(u,{children:[e(t,{children:"Title1"}),e(t,{children:e(t,{children:"Content1"})})]}),styles:{horizontalAlign:"between"}},{children:o(u,{children:[e(t,{styles:{flexGrid:1},children:"Title2"}),e(t,{styles:{flexGrid:2},children:e(t,{children:"Content2"})})]})},{children:o(u,{children:[e(t,{children:"Title3"}),e(t,{children:e(t,{children:"Content3"})})]}),styles:{flexType:"col"}},{children:e(u,{children:e(t,{children:e(t,{children:"Content4"})})}),styles:{borderBottom:"unset"}}]})})]}),o(t,{styles:{ssCardBox:!0},children:[e(n.SubTitle,{styles:{padding:1,borderBottom:!0},children:"Sheet"}),e(t,{styles:{padding:1,overflow:"auto"},children:e(n.Description,{children:`Sheet.open( {
95
95
  sheetID: 'sheetID',
96
96
  header: ReactElement | React.FC< { modalClose } >,
97
97
  body: ReactElement | React.FC< { modalClose } >,
98
98
  footer: ReactElement | React.FC< { modalClose } >
99
- } )`})}),t(x,{padding:2,children:[e(r.Button.Border.R,{onClick:i=>{k.open({tipsID:"testTips",parent:i.currentTarget,close_option:{parentBlur:!1,aroundClick:!1,escapeKeyDown:!0},content:()=>e(b.Comps.Body,{padding:2,children:e(r.Button.Prime.R,{onClick:()=>{b.open({sheetID:"testSheet",close_option:{aroundClick:!0},type:"normal.middleLeft",content:()=>e(b.Comps.Body,{padding:2,children:"END"})})},children:"nest"})})})},children:"Tooltips with nested sheet"}),e(o,{flexCenter:!0,children:t(p,{gridCols:3,gap:1,children:[e(r.Button.Border.R,{onClick:()=>{n("normal.topLeft")},children:"Top Left"}),e(r.Button.Border.R,{onClick:()=>{n("normal.topCenter")},children:"Top Center"}),e(r.Button.Border.R,{onClick:()=>{n("normal.topRight")},children:"Top Right"}),e(r.Button.Border.R,{onClick:()=>{n("normal.middleLeft")},children:"Middle Left"}),e(r.Button.Border.R,{onClick:()=>{n("normal.middleCenter")},children:"Middle Center"}),e(r.Button.Border.R,{onClick:()=>{n("normal.middleRight")},children:"Middle Right"}),e(r.Button.Border.R,{onClick:()=>{n("normal.bottomLeft")},children:"Bottom Left"}),e(r.Button.Border.R,{onClick:()=>{n("normal.bottomCenter")},children:"Bottom Center"}),e(r.Button.Border.R,{onClick:()=>{n("normal.bottomRight")},children:"Bottom Right"}),e(r.Button.Border.R,{onClick:()=>{n("drawer.left")},children:"Drawer Left"}),e(r.Button.Border.R,{onClick:()=>{n("drawer.bottom")},children:"Drawer Bottom"}),e(r.Button.Border.R,{onClick:()=>{n("drawer.right")},children:"Drawer Right"}),e(r.Button.Border.R,{onClick:i=>{k.open({tipsID:"test40",parent:i.currentTarget,content:e(o,{padding:1,border:!0,borderRadius:2,backgroundColor:"dark",fontColor:"white",children:"Content"})})},children:"Open Tooltips"})]})}),t(B.Center,{children:["Image Picker",e(w,{src:a.Images.defaultIcon("user"),unitWidth:6,unitHeight:6,showExpand:!0})]})]})]})]})},F={index:()=>e(u,{children:t(x,{children:[e(F.Normal,{}),e(F.Data,{}),e(F.Drag,{}),e(F.Spread,{})]})}),Normal:()=>{let n=[];for(var i=0;i<10;i++){let s=[{children:"head_"+i},{children:"data_"+i},{children:"data_"+i}];n.push(s)}return t(u,{children:[e(o,{fontSize:"5.subTitle",children:"Table.Normal"}),e(C.Normal,{colLength:3,head:[{children:"head1"},{children:"head2"},{children:"head3"}],rows:n,ssCardBox:!0,onRowClick:s=>{console.log(s)}})]})},Drag:()=>{let n=[];for(var i=0;i<4;i++){let s=[{children:"head_"+i},{children:"data_"+i},{children:"data_"+i}];s.rowID="rowID-"+i,n.push(s)}return t(u,{children:[e(o,{fontSize:"5.subTitle",children:"Table.Drag"}),e(C.Drag,{colLength:3,head:[{children:"head1"},{children:"head2"},{children:"head3"}],rows:n,ssCardBox:!0,onOrderChanged:s=>{console.log(s)}})]})},Data:()=>{let n=[];for(var i=0;i<100;i++){let g=Math.round(Math.random()*50+1),T=Math.round(Math.random()*50+1),L=Math.round(Math.random()*50+1),m="name_"+g,W="data_"+T,I="data_"+L,q=[{type:"th",children:i+":"+m,data:m,orderIndex:i},{type:"td",children:W,data:W},{type:"td",children:I,data:I}];n.push(q)}n[1].checked=!0,n[4].checked=!0,n[10].checked=!0;let s="testDataTable";return t(u,{children:[t(h,{horizontalAlign:"between",children:[e(o,{fontSize:"5.subTitle",children:"Table.Data"}),t(h,{gap:"1/2",backgroundColor:"theme",borderRadius:"1.tone.primary",overflow:"hidden",fontColor:"white",children:[e(r.Button.Clear.R,{color:"white",children:"SubmitButton"}),e(o,{flexSizing:"none",unitWidth:"1/4",backgroundColor:"layer.4.opa.middle",isRounded:!0,margin:["2/3",0]}),e(r.Button.Clear.R,{padding:[0,1],color:"white",onClick:g=>{k.open({tipsID:S.uuid.gen(),parent:g.target,gravityPoint:24,close_option:{aroundClick:!0,parentBlur:!1},content:e(u,{children:t(x,{gap:0,padding:["2/3",0],backgroundColor:"layer.1",borderRadius:2,boxShadow:"0.normal",overflow:"hidden",children:[e(r.Button.Clear.S,{borderRadius:0,borderBottom:"1.thin",children:"\u3059\u3079\u3066\u3092\u51FA\u529B"}),e(r.Button.Clear.S,{borderRadius:0,borderBottom:"1.thin",children:"\u3053\u306E\u30DA\u30FC\u30B8\u306E\u307F\u51FA\u529B"}),e(r.Button.Clear.S,{borderRadius:0,children:"\u30C1\u30A7\u30C3\u30AF\u3057\u305F\u884C\u306E\u307F\u51FA\u529B"})]})})})},children:e(c.EllipsisV,{})})]})]}),t(B.Separate,{verticalAlign:"bottom",children:[t(B.Left,{verticalAlign:"bottom",children:[e(C.Data.SearchInput,{tableID:s}),e(C.Data.Info,{tableID:s})]}),t(B.Right,{verticalAlign:"unset",children:[e(C.Data.RowLength,{tableID:s,lengthSelect:[30,50,100]}),e(C.Data.Paging,{tableID:s})]})]}),e(C.Data,{tableID:s,colLength:3,head:[{data:"head1"},{data:"head2"},{data:"head3"}],rows:n,pageRowLength:30,ssCardBox:!0,filter:[!0],checker:!0})]})},Spread:()=>e(u,{children:e(o,{fontSize:"5.subTitle",children:"Table.Spread"})})},le=()=>{let[n,i]=D(""),[s,g]=D(""),[T,L]=D("");return e(u,{children:t(o,{children:[t(r.Button.Prime.R,{onClick:()=>{ee.open({use:"square",develops:[{size:"S"},{size:"R"},{size:"L"}],onProcessFinished:m=>A(void 0,null,function*(){i(yield m[0].toDataUrl()),g(yield m[1].toDataUrl()),L(yield m[2].toDataUrl())})})},children:[e(c.Image,{})," \u30A4\u30E1\u30FC\u30B8\u3092\u9078\u629E"]}),t(h,{verticalAlign:"top",gap:1,children:[n&&e(w,{isRounded:!0,src:n,alt:"",showExpand:!0,freeCSS:{maxWidth:12*12}}),s&&e(w,{style:{maxWidth:24*12},src:s,alt:"",showExpand:!0}),T&&e(w,{style:{maxWidth:24*12},src:T,alt:"",showExpand:!0}),e($,{border:!0,borderWidth:3,margin:[3,"auto"],freeCSS:{width:12*10},slideIndex:1,options:{loop:!0,onSlideCallback:m=>{}},slides:[e(o,{backgroundColor:"nega",padding:3,flexCenter:!0,children:"test1"}),e(o,{backgroundColor:"posi",padding:3,flexCenter:!0,children:"test2"}),e(o,{backgroundColor:"warn",padding:3,flexCenter:!0,children:"test3"}),e(o,{backgroundColor:"theme",padding:3,flexCenter:!0,children:"test4"})]})]})]})})},V={Darkmode:n=>e(d.Segmented.Cloud,M(E({ssCardBox:!0,backgroundColor:"layer.1",isRounded:!0,gap:"1/6",fontColor:"4.thin",cellStyles:{flexCenter:!0,padding:["1/4","1/2"],isRounded:!0},cellCheckedStyles:{boxShadow:"2.normal",backgroundColor:"theme",fontColor:"white"}},n),{options:[{value:"light",label:"Light"},{value:"dim",label:"Dim"},{value:"dark",label:"Dark"}],value:R.get().darkMode,onUpdateValidValue:({value:i})=>{let s=i[0];S.setLocalStrageData("prf.darkMode",s),R.update.darkMode(s)}})),ThemeColor:()=>{const n=i=>{let s="themeColorSelector";b.open({sheetID:s,type:"normal.middleCenter",size:"L",close_option:{aroundClick:!0},closeAfter:()=>{oe.fn.updateCSSProperty.reset()},content:()=>{let[g,T]=D(i.defaultColor);N(()=>{S.scope(()=>{g!==R.get().themeColor&&(R.update.themeColor(g),S.setLocalStrageData("prf.themeColor",g),b.close(s))})},[g]);let L=Object.entries(Y).map(([m,W])=>{let I=m===g;return e(r.Button.Clear.R,{color:"cloud",textAlign:"center",onClick:()=>{T(m)},children:t(x,{textAlign:"center",gap:"1/2",children:[I&&e(l.Supplement,{padding:["1/4","1/2"],borderRadius:"3.tone.tertiary",backgroundColor:m,boxShadow:"2.normal",margin:"auto",fontColor:"white",fontSize:"0.xs",children:"\u8A2D\u5B9A\u4E2D"}),e(o,{position:"relative",margin:"auto",backgroundColor:m,ssSphere:2.5,children:e(o,{ssAbsoluteCovered:!0,border:!0,opacity:I?"max":"low",borderWidth:2,transition:"short",isRounded:!0,freeCSS:{transform:"scale(1.25)"}})}),e(l.Supplement,{ssTextEllipsis:!0,freeCSS:{lineHeight:1.25},children:m.toCapital()})]})},m)});return e(b.Comps.Body,{children:t(x,{padding:2,gap:2,children:[t(B.Separate,{children:[e(l.Paragraph,{children:"\u30C6\u30FC\u30DE\u3092\u9078\u629E"}),e(r.Button.Sub.R,{color:"cloud",ssSphere:3,onClick:()=>{b.close(s)},children:e(c.Times,{})})]}),e(p,{gap:"1/4",freeCSS:{gridTemplateColumns:"repeat(auto-fit, minmax(4.5rem, 1fr))"},children:L})]})})}})};return e(r.Button.Border.R,{isRounded:!0,fontColor:"theme",onClick:i=>{n({defaultColor:R.get().themeColor,cb:s=>{}})},children:t(B.Center,{gap:"1/3",children:[e(o,{boxShadow:"2.normal",ssSquare:1,borderRadius:"1/3",backgroundColor:"theme"}),"Theme: ",R.get().themeColor.toCapital()]})})}};let U=()=>{let[n,i]=D(Number(S.queryParams.get().ti)||0);return N(()=>{S.queryParams.set({ti:String(n)})},[n]),t(u,{children:[e(o,{position:"fixed",bottom:1,left:1,isRounded:!0,freeCSS:{zIndex:20},children:e(V.Darkmode,{})}),e(o,{position:"fixed",bottom:1,right:1,isRounded:!0,freeCSS:{zIndex:20},children:e(V.ThemeColor,{})}),t(x,{gap:0,minHeight:"contentHeight",backgroundColor:"layer.1",position:"relative",freeCSS:{zIndex:1},children:[e(Q,{borderBottom:!0,position:"sticky",backgroundColor:"layer.1",top:"topBase",tabIndex:n,tabs:["Basic","Shadows","Buttons","Inputs","Styling","Effection","Tables","Croppie","PlayGround","Logo"],onTabChange:s=>{localStorage.setItem("designTabHeader",String(s)),i(s)},UnderBreakPointStyles:{position:"static",top:0}}),e(o,{flexSizing:0,position:"relative",freeCSS:{zIndex:1},children:e(X,{viewIndex:n,views:[e(v.index,{}),e(te.index,{}),e(O.index,{}),e(re,{}),e(ne,{}),e(P.index,{}),e(F.index,{}),e(le,{}),e(f.index,{})],wrapper:s=>e(Z.FadeIn,{animationTime:200,children:e(_,{children:e(h,{gap:2,padding:2,flexWrap:!0,flexChilds:"auto",children:s})})},n)})})]})]})};export{U as DesignBook,U as default};
99
+ } )`})}),o(c,{styles:{padding:2},children:[e(r.Button.Border.R,{onClick:a=>{w.open({tipsID:"testTips",parent:a.currentTarget,close_option:{parentBlur:!1,aroundClick:!1,escapeKeyDown:!0},content:()=>e(y.Comps.Body,{styles:{padding:2},children:e(r.Button.Prime.R,{onClick:()=>{y.open({sheetID:"testSheet",close_option:{aroundClick:!0},type:"normal.middleLeft",content:()=>e(y.Comps.Body,{styles:{padding:2},children:"END"})})},children:"nest"})})})},children:"Tooltips with nested sheet"}),e(t,{styles:{flexCenter:!0},children:o(p,{styles:{gridCols:3,gap:1},children:[e(r.Button.Border.R,{onClick:()=>{l("normal.topLeft")},children:"Top Left"}),e(r.Button.Border.R,{onClick:()=>{l("normal.topCenter")},children:"Top Center"}),e(r.Button.Border.R,{onClick:()=>{l("normal.topRight")},children:"Top Right"}),e(r.Button.Border.R,{onClick:()=>{l("normal.middleLeft")},children:"Middle Left"}),e(r.Button.Border.R,{onClick:()=>{l("normal.middleCenter")},children:"Middle Center"}),e(r.Button.Border.R,{onClick:()=>{l("normal.middleRight")},children:"Middle Right"}),e(r.Button.Border.R,{onClick:()=>{l("normal.bottomLeft")},children:"Bottom Left"}),e(r.Button.Border.R,{onClick:()=>{l("normal.bottomCenter")},children:"Bottom Center"}),e(r.Button.Border.R,{onClick:()=>{l("normal.bottomRight")},children:"Bottom Right"}),e(r.Button.Border.R,{onClick:()=>{l("drawer.left")},children:"Drawer Left"}),e(r.Button.Border.R,{onClick:()=>{l("drawer.bottom")},children:"Drawer Bottom"}),e(r.Button.Border.R,{onClick:()=>{l("drawer.right")},children:"Drawer Right"}),e(r.Button.Border.R,{onClick:a=>{w.open({tipsID:"test40",parent:a.currentTarget,content:e(t,{styles:{padding:1,border:!0,borderRadius:2,backgroundColor:"dark",fontColor:"white"},children:"Content"})})},children:"Open Tooltips"})]})}),o(B.Center,{children:["Image Picker",e(R,{src:s.Images.defaultIcon("user"),styles:{unitWidth:6,unitHeight:6},showExpand:!0})]})]})]})]})},A={index:()=>e(u,{children:o(c,{children:[e(A.Normal,{}),e(A.Data,{}),e(A.Drag,{}),e(A.Spread,{})]})}),Normal:()=>{let l=[];for(var a=0;a<10;a++){let d=[{children:"head_"+a},{children:"data_"+a},{children:"data_"+a}];l.push(d)}return o(u,{children:[e(t,{styles:{fontSize:"5.subTitle"},children:"Table.Normal"}),e(C.Normal,{colLength:3,head:[{children:"head1"},{children:"head2"},{children:"head3"}],rows:l,styles:{ssCardBox:!0},onRowClick:d=>{console.log(d)}})]})},Drag:()=>{let l=[];for(var a=0;a<4;a++){let d=[{children:"head_"+a},{children:"data_"+a},{children:"data_"+a}];d.rowID="rowID-"+a,l.push(d)}return o(u,{children:[e(t,{styles:{fontSize:"5.subTitle"},children:"Table.Drag"}),e(C.Drag,{colLength:3,head:[{children:"head1"},{children:"head2"},{children:"head3"}],cellStyles:{},cellStylesCallback:()=>({}),rows:l,styles:{ssCardBox:!0},onOrderChanged:d=>{console.log(d)}})]})},Data:()=>{let l=[];for(var a=0;a<100;a++){let h=Math.round(Math.random()*50+1),f=Math.round(Math.random()*50+1),v=Math.round(Math.random()*50+1),m="name_"+h,M="data_"+f,L="data_"+v,q=[{type:"th",children:a+":"+m,data:m,orderIndex:a},{type:"td",children:M,data:M},{type:"td",children:L,data:L}];l.push(q)}l[1].checked=!0,l[4].checked=!0,l[10].checked=!0;let d="testDataTable";return o(u,{children:[o(g,{styles:{horizontalAlign:"between"},children:[e(t,{styles:{fontSize:"5.subTitle"},children:"Table.Data"}),o(g,{styles:{gap:"1/2",backgroundColor:"theme",borderRadius:"1.tone.primary",overflow:"hidden",fontColor:"white"},children:[e(r.Button.Clear.R,{color:"white",children:"SubmitButton"}),e(t,{styles:{flexSizing:"none",unitWidth:"1/4",backgroundColor:"layer.4.opa.middle",isRounded:!0,margin:["2/3",0]}}),e(r.Button.Clear.R,{styles:{padding:[0,1]},color:"white",onClick:h=>{w.open({tipsID:b.uuid.gen(),parent:h.target,gravityPoint:24,close_option:{aroundClick:!0,parentBlur:!1},content:o(c,{styles:{gap:0,padding:["2/3",0],backgroundColor:"layer.1",borderRadius:2,boxShadow:"0.normal",overflow:"hidden"},children:[e(r.Button.Clear.S,{styles:{borderRadius:0,borderBottom:"1.thin"},children:"\u3059\u3079\u3066\u3092\u51FA\u529B"}),e(r.Button.Clear.S,{styles:{borderRadius:0,borderBottom:"1.thin"},children:"\u3053\u306E\u30DA\u30FC\u30B8\u306E\u307F\u51FA\u529B"}),e(r.Button.Clear.S,{styles:{borderRadius:0},children:"\u30C1\u30A7\u30C3\u30AF\u3057\u305F\u884C\u306E\u307F\u51FA\u529B"})]})})},children:e(x.EllipsisV,{})})]})]}),o(B.Separate,{styles:{verticalAlign:"bottom"},children:[o(B.Left,{styles:{verticalAlign:"bottom"},children:[e(C.Data.SearchInput,{tableID:d}),e(C.Data.Info,{tableID:d})]}),o(B.Right,{styles:{verticalAlign:"unset"},children:[e(C.Data.RowLength,{tableID:d,lengthSelect:[30,50,100]}),e(C.Data.Paging,{tableID:d})]})]}),e(C.Data,{tableID:d,colLength:3,head:[{data:"head1"},{data:"head2"},{data:"head3"}],rows:l,pageRowLength:30,styles:{ssCardBox:!0},cellStyles:{},cellStylesCallback:()=>({}),filter:[!0],checker:!0})]})},Spread:()=>e(u,{children:e(t,{styles:{fontSize:"5.subTitle"},children:"Table.Spread"})})},ne=()=>{let[l,a]=D(""),[d,h]=D(""),[f,v]=D("");return e(u,{children:o(t,{children:[o(r.Button.Prime.R,{onClick:()=>{ee.open({use:"square",develops:[{size:"S"},{size:"R"},{size:"L"}],onProcessFinished:m=>G(void 0,null,function*(){a(yield m[0].toDataUrl()),h(yield m[1].toDataUrl()),v(yield m[2].toDataUrl())})})},children:[e(x.Image,{})," \u30A4\u30E1\u30FC\u30B8\u3092\u9078\u629E"]}),o(g,{styles:{verticalAlign:"top",gap:1},children:[l&&e(R,{styles:{isRounded:!0},src:l,alt:"",showExpand:!0,freeCSS:{maxWidth:12*12}}),d&&e(R,{style:{maxWidth:24*12},src:d,alt:"",showExpand:!0}),f&&e(R,{style:{maxWidth:24*12},src:f,alt:"",showExpand:!0}),e($,{styles:{border:!0,borderWidth:3,margin:[3,"auto"]},freeCSS:{width:12*10},slideIndex:1,options:{loop:!0,onSlideCallback:m=>{}},slides:[e(t,{styles:{padding:3,flexCenter:!0,backgroundColor:"nega"},children:"test1"}),e(t,{styles:{padding:3,flexCenter:!0,backgroundColor:"posi"},children:"test2"}),e(t,{styles:{padding:3,flexCenter:!0,backgroundColor:"warn"},children:"test3"}),e(t,{styles:{padding:3,flexCenter:!0,backgroundColor:"theme"},children:"test4"})]})]})]})})},U={Darkmode:l=>e(i.Segmented.Cloud,N(I({cellStyles:{flexCenter:!0,padding:["1/4","1/2"],isRounded:!0},cellCheckedStyles:{boxShadow:"2.normal",backgroundColor:"theme",fontColor:"white"}},l),{styles:I({ssCardBox:!0,backgroundColor:"layer.1",isRounded:!0,gap:"1/6",fontColor:"4.thin"},l.styles),options:[{value:"light",label:"Light"},{value:"dim",label:"Dim"},{value:"dark",label:"Dark"}],value:T.get().darkMode,onUpdateValidValue:({value:a})=>{let d=a[0];b.setLocalStrageData("prf.darkMode",d),T.update.darkMode(d)}})),ThemeColor:()=>{const l=a=>{let d="themeColorSelector";y.open({sheetID:d,type:"normal.middleCenter",size:"L",close_option:{aroundClick:!0},closeAfter:()=>{te.fn.updateCSSProperty.reset()},content:()=>{let[h,f]=D(a.defaultColor);W(()=>{b.scope(()=>{h!==T.get().themeColor&&(T.update.themeColor(h),b.setLocalStrageData("prf.themeColor",h),y.close(d))})},[h]);let v=Object.entries(Y).map(([m,M])=>{let L=m===h;return e(r.Button.Clear.R,{color:"cloud",styles:{textAlign:"center"},onClick:()=>{f(m)},children:o(c,{styles:{textAlign:"center",gap:"1/2"},children:[L&&e(n.Supplement,{styles:{padding:["1/4","1/2"],borderRadius:"3.tone.tertiary",backgroundColor:m,boxShadow:"2.normal",margin:"auto",fontColor:"white",fontSize:"0.xs"},children:"\u8A2D\u5B9A\u4E2D"}),e(t,{styles:{position:"relative",margin:"auto",backgroundColor:m,ssSphere:2.5},children:e(t,{styles:{ssAbsoluteCovered:!0,border:!0,opacity:L?"max":"low",borderWidth:2,transition:"short",isRounded:!0},freeCSS:{transform:"scale(1.25)"}})}),e(n.Supplement,{styles:{ssTextEllipsis:!0},freeCSS:{lineHeight:1.25},children:m.toCapital()})]})},m)});return e(y.Comps.Body,{children:o(c,{styles:{padding:2,gap:2},children:[o(B.Separate,{children:[e(n.Paragraph,{children:"\u30C6\u30FC\u30DE\u3092\u9078\u629E"}),e(r.Button.Sub.R,{color:"cloud",styles:{ssSphere:3},onClick:()=>{y.close(d)},children:e(x.Times,{})})]}),e(p,{styles:{gap:"1/4"},freeCSS:{gridTemplateColumns:"repeat(auto-fit, minmax(4.5rem, 1fr))"},children:v})]})})}})};return e(r.Button.Border.R,{styles:{isRounded:!0,fontColor:"theme"},onClick:a=>{l({defaultColor:T.get().themeColor,cb:d=>{}})},children:o(B.Center,{styles:{gap:"1/3"},children:[e(t,{styles:{boxShadow:"2.normal",ssSquare:1,borderRadius:"1/3",backgroundColor:"theme"}}),"Theme: ",T.get().themeColor.toCapital()]})})}};let H=()=>{let[l,a]=D(Number(b.queryParams.get().ti)||0);return W(()=>{b.queryParams.set({ti:String(l)})},[l]),o(u,{children:[e(t,{styles:{position:"fixed",bottom:1,left:1,isRounded:!0},freeCSS:{zIndex:20},children:e(U.Darkmode,{})}),e(t,{styles:{position:"fixed",bottom:1,right:1,isRounded:!0},freeCSS:{zIndex:20},children:e(U.ThemeColor,{})}),o(c,{styles:{gap:0,minHeight:"contentHeight",backgroundColor:"layer.1",position:"relative"},freeCSS:{zIndex:1},children:[e(Q,{styles:{borderBottom:!0,position:"sticky",backgroundColor:"layer.1",top:"topBase"},tabIndex:l,tabs:["Basic","Shadows","Buttons","Inputs","Styling","Effection","Tables","Croppie","PlayGround","Logo"],onTabChange:d=>{localStorage.setItem("designTabHeader",String(d)),a(d)},UnderBreakPointStyles:{position:"static",top:0}}),e(t,{styles:{flexSizing:0,position:"relative"},freeCSS:{zIndex:1},children:e(X,{viewIndex:l,views:[e(k.index,{}),e(oe.index,{}),e(E.index,{}),e(re,{}),e(le,{}),e(F.index,{}),e(A.index,{}),e(ne,{}),e(S.index,{})],wrapper:d=>e(Z.FadeIn,{animationTime:200,children:e(_,{children:e(g,{styles:{gap:2,padding:2,flexWrap:!0,flexChilds:"auto"},children:d})})},l)})})]})]})};export{H as DesignBook,H as default};
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "amotify",
3
- "version": "0.2.21",
3
+ "version": "0.2.23",
4
4
  "description": "UI Component for React,NextJS,esbuild",
5
5
  "scripts": {
6
6
  "start": "run-p clean build:*",
@@ -89,7 +89,7 @@
89
89
  "@fortawesome/free-regular-svg-icons": "^6.5.2",
90
90
  "@fortawesome/free-solid-svg-icons": "^6.5.1",
91
91
  "@fortawesome/react-fontawesome": "^0.2.0",
92
- "@mingoo/jsmin": "^0.0.49",
92
+ "@mingoo/jsmin": "^0.0.51",
93
93
  "react": "^18.3.1"
94
94
  },
95
95
  "devDependencies": {