@codecademy/gamut-patterns 1.0.0-alpha.fb02a7.0 → 1.0.1-alpha.817a48.0

package/dist/patterns/StripeLoose.js

@@ -0,0 +1,209 @@
+import * as React from 'react';
+import { Svg } from '../props';
+import { usePatternId } from '../usePatternId';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const StripeLoose = /*#__PURE__*/React.forwardRef(({
+  title = 'Stripe Loose',
+  titleId,
+  ...props
+}, svgRef) => {
+  const patternId = usePatternId('StripeLoose');
+  return /*#__PURE__*/_jsxs(Svg, {
+    fill: "currentColor",
+    role: "img",
+    "aria-hidden": "true",
+    ref: svgRef,
+    "aria-labelledby": titleId,
+    ...props,
+    children: [title ? /*#__PURE__*/_jsx("title", {
+      id: titleId,
+      children: title
+    }) : null, /*#__PURE__*/_jsxs("pattern", {
+      id: patternId,
+      x: 0,
+      y: 0,
+      width: 16,
+      height: 16,
+      patternUnits: "userSpaceOnUse",
+      children: [/*#__PURE__*/_jsx("rect", {
+        x: 1,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 2,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 3,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 1,
+        y: 8,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        y: 8,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 2,
+        y: 8,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 3,
+        y: 8,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 5,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 4,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 6,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 7,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 5,
+        y: 8,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 4,
+        y: 8,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 6,
+        y: 8,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 7,
+        y: 8,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 9,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 8,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 10,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 11,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 9,
+        y: 8,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 8,
+        y: 8,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 10,
+        y: 8,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 11,
+        y: 8,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 13,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 12,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 14,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 15,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 13,
+        y: 8,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 12,
+        y: 8,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 14,
+        y: 8,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 15,
+        y: 8,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      })]
+    }), /*#__PURE__*/_jsx("rect", {
+      width: "100%",
+      height: "100%",
+      fill: `url(#${patternId})`
+    })]
+  });
+});

package/dist/patterns/StripeRegular.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+import { PatternProps } from '../props';
+export declare const StripeRegular: React.ForwardRefExoticComponent<PatternProps & React.RefAttributes<SVGSVGElement>>;

package/dist/patterns/StripeRegular.js

@@ -0,0 +1,121 @@
+import * as React from 'react';
+import { Svg } from '../props';
+import { usePatternId } from '../usePatternId';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const StripeRegular = /*#__PURE__*/React.forwardRef(({
+  title = 'Stripe Regular',
+  titleId,
+  ...props
+}, svgRef) => {
+  const patternId = usePatternId('StripeRegular');
+  return /*#__PURE__*/_jsxs(Svg, {
+    fill: "currentColor",
+    role: "img",
+    "aria-hidden": "true",
+    ref: svgRef,
+    "aria-labelledby": titleId,
+    ...props,
+    children: [title ? /*#__PURE__*/_jsx("title", {
+      id: titleId,
+      children: title
+    }) : null, /*#__PURE__*/_jsxs("pattern", {
+      id: patternId,
+      x: 0,
+      y: 0,
+      width: 8,
+      height: 8,
+      patternUnits: "userSpaceOnUse",
+      children: [/*#__PURE__*/_jsx("rect", {
+        x: 1,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 2,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 3,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 1,
+        y: 4,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        y: 4,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 2,
+        y: 4,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 3,
+        y: 4,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 5,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 4,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 6,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 7,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 5,
+        y: 4,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 4,
+        y: 4,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 6,
+        y: 4,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      }), /*#__PURE__*/_jsx("rect", {
+        x: 7,
+        y: 4,
+        width: 1,
+        height: 1,
+        fill: "currentColor"
+      })]
+    }), /*#__PURE__*/_jsx("rect", {
+      width: "100%",
+      height: "100%",
+      fill: `url(#${patternId})`
+    })]
+  });
+});

package/dist/patterns/index.d.ts

@@ -0,0 +1,28 @@
+export * from './CheckerDense';
+export * from './CheckerLoose';
+export * from './CheckerRegular';
+export * from './DiagonalADense';
+export * from './DiagonalALoose';
+export * from './DiagonalARegular';
+export * from './DiagonalBDense';
+export * from './DiagonalBLoose';
+export * from './DiagonalBRegular';
+export * from './DotDense';
+export * from './DotLoose';
+export * from './DotRegular';
+export * from './ExDense';
+export * from './ExLoose';
+export * from './ExRegular';
+export * from './FlowerDense';
+export * from './FlowerLoose';
+export * from './FlowerRegular';
+export * from './GridDense';
+export * from './GridLoose';
+export * from './GridRegular';
+export * from './Herringbone';
+export * from './RainDense';
+export * from './RainLoose';
+export * from './RainRegular';
+export * from './StripeDense';
+export * from './StripeLoose';
+export * from './StripeRegular';

package/dist/patterns/index.js

@@ -0,0 +1,28 @@
+export * from './CheckerDense';
+export * from './CheckerLoose';
+export * from './CheckerRegular';
+export * from './DiagonalADense';
+export * from './DiagonalALoose';
+export * from './DiagonalARegular';
+export * from './DiagonalBDense';
+export * from './DiagonalBLoose';
+export * from './DiagonalBRegular';
+export * from './DotDense';
+export * from './DotLoose';
+export * from './DotRegular';
+export * from './ExDense';
+export * from './ExLoose';
+export * from './ExRegular';
+export * from './FlowerDense';
+export * from './FlowerLoose';
+export * from './FlowerRegular';
+export * from './GridDense';
+export * from './GridLoose';
+export * from './GridRegular';
+export * from './Herringbone';
+export * from './RainDense';
+export * from './RainLoose';
+export * from './RainRegular';
+export * from './StripeDense';
+export * from './StripeLoose';
+export * from './StripeRegular';