svger-cli 1.0.5 → 1.0.7

package/test-output-mulit/TestIcon-lit.ts

@@ -0,0 +1,35 @@
+import { LitElement, html, css, svg } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+
+@customElement('test-icon')
+export class TestIcon extends LitElement {
+  @property({ type: String }) className = '';
+  @property({ type: String, reflect: true }) width = '24';
+  @property({ type: String, reflect: true }) height = '24';
+  @property({ type: String, reflect: true }) fill = 'currentColor';
+  @property({ type: String, reflect: true }) stroke = '';
+
+  static styles = css`:host { display: inline-block; }`;
+
+  render() {
+    return svg`
+      <svg
+        class="${this.className}"
+        width="${this.width}"
+        height="${this.height}"
+        fill="${this.fill}"
+        stroke="${this.stroke}"
+        viewBox="0 0 24 24"
+        xmlns="http://www.w3.org/2000/svg"
+      >
+        <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"/>
+      </svg>
+    `;
+  }
+}
+
+declare global {
+  interface HTMLElementTagNameMap {
+    'test-icon': TestIcon;
+  }
+}

package/test-output-mulit/TestIcon-preact.tsx

@@ -0,0 +1,38 @@
+import { h, FunctionComponent } from 'preact';
+import { JSX } from 'preact/jsx-runtime';
+
+export interface TestIconProps extends JSX.SVGAttributes<SVGSVGElement> {
+  className?: string;
+  width?: string | number;
+  height?: string | number;
+  fill?: string;
+  stroke?: string;
+}
+
+const TestIcon: FunctionComponent<TestIconProps> = ({ 
+  className, 
+  style, 
+  width, 
+  height, 
+  fill, 
+  stroke, 
+  ...props 
+}) => {
+  return (
+    <svg
+      class={className}
+      style={style}
+      width={width || 24}
+      height={height || 24}
+      fill={fill || 'currentColor'}
+      stroke={stroke}
+      viewBox="0 0 24 24"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"/>
+    </svg>
+  );
+};
+
+export default TestIcon;

package/test-output-mulit/TestIcon-react.tsx

@@ -0,0 +1,35 @@
+import React from "react";
+import type { SVGProps } from "react";
+
+export interface TestIconProps extends SVGProps<SVGSVGElement> {
+  size?: number | string;
+}
+
+const TestIcon = React.forwardRef<SVGSVGElement, TestIconProps>(
+  ({ size, className, style, ...props }, ref) => {
+    const dimensions = size ? { width: size, height: size } : {
+      width: props.width || 24,
+      height: props.height || 24
+    };
+
+    return (
+      <svg
+        ref={ref}
+        viewBox="0 0 24 24"
+        xmlns="http://www.w3.org/2000/svg"
+        width={dimensions.width}
+        height={dimensions.height}
+        fill={props.fill || "currentColor"}
+        className={className}
+        style={style}
+        {...props}
+      >
+        <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"/>
+      </svg>
+    );
+  }
+);
+
+TestIcon.displayName = "TestIcon";
+
+export default TestIcon;

package/test-output-mulit/TestIcon-solid.tsx

@@ -0,0 +1,27 @@
+import { Component, JSX } from 'solid-js';
+
+export interface TestIconProps extends JSX.SvgSVGAttributes<SVGSVGElement> {
+  className?: string;
+  width?: string | number;
+  height?: string | number;
+  fill?: string;
+  stroke?: string;
+}
+
+const TestIcon: Component<TestIconProps> = (props) => (
+  <svg
+    class={props.className}
+    style={props.style}
+    width={props.width || 24}
+    height={props.height || 24}
+    fill={props.fill || 'currentColor'}
+    stroke={props.stroke}
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"/>
+  </svg>
+);
+
+export default TestIcon;

package/test-output-mulit/TestIcon-svelte.svelte

