@nstc-design/icons 0.1.1 → 0.2.0

package/packages/vue-legacy/icons/Shop.cjs

@@ -0,0 +1,66 @@
+"use strict";
+const toSize = (size) => typeof size === "number" ? `${size}px` : size;
+const toButtonIconSize = (size) => typeof size === "number" ? `${Math.max(0, size - 8)}px` : `max(0px, calc(${size} - 8px))`;
+const joinClassNames = (...values) => values.filter(Boolean).join(" ");
+const componentDefinition = {
+  name: "icon-shop",
+  inheritAttrs: false,
+  props: {
+    size: { type: [String, Number], default: undefined },
+    color: { type: String, default: undefined },
+    originColor: { type: Boolean, default: false },
+    button: { type: Boolean, default: false },
+    background: { type: Boolean, default: true },
+  },
+  computed: {
+    el() {
+      return this.$refs.root || this.$el;
+    },
+  },
+  render(h) {
+    const originColor = this.originColor;
+    const renderedSize = this.size === undefined || this.size === null ? 16 : this.size;
+    const buttonSize = this.size === undefined || this.size === null ? 24 : this.size;
+    const attrs = this.$attrs || {};
+    const listeners = this.$listeners || {};
+    const svgAttributes = { "fill": originColor ? undefined : "currentColor", "viewBox": "0 0 1024 1024", "xmlns": "http://www.w3.org/2000/svg" };
+    const style = this.color === undefined ? undefined : { color: this.color };
+    const buttonStyle = [style, { width: toSize(buttonSize), height: toSize(buttonSize) }];
+    const svg = h("svg", this.button
+      ? {
+          attrs: {
+            ...svgAttributes,
+            width: toButtonIconSize(buttonSize),
+            height: toButtonIconSize(buttonSize),
+            "aria-hidden": "true",
+          },
+        }
+      : {
+          ref: "root",
+          attrs: {
+            ...svgAttributes,
+            ...attrs,
+            width: toSize(renderedSize),
+            height: toSize(renderedSize),
+          },
+          style: style,
+          on: listeners,
+        }, [h("path", { attrs: { "d": "M853.333 85.333a42.67 42.67 0 0 1 41.387 32.32l42.667 170.667a42.2 42.2 0 0 1 1.28 10.347V384A148.84 148.84 0 0 1 896 488.49V896a42.667 42.667 0 0 1-42.667 42.667H170.667A42.667 42.667 0 0 1 128 896V494.656a138.22 138.22 0 0 1-42.667-99.99v-96c0-3.498.427-6.975 1.28-10.346l42.667-170.667a42.67 42.67 0 0 1 41.387-32.32zM635.797 480.896a197.04 197.04 0 0 1-127.296 52.33l-6.57.107h-1.195a197 197 0 0 1-133.867-52.437l-4.202-4.053-4.203 4.053a197.04 197.04 0 0 1-127.296 52.33l-6.57.107H224c-3.584 0-7.147-.192-10.667-.448v320.448h149.334V640a42.667 42.667 0 0 1 42.666-42.667h213.334A42.667 42.667 0 0 1 661.333 640v213.333h149.334V531.776c-6.976 1.003-14.08 1.557-21.334 1.557H778.07a197 197 0 0 1-133.866-52.437L640 476.843zM448 853.333h128V682.667H448zm-277.333-549.44v90.774a53.333 53.333 0 0 0 49.834 53.226L224 448h.597a111.7 111.7 0 0 0 99.904-61.76c15.723-31.445 60.608-31.445 76.331 0A111.7 111.7 0 0 0 500.736 448h1.195a111.7 111.7 0 0 0 99.904-61.76c15.722-31.445 60.608-31.445 76.33 0A111.7 111.7 0 0 0 778.07 448h11.264a64 64 0 0 0 64-64v-80.021l-33.322-133.312H203.968z" } })]);
+    if (!this.button) return svg;
+    return h("button", {
+      ref: "root",
+      attrs: {
+        type: attrs.type || "button",
+        ...attrs,
+      },
+      class: joinClassNames("nstc-icon-button", this.background && "nstc-icon-button--background"),
+      style: buttonStyle,
+      on: listeners,
+    }, [svg]);
+  },
+};
+module.exports = {
+  Shop: componentDefinition,
+  IconShop: componentDefinition,
+  default: componentDefinition,
+};

