@bariskuran/base 0.0.0-stage → 0.0.2

package/src/libs/Icon/_dS.jsx

@@ -0,0 +1,401 @@
+import Ds from "../DesignSystem";
+import { SYS } from "../../constants/SYS";
+import { Icon } from "./";
+import { Flex } from "../Flex";
+import { Button } from "../Button";
+import { baseStore } from "../baseStore";
+import { t } from "../getText";
+
+const CustomTriangle = () => (
+    <>
+        <path d="M12 2L22 22H2Z" />
+    </>
+);
+
+const X = () => {
+    const { isHover, isActive, isPending, isClickEffect, setByPath } = baseStore.useLocal({
+        isHover: false,
+        isActive: false,
+        isPending: false,
+        isClickEffect: false,
+    });
+
+    /* RETURN */
+    return (
+        <Ds.page
+            title="<Icon>"
+            releasedOn="1.0.0"
+            description={
+                <>
+                    {t({ tr: "Icon, SVG ikonlarını yerleşik ikon setinden veya özel ikon tanımlarından render eder. Hover ve active durumlarını, boyut ve renk değişimini, ayrıca isteğe bağlı PopTip entegrasyonunu destekler.", en: "Icon renders SVG icons from the built-in icon set or custom icon definitions. It supports hover and active states, size and colour switching, and optional PopTip integration." })}
+                    <br />
+                    <br /> {t({ tr: "Tüm kullanılabilir ikonları ve yeni ikon eklemeyi görmek için ", en: "See " })}
+                    <Button.string to="/design-system/iconLibrary" label="Icon Library" />{t({ tr: " sayfasına bakın.", en: " for all available icons and how to add new icons." })}
+                </>
+            }
+        >
+            <Ds.block
+                title={{ tr: "Temel kullanım", en: "Basic Usage" }}
+                description={{ tr: "Icon componenti, ikon adını vererek ikon kütüphanesindeki herhangi bir ikonu render edebilir.", en: "The Icon component can render any icon from the icon library by passing its name." }}
+                code={`import { Icon } from "${SYS.basePath}";
+
+                       <Flex gap={16}>
+                        <Icon icon="copy" />
+                        <Icon icon="check" width={20} />
+                        <Icon icon="close" width={24} />
+                       </Flex>`}
+                example={
+                    <Flex gap={16}>
+                        <Icon icon="copy" />
+                        <Icon icon="check" width={20} />
+                        <Icon icon="close" width={24} />
+                    </Flex>
+                }
+            />
+            <Ds.block
+                title={{ tr: "Özel ikon dizisi", en: "Custom Icon Array" }}
+                description={{ tr: "Özel ikon tanımını doğrudan dizi olarak verebilirsiniz. İlk öğe viewBox boyutu; ikinci öğe ise path string'i, component veya render edilebilir başka bir içeriktir.", en: "You can pass a custom icon definition directly as an array. The first item is the viewBox size and the second item is a path string, a component, or other renderable content." }}
+                code={`import { Icon } from "${SYS.basePath}";
+
+                        const customIcon = [ "24 24", "M12 2L22 22H2Z" ];
+                        const CustomTriangle = () => ( <><path d="M12 2L22 22H2Z" /></> );
+
+                        <Flex gap={20}>
+                            <Icon icon={customIcon} width={18} color="tomato" />
+                            <Icon icon={["24 24", CustomTriangle]} width={18} color="royalblue" />
+                       </Flex>`}
+                example={
+                    <Flex gap={20}>
+                        <Icon icon={["24 24", "M12 2L22 22H2Z"]} width={18} color="tomato" />
+                        <Icon icon={["24 24", CustomTriangle]} width={18} color="royalblue" />
+                    </Flex>
+                }
+            />
+            <Ds.block
+                title="flat"
+                description={{ tr: "Kare yerine içerikle orantılı kutu kullanır: width/size, ikon içeriğinin uzun kenarını hedefler (kare ikonla aynı zihinsel model). Path tabanlı ikonlarda flat, SVG'yi path sınırlarına kırpar ve optik ölçeklemeyi kapatır; böylece kaynak viewBox'ta fazladan boşluk olsa bile logolar ve wordmark'lar kenardan kenara render edilir.", en: "Uses a content-proportional box instead of a square: width/size targets the long side of the icon content. For path-based icons, flat trims the SVG to path bounds and disables optical scaling, so logos and wordmarks render edge-to-edge even when the source viewBox has extra whitespace." }}
+                code={`import { Icon } from "${SYS.basePath}";
+
+                        <Icon icon="baseLogo" width={80} />
+                        <Icon icon="baseLogo" width={80} flat />`}
+                example={
+                    <Flex gap={24} yAlign="start">
+                        <Flex bgColor="greys.shade40">
+                            <Icon icon="baseLogo" width={80} />
+                        </Flex>
+                        <Flex bgColor="greys.shade40">
+                            <Icon icon="baseLogo" width={80} flat />
+                        </Flex>
+                    </Flex>
+                }
+            />
+            <Ds.block
+                title={{ tr: "Genişlik ve renk", en: "Width and Color" }}
+                description={{ tr: "width ikon boyutunu kontrol eder. color ham değerleri, theme değerlerini ve theme path'lerini destekler. width için size ve w propları da kullanılabilir.", en: "width controls icon size. color supports raw values, theme values, and theme paths. size and w also work as width shorthands." }}
+                code={`import { Icon } from "${SYS.basePath}";
+
+                       <Flex gap={20}>
+                        <Icon icon="copy" width={12} color="$ff0000" />
+                        <Icon icon="copy" size={18} color="royalblue" />
+                        <Icon icon="copy" size={18} color="primary" />
+                        <Icon icon="copy" w={24} color="greys.shade40" />
+                       </Flex>`}
+                example={
+                    <Flex gap={20}>
+                        <Icon icon="copy" width={12} color="#ff0000" />
+                        <Icon icon="copy" size={18} color="royalblue" />
+                        <Icon icon="copy" size={18} color="primary" />
+                        <Icon icon="copy" w={24} color="greys.shade40" />
+                    </Flex>
+                }
+            />
+            <Ds.block
+                title={{ tr: "Hover durumu", en: "Hover State" }}
+                description={{ tr: "Hover sırasında ikonu, rengi ve genişliği değiştirebilirsiniz. Hover davranışı fare etkileşimiyle otomatik çalışır; hoverManually boolean prop'u ile elle de tetiklenebilir.", en: "You can change the icon, colour, and width on hover. Hover works automatically through pointer interaction or can be triggered manually with the hoverManually boolean prop." }}
+                code={`import { Icon } from "${SYS.basePath}";
+
+                       <Flex gap={20}>
+                        <Icon icon="copy" hoverIcon="check" hoverColor="green" />
+                        <Icon icon="download" width={14} hoverScale={1.4} hoverColor="dodgerblue" />
+                        <Icon icon="search" width={14} hoverScale={4} disableScaleEffect hoverColor="dodgerblue" hoverManually={isHover} />
+                       </Flex>`}
+                example={
+                    <Flex gap={20}>
+                        <Icon
+                            icon="copy"
+                            hoverIcon="check"
+                            hoverColor="green"
+                            hoverManually={isHover}
+                        />
+                        <Icon
+                            icon="download"
+                            width={14}
+                            hoverScale={1.4}
+                            hoverColor="dodgerblue"
+                            hoverManually={isHover}
+                        />
+                        <Icon
+                            icon="search"
+                            width={14}
+                            hoverScale={4}
+                            hoverColor="dodgerblue"
+                            hoverManually={isHover}
+                            disableScaleEffect
+                        />
+                        <div
+                            onMouseEnter={() => setByPath("isHover", true)}
+                            onMouseLeave={() => setByPath("isHover", false)}
+                        >
+                            hoverManually
+                        </div>
+                    </Flex>
+                }
+            />
+            <Ds.block
+                title={{ tr: "Active durumu", en: "Active State" }}
+                description={{ tr: "Active durum ikonu, rengi ve scale değerini değiştirebilir. Active iken disableScaleEffect true değilse yerleşik pulse animasyonu da oynar. Icon kendi başına active durumu tetiklemez; componentiniz içinden activeManually boolean prop'u ile elle tetikleyebilirsiniz.", en: "The active state can switch icon, colour, and scale. Unless disableScaleEffect is true, it also plays the built-in pulse animation. Icon cannot trigger the active state itself; trigger it manually in your component with the activeManually boolean prop." }}
+                code={`import { Icon } from "${SYS.basePath}";
+
+                       <Flex gap={20}>
+                        <Icon icon="copy" activeIcon="check" activeColor="green" activeManually={isActive} />
+                        <Icon icon="copy" width={14} activeScale={1.4} activeColor="tomato" activeManually={isActive} />
+                        <Icon icon="copy" width={14} activeScale={1.8} activeColor="primary" activeManually={isActive} disablePulseEffect />
+                       </Flex>`}
+                example={
+                    <Flex gap={20}>
+                        <Icon
+                            icon="copy"
+                            activeIcon="check"
+                            activeColor="green"
+                            activeManually={isActive}
+                        />
+                        <Icon
+                            icon="download"
+                            width={14}
+                            activeColor="blue"
+                            activeScale={1.8}
+                            activeManually={isActive}
+                        />
+                        <Icon
+                            icon="search"
+                            width={14}
+                            activeColor="primary"
+                            activeScale={3}
+                            activeManually={isActive}
+                            disablePulseEffect
+                        />
+                        <div
+                            onMouseEnter={() => setByPath("isActive", true)}
+                            onMouseLeave={() => setByPath("isActive", false)}
+                        >
+                            activeManually
+                        </div>
+                    </Flex>
+                }
+            />
+            <Ds.block
+                title={{ tr: "Pending durumu", en: "Pending State" }}
+                description={{ tr: "Pending durum ikonu, rengi ve scale değerini değiştirebilir. Icon bunu kendi başına tetiklemez; pendingManually boolean prop'u ile elle tetikleyebilirsiniz. Pending durumunda ikon 360 derece döner; bu animasyona uygun ikonların seçilmesi önerilir.", en: "The pending state can switch icon, colour, and scale. Icon cannot trigger it itself; trigger it manually with the pendingManually boolean prop. While pending, the icon rotates 360 degrees, so choose icons suitable for this animation." }}
+                code={`import { Icon } from "${SYS.basePath}";
+
+                       <Icon icon="copy" pendingIcon="loading" pendingColor="green" pendingManually={isPending} />
+                       <Icon icon="download" width={14} pendingIcon="loading2" pendingColor="blue" pendingScale={1.8} pendingManually={isPending} />`}
+                example={
+                    <Flex gap={20}>
+                        <Icon
+                            icon="copy"
+                            pendingIcon="loading"
+                            pendingColor="green"
+                            pendingManually={isPending}
+                        />
+                        <Icon
+                            icon="download"
+                            width={14}
+                            pendingIcon="loading2"
+                            pendingColor="blue"
+                            pendingScale={1.8}
+                            pendingManually={isPending}
+                        />
+                        <div
+                            onMouseEnter={() => setByPath("isPending", true)}
+                            onMouseLeave={() => setByPath("isPending", false)}
+                        >
+                            pendingManually
+                        </div>
+                    </Flex>
+                }
+            />
+            <Ds.block
+                title={{ tr: "Click durumu", en: "Click State" }}
+                description={{ tr: "Click/press görselleri active katmanını yeniden kullanır: activeIcon, activeColor, activeScale ve pulse (disablePulseEffect değilse). Icon click feedback'i kendi başına oynatmaz. Parent'tan clickEffectManually boolean'ını kullanın; örneğin ertelenmiş action'lı Button veya confirm sonrası PopConfirm. clickEffectManually tanımlıysa click efektini activeManually'e ek olarak yalnızca bu boolean yönetir. Icon Button ile otomatik yönetiliyorsa prop'u vermeyin.", en: "Click/press visuals reuse the active layer: activeIcon, activeColor, activeScale, and pulse unless disablePulseEffect is set. Icon does not play click feedback itself; use clickEffectManually from a parent, such as a Button with deferred actions or PopConfirm after confirmation. When defined, this boolean controls click-effect visuals alongside activeManually. Omit it when Button drives Icon automatically." }}
+                code={`import { Icon } from "${SYS.basePath}";
+
+                       <Flex gap={20}>
+                        <Icon
+                            icon="copy"
+                            activeIcon="check"
+                            activeColor="green"
+                            clickEffectManually={isClickEffect}
+                        />
+                        <Icon
+                            icon="download"
+                            width={14}
+                            activeIcon="loading"
+                            activeColor="blue"
+                            activeScale={1.4}
+                            clickEffectManually={isClickEffect}
+                        />
+                       </Flex>`}
+                example={
+                    <Flex gap={20}>
+                        <Icon
+                            icon="copy"
+                            activeIcon="check"
+                            activeColor="green"
+                            clickEffectManually={isClickEffect}
+                        />
+                        <Icon
+                            icon="download"
+                            width={14}
+                            activeIcon="loading"
+                            activeColor="blue"
+                            activeScale={1.4}
+                            clickEffectManually={isClickEffect}
+                        />
+                        <div
+                            onMouseEnter={() => setByPath("isClickEffect", true)}
+                            onMouseLeave={() => setByPath("isClickEffect", false)}
+                        >
+                            clickEffectManually
+                        </div>
+                    </Flex>
+                }
+            />
+            <Ds.block
+                title={{ tr: "PopTip entegrasyonu", en: "PopTip Integration" }}
+                description={
+                    <>
+                        {t({ tr: "Icon ile PopTip kullanmak isterseniz, tooltip içeriğini ve ayarını popTipProps prop'u ile belirleyebilirsiniz. popTipProps nesnesi PopTip ile aynı API'yi kullanır.", en: "To use PopTip with an Icon, specify tooltip content and configuration through the popTipProps prop. The popTipProps object uses the same API as PopTip." })}
+                        <br />
+                        <br />
+                        {t({ tr: "popTipProps için ", en: "See " })}<Button.string to="/design-system/popTip" label="PopTip" />{t({ tr: " sayfasına bakın.", en: " for popTipProps." })}
+                    </>
+                }
+                code={`import { Icon } from "${SYS.basePath}";
+
+                        <Flex gap={20}>
+                            <Icon icon="copy" popTipProps={{ content: "Copy" }} />
+                            <Icon icon="check" width={18} popTipProps={{ content: "Success" }} />
+                        </Flex>`}
+                example={
+                    <Flex gap={20}>
+                        <Icon icon="copy" popTipProps={{ content: "Copy" }} />
+                        <Icon icon="check" width={18} popTipProps={{ content: "Success" }} />
+                    </Flex>
+                }
+            />
+            <Ds.api
+                args='<Icon icon="" />'
+                props={{
+                    icon: {
+                        description: { tr: "Kütüphanedeki ikon adı veya [viewBox, content] biçiminde özel ikon dizisi.", en: "Icon name from the library or a custom icon array in the form [viewBox, content]." },
+                        type: "string | array",
+                        required: true,
+                        defaultValue: "warning",
+                    },
+                    color: {
+                        description: { tr: "Varsayılan ikon rengi.", en: "Default icon colour." },
+                        type: "string",
+                        defaultValue: "foreground || black",
+                    },
+                    width: {
+                        description: { tr: "Temel ikon boyutu. Kısaltmalar: size ve w.", en: "Base icon size. Shorthands: size and w." },
+                        type: "number",
+                        defaultValue: "10",
+                    },
+                    hoverIcon: {
+                        description: { tr: "Hover durumunda gösterilen ikon.", en: "Icon shown on hover state." },
+                        type: "string | array",
+                    },
+                    hoverColor: {
+                        description: { tr: "Hover durumunda gösterilen renk.", en: "Colour shown on hover state." },
+                        type: "string",
+                    },
+                    hoverWidth: {
+                        description: { tr: "Hover durumunda gösterilen boyut. Kısaltmalar: hoverSize ve hoverW.", en: "Size shown on hover state. Shorthands: hoverSize and hoverW." },
+                        type: "number",
+                    },
+                    hoverManually: {
+                        description: { tr: "Hover görsellerini elle tetikler.", en: "Triggers hover visuals manually." },
+                        type: "boolean",
+                        defaultValue: "false",
+                    },
+                    activeIcon: {
+                        description: { tr: "Active durumunda gösterilen ikon.", en: "Icon shown on active state." },
+                        type: "string | array",
+                    },
+                    activeColor: {
+                        description: { tr: "Active durumunda gösterilen renk.", en: "Colour shown on active state." },
+                        type: "string",
+                    },
+                    activeWidth: {
+                        description: { tr: "Active durumunda gösterilen boyut. Kısaltmalar: activeSize ve activeW.", en: "Size shown on active state. Shorthands: activeSize and activeW." },
+                        type: "number",
+                    },
+                    activeManually: {
+                        description: { tr: "Active görsellerini elle tetikler.", en: "Triggers active visuals manually." },
+                        type: "boolean",
+                        defaultValue: "false",
+                    },
+                    pendingIcon: {
+                        description: { tr: "Pending durumunda gösterilen ikon (ör. navigasyon yüklenirken). Pending iken hover/active üzerinde önceliklidir.", en: "Icon shown while pending (e.g. navigation loading). Takes precedence over hover/active while pending." },
+                        type: "string | array",
+                    },
+                    pendingColor: {
+                        description: { tr: "Pending durumundaki renk.", en: "Colour while pending." },
+                        type: "string",
+                    },
+                    pendingWidth: {
+                        description: { tr: "Pending durumundaki boyut. Kısaltmalar: pendingSize ve pendingW.", en: "Size while pending. Shorthands: pendingSize and pendingW." },
+                        type: "number",
+                    },
+                    pendingScale: {
+                        description: { tr: "Pending durumundaki görsel scale ezmesi.", en: "Visual scale override while pending." },
+                        type: "number",
+                    },
+                    pendingManually: {
+                        description: { tr: "Pending görsellerini elle tetikler (ör. Router loading durumu ile birlikte).", en: "Triggers pending visuals manually (e.g. alongside Router loading state)." },
+                        type: "boolean",
+                        defaultValue: "false",
+                    },
+                    clickEffectManually: {
+                        description: { tr: "Click/press durumu (activeIcon, activeColor, activeScale kullanır). Icon kendini tetiklemez; parent true/false verir. Tanımlandığında click efekti activeManually ile birlikte bu boolean'ı izler. Button içinde otomatik yönetim için vermeyin.", en: "Click/press state (uses activeIcon, activeColor, activeScale). Icon does not self-trigger; the parent sets true/false. When defined, click-effect visuals follow this boolean together with activeManually. Omit it when nested in Button for automatic handling." },
+                        type: "boolean",
+                    },
+                    popTipProps: {
+                        description: { tr: "PopTip entegrasyonunu açar. enablePopTip true olduğunda proplar PopTip'e aktarılır.", en: "Enables PopTip integration. Props are passed to PopTip when enablePopTip is true." },
+                        type: "object",
+                        defaultValue: "{}",
+                    },
+                    disableScaleEffect: {
+                        description: { tr: "Hover scale efektini kapatır.", en: "Disables the hover scale effect." },
+                        type: "boolean",
+                        defaultValue: "false",
+                    },
+                    flat: {
+                        description: { tr: "true olduğunda ikon kare olmaya zorlanmaz. width/size uzun kenarı hedefler. Path tabanlı ikonlar gerçek path sınırlarına kırpılır ve logolar/wordmark'lar kenardan kenara render edilebilsin diye optik scale kapatılır.", en: "When true, the icon is not forced into a square. width/size targets the long side. Path-based icons are trimmed to their real path bounds and optical scaling is disabled so logos and wordmarks render edge-to-edge." },
+                        type: "boolean",
+                        defaultValue: "false",
+                    },
+                    disablePulse: {
+                        description: { tr: "Active pulse efektini kapatır.", en: "Disables the active pulse effect." },
+                        type: "boolean",
+                        defaultValue: "false",
+                    },
+                }}
+            />
+        </Ds.page>
+    );
+};
+
+export default X;

