@samuelgomez/astro 0.1.0

package/src/icons/ChevronRight.astro

@@ -0,0 +1,11 @@
+---
+import Svg, { type SvgProps } from '@samuelgomez/astro/components/Svg/index.astro';
+
+const props = Astro.props as SvgProps;
+---
+
+<Svg {...props}>
+  <path
+    d="M18.854 12.01a1.711 1.711 0 0 1-.504 1.211L8.055 23.488a1.713 1.713 0 0 1-2.42-2.427l9.083-9.057L5.66 2.921A1.713 1.713 0 0 1 8.086.501l10.268 10.295c.334.337.501.775.5 1.214z"
+  ></path>
+</Svg>

package/src/icons/Codepen.astro

@@ -0,0 +1,36 @@
+<svg
+  id="codepen"
+  width="64"
+  height="64"
+  viewBox="0 0 24 24"
+  xmlns="http://www.w3.org/2000/svg"
+  aria-hidden="true"
+>
+  <g clip-path="url(#clip-codepen)" fill="url('#codepen-gradient')">
+    <path
+      d="M21.937 13.727 19.356 12l2.58-1.727v3.454zm-8.908 7.314V16.23l4.474-2.99 3.607 2.414-8.081 5.387zm-1.03-6.602L8.352 12l3.647-2.44L15.646 12l-3.647 2.439zm-1.031 6.602-8.082-5.387 3.611-2.414 4.471 2.99v4.811zM2.061 10.274 4.642 12l-2.581 1.726v-3.452zm8.907-7.316v4.81l-4.471 2.991-3.611-2.414 8.082-5.387zm2.061 0 8.081 5.387-3.607 2.414-4.474-2.991v-4.81zm10.962 5.251c-.004-.017-.008-.03-.01-.045-.006-.029-.01-.06-.018-.086l-.018-.051c-.008-.024-.018-.05-.025-.074l-.023-.051a.387.387 0 0 0-.035-.067l-.029-.048c-.014-.021-.027-.042-.043-.063l-.035-.044a.547.547 0 0 0-.051-.056c-.016-.015-.027-.028-.041-.04-.021-.018-.039-.034-.061-.049-.016-.013-.029-.024-.045-.035-.008-.004-.012-.01-.018-.014L12.569.174a1.033 1.033 0 0 0-1.145 0L.458 7.485l-.018.014a.312.312 0 0 0-.045.034c-.021.017-.04.032-.06.05a.51.51 0 0 0-.041.04.664.664 0 0 0-.051.055c-.013.014-.023.03-.035.044a1.194 1.194 0 0 0-.108.179c-.007.016-.017.033-.023.051-.01.024-.019.05-.027.074-.004.017-.01.033-.016.051a.57.57 0 0 0-.017.086.97.97 0 0 0-.018.179v7.313c0 .045.004.09.01.135 0 .014.004.029.008.045.005.027.01.057.018.086.004.018.01.033.016.051l.027.076c.008.016.016.031.022.049a.745.745 0 0 0 .036.068l.029.047c.014.021.028.043.043.063a.691.691 0 0 0 .086.102c.014.016.027.027.041.041.02.018.039.033.06.049l.046.035c.006.004.011.01.018.014l10.969 7.313a1.034 1.034 0 0 0 1.142-.003l10.97-7.313.018-.014c.018-.012.031-.023.047-.035.02-.016.039-.031.059-.049a.397.397 0 0 0 .041-.041l.053-.057a.44.44 0 0 0 .035-.045.497.497 0 0 0 .043-.063l.029-.047c.014-.023.023-.045.033-.068a.266.266 0 0 0 .023-.049c.01-.027.02-.053.027-.076.004-.018.012-.033.016-.051a.734.734 0 0 0 .018-.086c.004-.016.008-.031.01-.045.006-.045.01-.09.01-.135V8.341c-.003-.043-.005-.088-.011-.132z"
+      fill-rule="evenodd"></path>
+  </g>
+  <defs>
+    <clipPath id="clip-codepen">
+      <rect width="24" height="24"></rect>
+    </clipPath>
+    <linearGradient id="codepen-gradient" x1="50%" y1="0%" x2="50%" y2="100%">
+      <stop offset="0%" stop-color="#7A5FFF">
+        <animate
+          attributeName="stop-color"
+          values="#7A5FFF; #01FF89; #7A5FFF"
+          dur="4s"
+          repeatCount="indefinite"></animate>
+      </stop>
+
+      <stop offset="100%" stop-color="#01FF89">
+        <animate
+          attributeName="stop-color"
+          values="#01FF89; #7A5FFF; #01FF89"
+          dur="4s"
+          repeatCount="indefinite"></animate>
+      </stop>
+    </linearGradient>
+  </defs>
+</svg>