package/packages/vue-legacy/icons/Shop.d.ts

@@ -0,0 +1,23 @@
+export interface IconProps {
+  size?: number | string;
+  color?: string;
+  originColor?: boolean;
+  button?: boolean;
+  background?: boolean;
+}
+
+export interface IconComponentInstance {
+  readonly $props: IconProps;
+  readonly el: SVGSVGElement | HTMLButtonElement;
+}
+
+export interface IconComponent {
+  new (...args: readonly unknown[]): IconComponentInstance;
+  name?: string;
+  props?: Record<string, unknown>;
+  render?: (...args: readonly unknown[]) => unknown;
+}
+
+export declare const Shop: IconComponent;
+export declare const IconShop: IconComponent;
+export default Shop;

package/packages/vue-legacy/icons/Shop.js

@@ -0,0 +1,63 @@
+const toSize = (size) => typeof size === "number" ? `${size}px` : size;
+const toButtonIconSize = (size) => typeof size === "number" ? `${Math.max(0, size - 8)}px` : `max(0px, calc(${size} - 8px))`;
+const joinClassNames = (...values) => values.filter(Boolean).join(" ");
+const componentDefinition = {
+  name: "icon-shop",
+  inheritAttrs: false,
+  props: {
+    size: { type: [String, Number], default: undefined },
+    color: { type: String, default: undefined },
+    originColor: { type: Boolean, default: false },
+    button: { type: Boolean, default: false },
+    background: { type: Boolean, default: true },
+  },
+  computed: {
+    el() {
+      return this.$refs.root || this.$el;
+    },
+  },
+  render(h) {
+    const originColor = this.originColor;
+    const renderedSize = this.size === undefined || this.size === null ? 16 : this.size;
+    const buttonSize = this.size === undefined || this.size === null ? 24 : this.size;
+    const attrs = this.$attrs || {};
+    const listeners = this.$listeners || {};
+    const svgAttributes = { "fill": originColor ? undefined : "currentColor", "viewBox": "0 0 1024 1024", "xmlns": "http://www.w3.org/2000/svg" };
+    const style = this.color === undefined ? undefined : { color: this.color };
+    const buttonStyle = [style, { width: toSize(buttonSize), height: toSize(buttonSize) }];
+    const svg = h("svg", this.button
+      ? {
+          attrs: {
+            ...svgAttributes,
+            width: toButtonIconSize(buttonSize),
+            height: toButtonIconSize(buttonSize),
+            "aria-hidden": "true",
+          },
+        }
+      : {
+          ref: "root",
+          attrs: {
+            ...svgAttributes,
+            ...attrs,
+            width: toSize(renderedSize),
+            height: toSize(renderedSize),
+          },
+          style: style,
+          on: listeners,
+        }, [h("path", { attrs: { "d": "M853.333 85.333a42.67 42.67 0 0 1 41.387 32.32l42.667 170.667a42.2 42.2 0 0 1 1.28 10.347V384A148.84 148.84 0 0 1 896 488.49V896a42.667 42.667 0 0 1-42.667 42.667H170.667A42.667 42.667 0 0 1 128 896V494.656a138.22 138.22 0 0 1-42.667-99.99v-96c0-3.498.427-6.975 1.28-10.346l42.667-170.667a42.67 42.67 0 0 1 41.387-32.32zM635.797 480.896a197.04 197.04 0 0 1-127.296 52.33l-6.57.107h-1.195a197 197 0 0 1-133.867-52.437l-4.202-4.053-4.203 4.053a197.04 197.04 0 0 1-127.296 52.33l-6.57.107H224c-3.584 0-7.147-.192-10.667-.448v320.448h149.334V640a42.667 42.667 0 0 1 42.666-42.667h213.334A42.667 42.667 0 0 1 661.333 640v213.333h149.334V531.776c-6.976 1.003-14.08 1.557-21.334 1.557H778.07a197 197 0 0 1-133.866-52.437L640 476.843zM448 853.333h128V682.667H448zm-277.333-549.44v90.774a53.333 53.333 0 0 0 49.834 53.226L224 448h.597a111.7 111.7 0 0 0 99.904-61.76c15.723-31.445 60.608-31.445 76.331 0A111.7 111.7 0 0 0 500.736 448h1.195a111.7 111.7 0 0 0 99.904-61.76c15.722-31.445 60.608-31.445 76.33 0A111.7 111.7 0 0 0 778.07 448h11.264a64 64 0 0 0 64-64v-80.021l-33.322-133.312H203.968z" } })]);
+    if (!this.button) return svg;
+    return h("button", {
+      ref: "root",
+      attrs: {
+        type: attrs.type || "button",
+        ...attrs,
+      },
+      class: joinClassNames("nstc-icon-button", this.background && "nstc-icon-button--background"),
+      style: buttonStyle,
+      on: listeners,
+    }, [svg]);
+  },
+};
+export const Shop = componentDefinition;
+export const IconShop = componentDefinition;
+export default Shop;

