├── .eslintignore ├── .eslintrc.json ├── .github ├── FUNDING.yml └── workflows │ ├── coolshapes.js.yml │ └── release.js.yml ├── .gitignore ├── .npmignore ├── .prettierignore ├── .prettierrc ├── CHANGELOG.md ├── LICENSE ├── README.md ├── package-lock.json ├── package.json ├── rollup.config.mjs ├── src ├── index.tsx ├── lib │ ├── iconBase.tsx │ ├── index.tsx │ ├── noiseMask.tsx │ └── shapes.tsx └── shapes │ ├── ellipses │ ├── e_1.tsx │ ├── e_10.tsx │ ├── e_11.tsx │ ├── e_12.tsx │ ├── e_2.tsx │ ├── e_3.tsx │ ├── e_4.tsx │ ├── e_5.tsx │ ├── e_6.tsx │ ├── e_7.tsx │ ├── e_8.tsx │ └── e_9.tsx │ ├── flowers │ ├── f_1.tsx │ ├── f_10.tsx │ ├── f_11.tsx │ ├── f_12.tsx │ ├── f_13.tsx │ ├── f_14.tsx │ ├── f_15.tsx │ ├── f_16.tsx │ ├── f_2.tsx │ ├── f_3.tsx │ ├── f_4.tsx │ ├── f_5.tsx │ ├── f_6.tsx │ ├── f_7.tsx │ ├── f_8.tsx │ └── f_9.tsx │ ├── index.tsx │ ├── miscs │ ├── m_1.tsx │ ├── m_10.tsx │ ├── m_11.tsx │ ├── m_2.tsx │ ├── m_3.tsx │ ├── m_4.tsx │ ├── m_5.tsx │ ├── m_6.tsx │ ├── m_7.tsx │ ├── m_8.tsx │ └── m_9.tsx │ ├── moons │ ├── m_1.tsx │ ├── m_10.tsx │ ├── m_11.tsx │ ├── m_12.tsx │ ├── m_13.tsx │ ├── m_14.tsx │ ├── m_15.tsx │ ├── m_2.tsx │ ├── m_3.tsx │ ├── m_4.tsx │ ├── m_5.tsx │ ├── m_6.tsx │ ├── m_7.tsx │ ├── m_8.tsx │ └── m_9.tsx │ ├── numbers │ ├── n_0.tsx │ ├── n_1.tsx │ ├── n_2.tsx │ ├── n_3.tsx │ ├── n_4.tsx │ ├── n_5.tsx │ ├── n_6.tsx │ ├── n_7.tsx │ ├── n_8.tsx │ └── n_9.tsx │ ├── polygons │ ├── p_1.tsx │ ├── p_2.tsx │ ├── p_3.tsx │ ├── p_4.tsx │ ├── p_5.tsx │ ├── p_6.tsx │ ├── p_7.tsx │ └── p_8.tsx │ ├── rectangles │ ├── r_1.tsx │ ├── r_2.tsx │ ├── r_3.tsx │ ├── r_4.tsx │ ├── r_5.tsx │ ├── r_6.tsx │ ├── r_7.tsx │ ├── r_8.tsx │ └── r_9.tsx │ ├── stars │ ├── s_1.tsx │ ├── s_10.tsx │ ├── s_11.tsx │ ├── s_12.tsx │ ├── s_13.tsx │ ├── s_2.tsx │ ├── s_3.tsx │ ├── s_4.tsx │ ├── s_5.tsx │ ├── s_6.tsx │ ├── s_7.tsx │ ├── s_8.tsx │ └── s_9.tsx │ ├── triangles │ ├── t_1.tsx │ ├── t_10.tsx │ ├── t_11.tsx │ ├── t_12.tsx │ ├── t_13.tsx │ ├── t_14.tsx │ ├── t_2.tsx │ ├── t_3.tsx │ ├── t_4.tsx │ ├── t_5.tsx │ ├── t_6.tsx │ ├── t_7.tsx │ ├── t_8.tsx │ └── t_9.tsx │ └── wheels │ ├── w_1.tsx │ ├── w_2.tsx │ ├── w_3.tsx │ ├── w_4.tsx │ ├── w_5.tsx │ ├── w_6.tsx │ └── w_7.tsx ├── tests └── shape.test.tsx ├── tsconfig.json └── vitest.config.mjs /.eslintignore: -------------------------------------------------------------------------------- 1 | dist/ 2 | node_modules/ -------------------------------------------------------------------------------- /.eslintrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "env": { 3 | "node": true, 4 | "browser": true 5 | }, 6 | "extends": [ 7 | "eslint:recommended", 8 | "plugin:@typescript-eslint/recommended", 9 | "plugin:react/recommended" 10 | ], 11 | "parser": "@typescript-eslint/parser", 12 | "parserOptions": { 13 | "ecmaVersion": "latest", 14 | "sourceType": "module" 15 | }, 16 | "plugins": ["@typescript-eslint", "react"], 17 | "rules": {} 18 | } 19 | -------------------------------------------------------------------------------- /.github/FUNDING.yml: -------------------------------------------------------------------------------- 1 | github: realvjy 2 | buy_me_a_coffee: realvjy 3 | -------------------------------------------------------------------------------- /.github/workflows/coolshapes.js.yml: -------------------------------------------------------------------------------- 1 | name: Build and test 2 | 3 | on: 4 | push: 5 | branches: ["dev", "main"] 6 | pull_request: 7 | branches: ["dev", "main"] 8 | 9 | jobs: 10 | build: 11 | runs-on: ubuntu-latest 12 | 13 | steps: 14 | - uses: actions/checkout@v3 15 | - name: Builds and test 16 | uses: actions/setup-node@v3 17 | with: 18 | node-version: 16.x 19 | cache: "npm" 20 | - run: npm ci 21 | - run: npm run build 22 | - run: npm test 23 | -------------------------------------------------------------------------------- /.github/workflows/release.js.yml: -------------------------------------------------------------------------------- 1 | name: Publish Package 2 | on: 3 | release: 4 | types: [published] 5 | jobs: 6 | build: 7 | runs-on: ubuntu-latest 8 | steps: 9 | - uses: actions/checkout@v4 10 | - uses: actions/setup-node@v4 11 | with: 12 | node-version: '20.x' 13 | registry-url: 'https://registry.npmjs.org' 14 | - run: npm ci 15 | - run: npm run test 16 | - run: npm run build 17 | - run: npm publish 18 | env: 19 | NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }} -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules 3 | dist/ 4 | .idea 5 | *.env -------------------------------------------------------------------------------- /.npmignore: -------------------------------------------------------------------------------- 1 | tsconfig.json 2 | src/ 3 | .babelrc 4 | node_modules 5 | rollup.config.mjs 6 | -------------------------------------------------------------------------------- /.prettierignore: -------------------------------------------------------------------------------- 1 | dist/ 2 | node_modules/ 3 | -------------------------------------------------------------------------------- /.prettierrc: -------------------------------------------------------------------------------- 1 | { 2 | "tabWidth": 2, 3 | "trailingComma": "es5", 4 | "bracketSpacing": true, 5 | "bracketSameLine": true 6 | } 7 | -------------------------------------------------------------------------------- /CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Changelog 2 | 3 | ## 1.0.1 4 | - Update Cover 5 | - Readme link 6 | 7 | ## 1.0.0 8 | - Added SVG + PNG Zip 9 | - Releasing v1 10 | 11 | ## 0.1.2-beta.0 12 | 13 | - Bug fix 14 | - Readme Update 15 | - Action 16 | 17 | ## 0.1.1-beta.0 18 | 19 | - Fix Random Function 20 | - Fix state issue 21 | 22 | ## 0.1.0-beta.0 23 | 24 | - Bug Fix 25 | - Update Interface of iconBase 26 | - Ready to release 27 | 28 | ## 0.0.8-alpha.1 29 | 30 | - Bug Fix 31 | 32 | ## 0.0.7-alpha.0 33 | 34 | - Rendering View Bug Fix for some shapes 35 | 36 | 37 | ## 0.0.6-alpha.0 38 | 39 | - Add `number` type shapes, Total count 115 40 | - Change the index to start from 0 41 | 42 | ## 0.0.5-alpha.1 43 | 44 | - Add more shapes. Total count 105 45 | - Fix noise toggle 46 | 47 | ## 0.0.5-alpha.0 48 | 49 | - Change name to `coolshapes-react@0.0.5-alpha.0` 50 | - Fix rendering bugs 51 | - Added all remaining shapes 52 | 53 | ## 0.0.4-alpha.0 54 | 55 | - Changed versioning to alpha `react-coolshapes@0.0.4-alpha.0` 56 | - Added 90+ shapes from different categories 57 | `Coolshape`, `Ellipse`, `Flower`, `Misc`, `Moon`, `Polygon`, `Rectangle`, `Star`, `Triangle` 58 | 59 | ## 0.0.3 60 | 61 | - `react-coolshapes@0.0.3` 62 | - Changed render type of shapes and added dynamic support 63 | 64 | ```jsx 65 | 66 | ``` 67 | 68 | ## 0.0.2 69 | 70 | - Published - `react-coolshapes@0.0.2` 71 | - Minor fixes 72 | 73 | ## 0.0.1 First Publish 74 | 75 | - NPM package published - `react-coolshapes` 76 | 77 | - Added these 4 shapes and publish to test on [coolshap.es](https://coolshapes) 78 | ```jsx 79 | "star-1": ShapeType; 80 | "star-2": ShapeType; 81 | "circle-1": ShapeType; 82 | "circle-2": ShapeType; 83 | ``` 84 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2024 Coolshapes 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "coolshapes-react", 3 | "version": "1.0.4", 4 | "description": "A react component library for coolshapes with little grainy gradients.", 5 | "keywords": [ 6 | "coolshapes", 7 | "shapes", 8 | "abstract", 9 | "svg", 10 | "vector", 11 | "avatar", 12 | "illustration", 13 | "graphics", 14 | "placeholder" 15 | ], 16 | "main": "dist/cjs/coolshapes.js", 17 | "main:umd": "dist/umd/coolshapes.js", 18 | "module": "dist/esm/coolshapes.js", 19 | "unpkg": "dist/umd/coolshapes.js", 20 | "typings": "dist/index.d.ts", 21 | "type": "module", 22 | "files": [ 23 | "./dist", 24 | "LICENSE", 25 | "README.md" 26 | ], 27 | "scripts": { 28 | "build": "npm run clean && rollup --config", 29 | "test": "vitest --config ./vitest.config.mjs run", 30 | "clean": "rm -rf dist", 31 | "reformat": "prettier . --write" 32 | }, 33 | "author": { 34 | "name": "realvjy", 35 | "email": "realvjy@gmail.com", 36 | "twitter": "https://x.com/realvjy", 37 | "url": "https://vjy.me" 38 | }, 39 | "contributors": [ 40 | { 41 | "name": "0xgreenapple", 42 | "url": "https://greenapple.one", 43 | "email": "0xgreenapple@gmail.com" 44 | } 45 | ], 46 | "license": "MIT", 47 | "homepage": "https://www.coolshap.es/", 48 | "repository": { 49 | "type": "git", 50 | "url": "https://github.com/realvjy/coolshapes-react" 51 | }, 52 | "bugs": { 53 | "url": "https://github.com/realvjy/coolshapes-react/issues", 54 | "email": "realvjy@gmail.com" 55 | }, 56 | "engines": { 57 | "node": ">=14.0.0" 58 | }, 59 | "peerDependencies": { 60 | "react": ">=16.8", 61 | "react-dom": ">=16.8" 62 | }, 63 | "devDependencies": { 64 | "@rollup/plugin-commonjs": "^25.0.7", 65 | "@rollup/plugin-node-resolve": "^15.2.3", 66 | "@rollup/plugin-terser": "^0.4.4", 67 | "@rollup/plugin-typescript": "^11.1.6", 68 | "@testing-library/react": "^14.2.1", 69 | "@types/react": "^18.2.58", 70 | "@typescript-eslint/eslint-plugin": "^7.1.0", 71 | "@typescript-eslint/parser": "^7.1.0", 72 | "@vitejs/plugin-react": "^4.2.1", 73 | "eslint": "^8.57.0", 74 | "eslint-plugin-react": "^7.33.2", 75 | "jsdom": "^24.0.0", 76 | "prettier": "3.2.5", 77 | "react": "^18.2.0", 78 | "react-dom": "^18.2.0", 79 | "rollup": "^4.12.0", 80 | "rollup-plugin-dts": "^6.1.0", 81 | "tslib": "^2.6.2", 82 | "typescript": "^5.3.3", 83 | "vitest": "^1.3.1" 84 | } 85 | } -------------------------------------------------------------------------------- /rollup.config.mjs: -------------------------------------------------------------------------------- 1 | import resolve from "@rollup/plugin-node-resolve"; 2 | import terser from "@rollup/plugin-terser"; 3 | import typescript from "@rollup/plugin-typescript"; 4 | import commonjs from "@rollup/plugin-commonjs"; 5 | import { dts } from "rollup-plugin-dts"; 6 | import pkg from "./package.json" assert { type: "json" }; 7 | const inputFile = "src/index.tsx"; 8 | 9 | // rollup.config.mjs 10 | export default [ 11 | { 12 | input: inputFile, 13 | output: [ 14 | { 15 | file: pkg.main, 16 | format: "cjs", 17 | sourcemap: true, 18 | }, 19 | { 20 | file: pkg.module, 21 | format: "esm", 22 | sourcemap: true, 23 | }, 24 | { 25 | name: "coolshapes", 26 | file: pkg["main:umd"], 27 | format: "umd", 28 | sourcemap: true, 29 | globals: { 30 | react: "React", 31 | "react-dom": "ReactDOM", 32 | }, 33 | }, 34 | ], 35 | external: ["react", "react-dom"], 36 | plugins: [ 37 | resolve(), 38 | commonjs(), 39 | typescript({ tsconfig: "./tsconfig.json" }), 40 | terser(), 41 | ], 42 | }, 43 | 44 | { 45 | input: inputFile, 46 | output: [ 47 | { 48 | file: `dist/index.d.ts`, 49 | format: "es", 50 | }, 51 | ], 52 | plugins: [dts()], 53 | }, 54 | ]; 55 | -------------------------------------------------------------------------------- /src/index.tsx: -------------------------------------------------------------------------------- 1 | export * from "./lib/shapes"; 2 | export { default as shapes, shapeTypes, getRandomShape } from "./shapes"; 3 | -------------------------------------------------------------------------------- /src/lib/iconBase.tsx: -------------------------------------------------------------------------------- 1 | import React, { 2 | ForwardRefExoticComponent, 3 | RefAttributes, 4 | SVGProps, 5 | forwardRef, 6 | } from "react"; 7 | import NoiseMask from "./noiseMask"; 8 | 9 | // icon base props 10 | type svgProps = RefAttributes & Partial>; 11 | export interface ShapeProps extends svgProps{ 12 | size?: number; 13 | noise?: boolean; 14 | } 15 | 16 | interface BaseProps extends ShapeProps { 17 | shapeName: string; 18 | } 19 | 20 | export type ShapeType = ForwardRefExoticComponent; 21 | 22 | // default props 23 | const defaultProps = { 24 | xmlns: "http://www.w3.org/2000/svg", 25 | fill: "none", 26 | className: "coolshapes", 27 | viewBox: "0 0 200 200", 28 | width: 200, 29 | height: 200, 30 | }; 31 | 32 | const ShapeBase = forwardRef((props, ref) => { 33 | const { 34 | size, 35 | noise = true, 36 | shapeName: iconName, 37 | className, 38 | children, 39 | ...rest 40 | } = props; 41 | const { 42 | className: defaultClassName, 43 | width: defaultWidth, 44 | height: defaultHeight, 45 | ...restDefaultProps 46 | } = defaultProps; 47 | return ( 48 | 55 | {children} 56 | {} 57 | 58 | ); 59 | }); 60 | 61 | ShapeBase.displayName = "ShapeBase"; 62 | export default ShapeBase; 63 | -------------------------------------------------------------------------------- /src/lib/index.tsx: -------------------------------------------------------------------------------- 1 | export { default as NoiseMask } from "./noiseMask"; 2 | export { default as ShapeBase, ShapeType, ShapeProps } from "./iconBase"; 3 | -------------------------------------------------------------------------------- /src/lib/noiseMask.tsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | 3 | const NoiseMask = ({ 4 | showNoise = true, 5 | id, 6 | }: { 7 | showNoise?: boolean; 8 | id: string; 9 | }) => { 10 | return ( 11 | <> 12 | {showNoise && ( 13 | <> 14 | 15 | 21 | 22 | 23 | 30 | 35 | 40 | 45 | 46 | 47 | 48 | )} 49 | 50 | ); 51 | }; 52 | 53 | export default NoiseMask; 54 | -------------------------------------------------------------------------------- /src/lib/shapes.tsx: -------------------------------------------------------------------------------- 1 | import React, { 2 | ForwardRefExoticComponent, 3 | forwardRef, 4 | useEffect, 5 | useState, 6 | } from "react"; 7 | import shapes, { getRandomShape, shapeTypes } from "../shapes"; 8 | import { ShapeProps, ShapeType } from "./iconBase"; 9 | 10 | interface ShapeOptions extends BaseShapeOptions { 11 | type?: shapeTypes; 12 | } 13 | 14 | interface BaseShapeOptions extends ShapeProps { 15 | index?: number; 16 | random?: boolean; 17 | } 18 | 19 | const Coolshape: ForwardRefExoticComponent = forwardRef( 20 | (options, ref) => { 21 | const { type, index, random, ...rest } = options; 22 | 23 | if (index !== undefined && type && !random) { 24 | const Shape = shapes[type][index]; 25 | return 26 | } 27 | 28 | const [RandomShape, setRandomShape] = useState(null); 29 | useEffect(() => { 30 | const shape = getRandomShape({ type }) as ShapeType; 31 | setRandomShape(shape); 32 | }, []); 33 | if (!RandomShape) { 34 | return null; 35 | } 36 | return ; 37 | } 38 | ); 39 | Coolshape.displayName = "Coolshape"; 40 | 41 | const getComponentWithShape = ( 42 | shapeType: keyof typeof shapes 43 | ): ForwardRefExoticComponent => { 44 | const Component = forwardRef( 45 | (props, ref) => { 46 | return ; 47 | } 48 | ); 49 | Component.displayName = shapeType; 50 | return Component; 51 | }; 52 | 53 | const Star = getComponentWithShape("star"); 54 | const Ellipse = getComponentWithShape("ellipse"); 55 | const Flower = getComponentWithShape("flower"); 56 | const Misc = getComponentWithShape("misc"); 57 | const Moon = getComponentWithShape("moon"); 58 | const Triangle = getComponentWithShape("triangle"); 59 | const Rectangle = getComponentWithShape("rectangle"); 60 | const Polygon = getComponentWithShape("polygon"); 61 | const Number = getComponentWithShape("number"); 62 | 63 | export { 64 | Coolshape, 65 | Star, 66 | Flower, 67 | Ellipse, 68 | Misc, 69 | Moon, 70 | Triangle, 71 | Rectangle, 72 | Polygon, 73 | Number, 74 | }; 75 | -------------------------------------------------------------------------------- /src/shapes/ellipses/e_1.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Ellipse1: ShapeType = forwardRef((props, ref) => { 5 | const ShapeId = "ellipse-1"; 6 | 7 | return ( 8 | 9 | 10 | 18 | 23 | 24 | 25 | 26 | 29 | 30 | 31 | 35 | 39 | 40 | 41 | 42 | 43 | 51 | 52 | 56 | 59 | 60 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | ); 76 | }); 77 | 78 | Ellipse1.displayName = "Ellipse1"; 79 | export { Ellipse1 }; 80 | -------------------------------------------------------------------------------- /src/shapes/ellipses/e_10.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Ellipse10: ShapeType = forwardRef((props, ref) => { 5 | const ShapeId = "ellipse-10"; 6 | 7 | return ( 8 | 9 | 10 | 18 | 23 | 24 | 25 | 28 | 29 | 36 | 43 | 44 | 45 | 46 | 47 | 55 | 56 | 60 | 63 | 64 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | ); 80 | }); 81 | 82 | Ellipse10.displayName = "Ellipse10"; 83 | export { Ellipse10 }; 84 | -------------------------------------------------------------------------------- /src/shapes/ellipses/e_12.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Ellipse12: ShapeType = forwardRef((props, ref) => { 5 | const ShapeId = "ellipse-12"; 6 | 7 | return ( 8 | 9 | 10 | 18 | 23 | 24 | 25 | 26 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 47 | 48 | 52 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | ); 62 | }); 63 | 64 | Ellipse12.displayName = "Ellipse12"; 65 | export { Ellipse12 }; 66 | -------------------------------------------------------------------------------- /src/shapes/ellipses/e_2.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Ellipse2: ShapeType = forwardRef((props, ref) => { 5 | const ShapeId = "ellipse-2"; 6 | 7 | return ( 8 | 9 | 10 | 18 | 23 | 24 | 25 | 26 | 30 | 31 | 35 | 36 | 42 | 43 | 44 | 45 | 46 | 54 | 55 | 59 | 62 | 63 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | ); 79 | }); 80 | 81 | Ellipse2.displayName = "Ellipse2"; 82 | export { Ellipse2 }; 83 | -------------------------------------------------------------------------------- /src/shapes/ellipses/e_4.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Ellipse4: ShapeType = forwardRef((props, ref) => { 5 | const ShapeId = "ellipse-4"; 6 | 7 | return ( 8 | 9 | 10 | 18 | 21 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 37 | 38 | 39 | 40 | 41 | 49 | 50 | 54 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | ); 64 | }); 65 | 66 | Ellipse4.displayName = "Ellipse4"; 67 | export { Ellipse4 }; 68 | -------------------------------------------------------------------------------- /src/shapes/ellipses/e_7.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Ellipse7: ShapeType = forwardRef((props, ref) => { 5 | const ShapeId = "ellipse-7"; 6 | 7 | return ( 8 | 9 | 10 | 18 | 21 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 44 | 45 | 49 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | ); 59 | }); 60 | 61 | Ellipse7.displayName = "Ellipse7"; 62 | export { Ellipse7 }; 63 | -------------------------------------------------------------------------------- /src/shapes/ellipses/e_8.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Ellipse8: ShapeType = forwardRef((props, ref) => { 5 | const ShapeId = "ellipse-8"; 6 | 7 | return ( 8 | 9 | 10 | 18 | 21 | 22 | 23 | 24 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 42 | 43 | 47 | 50 | 51 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | ); 67 | }); 68 | 69 | Ellipse8.displayName = "Ellipse8"; 70 | export { Ellipse8 }; 71 | -------------------------------------------------------------------------------- /src/shapes/flowers/f_1.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Flower1: ShapeType = forwardRef((props, ref) => { 5 | const ShapeId = "flower-1"; 6 | 7 | return ( 8 | 9 | 10 | 18 | 21 | 22 | 23 | 24 | 27 | 28 | 29 | 33 | 37 | 38 | 39 | 40 | 41 | 49 | 50 | 54 | 57 | 58 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | ); 74 | }); 75 | 76 | Flower1.displayName = "Flower1"; 77 | export { Flower1 }; 78 | -------------------------------------------------------------------------------- /src/shapes/flowers/f_14.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Flower14: ShapeType = forwardRef((props, ref) => { 5 | const ShapeId = "flower-14"; 6 | 7 | return ( 8 | 9 | 10 | 18 | 21 | 22 | 23 | 24 | 28 | 29 | 35 | 41 | 42 | 43 | 44 | 45 | 46 | 54 | 55 | 59 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | ); 69 | }); 70 | 71 | Flower14.displayName = "Flower14"; 72 | export { Flower14 }; 73 | -------------------------------------------------------------------------------- /src/shapes/flowers/f_15.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Flower15: ShapeType = forwardRef((props, ref) => { 5 | const ShapeId = "flower-15"; 6 | 7 | return ( 8 | 9 | 10 | 18 | 21 | 22 | 23 | 24 | 28 | 29 | 35 | 41 | 42 | 43 | 44 | 45 | 46 | 54 | 55 | 59 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | ); 69 | }); 70 | 71 | Flower15.displayName = "Flower15"; 72 | export { Flower15 }; 73 | -------------------------------------------------------------------------------- /src/shapes/flowers/f_16.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Flower16: ShapeType = forwardRef((props, ref) => { 5 | const ShapeId = "flower-16"; 6 | 7 | return ( 8 | 9 | 10 | 18 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 41 | 42 | 46 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | ); 56 | }); 57 | 58 | Flower16.displayName = "Flower16"; 59 | export { Flower16 }; 60 | -------------------------------------------------------------------------------- /src/shapes/flowers/f_3.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Flower3: ShapeType = forwardRef((props, ref) => { 5 | const ShapeId = "flower-3"; 6 | 7 | return ( 8 | 9 | 10 | 18 | 21 | 22 | 23 | 24 | 28 | 29 | 30 | 31 | 38 | 39 | 40 | 41 | 42 | 50 | 51 | 55 | 58 | 59 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | ); 75 | }); 76 | 77 | Flower3.displayName = "Flower3"; 78 | export { Flower3 }; 79 | -------------------------------------------------------------------------------- /src/shapes/flowers/f_5.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Flower5: ShapeType = forwardRef((props, ref) => { 5 | const ShapeId = "flower-5"; 6 | 7 | return ( 8 | 9 | 10 | 18 | 21 | 22 | 23 | 24 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 44 | 45 | 49 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | ); 59 | }); 60 | 61 | Flower5.displayName = "Flower5"; 62 | export { Flower5 }; 63 | -------------------------------------------------------------------------------- /src/shapes/flowers/f_6.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Flower6: ShapeType = forwardRef((props, ref) => { 5 | const ShapeId = "flower-6"; 6 | 7 | return ( 8 | 9 | 10 | 18 | 21 | 22 | 23 | 24 | 25 | 28 | 29 | 36 | 37 | 38 | 39 | 40 | 41 | 49 | 50 | 54 | 57 | 58 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | ); 74 | }); 75 | 76 | Flower6.displayName = "Flower6"; 77 | export { Flower6 }; 78 | -------------------------------------------------------------------------------- /src/shapes/flowers/f_8.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Flower8: ShapeType = forwardRef((props, ref) => { 5 | const ShapeId = "flower-8"; 6 | 7 | return ( 8 | 9 | 10 | 18 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 33 | 34 | 35 | 36 | 37 | 45 | 46 | 50 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | ); 60 | }); 61 | 62 | Flower8.displayName = "Flower8"; 63 | export { Flower8 }; 64 | -------------------------------------------------------------------------------- /src/shapes/flowers/f_9.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Flower9: ShapeType = forwardRef((props, ref) => { 5 | const ShapeId = "flower-9"; 6 | 7 | return ( 8 | 9 | 10 | 18 | 21 | 22 | 23 | 24 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 43 | 44 | 48 | 51 | 52 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | {" "} 66 | 67 | ); 68 | }); 69 | 70 | Flower9.displayName = "Flower9"; 71 | export { Flower9 }; 72 | -------------------------------------------------------------------------------- /src/shapes/miscs/m_1.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Misc1: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "misc-1"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 30 | 31 | 35 | 36 | 43 | 44 | 45 | 46 | 47 | 55 | 56 | 60 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | ); 70 | }); 71 | 72 | Misc1.displayName = "Misc1"; 73 | export { Misc1 }; 74 | -------------------------------------------------------------------------------- /src/shapes/miscs/m_10.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Misc10: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "misc-10"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 30 | 31 | 38 | 41 | 42 | 43 | 44 | 45 | 46 | 54 | 55 | 59 | 62 | 63 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | ); 79 | }); 80 | 81 | Misc10.displayName = "Misc10"; 82 | export { Misc10 }; 83 | -------------------------------------------------------------------------------- /src/shapes/miscs/m_11.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Misc11: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "misc-11"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 40 | 41 | 45 | 48 | 49 | 50 | 51 | 52 | 53 | 54 | ); 55 | }); 56 | 57 | Misc11.displayName = "Misc11"; 58 | export { Misc11 }; 59 | -------------------------------------------------------------------------------- /src/shapes/miscs/m_4.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Misc4: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "misc-4"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 43 | 44 | 48 | 51 | 52 | 59 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | ); 68 | }); 69 | 70 | Misc4.displayName = "Misc4"; 71 | export { Misc4 }; 72 | -------------------------------------------------------------------------------- /src/shapes/miscs/m_5.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Misc5: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "misc-5"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 29 | 32 | 33 | 34 | 35 | 42 | 43 | 44 | 45 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | ); 62 | }); 63 | 64 | Misc5.displayName = "Misc5"; 65 | export { Misc5 }; 66 | -------------------------------------------------------------------------------- /src/shapes/miscs/m_6.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Misc6: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "misc-6"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 30 | 31 | 32 | 33 | 40 | 41 | 42 | 43 | 44 | 52 | 53 | 57 | 60 | 61 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | 76 | ); 77 | }); 78 | 79 | Misc6.displayName = "Misc6"; 80 | export { Misc6 }; 81 | -------------------------------------------------------------------------------- /src/shapes/miscs/m_8.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Misc8: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "misc-8"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 29 | 30 | 31 | 32 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | ); 48 | }); 49 | 50 | Misc8.displayName = "Misc8"; 51 | export { Misc8 }; 52 | -------------------------------------------------------------------------------- /src/shapes/moons/m_11.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Moon11: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "moon-11"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 34 | 35 | 36 | 37 | 38 | 46 | 47 | 51 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | ); 61 | }); 62 | 63 | Moon11.displayName = "Moon11"; 64 | export { Moon11 }; 65 | -------------------------------------------------------------------------------- /src/shapes/moons/m_13.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Moon13: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "moon-13"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 30 | 31 | 37 | 43 | 44 | 45 | 46 | 47 | 48 | 56 | 57 | 61 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | ); 71 | }); 72 | 73 | Moon13.displayName = "Moon13"; 74 | export { Moon13 }; 75 | -------------------------------------------------------------------------------- /src/shapes/moons/m_14.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Moon14: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "moon-14"; // Updated shapeId 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | {" "} 26 | 27 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 46 | 47 | 51 | 54 | 55 | 56 | {" "} 57 | {/* Updated to use clipId */} 58 | 59 | 60 | 61 | 62 | ); 63 | }); 64 | 65 | Moon14.displayName = "Moon14"; 66 | export { Moon14 }; 67 | -------------------------------------------------------------------------------- /src/shapes/moons/m_15.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Moon15: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "moon-15"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 30 | 31 | 37 | 43 | 44 | 45 | 46 | 47 | 48 | 56 | 57 | 61 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | ); 71 | }); 72 | 73 | Moon15.displayName = "Moon15"; 74 | export { Moon15 }; 75 | -------------------------------------------------------------------------------- /src/shapes/moons/m_3.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Moon3: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "moon-3"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 45 | 46 | 50 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | ); 60 | }); 61 | 62 | Moon3.displayName = "Moon3"; 63 | export { Moon3 }; 64 | -------------------------------------------------------------------------------- /src/shapes/moons/m_5.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Moon5: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "moon-5"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 45 | 46 | 50 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | ); 60 | }); 61 | 62 | Moon5.displayName = "Moon5"; 63 | export { Moon5 }; 64 | -------------------------------------------------------------------------------- /src/shapes/moons/m_6.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Moon6: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "moon-6"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 46 | 47 | 51 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | ); 61 | }); 62 | 63 | Moon6.displayName = "Moon6"; 64 | export { Moon6 }; 65 | -------------------------------------------------------------------------------- /src/shapes/moons/m_8.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Moon8: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "moon-8"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 43 | 44 | 48 | 51 | 52 | 53 | 54 | 55 | 56 | 57 | ); 58 | }); 59 | 60 | Moon8.displayName = "Moon8"; 61 | export { Moon8 }; 62 | -------------------------------------------------------------------------------- /src/shapes/moons/m_9.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Moon9: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "moon-9"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 44 | 45 | 49 | 52 | 53 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | ); 69 | }); 70 | 71 | Moon9.displayName = "Moon9"; 72 | export { Moon9 }; 73 | -------------------------------------------------------------------------------- /src/shapes/numbers/n_0.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Number0: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "number-0"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 25 | 26 | 27 | 28 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 49 | 50 | 54 | 57 | 58 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | ); 74 | }); 75 | 76 | Number0.displayName = "Number0"; 77 | export { Number0 }; 78 | -------------------------------------------------------------------------------- /src/shapes/numbers/n_1.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Number1: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "number-1"; 6 | const maskId = `cs_mask_1_${shapeId}`; 7 | const clipId = `cs_clip_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 21 | 22 | 23 | 24 | 28 | 29 | 35 | 41 | 42 | 43 | 44 | 45 | 46 | 54 | 55 | 59 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | ); 69 | }); 70 | 71 | Number1.displayName = "Number1"; 72 | export { Number1 }; 73 | -------------------------------------------------------------------------------- /src/shapes/numbers/n_2.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Number2: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "number-2"; 6 | const maskId = `cs_mask_1_${shapeId}`; 7 | const clipId = `cs_clip_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 29 | 32 | 33 | 34 | 35 | 42 | 43 | 44 | 45 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | ); 62 | }); 63 | 64 | Number2.displayName = "Number2"; 65 | export { Number2 }; 66 | -------------------------------------------------------------------------------- /src/shapes/numbers/n_3.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Number3: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "number-3"; 6 | const maskId = `cs_mask_1_${shapeId}`; 7 | const clipId = `cs_clip_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 27 | 30 | 31 | 38 | 39 | 40 | 41 | 42 | 43 | 51 | 52 | 56 | 59 | 60 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | ); 76 | }); 77 | 78 | Number3.displayName = "Number3"; 79 | export { Number3 }; 80 | -------------------------------------------------------------------------------- /src/shapes/numbers/n_4.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Number4: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "number-4"; 6 | const maskId = `cs_mask_1_${shapeId}`; 7 | const clipId = `cs_clip_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 21 | 22 | 23 | 24 | 28 | 29 | 35 | 41 | 42 | 43 | 44 | 45 | 46 | 54 | 55 | 59 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | ); 69 | }); 70 | 71 | Number4.displayName = "Number4"; 72 | export { Number4 }; 73 | -------------------------------------------------------------------------------- /src/shapes/numbers/n_5.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Number5: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "number-5"; 6 | const maskId = `cs_mask_1_${shapeId}`; 7 | const clipId = `cs_clip_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 38 | 39 | 40 | 41 | 42 | 50 | 51 | 55 | 58 | 59 | 60 | 61 | 62 | 63 | 64 | ); 65 | }); 66 | 67 | Number5.displayName = "Number5"; 68 | export { Number5 }; 69 | -------------------------------------------------------------------------------- /src/shapes/numbers/n_6.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Number6: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "number-6"; 6 | const maskId = `cs_mask_1_${shapeId}`; 7 | const clipId = `cs_clip_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 29 | 30 | 34 | 38 | 39 | 40 | 41 | 42 | 43 | 51 | 52 | 56 | 59 | 60 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | {" "} 74 | 75 | ); 76 | }); 77 | 78 | Number6.displayName = "number6"; 79 | export { Number6 }; 80 | -------------------------------------------------------------------------------- /src/shapes/numbers/n_7.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Number7: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "number-7"; 6 | const maskId = `cs_mask_1_${shapeId}`; 7 | const clipId = `cs_clip_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 30 | 31 | 37 | 43 | 44 | 45 | 46 | 47 | 48 | 56 | 57 | 61 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | ); 71 | }); 72 | 73 | Number7.displayName = "Number7"; 74 | export { Number7 }; 75 | -------------------------------------------------------------------------------- /src/shapes/numbers/n_8.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Number8: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "number-8"; 6 | const maskId = `cs_mask_1_${shapeId}`; 7 | const clipId = `cs_clip_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 30 | 31 | 32 | 36 | 37 | 38 | 39 | 40 | 48 | 49 | 53 | 56 | 57 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | ); 73 | }); 74 | 75 | Number8.displayName = "Number8"; 76 | export { Number8 }; 77 | -------------------------------------------------------------------------------- /src/shapes/numbers/n_9.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Number9: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "number-9"; 6 | const maskId = `cs_mask_1_${shapeId}`; 7 | const clipId = `cs_clip_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 29 | 30 | 31 | 32 | 36 | 37 | 38 | 39 | 40 | 48 | 49 | 53 | 56 | 57 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | ); 73 | }); 74 | 75 | Number9.displayName = "Number9"; 76 | export { Number9 }; 77 | -------------------------------------------------------------------------------- /src/shapes/polygons/p_2.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Polygon2: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "polygon-2"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 34 | 35 | 36 | 37 | 38 | 46 | 47 | 51 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | ); 61 | }); 62 | 63 | Polygon2.displayName = "Polygon2"; 64 | export { Polygon2 }; 65 | -------------------------------------------------------------------------------- /src/shapes/polygons/p_4.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Polygon4: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "polygon-4"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 27 | 30 | 31 | 38 | 39 | 40 | 41 | 42 | 50 | 51 | 55 | 58 | 59 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | ); 75 | }); 76 | 77 | Polygon4.displayName = "Polygon4"; 78 | export { Polygon4 }; 79 | -------------------------------------------------------------------------------- /src/shapes/polygons/p_5.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Polygon5: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "polygon-5"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 29 | 32 | 33 | 34 | 35 | 42 | 43 | 44 | 45 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | ); 62 | }); 63 | 64 | Polygon5.displayName = "Polygon5"; 65 | export { Polygon5 }; 66 | -------------------------------------------------------------------------------- /src/shapes/polygons/p_6.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Polygon6: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "polygon-6"; 6 | const maskId = `cs_mask_1_${shapeId}`; 7 | 8 | return ( 9 | 10 | 18 | 21 | 22 | 23 | 24 | 28 | 29 | 30 | 31 | 38 | 39 | 40 | 41 | 49 | 50 | 54 | 57 | 58 | 65 | 66 | 67 | 68 | 69 | 70 | ); 71 | }); 72 | 73 | Polygon6.displayName = "Polygon6"; 74 | export { Polygon6 }; 75 | -------------------------------------------------------------------------------- /src/shapes/polygons/p_7.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Polygon7: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "polygon-7"; 6 | const maskId = `cs_mask_1_${shapeId}`; 7 | const clipId = `cs_clip_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 35 | 36 | 37 | 38 | 39 | 47 | 48 | 52 | 55 | 56 | 57 | 58 | 59 | {" "} 60 | 61 | ); 62 | }); 63 | 64 | Polygon7.displayName = "Polygon7"; 65 | export { Polygon7 }; 66 | -------------------------------------------------------------------------------- /src/shapes/polygons/p_8.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Polygon8: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "polygon-8"; 6 | const maskId = `cs_mask_1_${shapeId}`; 7 | 8 | return ( 9 | 10 | 18 | 21 | 22 | 23 | 24 | 27 | 28 | 29 | 36 | 37 | 38 | 39 | 40 | 41 | ); 42 | }); 43 | 44 | Polygon8.displayName = "Polygon8"; 45 | export { Polygon8 }; 46 | -------------------------------------------------------------------------------- /src/shapes/rectangles/r_1.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Rectangle1: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "rectangle-1"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 32 | 39 | 45 | 46 | 47 | 48 | 49 | 50 | 58 | 59 | 63 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | 75 | ); 76 | }); 77 | 78 | Rectangle1.displayName = "Rectangle1"; 79 | export { Rectangle1 }; 80 | -------------------------------------------------------------------------------- /src/shapes/rectangles/r_2.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Rectangle2: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "rectangle-2"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 34 | 35 | 36 | 37 | 38 | 46 | 47 | 51 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | ); 61 | }); 62 | 63 | Rectangle2.displayName = "Rectangle2"; 64 | export { Rectangle2 }; 65 | -------------------------------------------------------------------------------- /src/shapes/rectangles/r_3.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Rectangle3: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "rectangle-3"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 29 | 32 | 33 | 36 | 37 | 38 | 39 | 40 | 41 | 49 | 50 | 54 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | ); 64 | }); 65 | 66 | Rectangle3.displayName = "Rectangle3"; 67 | export { Rectangle3 }; 68 | -------------------------------------------------------------------------------- /src/shapes/rectangles/r_4.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Rectangle4: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "rectangle-4"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 25 | 26 | 27 | 28 | 32 | 33 | 34 | 35 | 42 | 43 | 44 | 45 | 46 | 54 | 55 | 59 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | ); 69 | }); 70 | 71 | Rectangle4.displayName = "Rectangle4"; 72 | export { Rectangle4 }; 73 | -------------------------------------------------------------------------------- /src/shapes/rectangles/r_6.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Rectangle6: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "rectangle-6"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 29 | 30 | 31 | 32 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | ); 48 | }); 49 | 50 | Rectangle6.displayName = "Rectangle6"; 51 | export { Rectangle6 }; 52 | -------------------------------------------------------------------------------- /src/shapes/rectangles/r_9.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Rectangle9: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "rectangle-9"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 44 | 45 | 49 | 52 | 53 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | ); 69 | }); 70 | 71 | Rectangle9.displayName = "Rectangle9"; 72 | export { Rectangle9 }; 73 | -------------------------------------------------------------------------------- /src/shapes/stars/s_1.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Star1: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "star-1"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 25 | 26 | 27 | 28 | 32 | 33 | 37 | 38 | 45 | 46 | 47 | 48 | 49 | 57 | 58 | 62 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | ); 72 | }); 73 | 74 | Star1.displayName = "Star1"; 75 | export { Star1 }; 76 | -------------------------------------------------------------------------------- /src/shapes/stars/s_10.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Star10: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "star-10"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 29 | 32 | 33 | 34 | 35 | 42 | 43 | 44 | 45 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | ); 62 | }); 63 | 64 | Star10.displayName = "Star10"; 65 | export { Star10 }; 66 | -------------------------------------------------------------------------------- /src/shapes/stars/s_11.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Star11: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "star-11"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 45 | 46 | 50 | 53 | 54 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | ); 70 | }); 71 | 72 | Star11.displayName = "Star11"; 73 | export { Star11 }; 74 | -------------------------------------------------------------------------------- /src/shapes/stars/s_12.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Star12: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "star-12"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 35 | 36 | 37 | 38 | 39 | 47 | 48 | 52 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | ); 62 | }); 63 | 64 | Star12.displayName = "Star12"; 65 | export { Star12 }; 66 | -------------------------------------------------------------------------------- /src/shapes/stars/s_2.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Star2: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "star-2"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 45 | 46 | 50 | 53 | 54 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | ); 70 | }); 71 | 72 | Star2.displayName = "Star2"; 73 | export { Star2 }; 74 | -------------------------------------------------------------------------------- /src/shapes/stars/s_3.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Star3: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "star-3"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 30 | 31 | 37 | 43 | 44 | 45 | 46 | 47 | 48 | 56 | 57 | 61 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | ); 71 | }); 72 | 73 | Star3.displayName = "Star3"; 74 | export { Star3 }; 75 | -------------------------------------------------------------------------------- /src/shapes/stars/s_4.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Star4: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "star-4"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 42 | 43 | 47 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | ); 57 | }); 58 | 59 | Star4.displayName = "Star4"; 60 | export { Star4 }; 61 | -------------------------------------------------------------------------------- /src/shapes/stars/s_5.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Star5: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "star-5"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 29 | 32 | 33 | 34 | 35 | 42 | 43 | 44 | 45 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | ); 62 | }); 63 | 64 | Star5.displayName = "Star5"; 65 | export { Star5 }; 66 | -------------------------------------------------------------------------------- /src/shapes/stars/s_6.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Star6: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "star-6"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 41 | 42 | 46 | 49 | 50 | 51 | 52 | 53 | 54 | 55 | ); 56 | }); 57 | 58 | Star6.displayName = "Star6"; 59 | export { Star6 }; 60 | -------------------------------------------------------------------------------- /src/shapes/stars/s_7.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Star7: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "star-7"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 42 | 43 | 47 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | ); 57 | }); 58 | 59 | Star7.displayName = "Star7"; 60 | export { Star7 }; 61 | -------------------------------------------------------------------------------- /src/shapes/stars/s_8.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Star8: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "star-8"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 44 | 45 | 49 | 52 | 53 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | ); 69 | }); 70 | 71 | Star8.displayName = "Star8"; 72 | export { Star8 }; 73 | -------------------------------------------------------------------------------- /src/shapes/triangles/t_1.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Triangle1: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "triangle-1"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 30 | 31 | 35 | 36 | 43 | 44 | 45 | 46 | 47 | 55 | 56 | 60 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | ); 70 | }); 71 | 72 | Triangle1.displayName = "Triangle1"; 73 | export { Triangle1 }; 74 | -------------------------------------------------------------------------------- /src/shapes/triangles/t_10.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Triangle10: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "triangle-10"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 21 | 22 | 23 | 24 | 28 | 29 | 30 | 31 | 34 | 35 | 36 | 37 | 38 | 46 | 47 | 51 | 54 | 55 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | ); 71 | }); 72 | 73 | Triangle10.displayName = "Triangle10"; 74 | export { Triangle10 }; 75 | -------------------------------------------------------------------------------- /src/shapes/triangles/t_11.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Triangle11: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "triangle-11"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 25 | 26 | 27 | 28 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 45 | 46 | 50 | 53 | 54 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | ); 70 | }); 71 | 72 | Triangle11.displayName = "Triangle11"; 73 | export { Triangle11 }; 74 | -------------------------------------------------------------------------------- /src/shapes/triangles/t_12.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Triangle12: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "triangle-12"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 36 | 37 | 38 | 39 | 40 | 48 | 49 | 53 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | ); 63 | }); 64 | 65 | Triangle12.displayName = "Triangle12"; 66 | export { Triangle12 }; 67 | -------------------------------------------------------------------------------- /src/shapes/triangles/t_13.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Triangle13: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "triangle-13"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 42 | 43 | 47 | 50 | 51 | 52 | 53 | 54 | 55 | 56 | ); 57 | }); 58 | 59 | Triangle13.displayName = "Triangle13"; 60 | export { Triangle13 }; 61 | -------------------------------------------------------------------------------- /src/shapes/triangles/t_2.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Triangle2: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "triangle-2"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 29 | 30 | 31 | 32 | 36 | 37 | 38 | 39 | 40 | 48 | 49 | 53 | 56 | 57 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | ); 73 | }); 74 | 75 | Triangle2.displayName = "Triangle2"; 76 | export { Triangle2 }; 77 | -------------------------------------------------------------------------------- /src/shapes/triangles/t_3.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Triangle3: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "triangle-3"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 34 | 35 | 36 | 37 | 38 | 46 | 47 | 51 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | ); 61 | }); 62 | 63 | Triangle3.displayName = "Triangle3"; 64 | export { Triangle3 }; 65 | -------------------------------------------------------------------------------- /src/shapes/triangles/t_4.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Triangle4: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "triangle-4"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 27 | 30 | 31 | 38 | 39 | 40 | 41 | 42 | 50 | 51 | 55 | 58 | 59 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | 73 | 74 | ); 75 | }); 76 | 77 | Triangle4.displayName = "Triangle4"; 78 | export { Triangle4 }; 79 | -------------------------------------------------------------------------------- /src/shapes/triangles/t_6.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Triangle6: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "triangle-6"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 35 | 36 | 37 | 38 | 39 | 47 | 48 | 52 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | ); 62 | }); 63 | 64 | Triangle6.displayName = "Triangle6"; 65 | export { Triangle6 }; 66 | -------------------------------------------------------------------------------- /src/shapes/triangles/t_7.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Triangle7: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "triangle-7"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 29 | 30 | 36 | 37 | 38 | 39 | 40 | 48 | 49 | 53 | 56 | 57 | 64 | 65 | 66 | 67 | 68 | 69 | 70 | 71 | 72 | ); 73 | }); 74 | 75 | Triangle7.displayName = "Triangle7"; 76 | export { Triangle7 }; 77 | -------------------------------------------------------------------------------- /src/shapes/triangles/t_8.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Triangle8: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "triangle-8"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 44 | 45 | 49 | 52 | 53 | 60 | 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | ); 69 | }); 70 | 71 | Triangle8.displayName = "Triangle8"; 72 | export { Triangle8 }; 73 | -------------------------------------------------------------------------------- /src/shapes/wheels/w_1.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Wheel1: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "wheel-1"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 36 | 37 | 38 | 39 | 40 | 48 | 49 | 53 | 56 | 57 | 58 | 59 | 60 | 61 | 62 | ); 63 | }); 64 | 65 | Wheel1.displayName = "Wheel1"; 66 | export { Wheel1 }; 67 | -------------------------------------------------------------------------------- /src/shapes/wheels/w_2.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Wheel2: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "wheel-2"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 29 | 30 | 31 | 32 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | ); 48 | }); 49 | 50 | Wheel2.displayName = "Wheel2"; 51 | export { Wheel2 }; 52 | -------------------------------------------------------------------------------- /src/shapes/wheels/w_4.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Wheel4: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "wheel-4"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 25 | 26 | 27 | 28 | 32 | 33 | 36 | 37 | 38 | 39 | 40 | 41 | 49 | 50 | 54 | 57 | 58 | 59 | 60 | 61 | 62 | 63 | ); 64 | }); 65 | 66 | Wheel4.displayName = "Wheel4"; 67 | export { Wheel4 }; 68 | -------------------------------------------------------------------------------- /src/shapes/wheels/w_5.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Wheel5: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "wheel-5"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 30 | 31 | 32 | 33 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | ); 49 | }); 50 | 51 | Wheel5.displayName = "Wheel5"; 52 | export { Wheel5 }; 53 | -------------------------------------------------------------------------------- /src/shapes/wheels/w_6.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Wheel6: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "wheel-6"; 6 | const clipId = `cs_clip_1_${shapeId}`; 7 | const maskId = `cs_mask_1_${shapeId}`; 8 | 9 | return ( 10 | 11 | 12 | 20 | 23 | 24 | 25 | 26 | 29 | 32 | 33 | 34 | 35 | 42 | 43 | 44 | 45 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 | 61 | ); 62 | }); 63 | 64 | Wheel6.displayName = "Wheel6"; 65 | export { Wheel6 }; 66 | -------------------------------------------------------------------------------- /src/shapes/wheels/w_7.tsx: -------------------------------------------------------------------------------- 1 | import React, { forwardRef } from "react"; 2 | import { ShapeBase, ShapeType } from "../../lib"; 3 | 4 | const Wheel7: ShapeType = forwardRef((props, ref) => { 5 | const shapeId = "wheel-7"; 6 | const maskId = `cs_mask_1_${shapeId}`; 7 | 8 | return ( 9 | 10 | 18 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 34 | 35 | 36 | 37 | 45 | 46 | 50 | 53 | 54 | 55 | 56 | ); 57 | }); 58 | 59 | Wheel7.displayName = "Wheel7"; 60 | export { Wheel7 }; 61 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "include": ["./src/**/*"], 3 | 4 | "compilerOptions": { 5 | "allowJs": true, 6 | "jsx": "react", 7 | "target": "ES2015", 8 | "module": "ESNext", 9 | "lib": ["ES2016", "esnext", "DOM"], 10 | "esModuleInterop": true, 11 | "moduleResolution": "Node", 12 | "forceConsistentCasingInFileNames": true, 13 | "strict": true, 14 | "skipLibCheck": true, 15 | "rootDir": "./src", 16 | "allowSyntheticDefaultImports": true, 17 | "outDir": "dist" 18 | }, 19 | "exclude": ["node_modules", "dist", "tests"] 20 | } 21 | -------------------------------------------------------------------------------- /vitest.config.mjs: -------------------------------------------------------------------------------- 1 | import react from "@vitejs/plugin-react"; 2 | import { defineConfig } from "vite"; 3 | 4 | export default defineConfig({ 5 | plugins: [react()], 6 | test: { 7 | globals: true, 8 | environment: "jsdom", 9 | setupFiles: "./tests/shape.test.tsx", 10 | }, 11 | }); 12 | --------------------------------------------------------------------------------