package/src/icons/Cross.astro

@@ -0,0 +1,11 @@
+---
+import Svg, { type SvgProps } from '@samuelgomez/astro/components/Svg/index.astro';
+
+const props = Astro.props as SvgProps;
+---
+
+<Svg {...props}>
+  <path
+    d="M22.1 24c-.5 0-1-.2-1.3-.6L12 14.6l-8.7 8.7c-.7.7-1.9.7-2.7 0s-.7-1.9 0-2.7L9.4 12 .6 3.2C-.1 2.5-.1 1.3.6.5s1.9-.7 2.7 0L12 9.3 20.7.6c.7-.7 1.9-.7 2.7 0s.7 1.9 0 2.7L14.7 12l8.7 8.7c.7.7.7 1.9 0 2.7-.3.4-.8.6-1.3.6z"
+  ></path>
+</Svg>

package/src/icons/ExternalLink.astro

@@ -0,0 +1,19 @@
+---
+import Svg, { type SvgProps } from '@samuelgomez/astro/components/Svg/index.astro';
+
+const {
+  stroke = 'currentColor',
+  fill = 'none',
+  ...props
+} = Astro.props as SvgProps;
+---
+
+<Svg {...props} fill={fill}>
+  <path
+    stroke={stroke}
+    stroke-linecap="round"
+    stroke-linejoin="round"
+    stroke-width="2"
+    d="M10 5H8.2c-1.12 0-1.68 0-2.1.22a2 2 0 0 0-.88.87C5 6.52 5 7.08 5 8.2v7.6c0 1.12 0 1.68.22 2.1.19.38.5.7.87.88.43.22.99.22 2.1.22h7.61c1.12 0 1.68 0 2.1-.22a2 2 0 0 0 .88-.87c.22-.43.22-.99.22-2.1V14m1-5V4m0 0h-5m5 0-7 7"
+  ></path>
+</Svg>

package/src/icons/Github.astro