package/packages/vue-legacy/icons/ShoppingBag.cjs

@@ -0,0 +1,66 @@
+"use strict";
+const toSize = (size) => typeof size === "number" ? `${size}px` : size;
+const toButtonIconSize = (size) => typeof size === "number" ? `${Math.max(0, size - 8)}px` : `max(0px, calc(${size} - 8px))`;
+const joinClassNames = (...values) => values.filter(Boolean).join(" ");
+const componentDefinition = {
+  name: "icon-shopping-bag",
+  inheritAttrs: false,
+  props: {
+    size: { type: [String, Number], default: undefined },
+    color: { type: String, default: undefined },
+    originColor: { type: Boolean, default: false },
+    button: { type: Boolean, default: false },
+    background: { type: Boolean, default: true },
+  },
+  computed: {
+    el() {
+      return this.$refs.root || this.$el;
+    },
+  },
+  render(h) {
+    const originColor = this.originColor;
+    const renderedSize = this.size === undefined || this.size === null ? 16 : this.size;
+    const buttonSize = this.size === undefined || this.size === null ? 24 : this.size;
+    const attrs = this.$attrs || {};
+    const listeners = this.$listeners || {};
+    const svgAttributes = { "fill": originColor ? undefined : "currentColor", "viewBox": "0 0 1024 1024", "xmlns": "http://www.w3.org/2000/svg" };
+    const style = this.color === undefined ? undefined : { color: this.color };
+    const buttonStyle = [style, { width: toSize(buttonSize), height: toSize(buttonSize) }];
+    const svg = h("svg", this.button
+      ? {
+          attrs: {
+            ...svgAttributes,
+            width: toButtonIconSize(buttonSize),
+            height: toButtonIconSize(buttonSize),
+            "aria-hidden": "true",
+          },
+        }
+      : {
+          ref: "root",
+          attrs: {
+            ...svgAttributes,
+            ...attrs,
+            width: toSize(renderedSize),
+            height: toSize(renderedSize),
+          },
+          style: style,
+          on: listeners,
+        }, [h("path", { attrs: { "d": "M843.861 85.333a42.667 42.667 0 0 1 42.326 37.44l94.826 768a42.667 42.667 0 0 1-42.346 47.894H85.333a42.667 42.667 0 0 1-42.346-47.894l94.805-768a42.667 42.667 0 0 1 42.368-37.44zm-710.293 768h756.843l-84.267-682.666H217.856l-84.267 682.666zm227.115-567.552c3.712 11.734 8.405 22.848 13.653 32.214a169.71 169.71 0 0 0 148.267 87.338 170.11 170.11 0 0 0 162.026-118.997l81.387 25.707c-33.301 105.514-131.285 178.624-243.392 178.624-93.44 0-177.984-50.816-222.805-131.051a261 261 0 0 1-20.48-48.064l81.344-25.75z" } })]);
+    if (!this.button) return svg;
+    return h("button", {
+      ref: "root",
+      attrs: {
+        type: attrs.type || "button",
+        ...attrs,
+      },
+      class: joinClassNames("nstc-icon-button", this.background && "nstc-icon-button--background"),
+      style: buttonStyle,
+      on: listeners,
+    }, [svg]);
+  },
+};
+module.exports = {
+  ShoppingBag: componentDefinition,
+  IconShoppingBag: componentDefinition,
+  default: componentDefinition,
+};