package/src/libs/Icon/_dSLibrary.jsx

@@ -0,0 +1,145 @@
+import Ds from "../DesignSystem";
+import { loadAllBuiltInIcons } from "./icons";
+import { Icon } from "./";
+import styled from "styled-components";
+import { copyToClipboard } from "../copyToClipboard";
+import { baseStore } from "../baseStore";
+import { useEffect, useState } from "react";
+import { sortBy } from "../sortBy";
+import { Button } from "../Button";
+
+const X = () => (
+    <Ds.page
+        title="Icon Library"
+        releasedOn="1.0.0"
+        description={
+            <>
+                You can view all the icons used with the Icon component here. You can search by name
+                or keyword. For usage details, check the documentation for the Icon component. Base
+                comes with its own built-in icon set, but you can also add your own custom icons
+                through your project files.
+                <br />
+                <br /> Check out
+                <Button.string to="/design-system/icon" label="<Icon>" />.
+            </>
+        }
+    >
+        <Ds.block
+            title="Adding new icons"
+            description={`In your project, you can add your own icon set under PROJECT_SETTINGS.iconsLibrary
+            in the format: ["viewPortX viewPortY", path, searchKeywords].`}
+            code={`iconsLibrary: {
+                        testIcon: [
+                            "5.6, 20",
+                            "M2.8,20c-1.5,0-2.7-1.2-2.7-2.7s1.2-2.7,2.7-2.7,2.7,1.2,2.7,2.7-1.2,2.7-2.7,2.7ZM4.3,9.5l-.7,2.8h-1.6l-.7-2.8C.3,5.8,0,3.8,0,2.8,0,.9,1.1,0,2.8,0s2.8.9,2.8,2.8-.3,3.1-1.3,6.7Z",
+                            ["warning", "exclamation", "mark"],
+                        ],
+                    }
+                `}
+        />
+        <Ds.block title="Library" example={<Library />} lastBlock />
+    </Ds.page>
+);
+
+export default X;
+
+const S = {
+    Container: styled.div`
+        width: 100%;
+        display: flex;
+        flex-wrap: wrap;
+        justify-content: center;
+        gap: 10px;
+    `,
+    Box: styled.div`
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+        gap: 10px;
+        border: 1px solid black;
+        padding: 10px;
+        flex: 0 0 150px;
+        height: 150px;
+        cursor: pointer;
+        user-select: none;
+        transition: all 0.25s ease-in-out;
+
+        &:hover {
+            background: rgba(0, 0, 0, 0.1);
+        }
+
+        &:active {
+            transition: all 0.1s ease-in-out;
+            background: rgba(0, 0, 0, 0.5);
+        }
+    `,
+    Label: styled.span`
+        font-size: 12px;
+        font-weight: 600;
+        color: black;
+    `,
+    Input: styled.input`
+        flex: 0 0 100%;
+        width: 100%;
+        margin-bottom: 16px;
+        padding: 6px 10px;
+        font-size: 14px;
+        width: 100%;
+    `,
+};
+
+export const Library = () => {
+    const [iconsLibrary] = baseStore.useGlobal((s) => [s._iconsLibrary]);
+    const { searchText, set } = baseStore.useLocal({ searchText: "" });
+    const [builtInIcons, setBuiltInIcons] = useState({});
+
+    useEffect(() => {
+        let cancelled = false;
+
+        loadAllBuiltInIcons().then((definitions) => {
+            if (!cancelled) setBuiltInIcons(definitions);
+        });
+
+        return () => {
+            cancelled = true;
+        };
+    }, []);
+
+    /* Return */
+    return (
+        <S.Container>
+            <S.Input
+                type="text"
+                placeholder="Search icons..."
+                value={searchText}
+                onChange={(e) => set({ searchText: e.target.value })}
+            />
+            {Object.entries({ ...builtInIcons, ...iconsLibrary })
+                .filter(([iconName, iconArr]) => {
+                    if (!searchText) return true;
+                    const lowerSearch = searchText.toLowerCase();
+                    const keywords =
+                        Array.isArray(iconArr) && iconArr.length > 2 && Array.isArray(iconArr[2])
+                            ? iconArr[2].map((kw) => String(kw).toLowerCase())
+                            : [];
+                    return (
+                        iconName.toLowerCase().includes(lowerSearch) ||
+                        keywords.some((kw) => kw.includes(lowerSearch))
+                    );
+                })
+                .sort(([aName], [bName]) => sortBy.asc(aName, bName))
+                .map(([iconName]) => (
+                    <S.Box
+                        key={iconName}
+                        onClick={() => {
+                            copyToClipboard(`<Icon icon="${iconName}" width={20} />`);
+                        }}
+                    >
+                        <Icon icon={iconName} width={24} color="black" />
+                        <S.Label>{iconName}</S.Label>
+                    </S.Box>
+                ))}
+        </S.Container>
+    );
+};