@@ -0,0 +1,36 @@
+<svg
+  id="github"
+  width="64"
+  height="64"
+  viewBox="0 0 20 20"
+  xmlns="http://www.w3.org/2000/svg"
+  role="img"
+>
+  <g clip-path="url(#clip-github)" fill="url('#logo-gradient')">
+    <path
+      d="M10 0c5.523 0 10 4.59 10 10.253 0 4.529-2.862 8.371-6.833 9.728-.507.101-.687-.219-.687-.492 0-.338.012-1.442.012-2.814 0-.956-.32-1.58-.679-1.898 2.227-.254 4.567-1.121 4.567-5.059 0-1.12-.388-2.034-1.03-2.752.104-.259.447-1.302-.098-2.714 0 0-.838-.275-2.747 1.051A9.396 9.396 0 0 0 10 4.958a9.375 9.375 0 0 0-2.503.345C5.586 3.977 4.746 4.252 4.746 4.252c-.543 1.412-.2 2.455-.097 2.714-.639.718-1.03 1.632-1.03 2.752 0 3.928 2.335 4.808 4.556 5.067-.286.256-.545.708-.635 1.371-.57.262-2.018.715-2.91-.852 0 0-.529-.985-1.533-1.057 0 0-.975-.013-.068.623 0 0 .655.315 1.11 1.5 0 0 .587 1.83 3.369 1.21.005.857.014 1.665.014 1.909 0 .271-.184.588-.683.493C2.865 18.627 0 14.783 0 10.253 0 4.59 4.478 0 10 0"
+      fill-rule="evenodd"></path>
+  </g>
+  <defs>
+    <clipPath id="clip-github">
+      <rect width="20" height="20"></rect>
+    </clipPath>
+    <linearGradient id="logo-gradient" x1="50%" y1="0%" x2="50%" y2="100%">
+      <stop offset="0%" stop-color="#7A5FFF">
+        <animate
+          attributeName="stop-color"
+          values="#7A5FFF; #01FF89; #7A5FFF"
+          dur="4s"
+          repeatCount="indefinite"></animate>
+      </stop>
+
+      <stop offset="100%" stop-color="#01FF89">
+        <animate
+          attributeName="stop-color"
+          values="#01FF89; #7A5FFF; #01FF89"
+          dur="4s"
+          repeatCount="indefinite"></animate>
+      </stop>
+    </linearGradient>
+  </defs>
+</svg>

package/src/icons/Github2.astro

@@ -0,0 +1,11 @@
+---
+import Svg, { type SvgProps } from '@samuelgomez/astro/components/Svg/index.astro';
+
+const props = Astro.props as SvgProps;
+---
+
+<Svg {...props}>
+  <path
+    d="M12.03.25a12.04 12.04 0 0 0-3.8 23.49c.6.1.8-.28.8-.6V21.1c-3.34.72-4.05-1.58-4.05-1.58a3.23 3.23 0 0 0-1.37-1.81c-1.1-.75.08-.72.08-.72.77.1 1.44.54 1.84 1.2a2.6 2.6 0 0 0 3.51 1c.05-.61.32-1.18.76-1.61-2.58-.27-5.45-1.3-5.45-5.89a4.7 4.7 0 0 1 1.2-3.26 4.3 4.3 0 0 1 .12-3.19s1.01-.33 3.31 1.2a11.6 11.6 0 0 1 6.02 0c2.3-1.55 3.31-1.2 3.31-1.2.44 1.01.49 2.14.12 3.18a4.62 4.62 0 0 1 1.2 3.26c0 4.6-2.82 5.61-5.51 5.91.59.59.89 1.4.83 2.23v3.3c0 .33.19.71.81.6A12.05 12.05 0 0 0 12.03.25z"
+  ></path>
+</Svg>

package/src/icons/Grid.astro

@@ -0,0 +1,19 @@
+---
+import Svg, { type SvgProps } from '@samuelgomez/astro/components/Svg/index.astro';
+
+const {
+  stroke = 'currentColor',
+  fill = 'none',
+  ...props
+} = Astro.props as SvgProps;
+---
+
+<Svg {...props} fill={fill}>
+  <path
+    stroke={stroke}
+    stroke-linecap="round"
+    stroke-linejoin="round"
+    stroke-width="1"
+    d="M3.5 3.5h4.2v17H3.5v-17zM15.5 3.5h4.2v17h-4.2v-17zM9.5 3.5h4.2v17H9.5v-17z"
+  ></path>
+</Svg>

package/src/icons/Info.astro