package/packages/vue-legacy/icons/ShoppingBag.d.ts

@@ -0,0 +1,23 @@
+export interface IconProps {
+  size?: number | string;
+  color?: string;
+  originColor?: boolean;
+  button?: boolean;
+  background?: boolean;
+}
+
+export interface IconComponentInstance {
+  readonly $props: IconProps;
+  readonly el: SVGSVGElement | HTMLButtonElement;
+}
+
+export interface IconComponent {
+  new (...args: readonly unknown[]): IconComponentInstance;
+  name?: string;
+  props?: Record<string, unknown>;
+  render?: (...args: readonly unknown[]) => unknown;
+}
+
+export declare const ShoppingBag: IconComponent;
+export declare const IconShoppingBag: IconComponent;
+export default ShoppingBag;

package/packages/vue-legacy/icons/ShoppingBag.js

@@ -0,0 +1,63 @@
+const toSize = (size) => typeof size === "number" ? `${size}px` : size;
+const toButtonIconSize = (size) => typeof size === "number" ? `${Math.max(0, size - 8)}px` : `max(0px, calc(${size} - 8px))`;
+const joinClassNames = (...values) => values.filter(Boolean).join(" ");
+const componentDefinition = {
+  name: "icon-shopping-bag",
+  inheritAttrs: false,
+  props: {
+    size: { type: [String, Number], default: undefined },
+    color: { type: String, default: undefined },
+    originColor: { type: Boolean, default: false },
+    button: { type: Boolean, default: false },
+    background: { type: Boolean, default: true },
+  },
+  computed: {
+    el() {
+      return this.$refs.root || this.$el;
+    },
+  },
+  render(h) {
+    const originColor = this.originColor;
+    const renderedSize = this.size === undefined || this.size === null ? 16 : this.size;
+    const buttonSize = this.size === undefined || this.size === null ? 24 : this.size;
+    const attrs = this.$attrs || {};
+    const listeners = this.$listeners || {};
+    const svgAttributes = { "fill": originColor ? undefined : "currentColor", "viewBox": "0 0 1024 1024", "xmlns": "http://www.w3.org/2000/svg" };
+    const style = this.color === undefined ? undefined : { color: this.color };
+    const buttonStyle = [style, { width: toSize(buttonSize), height: toSize(buttonSize) }];
+    const svg = h("svg", this.button
+      ? {
+          attrs: {
+            ...svgAttributes,
+            width: toButtonIconSize(buttonSize),
+            height: toButtonIconSize(buttonSize),
+            "aria-hidden": "true",
+          },
+        }
+      : {
+          ref: "root",
+          attrs: {
+            ...svgAttributes,
+            ...attrs,
+            width: toSize(renderedSize),
+            height: toSize(renderedSize),
+          },
+          style: style,
+          on: listeners,
+        }, [h("path", { attrs: { "d": "M843.861 85.333a42.667 42.667 0 0 1 42.326 37.44l94.826 768a42.667 42.667 0 0 1-42.346 47.894H85.333a42.667 42.667 0 0 1-42.346-47.894l94.805-768a42.667 42.667 0 0 1 42.368-37.44zm-710.293 768h756.843l-84.267-682.666H217.856l-84.267 682.666zm227.115-567.552c3.712 11.734 8.405 22.848 13.653 32.214a169.71 169.71 0 0 0 148.267 87.338 170.11 170.11 0 0 0 162.026-118.997l81.387 25.707c-33.301 105.514-131.285 178.624-243.392 178.624-93.44 0-177.984-50.816-222.805-131.051a261 261 0 0 1-20.48-48.064l81.344-25.75z" } })]);
+    if (!this.button) return svg;
+    return h("button", {
+      ref: "root",
+      attrs: {
+        type: attrs.type || "button",
+        ...attrs,
+      },
+      class: joinClassNames("nstc-icon-button", this.background && "nstc-icon-button--background"),
+      style: buttonStyle,
+      on: listeners,
+    }, [svg]);
+  },
+};
+export const ShoppingBag = componentDefinition;
+export const IconShoppingBag = componentDefinition;
+export default ShoppingBag;