package/src/libs/Icon/icons/abstract1.js

@@ -0,0 +1 @@
+export default ["20 18.01","M12.43,0c2.24,0,4.49,0,6.73,0,.45,0,.75.24.83.64.03.14,0,.26-.05.39-.85,2.87-1.71,5.74-2.56,8.62-.75,2.52-1.5,5.04-2.24,7.56-.19.66-.39.8-1.08.8-4.37,0-8.74,0-13.11,0-.15,0-.3,0-.44-.05-.41-.14-.61-.53-.48-.98.26-.89.52-1.78.79-2.68,1.21-4.07,2.41-8.14,3.62-12.2.14-.48.28-.96.43-1.44C5.03.17,5.25,0,5.76,0c2.22,0,4.45,0,6.67,0Z"];

package/src/libs/Icon/icons/abstract10.js

@@ -0,0 +1 @@
+export default ["20 20","M8.36,4.2c0,2.31-1.87,4.16-4.2,4.16C1.85,8.36,0,6.48,0,4.16,0,1.86,1.88,0,4.2,0c2.31,0,4.16,1.88,4.15,4.2ZM11.02,11.75c2.19.29,4,1.29,5.4,2.99,1.18,1.44,1.8,3.1,1.85,4.97,0,.2.07.29.28.28.39-.01.78-.01,1.17,0,.21,0,.29-.06.28-.28-.02-.47-.06-.94-.14-1.4-.94-5.54-6.23-9.24-11.73-8.16-3.08.6-5.38,2.32-6.91,5.06C.43,16.6.05,18.11,0,19.7c0,.22.06.3.29.3.4-.01.8,0,1.19,0,.18,0,.25-.07.25-.24-.01-.32.02-.63.07-.95.61-4.22,4.24-7.16,8.26-7.11.28.02.62,0,.96.05ZM13.36,16.65c0-1.83-1.51-3.35-3.35-3.35-1.85,0-3.37,1.51-3.37,3.35,0,1.84,1.51,3.35,3.35,3.35,1.86,0,3.37-1.5,3.37-3.35ZM20,8.53c0-.17-.07-.23-.23-.24-.27,0-.53-.01-.8-.05-2.58-.35-4.57-1.62-5.99-3.78-.81-1.25-1.24-2.63-1.28-4.13,0-.32-.01-.33-.33-.33-.38,0-.76,0-1.14,0-.19,0-.25.06-.25.25,0,.57.06,1.13.18,1.69.79,3.6,2.91,6.09,6.33,7.45,1.04.41,2.13.61,3.25.62.19,0,.27-.05.26-.25-.01-.2,0-.41,0-.61,0-.21,0-.42,0-.63ZM14.95,2.52c0,1.38,1.15,2.53,2.53,2.53,1.37,0,2.51-1.13,2.51-2.51,0-1.4-1.12-2.53-2.51-2.53-1.39,0-2.53,1.13-2.53,2.51Z"];

