fix: add toJSON to icon and cast as any

.changeset/spotty-schools-sniff.md

@@ -0,0 +1,5 @@
+---
+"@ebay/ebayui-core": patch
+---
+
+optimize icons with toJSON

src/components/components/ebay-tooltip-base/component-browser.ts

@@ -15,7 +15,6 @@ import type { WithNormalizedProps } from "../../../global";
 
 interface TooptipBaseInput {
     open?: boolean;
-    toJSON?: () => Object;
     type: string;
     offset?: number;
     "no-hover"?: boolean;

src/components/components/ebay-tooltip-base/index.marko

@@ -7,7 +7,7 @@ static function toJSON(this: any) {
     }
 }
 
-$ input.toJSON = toJSON;
+$ (input as any).toJSON = toJSON;
 
 $ const {
     overlayStyle,

src/components/components/ebay-tooltip-overlay/component-browser.ts

@@ -3,7 +3,6 @@ import { typeRoles } from "./constants";
 import type { WithNormalizedProps } from "../../../global";
 
 interface TooltipOverlayInput {
-    toJSON?: any;
     "style-top"?: string;
     "style-left"?: string;
     "style-right"?: string;

src/components/components/ebay-tooltip-overlay/index.marko

@@ -3,7 +3,7 @@ import { typeRoles } from "./constants";
 
 static function noop() {}
 
-$ input.toJSON = noop;
+$ (input as any).toJSON = noop;
 
 $ const {
     id,

src/components/ebay-button/index.marko

@@ -12,7 +12,6 @@ export interface ButtonEvent<T extends Event> {
 
 export interface ButtonInput extends Omit<Marko.Input<"button">, `on${string}`> {
     href?: string;
-    toJSON?: () => Object;
     size?: (typeof validSizes)[number];
     priority?: "primary" | "secondary" | "tertiary" | "none";
     variant?: "standard" | "destructive" | "form";
@@ -68,7 +67,7 @@ static var validPriorities = [
 ];
 
 $ {
-    input.toJSON = toJSON;
+    (input as any).toJSON = toJSON;
     var size = inputSize && validSizes.includes(inputSize) ? inputSize : null;
 
     var priority = inputPriority || "secondary";

src/components/ebay-checkbox/component-browser.ts

@@ -6,7 +6,6 @@ export interface CheckboxEvent {
     checked: boolean;
 }
 interface CheckboxInput extends Omit<Marko.Input<"input">, `on${string}`> {
-    toJSON?: any;
     "icon-style"?: "rounded" | "square";
     "on-change"?: (e: CheckboxEvent) => void;
     "on-focus"?: (e: CheckboxEvent) => void;

src/components/ebay-checkbox/index.marko

@@ -10,7 +10,7 @@ $ const {
     ...htmlInput
 } = input;
 
-$ input.toJSON = noop;
+$ (input as any).toJSON = noop;
 
 <span class=["checkbox", inputClass] style=style>
     <input

src/components/ebay-details/component-browser.ts

@@ -2,7 +2,6 @@ import type { WithNormalizedProps } from "../../global";
 
 export interface DetailsInput
     extends Omit<Marko.Input<"details">, `on${string}`> {
-    toJSON?: any;
     text: string;
     size?: "regular" | "small";
     alignment?: "regular" | "center";

src/components/ebay-details/index.marko

@@ -10,11 +10,10 @@ $ const {
     text,
     renderBody,
     as: inputAs,
-    toJSON,
     ...htmlInput
 } = input;
 
-$ input.toJSON = noop;
+$ (input as any).toJSON = noop;
 
 <details
     ...processHtmlAttributes(htmlInput)

src/components/ebay-details/test/test.server.js

@@ -9,31 +9,27 @@ use(require("chai-dom"));
 
 describe("details", () => {
     it("renders basic version", async () => {
-        const input = mock.Default_Details;
+        const input = { ...mock.Default_Details };
         await htmlSnap(template, input);
     });
 
     it("renders as div version", async () => {
-        const input = Object.assign({}, mock.Default_Details, { as: "div" });
+        const input = { ...mock.Default_Details, as: "div" };
         await htmlSnap(template, input);
     });
 
     it("renders in open state", async () => {
-        const input = mock.Open_Details;
+        const input = { ...mock.Default_Details };
         await htmlSnap(template, input);
     });
 
     it("renders small version", async () => {
-        const input = Object.assign({}, mock.Default_Details, {
-            size: "small",
-        });
+        const input = { ...mock.Default_Details, size: "small" };
         await htmlSnap(template, input);
     });
 
     it("renders center version", async () => {
-        const input = Object.assign({}, mock.Default_Details, {
-            alignment: "center",
-        });
+        const input = { ...mock.Default_Details, alignment: "center" };
         await htmlSnap(template, input);
     });
 

src/components/ebay-eek/eek-util.ts

@@ -8,7 +8,6 @@ const validRanges = {
 };
 
 interface EekInput extends Omit<Marko.Input<"div">, `on${string}`> {
-    toJSON?: any;
     max: string;
     min: string;
     rating: string;

src/components/ebay-eek/index.marko

@@ -14,7 +14,7 @@ $ const {
     ...htmlInput
 } = input;
 
-$ input.toJSON = noop;
+$ (input as any).toJSON = noop;
 $ const eekRating = eekUtil(input);
 <div
     ...processHtmlAttributes(htmlInput)

src/components/ebay-fake-link/component-browser.ts

@@ -2,7 +2,6 @@ import * as eventUtils from "../../common/event-utils";
 import type { WithNormalizedProps } from "../../global";
 
 interface FakeLinkInput extends Omit<Marko.Input<"button">, `on${string}`> {
-    toJSON?: any;
     variant?: "inline" | "standalone";
     "on-click"?: (event: { originalEvent: MouseEvent }) => void;
     "on-escape"?: (event: { originalEvent: KeyboardEvent }) => void;

src/components/ebay-fake-link/index.marko

@@ -14,7 +14,7 @@ $ const {
     ...htmlInput
 } = input;
 
-$ input.toJSON = toJSON;
+$ (input as any).toJSON = toJSON;
 
 <button
     ...processHtmlAttributes(htmlInput)

src/components/ebay-icon-button/component-browser.ts

@@ -3,7 +3,6 @@ import * as eventUtils from "../../common/event-utils";
 import type { WithNormalizedProps } from "../../global";
 
 interface IconButtonInput extends Omit<Marko.Input<"button">, `on${string}`> {
-    toJSON?: any;
     "badge-number"?: number | string;
     href?: string;
     transparent?: boolean;

src/components/ebay-icon-button/index.marko

@@ -22,7 +22,7 @@ $ const {
     ...htmlInput
 } = input;
 
-$ input.toJSON = toJSON;
+$ (input as any).toJSON = toJSON;
 $ const tagType = href ? "a" : "button";
 
 <${tagType}

src/components/ebay-icon/index.marko

@@ -4,6 +4,8 @@ static var isBrowser = typeof window !== "undefined";
 
 static var browserLookup: Record<string, unknown> = {};
 
+static function noop() {}
+
 $ const {
     _name,
     _type,
@@ -16,6 +18,8 @@ $ const {
     ...htmlInput
 } = input;
 
+$ (input as any).toJSON = noop;
+
 static function getIconClass(type: string, name: string) {
     if (type === "icon") {
         return `icon icon--${name}`;

src/components/ebay-radio/component-browser.ts

@@ -5,7 +5,6 @@ export interface RadioEvent {
     value: string;
 }
 interface RadioInput extends Omit<Marko.Input<"input">, `on${string}`> {
-    toJSON?: any;
     "icon-style"?: "rounded" | "square";
     "on-change"?: (e: RadioEvent, el: HTMLInputElement) => void;
     "on-focus"?: (e: RadioEvent, el: HTMLInputElement) => void;

src/components/ebay-radio/index.marko

@@ -9,7 +9,7 @@ $ const {
     ...htmlInput
 } = input;
 
-$ input.toJSON = noop;
+$ (input as any).toJSON = noop;
 
 <span class=["radio", inputClass] style=style>
     <input

src/components/ebay-switch/component-browser.ts

@@ -7,7 +7,6 @@ export interface SwitchEvent {
 }
 
 interface SwitchInput extends Omit<Marko.Input<"input">, `on${string}`> {
-    toJSON?: any;
     "on-change"?: (event: SwitchEvent) => void;
 }
 

src/components/ebay-switch/index.marko

@@ -8,7 +8,7 @@ $ const {
     ...htmlInput
 } = input;
 
-$ input.toJSON = noop;
+$ (input as any).toJSON = noop;
 
 <span class=["switch", inputClass] style=style>
     <input

src/components/ebay-textbox/component-browser.ts

@@ -8,7 +8,6 @@ export interface TextboxEvent {
 }
 
 interface TextboxInput extends Omit<Marko.Input<"textarea">, `on${string}`> {
-    toJSON?: any;
     multiline?: boolean;
     type?: Marko.Input<"input">["type"];
     "input-size"?: "regular" | "large";

src/components/ebay-textbox/index.marko

@@ -25,7 +25,7 @@ $ const {
     ...htmlInput
 } = input;
 
-$ input.toJSON = toJSON;
+$ (input as any).toJSON = toJSON;
 $ var isPostfix = !!postfixIcon;
 $ var hasIcon = prefixIcon || isPostfix;
 $ var isLarge = inputSize === "large";