package/packages/vue-legacy/icons/ShoppingCart.cjs

@@ -0,0 +1,66 @@
+"use strict";
+const toSize = (size) => typeof size === "number" ? `${size}px` : size;
+const toButtonIconSize = (size) => typeof size === "number" ? `${Math.max(0, size - 8)}px` : `max(0px, calc(${size} - 8px))`;
+const joinClassNames = (...values) => values.filter(Boolean).join(" ");
+const componentDefinition = {
+  name: "icon-shopping-cart",
+  inheritAttrs: false,
+  props: {
+    size: { type: [String, Number], default: undefined },
+    color: { type: String, default: undefined },
+    originColor: { type: Boolean, default: false },
+    button: { type: Boolean, default: false },
+    background: { type: Boolean, default: true },
+  },
+  computed: {
+    el() {
+      return this.$refs.root || this.$el;
+    },
+  },
+  render(h) {
+    const originColor = this.originColor;
+    const renderedSize = this.size === undefined || this.size === null ? 16 : this.size;
+    const buttonSize = this.size === undefined || this.size === null ? 24 : this.size;
+    const attrs = this.$attrs || {};
+    const listeners = this.$listeners || {};
+    const svgAttributes = { "fill": originColor ? undefined : "currentColor", "viewBox": "0 0 1024 1024", "xmlns": "http://www.w3.org/2000/svg" };
+    const style = this.color === undefined ? undefined : { color: this.color };
+    const buttonStyle = [style, { width: toSize(buttonSize), height: toSize(buttonSize) }];
+    const svg = h("svg", this.button
+      ? {
+          attrs: {
+            ...svgAttributes,
+            width: toButtonIconSize(buttonSize),
+            height: toButtonIconSize(buttonSize),
+            "aria-hidden": "true",
+          },
+        }
+      : {
+          ref: "root",
+          attrs: {
+            ...svgAttributes,
+            ...attrs,
+            width: toSize(renderedSize),
+            height: toSize(renderedSize),
+          },
+          style: style,
+          on: listeners,
+        }, [h("path", { attrs: { "d": "M277.333 768a106.667 106.667 0 1 1 0 213.333 106.667 106.667 0 0 1 0-213.333m597.334 0a106.667 106.667 0 1 1 0 213.333 106.667 106.667 0 0 1 0-213.333m-597.334 85.333a21.333 21.333 0 1 0 0 42.667 21.333 21.333 0 0 0 0-42.667m597.334 0a21.333 21.333 0 1 0 0 42.667 21.333 21.333 0 0 0 0-42.667M160 42.667a42.67 42.67 0 0 1 41.387 32.32l32 128 2.602 10.346h702.678a42.667 42.667 0 0 1 41.6 52.118L873.6 734.784A42.67 42.67 0 0 1 832 768H309.333a42.67 42.67 0 0 1-41.6-33.216L161.067 265.451l-.086-.384h-.021L126.677 128h-84.01V42.667zm183.381 640h454.55l87.274-384h-629.12z" } })]);
+    if (!this.button) return svg;
+    return h("button", {
+      ref: "root",
+      attrs: {
+        type: attrs.type || "button",
+        ...attrs,
+      },
+      class: joinClassNames("nstc-icon-button", this.background && "nstc-icon-button--background"),
+      style: buttonStyle,
+      on: listeners,
+    }, [svg]);
+  },
+};
+module.exports = {
+  ShoppingCart: componentDefinition,
+  IconShoppingCart: componentDefinition,
+  default: componentDefinition,
+};