@@ -0,0 +1,11 @@
+---
+import Svg, { type SvgProps } from '@samuelgomez/astro/components/Svg/index.astro';
+
+const props = Astro.props as SvgProps;
+---
+
+<Svg {...props}>
+  <path
+    d="M10.6 7.6c-1.6.8-3 2.1-4.4 4-.2.3-.2.4 0 .6.1.1.2.1.4-.2l.1-.1c.2-.2.3-.4.6-.7 1-1.2 1.5-1.7 2.3-2.1.7-.4 1.3.2 1.1.9 0 .2-.1.4-.2.7-.1.1-.1.2-.1.3-.3.7-.5 1.2-.9 2.4v.1c-.1.3-.1.3-.3.7-.6 1.5-.9 2.4-1.3 3.4v.1c-.1.3-.1.4-.2.5-.4 1.1-.7 1.9-.8 2.6 0 .1 0 .1-.1.2-.1.4-.2.7-.2 1-.1.5 0 .9.1 1.3.2.4.6.7 1 .7.7.1 1.4.1 2.1 0l1-.3c1-.4 1.9-.9 2.8-1.7.8-.7 1.5-1.5 2.3-2.4.1-.1.1-.1.1-.2.2-.3.4-.5.4-.7 0-.2-.1-.4-.3-.4-.1 0-.2.1-.3.3-.1.1-.1.2-.2.2l-.6.6c-.3.4-.7.7-1.2 1.3-.3.3-.6.5-.9.7-.6.3-1.1-.1-1-.7 0-.4.1-.8.3-1.3.3-.9.6-1.6 1.2-3.2.3-.7.4-1 .5-1.4.4-1.1.7-2 1.1-2.9.4-1.1.6-1.9.7-2.7.1-.6-.1-1.2-.5-1.6-.4-.5-1.1-.7-1.8-.7-.8 0-1.8.2-2.8.7zM16.5.2c-1.5-.6-3.4.4-3.7 2.1-.2 1.2.2 2.2 1.1 2.6 1.8.8 3.9-.5 3.9-2.5.1-1.1-.4-1.9-1.3-2.2z"
+  ></path>
+</Svg>

package/src/icons/Instagram.astro

@@ -0,0 +1,11 @@
+---
+import Svg, { type SvgProps } from '@samuelgomez/astro/components/Svg/index.astro';
+
+const props = Astro.props as SvgProps;
+---
+
+<Svg {...props} size={20}>
+  <path
+    d="M5.87.12C4.24.2 2.83.6 1.69 1.72A5.94 5.94 0 0 0 .1 5.9c-.05 1-.32 8.6.45 10.59a5.04 5.04 0 0 0 2.91 2.9 7.3 7.3 0 0 0 2.42.46c8.86.4 12.15.19 13.53-3.36.25-.63.42-1.35.46-2.41.4-8.88-.06-10.8-1.6-12.35C17.02.5 15.58-.32 5.86.13m.08 17.94a5.6 5.6 0 0 1-1.85-.34c-.88-.35-1.54-1-1.89-1.89-.59-1.51-.39-8.7-.34-9.86.05-1.14.29-2.18 1.09-2.99 1-.99 2.28-1.48 11.03-1.08 1.15.05 2.19.28 3 1.08.99 1 1.48 2.29 1.08 11.01-.04.97-.2 1.5-.34 1.84-.9 2.31-2.97 2.63-11.78 2.23M14.1 4.69a1.2 1.2 0 1 0 2.39 0 1.2 1.2 0 0 0-2.39 0m-9.23 5.3a5.1 5.1 0 1 0 10.2-.01 5.1 5.1 0 0 0-10.2 0m1.8 0a3.31 3.31 0 1 1 6.62.02 3.31 3.31 0 0 1-6.62-.01"
+  ></path>
+</Svg>

package/src/icons/Linkedin.astro

@@ -0,0 +1,11 @@
+---
+import Svg, { type SvgProps } from '@samuelgomez/astro/components/Svg/index.astro';
+
+const props = Astro.props as SvgProps;
+---
+
+<Svg {...props}>
+  <path
+    d="M24 24h-4.8v-8.4c0-2.3-1-3.6-2.8-3.6-2 0-3.2 1.3-3.2 3.6V24H8.4V8.4h4.8v1.8s1.5-2.6 4.9-2.6c3.4 0 5.9 2.1 5.9 6.4v10zM2.9 5.9A2.9 2.9 0 0 1 0 3c0-1.6 1.3-3 2.9-3 1.6 0 2.9 1.3 2.9 3 .1 1.6-1.3 2.9-2.9 2.9zM0 24h6V8.4H0V24z"
+  ></path>
+</Svg>