package/src/libs/Icon/icons/abstract11.js

@@ -0,0 +1 @@
+export default ["20 19.99","M16.62,19.99h-5.3c-.02-.07,0-.14.02-.21.06-.28.07-.57.03-.85-.24-1.64-1.67-2.69-3.31-2.43-1.26.2-2.28,1.36-2.32,2.64,0,.29.04.57.07.85-1.89,0-3.78,0-5.67,0-.12,0-.14-.02-.14-.14,0-1.89,0-3.78,0-5.67.36.06.72.11,1.08.06,1.5-.2,2.57-1.54,2.45-3.06-.12-1.46-1.38-2.59-2.88-2.57-.22,0-.43.07-.65.07V3.38c.16-.37.44-.53.85-.52,1.47,0,2.94,0,4.41,0q.41,0,.47-.4c.23-1.64,1.86-2.76,3.48-2.38,1.2.28,2.05,1.23,2.21,2.46q.04.32.37.32c1.51,0,3.01,0,4.52,0,.55,0,.84.29.84.84,0,1.48,0,2.96,0,4.44,0,.46-.05.39.4.45,1.52.18,2.68,1.75,2.42,3.25-.24,1.36-1.19,2.28-2.58,2.45-.21.03-.25.1-.25.29,0,1.52,0,3.04,0,4.56,0,.41-.15.69-.52.84Z"];