package/packages/vue-legacy/icons/ShoppingCart.d.ts

@@ -0,0 +1,23 @@
+export interface IconProps {
+  size?: number | string;
+  color?: string;
+  originColor?: boolean;
+  button?: boolean;
+  background?: boolean;
+}
+
+export interface IconComponentInstance {
+  readonly $props: IconProps;
+  readonly el: SVGSVGElement | HTMLButtonElement;
+}
+
+export interface IconComponent {
+  new (...args: readonly unknown[]): IconComponentInstance;
+  name?: string;
+  props?: Record<string, unknown>;
+  render?: (...args: readonly unknown[]) => unknown;
+}
+
+export declare const ShoppingCart: IconComponent;
+export declare const IconShoppingCart: IconComponent;
+export default ShoppingCart;

package/packages/vue-legacy/icons/ShoppingCart.js

@@ -0,0 +1,63 @@
+const toSize = (size) => typeof size === "number" ? `${size}px` : size;
+const toButtonIconSize = (size) => typeof size === "number" ? `${Math.max(0, size - 8)}px` : `max(0px, calc(${size} - 8px))`;
+const joinClassNames = (...values) => values.filter(Boolean).join(" ");
+const componentDefinition = {
+  name: "icon-shopping-cart",
+  inheritAttrs: false,
+  props: {
+    size: { type: [String, Number], default: undefined },
+    color: { type: String, default: undefined },
+    originColor: { type: Boolean, default: false },
+    button: { type: Boolean, default: false },
+    background: { type: Boolean, default: true },
+  },
+  computed: {
+    el() {
+      return this.$refs.root || this.$el;
+    },
+  },
+  render(h) {
+    const originColor = this.originColor;
+    const renderedSize = this.size === undefined || this.size === null ? 16 : this.size;
+    const buttonSize = this.size === undefined || this.size === null ? 24 : this.size;
+    const attrs = this.$attrs || {};
+    const listeners = this.$listeners || {};
+    const svgAttributes = { "fill": originColor ? undefined : "currentColor", "viewBox": "0 0 1024 1024", "xmlns": "http://www.w3.org/2000/svg" };
+    const style = this.color === undefined ? undefined : { color: this.color };
+    const buttonStyle = [style, { width: toSize(buttonSize), height: toSize(buttonSize) }];
+    const svg = h("svg", this.button
+      ? {
+          attrs: {
+            ...svgAttributes,
+            width: toButtonIconSize(buttonSize),
+            height: toButtonIconSize(buttonSize),
+            "aria-hidden": "true",
+          },
+        }
+      : {
+          ref: "root",
+          attrs: {
+            ...svgAttributes,
+            ...attrs,
+            width: toSize(renderedSize),
+            height: toSize(renderedSize),
+          },
+          style: style,
+          on: listeners,
+        }, [h("path", { attrs: { "d": "M277.333 768a106.667 106.667 0 1 1 0 213.333 106.667 106.667 0 0 1 0-213.333m597.334 0a106.667 106.667 0 1 1 0 213.333 106.667 106.667 0 0 1 0-213.333m-597.334 85.333a21.333 21.333 0 1 0 0 42.667 21.333 21.333 0 0 0 0-42.667m597.334 0a21.333 21.333 0 1 0 0 42.667 21.333 21.333 0 0 0 0-42.667M160 42.667a42.67 42.67 0 0 1 41.387 32.32l32 128 2.602 10.346h702.678a42.667 42.667 0 0 1 41.6 52.118L873.6 734.784A42.67 42.67 0 0 1 832 768H309.333a42.67 42.67 0 0 1-41.6-33.216L161.067 265.451l-.086-.384h-.021L126.677 128h-84.01V42.667zm183.381 640h454.55l87.274-384h-629.12z" } })]);
+    if (!this.button) return svg;
+    return h("button", {
+      ref: "root",
+      attrs: {
+        type: attrs.type || "button",
+        ...attrs,
+      },
+      class: joinClassNames("nstc-icon-button", this.background && "nstc-icon-button--background"),
+      style: buttonStyle,
+      on: listeners,
+    }, [svg]);
+  },
+};
+export const ShoppingCart = componentDefinition;
+export const IconShoppingCart = componentDefinition;
+export default ShoppingCart;