@@ -0,0 +1,22 @@
+<script lang="ts">
+  export let className: string = '';
+  export let style: string = '';
+  export let width: string | number = 24;
+  export let height: string | number = 24;
+  export let fill: string = 'currentColor';
+  export let stroke: string = '';
+</script>
+
+<svg
+  class={className}
+  {style}
+  {width}
+  {height}
+  {fill}
+  {stroke}
+  viewBox="0 0 24 24"
+  xmlns="http://www.w3.org/2000/svg"
+  {...$$restProps}
+>
+  <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"/>
+</svg>

package/test-output-mulit/TestIcon-vanilla.ts

@@ -0,0 +1,37 @@
+export interface TestIconOptions {
+  className?: string;
+  width?: string | number;
+  height?: string | number;
+  fill?: string;
+  stroke?: string;
+  [key: string]: any;
+}
+
+export function TestIcon(options: TestIconOptions = {}): SVGSVGElement {
+  const {
+    className = '',
+    width = 24,
+    height = 24,
+    fill = 'currentColor',
+    stroke = '',
+    ...attrs
+  } = options;
+
+  const svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
+  svg.setAttribute('viewBox', '0 0 24 24');
+  svg.setAttribute('xmlns', 'http://www.w3.org/2000/svg');
+  
+  if (className) svg.setAttribute('class', className);
+  svg.setAttribute('width', String(width));
+  svg.setAttribute('height', String(height));
+  svg.setAttribute('fill', fill);
+  if (stroke) svg.setAttribute('stroke', stroke);
+  
+  Object.entries(attrs).forEach(([key, value]) => {
+    svg.setAttribute(key, String(value));
+  });
+  
+  svg.innerHTML = `<path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"/>`;
+  
+  return svg;
+}

package/test-output-mulit/TestIcon-vue-composition.vue

@@ -0,0 +1,33 @@
+<template>
+  <svg
+    :class="className"
+    :style="style"
+    :width="width || 24"
+    :height="height || 24"
+    :fill="fill || 'currentColor'"
+    :stroke="stroke"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    v-bind="$attrs"
+  >
+    <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"/>
+  </svg>
+</template>
+
+<script setup lang="ts">
+interface Props {
+  className?: string;
+  style?: string | Record<string, any>;
+  width?: string | number;
+  height?: string | number;
+  fill?: string;
+  stroke?: string;
+}
+
+withDefaults(defineProps<Props>(), {
+  className: '',
+  fill: 'currentColor',
+  width: 24,
+  height: 24
+});
+</script>

package/test-output-mulit/TestIcon-vue-options.vue

@@ -0,0 +1,31 @@
+<template>
+  <svg
+    :class="className"
+    :style="style"
+    :width="width"
+    :height="height"
+    :fill="fill"
+    :stroke="stroke"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+    v-bind="$attrs"
+  >
+    <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"/>
+  </svg>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue';
+
+export default defineComponent({
+  name: 'TestIcon',
+  props: {
+    className: { type: String, default: '' },
+    style: { type: [String, Object], default: '' },
+    width: { type: [String, Number], default: 24 },
+    height: { type: [String, Number], default: 24 },
+    fill: { type: String, default: 'currentColor' },
+    stroke: { type: String, default: '' }
+  }
+});
+</script>

package/tsconfig.json

@@ -1,16 +1,18 @@
 {
   "compilerOptions": {
-    "target": "ES2020",
-    "module": "NodeNext",
-    "moduleResolution": "NodeNext",
-    "declaration": true,
+    "target": "ES2022",
+    "module": "ES2022",
+    "moduleResolution": "Bundler",
     "outDir": "dist",
     "rootDir": "src",
-    "esModuleInterop": true,
-    "forceConsistentCasingInFileNames": true,
+    "declaration": true,
+    "emitDeclarationOnly": false,
+    "skipLibCheck": true,
     "strict": true,
-    "skipLibCheck": true
+    "esModuleInterop": true,
+    "resolveJsonModule": true,
+    "jsx": "react-jsx",
+    "types": ["node"]
   },
   "include": ["src"]
-}
-
+}