package/src/libs/Icon/icons/abstract12.js

@@ -0,0 +1 @@
+export default ["20 20","M14.28,1.05c-.3-.04-.57-.07-.84-.1-1.59-.16-3.13.04-4.59.7-2.85,1.3-4.63,3.49-5.29,6.55-.4,1.87-.22,3.69.85,5.34,1.13,1.74,2.73,2.76,4.79,3.02,3.48.44,6.59-1.92,7.27-5.21.38-1.84.04-3.52-1.33-4.87-1.42-1.39-3.14-1.8-5.03-1.18-1.88.62-3,1.97-3.35,3.92-.28,1.58.33,2.9,1.6,3.64,1.98,1.15,4.57-.11,4.88-2.39.04-.3.06-.6-.02-.89-.19-.74-.89-1.26-1.65-1.22-.77.04-1.42.62-1.54,1.36-.03.2,0,.28.22.27.38-.02.76,0,1.14,0,.24-.01.27.09.25.29-.09.69-.73,1.33-1.43,1.4-1.12.12-1.98-.7-1.92-1.82.1-1.79,1.5-3.18,3.29-3.2,1.86-.02,3.19,1.37,3.36,2.93.26,2.42-1.44,4.86-4.06,5.34-2.83.51-5.49-1.39-5.87-4.24-.22-1.61.17-3.13,1.01-4.52,1.27-2.09,3.13-3.31,5.55-3.61,4.08-.51,7.79,2.36,8.33,6.44.29,2.21-.21,4.28-1.37,6.17-1.54,2.52-3.78,4.11-6.69,4.64-3.27.6-6.18-.24-8.64-2.48C1.5,15.77.46,13.82.12,11.54c-.45-3.07.34-5.81,2.39-8.15C4.09,1.58,6.08.51,8.44.13c1.95-.31,3.83-.05,5.63.76.07.03.16.04.21.17Z"];

package/src/libs/Icon/icons/abstract13.js

@@ -0,0 +1 @@
+export default ["19.32 20","M10.15,20h-1.64c-.74-.08-1.48-.21-2.2-.43-1.75-.55-3.23-1.51-4.46-2.87-.77-.85-1.37-1.8-1.8-2.86-.02-.06-.08-.12-.03-.18.04-.05.11-.01.17,0,.98.23,1.93.54,2.77,1.12.12.08.15.03.17-.08.05-.23.1-.46.17-.68.18-.54.42-1.04.86-1.42.04-.04.09-.1.15-.08.07.03.03.12.02.18-.1.52-.1,1.03-.03,1.55.15,1.14.63,2.13,1.45,2.94,1.61,1.59,3.9,1.95,5.95.96,2.03-.99,3.2-3.39,2.72-5.59-.33-1.51-1.15-2.66-2.48-3.44-.96-.56-2-.78-3.12-.64-.58.07-1.12.27-1.69.39-1.16.26-2.34.43-3.53.45-.62.01-1.24-.03-1.83-.22-.38-.12-.73-.3-.93-.67-.52-.97-.69-2-.4-3.07.32-1.17,1.01-2.1,1.93-2.85C4.62.66,7.23-.18,10.17.03c1.45.1,2.81.53,4.07,1.26,3.77,2.16,5.75,6.34,4.89,10.6-.81,4-3.28,6.58-7.17,7.78-.59.18-1.19.25-1.8.34Z"];

package/src/libs/Icon/icons/abstract14.js

@@ -0,0 +1 @@
+export default ["20 20","M14.13,15.87c-2.48-.13-4.3-1.27-5.35-3.55-.08-.18-.14-.18-.28-.07-.77.6-1.1,1.64-.81,2.6.27.93,1.1,1.62,2.06,1.7.7.06.81.21.79.88-.02.66,0,1.33,0,1.99,0,.39-.19.58-.58.58-2.75.02-5.23-2.06-5.7-4.79-.48-2.73.92-5.33,3.47-6.45.16-.07.16-.13.07-.26-.57-.77-1.6-1.11-2.55-.83-1,.29-1.69,1.08-1.76,2.04-.05.69-.18.83-.88.81-.66-.02-1.33,0-1.99,0C.19,10.52,0,10.33,0,9.93c0-2.77,1.97-5.14,4.72-5.65,1.97-.36,3.72.1,5.19,1.48.57.54.99,1.19,1.31,1.91.1.22.1.22.29.08.76-.58,1.08-1.59.81-2.54-.29-1.01-1.07-1.67-2.07-1.76-.09,0-.18-.02-.27-.03-.33-.03-.5-.22-.5-.56,0-.76,0-1.52,0-2.28,0-.38.2-.57.58-.57,2.57-.02,4.85,1.7,5.54,4.2.54,1.95.23,3.76-1.04,5.36-.59.74-1.35,1.28-2.21,1.66-.24.11-.24.11-.09.3.59.76,1.59,1.08,2.55.8,1-.29,1.66-1.07,1.75-2.05.06-.71.15-.79.85-.79.67,0,1.34,0,2.01,0,.39,0,.58.19.58.59.02,2.75-2.06,5.22-4.79,5.7-.36.06-.71.1-1.08.1ZM6.44,3.41c.97,0,1.71-.73,1.71-1.69,0-.98-.72-1.71-1.7-1.72-.97,0-1.71.73-1.71,1.69,0,.98.72,1.72,1.7,1.72ZM18.3,4.74c-.98,0-1.71.73-1.71,1.71,0,.97.73,1.7,1.7,1.7.98,0,1.71-.73,1.71-1.71,0-.97-.73-1.7-1.7-1.7ZM1.72,11.85C.74,11.85,0,12.57,0,13.55c0,.98.73,1.71,1.71,1.71.97,0,1.7-.73,1.7-1.7,0-.97-.72-1.7-1.69-1.71ZM13.56,16.59c-.98,0-1.72.73-1.72,1.7,0,.97.73,1.7,1.7,1.7.98,0,1.72-.73,1.72-1.7,0-.97-.73-1.7-1.7-1.7Z"];

package/src/libs/Icon/icons/abstract15.js

