@nstc-design/icons 0.2.0 → 0.2.1

package/packages/vue/icons/BankZxbank.d.ts

@@ -0,0 +1,10 @@
+import type { DefineComponent } from "vue";
+
+export interface IconProps {
+  size?: number | string;
+  color?: string;
+  originColor?: boolean;
+  button?: boolean;
+  background?: boolean;
+}
+export declare const BankZxbank: DefineComponent<IconProps>;

package/packages/vue/icons/BankZxbank.js

@@ -0,0 +1,39 @@
+import { defineComponent, h, ref } from "vue";
+
+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(" ");
+export const BankZxbank = defineComponent({
+  name: "BankZxbank",
+  inheritAttrs: false,
+  props: {
+    size: { type: [String, Number], default: undefined },
+    color: { type: String, default: undefined },
+    originColor: { type: Boolean, default: true },
+    button: { type: Boolean, default: false },
+    background: { type: Boolean, default: true },
+  },
+  setup(props, { attrs, expose }) {
+    const root = ref(null);
+    expose({ el: root });
+    return () => {
+      const originColor = props.originColor;
+      const renderedSize = props.size ?? 16;
+      const buttonSize = props.size ?? 24;
+      const svgAttributes = { "fill": originColor ? undefined : "currentColor", "viewBox": "0 0 1024 1024", "xmlns": "http://www.w3.org/2000/svg" };
+      const style = props.color === undefined ? attrs.style : [attrs.style, { color: props.color }];
+      const buttonStyle = [style, { width: toSize(buttonSize), height: toSize(buttonSize) }];
+      const svg = h("svg", props.button
+        ? { ...svgAttributes, width: toButtonIconSize(buttonSize), height: toButtonIconSize(buttonSize), "aria-hidden": true }
+        : { ...attrs, ...svgAttributes, ref: root, width: toSize(renderedSize), height: toSize(renderedSize), style }, [h("path", { "d": "M224 0h576c123.6 0 224 100.4 224 224v576c0 123.6-100.4 224-224 224H224C100.4 1024 0 923.6 0 800V224C0 100.4 100.4 0 224 0", "fill": originColor ? "#fff" : "currentColor" }), h("path", { "d": "M835.6 305.6C832.4 250.4 786.8 204 731.2 204H222.8c-6 0-10.8 4.8-10.8 10.8v1.2c2.4 61.6 40.8 113.2 96 133.6l332 .4c28.8 0 52 22.8 53.2 51.2v1.6C684.8 496.4 606.4 570 510.4 570c-29.2 0-56.8-6.8-81.2-18.8l-.8.8c9.6 23.2 30.8 41.2 53.6 48l2.8.8c27.6 10 57.6 15.2 88.8 15.2 146.8 0 266-119.2 266-266.4 0-14-1.6-27.6-3.6-41.2z", "fill": originColor ? "#a11017" : "currentColor" }), h("path", { "d": "M192.4 718.4c3.2 55.2 48 101.6 104 101.6h509.2c6 0 10.8-4.8 10.8-10.8v-1.6c-2.4-61.6-40.8-113.2-96-133.6l-332-.8c-28.8 0-52-22.8-53.2-51.2v-1.6c8.4-93.6 86.8-167.2 182.8-167.2 29.2 0 56.8 6.8 81.2 18.8l.4-.8c-9.6-23.2-30.8-41.2-53.6-48l-2.8-1.2c-28-8.8-58-14-89.2-14-146.8 0-266 119.2-266 266.4 0 14 1.6 27.6 3.6 41.2z", "fill": originColor ? "#bd8019" : "currentColor" })]);
+      if (!props.button) return svg;
+      return h("button", {
+        ...attrs,
+        ref: root,
+        type: attrs.type ?? "button",
+        class: joinClassNames("nstc-icon-button", props.background && "nstc-icon-button--background", attrs.class),
+        style: buttonStyle,
+      }, [svg]);
+    };
+  },
+});

package/packages/vue/icons/BankZybank.d.ts

@@ -0,0 +1,10 @@
+import type { DefineComponent } from "vue";
+
+export interface IconProps {
+  size?: number | string;
+  color?: string;
+  originColor?: boolean;
+  button?: boolean;
+  background?: boolean;
+}
+export declare const BankZybank: DefineComponent<IconProps>;

package/packages/vue/icons/BankZybank.js