package/packages/vue-legacy/icons/Shuffle.cjs

@@ -0,0 +1,66 @@
+"use strict";
+const toSize = (size) => typeof size === "number" ? `${size}px` : size;
+const toButtonIconSize = (size) => typeof size === "number" ? `${Math.max(0, size - 8)}px` : `max(0px, calc(${size} - 8px))`;
+const joinClassNames = (...values) => values.filter(Boolean).join(" ");
+const componentDefinition = {
+  name: "icon-shuffle",
+  inheritAttrs: false,
+  props: {
+    size: { type: [String, Number], default: undefined },
+    color: { type: String, default: undefined },
+    originColor: { type: Boolean, default: false },
+    button: { type: Boolean, default: false },
+    background: { type: Boolean, default: true },
+  },
+  computed: {
+    el() {
+      return this.$refs.root || this.$el;
+    },
+  },
+  render(h) {
+    const originColor = this.originColor;
+    const renderedSize = this.size === undefined || this.size === null ? 16 : this.size;
+    const buttonSize = this.size === undefined || this.size === null ? 24 : this.size;
+    const attrs = this.$attrs || {};
+    const listeners = this.$listeners || {};
+    const svgAttributes = { "fill": originColor ? undefined : "currentColor", "viewBox": "0 0 1024 1024", "xmlns": "http://www.w3.org/2000/svg" };
+    const style = this.color === undefined ? undefined : { color: this.color };
+    const buttonStyle = [style, { width: toSize(buttonSize), height: toSize(buttonSize) }];
+    const svg = h("svg", this.button
+      ? {
+          attrs: {
+            ...svgAttributes,
+            width: toButtonIconSize(buttonSize),
+            height: toButtonIconSize(buttonSize),
+            "aria-hidden": "true",
+          },
+        }
+      : {
+          ref: "root",
+          attrs: {
+            ...svgAttributes,
+            ...attrs,
+            width: toSize(renderedSize),
+            height: toSize(renderedSize),
+          },
+          style: style,
+          on: listeners,
+        }, [h("path", { attrs: { "d": "M926.165 234.667a42.667 42.667 0 0 1 0 60.33L776.832 444.331 716.502 384l76.48-76.501H736a202.667 202.667 0 0 0 0 405.333h56.96l-76.459-76.501L776.832 576l149.333 149.333a42.667 42.667 0 0 1 0 60.331L776.832 934.997l-60.33-60.33 76.48-76.502H736c-101.547 0-190.784-52.544-242.07-131.925-49.983 85.312-142.591 142.592-248.597 142.592h-160v-85.333h160a202.667 202.667 0 0 0 0-405.334h-160v-85.333h160c101.526 0 190.763 52.544 242.048 131.904A287.87 287.87 0 0 1 736 222.166h56.96l-76.459-76.502 60.331-60.33z" } })]);
+    if (!this.button) return svg;
+    return h("button", {
+      ref: "root",
+      attrs: {
+        type: attrs.type || "button",
+        ...attrs,
+      },
+      class: joinClassNames("nstc-icon-button", this.background && "nstc-icon-button--background"),
+      style: buttonStyle,
+      on: listeners,
+    }, [svg]);
+  },
+};
+module.exports = {
+  Shuffle: componentDefinition,
+  IconShuffle: componentDefinition,
+  default: componentDefinition,
+};

package/packages/vue-legacy/icons/Shuffle.d.ts