@@ -0,0 +1 @@
+export default ["20 20","M9.5,20c-.7-.12-1.36-.36-1.91-.82-1.27-1.06-1.77-2.42-1.36-4.03.41-1.6,1.49-2.58,3.11-2.88,2.18-.4,4.24,1.12,4.54,3.29.29,2.11-1.12,4.04-3.23,4.41-.04,0-.09.02-.13.03h-1.01ZM20,7.67c-.36-.03-.73-.04-1.09-.1-2.54-.42-4.44-1.76-5.68-4.03-.03-.06-.04-.14-.12-.17-.05.04-.06.09-.07.14-.44,1.65-1.17,3.16-2.19,4.53-.08.11-.08.18.01.28.42.47.87.89,1.36,1.28,1.74,1.41,3.72,2.28,5.94,2.62.61.09,1.22.16,1.84.12v-4.68ZM20,.02s-.03,0-.04,0c-1.66,0-3.33,0-4.99,0-.14,0-.17.07-.16.19.03.25.04.49.08.73.48,2.51,2.53,4.23,5.1,4.28V.02ZM7.98,0c-.33,0-.34,0-.35.34-.01.61-.1,1.21-.29,1.78-.88,2.77-2.73,4.54-5.54,5.3-.52.14-1.06.19-1.6.21-.14,0-.2.06-.2.21,0,1.44,0,2.87,0,4.31,0,.17.07.2.22.21.56,0,1.12-.04,1.67-.14,3.73-.63,6.62-2.54,8.64-5.74,1.2-1.9,1.8-3.99,1.84-6.24,0-.2-.06-.26-.25-.25-.7.01-1.4,0-2.11,0-.68,0-1.35,0-2.03,0ZM0,4.82c0,.41-.04.39.37.36,1.44-.11,2.63-.71,3.58-1.8.78-.89,1.18-1.95,1.25-3.13.01-.24,0-.26-.23-.26C3.39,0,1.82,0,.24,0,.06,0,0,.05,0,.24c0,.79,0,1.57,0,2.36,0,.74,0,1.48,0,2.22Z"];

package/src/libs/Icon/icons/abstract16.js

@@ -0,0 +1 @@
+export default ["20 20","M12.18,20c-.13-.07-.24-.17-.35-.27-1.49-1.5-2.99-2.99-4.48-4.48-.12-.12-.23-.25-.25-.43-.04-.39.22-.68.64-.68,2.32,0,4.64,0,6.96,0,1.53,0,3.07,0,4.6,0,.36,0,.58.14.67.42.09.28-.02.54-.31.73-2.3,1.53-4.6,3.06-6.9,4.59-.06.04-.13.08-.2.12h-.39ZM0,5.48c.14.3.38.41.71.41,3.82,0,7.65,0,11.47,0,.06,0,.12,0,.18,0,.29-.02.52-.26.54-.55.02-.23-.09-.4-.24-.55-1.5-1.5-3.01-3.01-4.51-4.51-.34-.34-.58-.36-.98-.09C4.89,1.69,2.63,3.2.37,4.7c-.16.1-.29.22-.37.39v.39ZM0,12.59c.8,1.21,1.61,2.43,2.41,3.64.75,1.13,1.51,2.26,2.26,3.39.11.16.23.3.4.39h.39c.3-.14.41-.38.41-.71,0-3.82,0-7.64,0-11.46,0-.06,0-.13,0-.19-.03-.28-.26-.5-.54-.52-.21-.02-.38.07-.52.21-1.53,1.53-3.06,3.06-4.59,4.59-.08.08-.15.18-.21.28,0,.13,0,.26,0,.39ZM14.11,11.8c0,.18,0,.36,0,.55.01.32.26.56.58.56.22,0,.38-.11.53-.25,1.5-1.5,3-3,4.5-4.5.34-.34.36-.58.1-.98-.71-1.06-1.41-2.12-2.12-3.18-.81-1.21-1.62-2.42-2.42-3.64-.12-.17-.25-.32-.47-.35-.39-.05-.69.22-.69.63,0,1.94,0,3.88,0,5.81,0,1.78,0,3.56,0,5.35ZM12.29,12.95c.39,0,.64-.24.64-.63,0-1.54,0-3.08,0-4.62,0-.39-.24-.63-.64-.63-1.53,0-3.07,0-4.6,0-.4,0-.64.24-.64.65,0,1.53,0,3.06,0,4.58,0,.42.24.65.66.65.76,0,1.52,0,2.28,0,.77,0,1.53,0,2.3,0Z"];

package/src/libs/Icon/icons/abstract17.js

@@ -0,0 +1 @@
+export default ["20 20","M10.81,20.02c-3.55,0-7.1,0-10.64,0-.14,0-.17-.03-.17-.17,0-3.56,0-7.12,0-10.68.05-.31.09-.63.14-.94C.97,3.53,5.14.03,9.9.02c3.26,0,6.53,0,9.79,0q.31,0,.31.31c0,3.25,0,6.5,0,9.75,0,.59-.04,1.17-.16,1.74-.87,4.02-3.27,6.63-7.19,7.85-.6.19-1.22.26-1.84.34ZM3.76,10.02c0,3.45,2.78,6.23,6.22,6.24,3.45,0,6.24-2.78,6.24-6.22,0-3.46-2.78-6.25-6.23-6.25-3.45,0-6.23,2.78-6.23,6.23ZM12.5,7.78c0-.26,0-.27-.26-.27-1.5,0-3,0-4.5,0-.19,0-.26.05-.26.25,0,1.51,0,3.02,0,4.52,0,.2.07.25.26.25,1.5,0,3,0,4.5,0,.25,0,.26,0,.26-.27,0-.75,0-1.49,0-2.24s0-1.49,0-2.24Z"];

package/src/libs/Icon/icons/abstract18.js

@@ -0,0 +1 @@
+export default ["17.3 20","M.08,0c2.19,1.27,4.38,2.54,6.58,3.81,3.18,1.84,6.36,3.68,9.54,5.52.32.19.64.37.96.56.19.11.19.13,0,.25-1.4.81-2.81,1.63-4.21,2.44-3.21,1.86-6.43,3.72-9.64,5.58-1.01.59-2.03,1.18-3.04,1.76C.02,20.05,0,20.04,0,19.76,0,13.17,0,6.59,0,0,.03,0,.05,0,.08,0ZM1.67,17.5s.02.02.03.04c4.31-2.49,8.62-4.99,12.93-7.48v-.03h-.11c-2.61,0-5.22,0-7.84,0-.16,0-.25.06-.33.18-1.32,2.07-2.65,4.13-3.98,6.2-.24.37-.47.73-.7,1.1Z"];

package/src/libs/Icon/icons/abstract19.js

@@ -0,0 +1 @@
+export default ["19.96 20","M19.96,3.36c-2.01,1.82-4.01,3.65-6.02,5.47-1.48,1.34-2.95,2.69-4.43,4.03-1.96,1.78-3.92,3.56-5.88,5.34-.61.55-1.21,1.1-1.82,1.66-.11.1-.21.15-.36.15-.43,0-.86,0-1.29,0-.2,0-.21-.02-.11-.19,1.04-1.66,2.07-3.32,3.11-4.98,2.38-3.8,4.75-7.61,7.13-11.41.67-1.08,1.34-2.15,2.02-3.23.04-.06.07-.12.1-.19.04,0,.08,0,.12,0,.03.02.07.04.1.06,1.66.74,3.32,1.48,4.99,2.22.78.35,1.55.7,2.33,1.05v.04ZM7.39,0s-.07.04-.1.06C4.95,1.1,2.61,2.14.27,3.18c-.33.15-.33.15-.07.38,1.67,1.52,3.35,3.04,5.02,4.57.13.12.18.08.26-.05,1.09-1.76,2.18-3.51,3.29-5.26.19-.3.2-.51,0-.81C8.33,1.36,7.93.67,7.51,0c-.04,0-.08,0-.12,0ZM19.96,19.91c-.04-.05-.08-.1-.12-.15-.79-1.27-1.59-2.54-2.38-3.8-1.04-1.66-2.08-3.33-3.12-5-.08-.13-.14-.17-.28-.05-.9.83-1.81,1.65-2.71,2.47-.18.17-.18.17,0,.34.65.59,1.31,1.19,1.96,1.78,1.61,1.46,3.22,2.93,4.83,4.4.06.05.11.11.2.11.53,0,1.07,0,1.6-.01v-.08Z"];