@@ -0,0 +1,39 @@
+import { defineComponent, h, ref } from "vue";
+
+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(" ");
+export const BankZybank = defineComponent({
+  name: "BankZybank",
+  inheritAttrs: false,
+  props: {
+    size: { type: [String, Number], default: undefined },
+    color: { type: String, default: undefined },
+    originColor: { type: Boolean, default: true },
+    button: { type: Boolean, default: false },
+    background: { type: Boolean, default: true },
+  },
+  setup(props, { attrs, expose }) {
+    const root = ref(null);
+    expose({ el: root });
+    return () => {
+      const originColor = props.originColor;
+      const renderedSize = props.size ?? 16;
+      const buttonSize = props.size ?? 24;
+      const svgAttributes = { "fill": originColor ? undefined : "currentColor", "viewBox": "0 0 1024 1024", "xmlns": "http://www.w3.org/2000/svg" };
+      const style = props.color === undefined ? attrs.style : [attrs.style, { color: props.color }];
+      const buttonStyle = [style, { width: toSize(buttonSize), height: toSize(buttonSize) }];
+      const svg = h("svg", props.button
+        ? { ...svgAttributes, width: toButtonIconSize(buttonSize), height: toButtonIconSize(buttonSize), "aria-hidden": true }
+        : { ...attrs, ...svgAttributes, ref: root, width: toSize(renderedSize), height: toSize(renderedSize), style }, [h("path", { "d": "M224 0h576c123.6 0 224 100.4 224 224v576c0 123.6-100.4 224-224 224H224C100.4 1024 0 923.6 0 800V224C0 100.4 100.4 0 224 0", "fill": originColor ? "#fff" : "currentColor" }), h("path", { "d": "m440.4 182.8 2 9.2 2 9.2 1.6 9.2 1.2 9.2 1.2 9.2.8 9.6.4 9.6.8 13.2v26.4l-.8 13.2-.4 13.2H202l2.8 16 2.4 16.4 2 16.4 2 16.4 1.6 16.4 1.2 16 1.6 16.4.8 16.4.8 16.8.4 16 .4 16.8v32.8l-.4 16.4-.4 16.4-.8 16.4-1.2 16-1.2 16.4-1.2 16.8-2 16-2 16.4-2 16.4-2.4 16.4-2.4 16-2.8 16.4-3.2 16-3.2 16-7.2 32.4-4.4 17.2-9.2 35.2h135.6l4.4-13.2 4-13.2 4-13.2 3.6-13.6 3.2-13.2L330 760l2.8-13.6 2.8-13.6 2.4-13.6 2.4-16.4 2.4-16.4 2.4-16 1.6-16.4 2-16.8 1.2-16 1.6-16.8.8-16.4.8-16.4 1.2-16.4.4-22.4.4-22.4v-44.8l-.4-22.8h320.4l.8-16 .8-16 1.2-16.4 2-16 1.6-16.4 2-16 2.4-16 2.4-16H578.8l-.4-13.2v-13.2l.4-13.2.4-13.2 1.2-13.2.8-16.4 1.6-16 1.6-16.8 2-16z", "fill": originColor ? "#16307f" : "currentColor" }), h("path", { "d": "m172.8 184.4 5.2 21.2 5.2 21.6 4.8 21.6 4.4 21.6 8.8 43.6h136.4l-1.6-13.6-2.4-13.2-2.4-13.6-2.4-13.2-2.8-13.2-2-8.4-2.4-8.4-2.4-8-2.8-8-2.8-8-3.2-8-3.6-7.6-3.6-7.6z", "fill": originColor ? "#2592bc" : "currentColor" }), h("path", { "d": "m688 708.4 1.6 13.2 2.4 13.6 2 13.2 2.8 13.6 2.8 13.2 2 8 2.4 8.4 2.4 8 2.8 8 2.8 8 3.2 8 3.2 7.6 4.4 8.4H854l-6.4-23.2-5.2-21.6-4.8-21.6-4.8-21.6-8.8-43.2z", "fill": originColor ? "#1e2c6a" : "currentColor" }), h("path", { "d": "m718 182.8-4.4 13.2-4 13.2-3.6 13.2-3.6 13.2-3.2 13.2-3.2 13.6-2.8 13.6-5.2 27.2-2.8 18-2.8 18-2 18.4-2 18-2 18.4-1.6 18.4-1.2 18-2 36.8-.4 22.4-.4 22.4v22.4l.4 44.8H350.8l-.8 8.8-.8 16.4-1.2 16.8-1.6 16-1.6 16.8-2 16.4-2.4 16-2.4 16.4-.8 5.6h110v26l-.4 13.2-1.2 26.4-1.2 16.4-1.6 16.4-1.6 16.4-2 16.4h146.4l-2.4-9.6-1.6-9.2-1.6-9.2-1.6-9.2-1.2-9.2-.8-9.6-.4-9.6-.4-13.2v-26.4l.4-13.2.4-12.8H824l-2.4-16.4-2.4-16.4-2-16-2-16.4-2-16.8-1.2-16-1.2-16.4-1.2-16.4-.8-16.8-.4-16-.4-16.4v-32.8l.4-16.4.8-16.8.4-16.4 1.2-16 1.2-16.8 1.6-16.4 1.6-16 2-16.4 2-16.4 2.4-16.4 2.8-16 2.8-16.4 2.8-16.4 3.2-15.6 7.6-32.4 4-17.6 9.2-34.4z", "fill": originColor ? "#1866ac" : "currentColor" })]);
+      if (!props.button) return svg;
+      return h("button", {
+        ...attrs,
+        ref: root,
+        type: attrs.type ?? "button",
+        class: joinClassNames("nstc-icon-button", props.background && "nstc-icon-button--background", attrs.class),
+        style: buttonStyle,
+      }, [svg]);
+    };
+  },
+});