package/src/icons/LogoSG.astro

@@ -0,0 +1,66 @@
+---
+type Props = {
+  title?: string;
+  size?: string;
+  fill?: string;
+  opacity?: string;
+};
+const FILL = "url('#logoSG-gradient')";
+const { title, size = '40', fill = FILL, opacity = '1' } = Astro.props;
+const titleId = Boolean(title) ? `${crypto.randomUUID()}` : null;
+---
+
+<svg
+  width={size}
+  height={size}
+  xmlns="http://www.w3.org/2000/svg"
+  xml:space="preserve"
+  viewBox="0 0 500 500"
+  aria-labelledby={titleId}
+  fill-opacity={opacity}
+  role="img"
+>
+  {Boolean(title) && <title id={titleId}>{title}</title>}
+  <g clip-path="url(#logoSG)" fill={fill}>
+    <path
+      d="M473.24 200H250a50 50 0 0 0-50 50c0 27.61 23.3 42.94 50 50 75.86 20.05 98.16 61.27 99 98.24 1 44.23-23.5 101.95-133.21 101.76 7.9.43 75.99 0 84.21 0 110.46 0 200-89.54 200-200V200h-26.76z"
+    ></path>
+    <path
+      d="M299.99 0H200C89.54 0 0 89.54 0 200s89.54 200 200 200c6.85 0 13.62-.35 20.3-1.02C136.47 390.32 71.4 326.93 71.4 250c0-81.85 73.66-148.38 165.2-149.96V100h167.18v-.09c53.47-1.99 96.21-45.96 96.21-99.91h-200z"
+    ></path>
+  </g>
+  {
+    fill === FILL && (
+      <defs>
+        <clipPath id="logoSG">
+          <rect width="500" height="500" />
+        </clipPath>
+        <linearGradient
+          id="logoSG-gradient"
+          x1="50%"
+          y1="0%"
+          x2="50%"
+          y2="100%"
+        >
+          <stop offset="0%" stop-color="#7A5FFF">
+            <animate
+              attributeName="stop-color"
+              values="#7A5FFF; #01FF89; #7A5FFF"
+              dur="4s"
+              repeatCount="indefinite"
+            />
+          </stop>
+
+          <stop offset="100%" stop-color="#01FF89">
+            <animate
+              attributeName="stop-color"
+              values="#01FF89; #7A5FFF; #01FF89"
+              dur="4s"
+              repeatCount="indefinite"
+            />
+          </stop>
+        </linearGradient>
+      </defs>
+    )
+  }
+</svg>

package/src/icons/MoonSun.astro

@@ -0,0 +1,17 @@
+<svg role="img" width="24" height="24" viewBox="0 0 24 24">
+  <mask id="moon">
+    <rect x="0" y="0" width="100%" height="100%" fill="white"></rect>
+    <circle cx="40" cy="8" r="11" fill="black"></circle>
+  </mask>
+  <circle id="sun" cx="12" cy="12" r="11" mask="url(#moon)"></circle>
+  <g id="sun-beams">
+    <line x1="12" y1="1" x2="12" y2="3"></line>
+    <line x1="12" y1="21" x2="12" y2="23"></line>
+    <line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line>
+    <line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line>
+    <line x1="1" y1="12" x2="3" y2="12"></line>
+    <line x1="21" y1="12" x2="23" y2="12"></line>
+    <line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line>
+    <line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line>
+  </g>
+</svg>

package/src/icons/Send.astro