package/src/libs/Icon/icons/abstract2.js

@@ -0,0 +1 @@
+export default ["20 19.29","M4.99,9.3c2.67,0,5.02,2.1,5,4.94-.01,3.06-2.18,5.04-5,5.05C2.26,19.29.02,17.38,0,14.23c-.02-2.79,2.28-4.92,4.99-4.94ZM9.43,6.6c0,1.84,1.46,3.28,3.33,3.28,1.79,0,3.27-1.5,3.27-3.31,0-1.81-1.47-3.3-3.27-3.3-1.91,0-3.34,1.42-3.34,3.33ZM11.71,15.83c0,1.49,1.09,2.6,2.56,2.61,1.47,0,2.58-1.11,2.59-2.59,0-1.4-1.16-2.55-2.57-2.55-1.42,0-2.58,1.14-2.58,2.54ZM20,11.05c0-1.08-.82-1.91-1.89-1.91-1.06,0-1.88.83-1.88,1.89,0,1.09.8,1.9,1.88,1.9,1.09,0,1.89-.8,1.89-1.89ZM13.48,1.27c0,.71.57,1.29,1.28,1.29.69,0,1.27-.58,1.28-1.28C16.04.59,15.45,0,14.75,0c-.7,0-1.27.57-1.27,1.27ZM5.91,5.26c-.69,0-1.26.59-1.26,1.29,0,.71.58,1.31,1.27,1.3.69,0,1.26-.59,1.26-1.29,0-.71-.58-1.3-1.28-1.3ZM8.25,2.65c-.27,0-.49.23-.5.51,0,.3.21.52.5.52.29,0,.51-.22.51-.52,0-.28-.24-.52-.52-.52ZM12.74,11.36c-.28,0-.53.23-.53.51,0,.29.23.51.53.5.29,0,.5-.22.5-.51,0-.28-.22-.5-.51-.51Z"];

package/src/libs/Icon/icons/abstract20.js

@@ -0,0 +1 @@
+export default ["20 20","M20,18.4c-.26.44-.57.52-1.01.26-1.88-1.13-3.76-2.25-5.64-3.38-.41-.25-.5-.53-.28-.97,1.91-3.83,3.83-7.65,5.74-11.48.12-.25.28-.44.58-.45.3-.01.48.16.61.4v15.61ZM17.23,20c.22-.12.39-.28.4-.55.01-.33-.18-.5-.45-.64-3.83-1.91-7.65-3.82-11.48-5.74-.43-.22-.72-.13-.97.28-1.13,1.88-2.25,3.76-3.38,5.64-.26.44-.18.75.26,1.01h15.61ZM3.11,0c-.11,0-.22-.01-.33.03-.23.09-.37.26-.39.51-.03.31.13.5.39.63,3.86,1.93,7.71,3.86,11.57,5.78.39.19.68.1.91-.27,1.14-1.9,2.28-3.8,3.42-5.71.06-.09.11-.19.12-.31.04-.39-.23-.67-.65-.67-2.52,0-5.03,0-7.55,0-2.5,0-5,0-7.49,0ZM0,16.96c0,.35.17.59.46.66.3.07.55-.07.71-.38,1.93-3.86,3.86-7.71,5.79-11.57.19-.39.11-.69-.27-.91C4.79,3.62,2.89,2.47.98,1.33c-.09-.06-.19-.11-.31-.12C.28,1.17,0,1.44,0,1.86,0,4.37,0,6.89,0,9.41c0,2.52,0,5.03,0,7.55ZM8.17,5.86c-.86,1.72-1.72,3.43-2.57,5.15-.17.35-.05.67.3.85,1.7.85,3.39,1.7,5.09,2.55.37.18.7.08.88-.29.85-1.69,1.69-3.38,2.54-5.08.19-.38.08-.7-.3-.9-1.69-.84-3.37-1.69-5.06-2.53-.11-.05-.22-.09-.34-.1-.24.03-.43.12-.54.35Z"];

package/src/libs/Icon/icons/abstract21.js

@@ -0,0 +1 @@
+export default ["20 20","M0,13.76c.09-.56.21-1.12.46-1.65.86-1.82,2.27-2.94,4.27-3.28,1.56-.26,2.99.12,4.27,1.05.16.12.17.19.05.35-1.07,1.36-1.53,2.92-1.41,4.64.09,1.36.57,2.59,1.42,3.67.11.14.11.21-.04.32-.82.61-1.72.98-2.73,1.1-.04,0-.08.02-.11.03h-1.13s-.06-.02-.09-.03c-2.25-.33-3.79-1.56-4.62-3.67-.17-.42-.24-.86-.32-1.3v-1.25ZM14.94,20s.06-.02.09-.03c1.3-.16,2.42-.7,3.33-1.63,1.24-1.27,1.76-2.81,1.58-4.58-.1-1.04-.49-1.96-1.11-2.79-.09-.12-.16-.15-.29-.05-1.43,1.11-3.05,1.59-4.85,1.42-1.3-.12-2.46-.59-3.48-1.39-.2-.16-.2-.16-.36.05-.9,1.22-1.29,2.59-1.07,4.08.33,2.28,1.62,3.82,3.77,4.62.4.15.83.21,1.25.28h1.13ZM0,6.27s.02.09.03.13c.14.97.5,1.85,1.09,2.64.11.15.18.14.32.04,1.07-.85,2.29-1.33,3.65-1.42,1.71-.12,3.27.33,4.64,1.39.23.17.23.18.4-.06.9-1.25,1.26-2.63,1.04-4.16C10.74,1.75,7.83-.43,4.77.07,2.83.39,1.41,1.45.53,3.21c-.28.57-.43,1.18-.53,1.81,0,.42,0,.83,0,1.25ZM10.96,1.15c-.13.1-.16.16-.05.31,1.11,1.43,1.58,3.05,1.41,4.85-.12,1.29-.59,2.44-1.38,3.46-.16.21-.17.21.05.37,1.25.91,2.64,1.28,4.18,1.06,3.07-.44,5.22-3.31,4.76-6.37C19.52,2.04,17.18.02,14.37.01c-1.26,0-2.45.4-3.41,1.13Z"];

package/src/libs/Icon/icons/abstract22.js

@@ -0,0 +1 @@
+export default ["20 19.98","M20,13.54c0,2.09,0,4.19,0,6.28,0,.13-.03.16-.16.16-2.18,0-4.37,0-6.55,0-.13-.03-.25-.05-.38-.08-4.17-.92-6.01-5.82-3.47-9.25.03-.04.06-.09.09-.13-.07.02-.11.06-.16.09-1.27.92-2.68,1.3-4.23,1.1C2.2,11.34.02,8.85,0,5.9c0-1.86,0-3.72,0-5.58C0,0,0,0,.33,0c1.81,0,3.63,0,5.44,0,.44,0,.87.04,1.3.13,4.22.91,6.07,5.82,3.49,9.29-.03.04-.05.08-.08.11.05,0,.07-.02.1-.04,1.28-.96,2.72-1.36,4.31-1.15,1.99.27,3.46,1.32,4.44,3.07.37.66.56,1.38.66,2.13ZM20,2.89c-.02-.09-.04-.18-.06-.27-.39-1.7-1.99-2.81-3.71-2.59-1.83.24-3.11,1.91-2.87,3.76.32,2.52,3.29,3.78,5.32,2.25.74-.56,1.17-1.31,1.32-2.22v-.94ZM3.53,19.97c.06-.02.11-.04.17-.05,1.27-.33,2.3-1.6,2.15-3.13-.16-1.63-1.65-2.82-3.3-2.61-1.17.15-2.13.98-2.45,2.12-.32,1.13.08,2.35,1,3.08.36.29.78.47,1.22.59h1.21Z"];