package/packages/vue/icons/BankZzb.d.ts

@@ -0,0 +1,10 @@
+import type { DefineComponent } from "vue";
+
+export interface IconProps {
+  size?: number | string;
+  color?: string;
+  originColor?: boolean;
+  button?: boolean;
+  background?: boolean;
+}
+export declare const BankZzb: DefineComponent<IconProps>;

package/packages/vue/icons/BankZzb.js

@@ -0,0 +1,39 @@
+import { defineComponent, h, ref } from "vue";
+
+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(" ");
+export const BankZzb = defineComponent({
+  name: "BankZzb",
+  inheritAttrs: false,
+  props: {
+    size: { type: [String, Number], default: undefined },
+    color: { type: String, default: undefined },
+    originColor: { type: Boolean, default: true },
+    button: { type: Boolean, default: false },
+    background: { type: Boolean, default: true },
+  },
+  setup(props, { attrs, expose }) {
+    const root = ref(null);
+    expose({ el: root });
+    return () => {
+      const originColor = props.originColor;
+      const renderedSize = props.size ?? 16;
+      const buttonSize = props.size ?? 24;
+      const svgAttributes = { "fill": originColor ? undefined : "currentColor", "viewBox": "0 0 1024 1024", "xmlns": "http://www.w3.org/2000/svg" };
+      const style = props.color === undefined ? attrs.style : [attrs.style, { color: props.color }];
+      const buttonStyle = [style, { width: toSize(buttonSize), height: toSize(buttonSize) }];
+      const svg = h("svg", props.button
+        ? { ...svgAttributes, width: toButtonIconSize(buttonSize), height: toButtonIconSize(buttonSize), "aria-hidden": true }
+        : { ...attrs, ...svgAttributes, ref: root, width: toSize(renderedSize), height: toSize(renderedSize), style }, [h("path", { "d": "M224 0h576c123.6 0 224 100.4 224 224v576c0 123.6-100.4 224-224 224H224C100.4 1024 0 923.6 0 800V224C0 100.4 100.4 0 224 0", "fill": originColor ? "#fff" : "currentColor" }), h("path", { "d": "M566 213.2C728 239.2 852 382 852 554c0 190.4-152.4 345.2-340 345.2S172 744.4 172 554c0-172.4 124.8-315.6 287.6-341.2-4 3.6-8.4 7.6-13.2 11.2C249.2 395.6 258 538.8 285.2 636.4s146 178.4 235.6 167.6c90-10.8 176-48.8 220.4-169.6s-22.4-240-62.8-292.4c-30-38.8-85.6-100-112.4-128.8", "fill": originColor ? "#0088c2" : "currentColor" }), h("path", { "d": "M467.6 344c-10.8 0-19.6 8.8-19.6 19.6V452c-8.8-.4-18.4-1.2-28.8-3.6-2-.4-3.6 0-5.6 0-16.4 0-30 13.6-30 30v286.8l93.2 70.4V660.8c0-20.4 16.8-37.2 37.2-37.2s37.2 16.8 37.2 37.2V836l94.4-70V478.4c0-16.4-13.6-30-30-30-2 0-4-.4-6.4 0-10.8 1.6-20 2.4-28 2.8v-87.6c0-10.8-8.8-19.6-19.6-19.6z", "fill": originColor ? "#e50e1b" : "currentColor" }), h("path", { "d": "M256.8 175.2c32.4 28.4 75.6 50 75.6 50 98 60.4 150.8 35.2 146 10.4-2.8-14-24.4-28.4-67.2-26.8-116.8 3.6-195.2-79.2-196.8-80.8 1.6 1.6 10.4 18.8 42.4 47.2", "fill": originColor ? "#009bce" : "currentColor" })]);
+      if (!props.button) return svg;
+      return h("button", {
+        ...attrs,
+        ref: root,
+        type: attrs.type ?? "button",
+        class: joinClassNames("nstc-icon-button", props.background && "nstc-icon-button--background", attrs.class),
+        style: buttonStyle,
+      }, [svg]);
+    };
+  },
+});

