diff --git a/src/main/tmpl/files.json b/src/main/tmpl/files.json index f14b079..f34b7fd 100644 --- a/src/main/tmpl/files.json +++ b/src/main/tmpl/files.json @@ -1 +1 @@ -[{"fileName":"@types.ts","contents":"export interface IconyakiIcon {\n id: string;\n fileName: string;\n componentName: string;\n tags: string[];\n viewBox: string;\n svgBody: string;\n}\n\nexport interface IconyakiData {\n icons: IconyakiIcon[];\n}\n"},{"fileName":"Browser.tsx","contents":"import styled from \"@emotion/styled\";\nimport * as React from \"react\";\nimport icons from \"./data.json\";\nimport Icon from \"./IconYaki\";\n\ninterface Props {}\n\nexport default function Browser({}: Props) {\n return (\n \n \n \n {icons.map((icon, key) => {\n const IconPreview = Icon({\n iconStr: icon.svgBody,\n viewBox: icon.viewBox\n });\n return (\n \n
\n \n \n \n {icon.componentName}\n
\n );\n })}\n
\n
\n
\n );\n}\n\nconst Container = styled.div`\n display: flex;\n flex-wrap: nowrap;\n flex-direction: column;\n justify-content: stretch;\n align-items: stretch;\n flex: 1;\n overflow: hidden;\n`;\n\nconst IconCardWrap = styled.div`\n overflow: auto;\n flex: 1;\n background: #eee;\n padding: 8px;\n`;\nconst IconList = styled.div`\n display: grid;\n gap: 8px;\n grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));\n`;\n\nconst IconCard = styled.div`\n display: flex;\n flex-wrap: nowrap;\n flex-direction: column;\n justify-content: stretch;\n align-items: stretch;\n border: 1px solid #ccc;\n border-radius: 8px;\n background: #fff;\n position: relative;\n\n .tools {\n position: absolute;\n top: 0;\n right: 0;\n padding: 5px;\n display: none;\n\n a {\n color: var(--txt-body);\n &:hover {\n color: var(--txt-link-hover);\n }\n }\n }\n\n &:hover {\n .tools {\n display: flex;\n flex-wrap: nowrap;\n flex-direction: row;\n justify-content: flex-end;\n align-items: center;\n\n gap: 3px;\n }\n }\n`;\nconst IconWrap = styled.div`\n display: flex;\n flex-wrap: nowrap;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n padding: 16px;\n border-bottom: 1px solid var(--border-color);\n font-size: 30px;\n flex: 1;\n`;\nconst IconMeta = styled.div`\n display: flex;\n flex-wrap: nowrap;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n flex: none;\n font-size: 13px;\n padding: 5px 0;\n`;\n"},{"fileName":"IconYaki.tsx","contents":"import styles from \"./iconyaki.module.css\";\n\ninterface IconYakiProps {\n iconStr: string;\n viewBox: string;\n}\n\nexport interface IconProps {\n size?: number;\n className?: string;\n role?: string;\n}\n\nconst withIconYaki = ({ iconStr, viewBox }: IconYakiProps) => {\n return function Icon({ size, className = \"iconyaki\", role = \"iconyaki\", ...rest }: IconProps) {\n return (\n \n \n \n );\n };\n};\n\nexport default withIconYaki;\n"},{"fileName":"data.json","contents":"[\n {\n \"id\": \"e98fffc3-7fbd-4655-83eb-43fd0e31a107\",\n \"fileName\": \"IconCodeSlash.tsx\",\n \"componentName\": \"IconCodeSlash\",\n \"tags\": [],\n \"viewBox\": \"0 0 24 24\",\n \"svgBody\": \"\\n \\n\"\n }\n]\n"},{"fileName":"iconyaki.module.css","contents":".iconyaki {\n display: inline-flex;\n align-items: center;\n color: inherit;\n font-style: normal;\n line-height: 0;\n text-align: center;\n text-transform: none;\n vertical-align: -0.125em;\n text-rendering: optimizeLegibility;\n -webkit-font-smoothing: antialiased;\n}\n\n.iconyaki svg {\n display: inline-block;\n width: 1em;\n height: 1em;\n line-height: 1;\n}\n\n.iconyaki svg path[fill=\"#000000\"], .iconyaki svg path[fill=\"black\"] {\n fill: currentColor;\n}\n\n.iconyaki svg path[stroke=\"#000000\"], .iconyaki svg path[stroke=\"black\"] {\n stroke: currentColor;\n}\n"},{"fileName":"index.tsx","contents":""}] \ No newline at end of file +[{"fileName":"@types.ts","contents":"export interface IconyakiIcon {\n id: string;\n fileName: string;\n componentName: string;\n tags: string[];\n viewBox: string;\n svgBody: string;\n}\n\nexport interface IconyakiData {\n icons: IconyakiIcon[];\n}\n"},{"fileName":"Browser.tsx","contents":"import styled from \"@emotion/styled\";\nimport * as React from \"react\";\nimport icons from \"./data.json\";\nimport Icon from \"./IconYaki\";\n\ninterface Props {}\n\nexport default function Browser({}: Props) {\n return (\n \n \n \n {icons.map((icon, key) => {\n const IconPreview = Icon({\n iconStr: icon.svgBody,\n viewBox: icon.viewBox\n });\n return (\n \n
\n \n \n \n {icon.componentName}\n
\n );\n })}\n
\n
\n
\n );\n}\n\nconst Container = styled.div`\n display: flex;\n flex-wrap: nowrap;\n flex-direction: column;\n justify-content: stretch;\n align-items: stretch;\n flex: 1;\n overflow: hidden;\n`;\n\nconst IconCardWrap = styled.div`\n overflow: auto;\n flex: 1;\n background: #eee;\n padding: 8px;\n`;\nconst IconList = styled.div`\n display: grid;\n gap: 8px;\n grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));\n`;\n\nconst IconCard = styled.div`\n display: flex;\n flex-wrap: nowrap;\n flex-direction: column;\n justify-content: stretch;\n align-items: stretch;\n border: 1px solid #ccc;\n border-radius: 8px;\n background: #fff;\n position: relative;\n\n .tools {\n position: absolute;\n top: 0;\n right: 0;\n padding: 5px;\n display: none;\n\n a {\n color: var(--txt-body);\n &:hover {\n color: var(--txt-link-hover);\n }\n }\n }\n\n &:hover {\n .tools {\n display: flex;\n flex-wrap: nowrap;\n flex-direction: row;\n justify-content: flex-end;\n align-items: center;\n\n gap: 3px;\n }\n }\n`;\nconst IconWrap = styled.div`\n display: flex;\n flex-wrap: nowrap;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n padding: 16px;\n border-bottom: 1px solid var(--border-color);\n font-size: 30px;\n flex: 1;\n`;\nconst IconMeta = styled.div`\n display: flex;\n flex-wrap: nowrap;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n flex: none;\n font-size: 13px;\n padding: 5px 0;\n`;\n"},{"fileName":"IconYaki.tsx","contents":"import React from \"react\";\nimport styles from \"./iconyaki.module.css\";\n\ninterface IconYakiProps {\n iconStr: string;\n viewBox: string;\n}\n\nexport interface IconProps {\n size?: number;\n className?: string;\n style?: React.CSSProperties;\n role?: string;\n}\n\nconst withIconYaki = ({ iconStr, viewBox }: IconYakiProps) => {\n return function Icon({ size, className = \"iconyaki\", role = \"iconyaki\", ...rest }: IconProps) {\n return (\n \n \n \n );\n };\n};\n\nexport default withIconYaki;\n"},{"fileName":"data.json","contents":"[\n {\n \"id\": \"e98fffc3-7fbd-4655-83eb-43fd0e31a107\",\n \"fileName\": \"IconCodeSlash.tsx\",\n \"componentName\": \"IconCodeSlash\",\n \"tags\": [],\n \"viewBox\": \"0 0 24 24\",\n \"svgBody\": \"\\n \\n\"\n }\n]\n"},{"fileName":"iconyaki.module.css","contents":".iconyaki {\n display: inline-flex;\n align-items: center;\n color: inherit;\n font-style: normal;\n line-height: 0;\n text-align: center;\n text-transform: none;\n vertical-align: -0.125em;\n text-rendering: optimizeLegibility;\n -webkit-font-smoothing: antialiased;\n}\n\n.iconyaki svg {\n display: inline-block;\n width: 1em;\n height: 1em;\n line-height: 1;\n}\n\n.iconyaki svg path[fill=\"#000000\"], .iconyaki svg path[fill=\"black\"] {\n fill: currentColor;\n}\n\n.iconyaki svg path[stroke=\"#000000\"], .iconyaki svg path[stroke=\"black\"] {\n stroke: currentColor;\n}\n"},{"fileName":"index.tsx","contents":""}] \ No newline at end of file