package/src/libs/Icon/icons/abstract23.js

@@ -0,0 +1 @@
+export default ["20 19.99","M7,14.01C3.12,13.97,0,10.91,0,7.01,0,3.1,3.12,0,7.01,0c3.9,0,6.99,3.13,6.99,7.01,0,3.89-3.11,6.96-7,7ZM16.89,19.99c1.74,0,3.08-1.32,3.09-3.05.02-2.65.02-5.29,0-7.94,0-1.64-1.29-2.95-2.93-3.03-.61-.03-1.08.41-1.11,1.01-.03.5-.04,1.01-.13,1.51-.46,2.53-1.76,4.51-3.88,5.95-1.49,1.01-3.16,1.47-4.95,1.51-.52.01-.89.34-.99.85-.05.24,0,.48.04.72.29,1.46,1.52,2.46,3.01,2.47,1.31,0,2.62,0,3.92,0,1.31,0,2.62,0,3.92,0Z"];

package/src/libs/Icon/icons/abstract24.js

@@ -0,0 +1 @@
+export default ["20 19.99","M0,12.04v-1.56c.07-.54.16-1.08.3-1.61C1.6,4.23,6.47,1.5,11.1,2.8c4.24,1.19,7.11,5.43,6.27,9.95-.67,3.56-2.82,5.86-6.28,6.94-.51.16-1.04.22-1.57.3h-1.52c-.24-.03-.49-.06-.73-.11-3.36-.67-5.63-2.62-6.82-5.82-.24-.65-.35-1.34-.44-2.03ZM8.74,6.27c-2.77,0-4.99,2.22-4.99,4.98,0,2.76,2.22,4.99,4.98,4.99,2.77,0,4.99-2.22,4.99-4.99,0-2.77-2.21-4.98-4.98-4.98ZM10.74,1.29c-.06.05-.18.1-.16.18.02.1.15.08.23.1,3.9.88,6.79,3.78,7.63,7.67.01.06,0,.15.07.17.08.03.12-.06.16-.12,1.08-1.31,1.51-2.8,1.27-4.47C19.55,2.05,17.16,0,14.35,0c-1.36,0-2.56.44-3.61,1.29ZM9.02,7.58c.2.56.49,1.08.85,1.55.66.84,1.48,1.45,2.48,1.82.23.09.25.07.22-.16-.03-.34-.11-.67-.25-.98-.61-1.41-1.69-2.2-3.2-2.41-.15,0-.17.03-.11.18Z"];

package/src/libs/Icon/icons/abstract25.js

@@ -0,0 +1 @@
+export default ["19.88 20","M9.22,20c-.51-.07-1.03-.13-1.54-.26-1.67-.4-3.14-1.18-4.4-2.33-1.59-1.46-2.63-3.24-3.06-5.36-.52-2.55-.11-4.96,1.22-7.19C2.66,2.82,4.41,1.4,6.64.58,7.8.16,9.01-.03,10.26,0c.03,0,.06,0,.1.01,0,0,.02.02.04.04-1.67.77-2.77,2.02-3.18,3.82-.26,1.14-.15,2.27.33,3.34,1,2.21,3.26,3.47,5.63,3.17,2.24-.28,4.55-2.19,4.69-5.13.05.45,0,.89-.06,1.34-.15,1.16-.47,2.28-1.02,3.32-1.23,2.29-3.1,3.73-5.69,4.15-1.79.29-3.48-.05-5.04-1-.04-.02-.07-.06-.13-.05.12.21.29.37.44.54,1.16,1.25,2.54,2.15,4.21,2.54,2.3.54,4.42.1,6.37-1.23,1.16-.79,2.06-1.82,2.76-3.03.04-.08.09-.15.16-.27.02.2-.02.34-.05.47-.4,1.92-1.29,3.58-2.65,4.97-1.58,1.61-3.5,2.58-5.74,2.92-.21.03-.41.05-.62.08h-1.6Z"];

package/src/libs/Icon/icons/abstract26.js

@@ -0,0 +1 @@
+export default ["20 19.4","M6.22,19.4c-.98.01-2.04-.09-3.06-.46-1.86-.66-2.96-1.98-3.14-3.95-.2-2.25.63-4.07,2.45-5.42.74-.55,1.62-.76,2.51-.93.76-.15,1.53-.27,2.28-.5,1.32-.4,2.12-1.28,2.48-2.6.2-.75.31-1.51.5-2.26.16-.64.38-1.26.79-1.8.65-.83,1.53-1.28,2.55-1.43,2.2-.32,4.11.65,5.27,2.62.66,1.12.99,2.33,1.1,3.62.38,4.44-2.13,8.95-5.84,11.16-1.14.68-2.38,1.1-3.65,1.41-1.36.34-2.74.54-4.25.53Z"];

package/src/libs/Icon/icons/abstract27.js

@@ -0,0 +1 @@
+export default ["20 17.3","M13.71,12.83c.74-.26,1.31-.73,1.8-1.31.34-.4.6-.84.88-1.28.44-.69,1.09-.98,1.89-.89.75.09,1.27.51,1.56,1.2.21.51.23,1.04-.03,1.53-1.1,2.07-2.63,3.69-4.88,4.51-1.81.65-3.59.56-5.31-.32-.15-.07-.25-.03-.37.02-.93.43-1.89.78-2.9.92-1.51.22-2.95.03-4.2-.93-1.1-.84-1.68-2.02-1.94-3.35-.38-1.89-.17-3.75.31-5.59.66-2.57,1.94-4.8,3.79-6.71C4.89.03,5.72-.16,6.46.15c.75.31,1.26,1.08,1.24,1.87-.02.5-.21.93-.55,1.29-.86.9-1.58,1.88-2.12,3.01-.58,1.21-.94,2.47-1.05,3.81-.06.69-.07,1.38.06,2.06.02.09.04.18.06.27.21.71.69,1.02,1.42.93.41-.05.8-.16,1.19-.28.12-.04.17-.08.12-.22-.53-1.72-.37-3.44.08-5.15.29-1.13.67-2.23,1.29-3.22.83-1.31,1.97-2.17,3.52-2.45,2.32-.42,4.41,1.14,4.65,3.48.16,1.49-.23,2.88-.8,4.23-.46,1.07-1.06,2.06-1.8,2.97-.02.03-.04.06-.06.09ZM10.44,10.51s.04.02.07.03c.04-.05.09-.11.13-.16.68-.82,1.21-1.71,1.57-2.71.16-.44.28-.88.31-1.35,0-.13.03-.29-.09-.36-.12-.07-.24.01-.35.07-.26.15-.44.38-.59.63-.48.81-.72,1.7-.9,2.61-.08.41-.16.83-.14,1.25Z"];