@@ -0,0 +1,11 @@
+---
+import Svg, { type SvgProps } from '@samuelgomez/astro/components/Svg/index.astro';
+
+const props = Astro.props as SvgProps;
+---
+
+<Svg {...props}>
+  <path
+    d="M14 24.1c-.3 0-.6-.2-.7-.5l-3.8-9-9-3.8c-.3-.1-.5-.4-.5-.7 0-.3.2-.6.5-.7L23 .1h.5c.1 0 .2.1.3.1l.1.1.1.1c.1.1.1.2.1.3v.5l-9.2 22.5c-.2.2-.5.4-.9.4zm-3-9.9 3 7 7-17-10 10zm-8.1-4.1 7 3 10-10-17 7z"
+  ></path>
+</Svg>

package/src/icons/Slash.astro

@@ -0,0 +1,14 @@
+---
+import Svg, { type SvgProps } from '@samuelgomez/astro/components/Svg/index.astro';
+
+const { size = 100, fill, ...props } = Astro.props as SvgProps;
+---
+
+<Svg {...props} size={size}>
+  <path fill={fill || '#e62c2e'} d="M68.19 9.18H100L31.82 90.82H0L68.19 9.18z"
+  ></path>
+  <path
+    fill={fill || '#283172'}
+    d="M87.46 51.33v27.54H64.49l-9.97 11.95H100V36.3L87.46 51.33zM12.54 21.14h22.97l9.97-11.95H0V63.7l12.54-15.03V21.14z"
+  ></path>
+</Svg>

package/src/icons/Trash.astro

@@ -0,0 +1,19 @@
+---
+import Svg, { type SvgProps } from '@samuelgomez/astro/components/Svg/index.astro';
+
+const {
+  stroke = 'currentColor',
+  fill = 'none',
+  ...props
+} = Astro.props as SvgProps;
+---
+
+<Svg {...props} fill={fill}>
+  <path
+    stroke={stroke}
+    stroke-linecap="round"
+    stroke-linejoin="round"
+    stroke-width="2"
+    d="M14 10v7m-4-7v7M6 6v11.8c0 1.12 0 1.68.22 2.1.19.38.5.7.87.88.43.22.99.22 2.1.22h5.61c1.12 0 1.68 0 2.1-.22a2 2 0 0 0 .88-.87c.22-.43.22-.99.22-2.1V6M6 6h2M6 6H4m4 0h8M8 6c0-.93 0-1.4.15-1.77a2 2 0 0 1 1.08-1.08C9.6 3 10.07 3 11 3h2c.93 0 1.4 0 1.77.15a2 2 0 0 1 1.08 1.08C16 4.6 16 5.07 16 6m0 0h2m0 0h2"
+  ></path>
+</Svg>

package/src/icons/Twitter.astro

@@ -0,0 +1,14 @@
+---
+import Svg, { type SvgProps } from '@samuelgomez/astro/components/Svg/index.astro';
+
+const props = Astro.props as SvgProps;
+---
+
+<Svg {...props}>
+  <path
+    d="m22.04 21.55-7.85-11.41-.89-1.29L7.68.69 7.21.02H.31l1.68 2.45 7.47 10.85.89 1.29 6 8.72.47.67h6.9l-1.68-2.45zm-4.4.89-6.23-9.06-.89-1.29L3.28 1.58h3.11l5.85 8.5.89 1.29 7.62 11.07h-3.11z"
+  ></path>
+  <path
+    d="m10.51 12.09.89 1.29-1.05 1.22L2.27 24H.28l9.18-10.68zM22.89.02l-8.71 10.12-1.05 1.23-.89-1.29 1.05-1.23 5.9-6.86L20.9.02z"
+  ></path>
+</Svg>

package/src/types/Permutations.d.ts

@@ -0,0 +1,3 @@
+export type Permutations<T extends string, U extends string = T> = T extends any
+  ? T | `${T} ${Permutations<Exclude<U, T>>}`
+  : never;