@@ -0,0 +1,23 @@
+export interface IconProps {
+  size?: number | string;
+  color?: string;
+  originColor?: boolean;
+  button?: boolean;
+  background?: boolean;
+}
+
+export interface IconComponentInstance {
+  readonly $props: IconProps;
+  readonly el: SVGSVGElement | HTMLButtonElement;
+}
+
+export interface IconComponent {
+  new (...args: readonly unknown[]): IconComponentInstance;
+  name?: string;
+  props?: Record<string, unknown>;
+  render?: (...args: readonly unknown[]) => unknown;
+}
+
+export declare const Shuffle: IconComponent;
+export declare const IconShuffle: IconComponent;
+export default Shuffle;

package/packages/vue-legacy/icons/Shuffle.js

@@ -0,0 +1,63 @@
+const toSize = (size) => typeof size === "number" ? `${size}px` : size;
+const toButtonIconSize = (size) => typeof size === "number" ? `${Math.max(0, size - 8)}px` : `max(0px, calc(${size} - 8px))`;
+const joinClassNames = (...values) => values.filter(Boolean).join(" ");
+const componentDefinition = {
+  name: "icon-shuffle",
+  inheritAttrs: false,
+  props: {
+    size: { type: [String, Number], default: undefined },
+    color: { type: String, default: undefined },
+    originColor: { type: Boolean, default: false },
+    button: { type: Boolean, default: false },
+    background: { type: Boolean, default: true },
+  },
+  computed: {
+    el() {
+      return this.$refs.root || this.$el;
+    },
+  },
+  render(h) {
+    const originColor = this.originColor;
+    const renderedSize = this.size === undefined || this.size === null ? 16 : this.size;
+    const buttonSize = this.size === undefined || this.size === null ? 24 : this.size;
+    const attrs = this.$attrs || {};
+    const listeners = this.$listeners || {};
+    const svgAttributes = { "fill": originColor ? undefined : "currentColor", "viewBox": "0 0 1024 1024", "xmlns": "http://www.w3.org/2000/svg" };
+    const style = this.color === undefined ? undefined : { color: this.color };
+    const buttonStyle = [style, { width: toSize(buttonSize), height: toSize(buttonSize) }];
+    const svg = h("svg", this.button
+      ? {
+          attrs: {
+            ...svgAttributes,
+            width: toButtonIconSize(buttonSize),
+            height: toButtonIconSize(buttonSize),
+            "aria-hidden": "true",
+          },
+        }
+      : {
+          ref: "root",
+          attrs: {
+            ...svgAttributes,
+            ...attrs,
+            width: toSize(renderedSize),
+            height: toSize(renderedSize),
+          },
+          style: style,
+          on: listeners,
+        }, [h("path", { attrs: { "d": "M926.165 234.667a42.667 42.667 0 0 1 0 60.33L776.832 444.331 716.502 384l76.48-76.501H736a202.667 202.667 0 0 0 0 405.333h56.96l-76.459-76.501L776.832 576l149.333 149.333a42.667 42.667 0 0 1 0 60.331L776.832 934.997l-60.33-60.33 76.48-76.502H736c-101.547 0-190.784-52.544-242.07-131.925-49.983 85.312-142.591 142.592-248.597 142.592h-160v-85.333h160a202.667 202.667 0 0 0 0-405.334h-160v-85.333h160c101.526 0 190.763 52.544 242.048 131.904A287.87 287.87 0 0 1 736 222.166h56.96l-76.459-76.502 60.331-60.33z" } })]);
+    if (!this.button) return svg;
+    return h("button", {
+      ref: "root",
+      attrs: {
+        type: attrs.type || "button",
+        ...attrs,
+      },
+      class: joinClassNames("nstc-icon-button", this.background && "nstc-icon-button--background"),
+      style: buttonStyle,
+      on: listeners,
+    }, [svg]);
+  },
+};
+export const Shuffle = componentDefinition;
+export const IconShuffle = componentDefinition;
+export default Shuffle;