package/packages/vue/icons/BankZzbank.d.ts

@@ -0,0 +1,10 @@
+import type { DefineComponent } from "vue";
+
+export interface IconProps {
+  size?: number | string;
+  color?: string;
+  originColor?: boolean;
+  button?: boolean;
+  background?: boolean;
+}
+export declare const BankZzbank: DefineComponent<IconProps>;

package/packages/vue/icons/BankZzbank.js

@@ -0,0 +1,39 @@
+import { defineComponent, h, ref } from "vue";
+
+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(" ");
+export const BankZzbank = defineComponent({
+  name: "BankZzbank",
+  inheritAttrs: false,
+  props: {
+    size: { type: [String, Number], default: undefined },
+    color: { type: String, default: undefined },
+    originColor: { type: Boolean, default: true },
+    button: { type: Boolean, default: false },
+    background: { type: Boolean, default: true },
+  },
+  setup(props, { attrs, expose }) {
+    const root = ref(null);
+    expose({ el: root });
+    return () => {
+      const originColor = props.originColor;
+      const renderedSize = props.size ?? 16;
+      const buttonSize = props.size ?? 24;
+      const svgAttributes = { "fill": originColor ? undefined : "currentColor", "viewBox": "0 0 1024 1024", "xmlns": "http://www.w3.org/2000/svg" };
+      const style = props.color === undefined ? attrs.style : [attrs.style, { color: props.color }];
+      const buttonStyle = [style, { width: toSize(buttonSize), height: toSize(buttonSize) }];
+      const svg = h("svg", props.button
+        ? { ...svgAttributes, width: toButtonIconSize(buttonSize), height: toButtonIconSize(buttonSize), "aria-hidden": true }
+        : { ...attrs, ...svgAttributes, ref: root, width: toSize(renderedSize), height: toSize(renderedSize), style }, [h("path", { "d": "M224 0h576c123.6 0 224 100.4 224 224v576c0 123.6-100.4 224-224 224H224C100.4 1024 0 923.6 0 800V224C0 100.4 100.4 0 224 0", "fill": originColor ? "#fff" : "currentColor" }), h("path", { "d": "M400.4 117.6s-118 12.4-232 142.4c0 0 269.2-1.2 391.2 15.2 0 0-44.8-70.8-159.2-157.6", "fill": originColor ? "#ed991f" : "currentColor" }), h("path", { "d": "M561.6 724.4s307.2-14 314.4-243.6c-3.6-226.4-266-402.4-475.6-363.2 0 0 209.6 150 226.8 312.4 23.6 156.8-46 259.6-65.6 294.4", "fill": originColor ? "#e85c00" : "currentColor" }), h("path", { "d": "M551.6 906.8s118-12.4 232-142.4c0 0-269.2.8-391.2-15.2 0 0 44.8 70.8 159.2 157.6", "fill": originColor ? "#ed991f" : "currentColor" }), h("path", { "d": "M390.4 299.6S83.2 313.6 76 543.2c3.6 226.4 265.6 402.4 475.6 363.2 0 0-209.6-150-226.8-312.4-23.6-156.8 45.6-259.6 65.6-294.4", "fill": originColor ? "#e85c00" : "currentColor" }), h("path", { "d": "M372.4 417.6h199.2v199.2H372.4z", "fill": originColor ? "#ed991f" : "currentColor" })]);
+      if (!props.button) return svg;
+      return h("button", {
+        ...attrs,
+        ref: root,
+        type: attrs.type ?? "button",
+        class: joinClassNames("nstc-icon-button", props.background && "nstc-icon-button--background", attrs.class),
+        style: buttonStyle,
+      }, [svg]);
+    };
+  },
+});