From e260c466acf261e04d48e455d170a42a76c178ac Mon Sep 17 00:00:00 2001
From: LuLaValva <lukelavalva@gmail.com>
Date: Wed, 27 Dec 2023 15:06:45 -0800
Subject: [PATCH 1/2] refactor: seemingly arbitrary changes for Marko 4 support
---
src/components/ebay-carousel/index.marko | 34 +++++++++++++------
.../ebay-filter-menu-button/index.marko | 8 ++---
2 files changed, 28 insertions(+), 14 deletions(-)
diff --git a/src/components/ebay-carousel/index.marko b/src/components/ebay-carousel/index.marko
index 6fbccfab0..a0c6fa55e 100644
--- a/src/components/ebay-carousel/index.marko
+++ b/src/components/ebay-carousel/index.marko
@@ -52,16 +52,30 @@ $ var config = data.config;
id:scoped='list'
>
<for|item| of=data.items>
- <li
- ...item.htmlAttributes
- key=item.key
- class=item.class
- style=item.style
- aria-hidden=!item.fullyVisible && 'true'
- no-update-body-if=!!config.preserveItems
- >
- <${item.renderBody}/>
- </li>
+ <if(config.preserveItems)>
+ <li
+ ...item.htmlAttributes
+ key=item.key
+ class=item.class
+ style=item.style
+ aria-hidden=!item.fullyVisible && 'true'
+ no-update-body
+ >
+ <${item.renderBody}/>
+ </li>
+ </if>
+ <else>
+ <!-- completely identical to above, without no-update-body -->
+ <li
+ ...item.htmlAttributes
+ key=item.key
+ class=item.class
+ style=item.style
+ aria-hidden=!item.fullyVisible && 'true'
+ >
+ <${item.renderBody}/>
+ </li>
+ </else>
</for>
</ul>
</div>
diff --git a/src/components/ebay-filter-menu-button/index.marko b/src/components/ebay-filter-menu-button/index.marko
index 88fe91bb4..668f648cd 100644
--- a/src/components/ebay-filter-menu-button/index.marko
+++ b/src/components/ebay-filter-menu-button/index.marko
@@ -13,7 +13,7 @@ $ const {
formAction,
formMethod,
items,
- type,
+ type: inputType,
...htmlInput
} = input;
@@ -40,7 +40,7 @@ $ const {
<ebay-filter-menu
classPrefix="filter-menu-button"
variant=variant
- type=type
+ type=inputType
formName=formName
formAction=formAction
formMethod=formMethod
@@ -58,10 +58,10 @@ $ const {
${footerText}
</@footer>
</if>
- <else-if(footer)>
+ <else><if(footer)>
<@footer ...footer a11yFooterText=(a11yFooterText || footer.a11yFooterText)>
<${footer.renderBody}/>
</@footer>
- </else-if>
+ </if></else>
</ebay-filter-menu>
</span>
From a24ebf84936e458d405ee46fd84711079b57619d Mon Sep 17 00:00:00 2001
From: Andrew Gliga <agliga4@gmail.com>
Date: Wed, 27 Dec 2023 20:59:48 -0800
Subject: [PATCH 2/2] fix: typescript on marko 4
---
package-lock.json | 3 +-
package.json | 2 +-
scripts/generate-cdn.js | 20 ++++++-----
scripts/prepublish.js | 5 ++-
src/common/cdn/index.ts | 2 +-
src/common/cdn/{versions.json => versions.ts} | 2 +-
.../ebay-tooltip-overlay/component-browser.ts | 6 +---
.../ebay-tooltip-overlay/constants.ts | 5 +++
.../ebay-tooltip-overlay/index.marko | 2 +-
.../ebay-button/component-browser.ts | 3 +-
src/components/ebay-button/constants.ts | 1 +
src/components/ebay-button/index.marko | 2 +-
src/components/ebay-carousel/index.marko | 33 +++++--------------
src/components/ebay-listbox/index.marko | 2 +-
src/components/ebay-menu-button/style.ts | 1 -
tsconfig.json | 8 ++---
16 files changed, 43 insertions(+), 54 deletions(-)
rename src/common/cdn/{versions.json => versions.ts} (85%)
create mode 100644 src/components/components/ebay-tooltip-overlay/constants.ts
create mode 100644 src/components/ebay-button/constants.ts
diff --git a/package-lock.json b/package-lock.json
index da671b2e9..983d06034 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9,7 +9,7 @@
"version": "13.0.0-1",
"license": "MIT",
"dependencies": {
- "@floating-ui/core": "^1.5.2",
+ "@floating-ui/dom": "^1.5.2",
"@marko-tags/subscribe": "^0.5.1",
"makeup-active-descendant": "0.6.1",
"makeup-expander": "~0.10.1",
@@ -3377,7 +3377,6 @@
"version": "1.5.3",
"resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.5.3.tgz",
"integrity": "sha512-ClAbQnEqJAKCJOEbbLo5IUlZHkNszqhuxS4fHAVxRPXPya6Ysf2G8KypnYcOTpx6I8xcgF9bbHb6g/2KpbV8qA==",
- "dev": true,
"dependencies": {
"@floating-ui/core": "^1.4.2",
"@floating-ui/utils": "^0.1.3"
diff --git a/package.json b/package.json
index a6f33f1ef..40561355e 100644
--- a/package.json
+++ b/package.json
@@ -142,7 +142,7 @@
},
"dependencies": {
"@marko-tags/subscribe": "^0.5.1",
- "@floating-ui/core": "^1.5.2",
+ "@floating-ui/dom": "^1.5.2",
"makeup-active-descendant": "0.6.1",
"makeup-expander": "~0.10.1",
"makeup-floating-label": "~0.3.2",
diff --git a/scripts/generate-cdn.js b/scripts/generate-cdn.js
index 80133a381..f7a5a9396 100644
--- a/scripts/generate-cdn.js
+++ b/scripts/generate-cdn.js
@@ -5,12 +5,12 @@ import * as https from "https"; // or 'https' for https:// URLs
import { fileURLToPath } from "url";
import * as fs from "fs";
import * as path from "path";
-import rimraf from "rimraf";
+import * as rimraf from "rimraf";
const __filename = fileURLToPath(import.meta.url);
const __dirname = path.dirname(__filename);
const rootDir = path.join(__dirname, "..");
-const versionPath = "src/common/cdn/versions.json";
+const versionPath = "src/common/cdn/versions.ts";
const cdnConfig = {
shaka: {
@@ -37,9 +37,11 @@ function updateVersionFile(version) {
{
"//": "This is a generated file. Run generateCDN script file to update",
},
- version
+ version,
);
- const newVersion = JSON.stringify(versionObject);
+ const newVersion = `export const versions = ${JSON.stringify(
+ versionObject,
+ )};`;
fs.writeFileSync(versionFile, newVersion);
}
@@ -70,29 +72,29 @@ async function shakaGenerator({ version, cdnVersionPath }) {
await download(getShakaCSSUrl(version), cdnVersionPath, "controls.css");
// Remove define
execSync(
- `sed -i '' -e 's/typeof define=="function"/typeof define=="w"/' ${cdnVersionPath}/shaka-player.ui.js`
+ `sed -i '' -e 's/typeof define=="function"/typeof define=="w"/' ${cdnVersionPath}/shaka-player.ui.js`,
);
}
async function threeDPlayerGenerator({ cdnVersionPath }) {
await fs.promises.cp(
`${rootDir}/node_modules/@google/model-viewer/dist/model-viewer.min.js`,
- `${cdnVersionPath}/model-viewer.min.js`
+ `${cdnVersionPath}/model-viewer.min.js`,
);
}
async function highchartsGenerator({ cdnVersionPath }) {
await fs.promises.cp(
`${rootDir}/node_modules/highcharts/highcharts.js`,
- `${cdnVersionPath}/highcharts.js`
+ `${cdnVersionPath}/highcharts.js`,
);
await fs.promises.cp(
`${rootDir}/node_modules/highcharts/modules/accessibility.js`,
- `${cdnVersionPath}/accessibility.js`
+ `${cdnVersionPath}/accessibility.js`,
);
await fs.promises.cp(
`${rootDir}/node_modules/highcharts/modules/pattern-fill.js`,
- `${cdnVersionPath}/pattern-fill.js`
+ `${cdnVersionPath}/pattern-fill.js`,
);
}
diff --git a/scripts/prepublish.js b/scripts/prepublish.js
index 2e33b6a82..7aed45e1f 100644
--- a/scripts/prepublish.js
+++ b/scripts/prepublish.js
@@ -10,7 +10,10 @@ const componentInputDir = path.join(rootDir, "src/components");
// run typescript compiler
execSync("mtc");
-execSync("babel --env-name prod dist --out-dir dist --copy-files");
+// Rename all exports.default to module.exports
+execSync(
+ "find dist -type f -name 'component*.js' | xargs sed -i '' 's/exports.default =/module.exports =/g'",
+);
// create top level browser.json files to map to nested ones
fs.readdirSync(componentInputDir)
diff --git a/src/common/cdn/index.ts b/src/common/cdn/index.ts
index 6bfe1ca8d..b386845c5 100644
--- a/src/common/cdn/index.ts
+++ b/src/common/cdn/index.ts
@@ -1,5 +1,5 @@
import { loader } from "../loader";
-import versions from "./versions.json";
+import { versions } from "./versions";
const MAX_RETRIES = 3;
interface CDNLoaderConfig {
diff --git a/src/common/cdn/versions.json b/src/common/cdn/versions.ts
similarity index 85%
rename from src/common/cdn/versions.json
rename to src/common/cdn/versions.ts
index 832d7473f..f24e53bf7 100644
--- a/src/common/cdn/versions.json
+++ b/src/common/cdn/versions.ts
@@ -1,4 +1,4 @@
-{
+export const versions = {
"//": "This is a generated file. Run generateCDN script file to update",
"shaka": "4.3.2",
"highcharts": "10.2.1",
diff --git a/src/components/components/ebay-tooltip-overlay/component-browser.ts b/src/components/components/ebay-tooltip-overlay/component-browser.ts
index a3117a01f..241cfcd1f 100644
--- a/src/components/components/ebay-tooltip-overlay/component-browser.ts
+++ b/src/components/components/ebay-tooltip-overlay/component-browser.ts
@@ -1,9 +1,5 @@
import type { AttrClass } from "marko/tags-html";
-export const typeRoles = {
- tourtip: "region",
- tooltip: "tooltip",
- infotip: "tooltip",
-} as const;
+import {typeRoles} from './constants'
interface TooltipOverlayInput {
toJSON?: any;
diff --git a/src/components/components/ebay-tooltip-overlay/constants.ts b/src/components/components/ebay-tooltip-overlay/constants.ts
new file mode 100644
index 000000000..5fb91fa0c
--- /dev/null
+++ b/src/components/components/ebay-tooltip-overlay/constants.ts
@@ -0,0 +1,5 @@
+export const typeRoles = {
+ tourtip: "region",
+ tooltip: "tooltip",
+ infotip: "tooltip",
+} as const;
diff --git a/src/components/components/ebay-tooltip-overlay/index.marko b/src/components/components/ebay-tooltip-overlay/index.marko
index a739735fa..b8c69a2bf 100644
--- a/src/components/components/ebay-tooltip-overlay/index.marko
+++ b/src/components/components/ebay-tooltip-overlay/index.marko
@@ -1,5 +1,5 @@
import { processHtmlAttributes } from "../../../common/html-attributes";
-import { typeRoles } from "./component-browser";
+import { typeRoles } from "./constants";
static function noop() {}
diff --git a/src/components/ebay-button/component-browser.ts b/src/components/ebay-button/component-browser.ts
index 443c8ff87..30b7f25e2 100644
--- a/src/components/ebay-button/component-browser.ts
+++ b/src/components/ebay-button/component-browser.ts
@@ -1,6 +1,5 @@
import * as eventUtils from "../../common/event-utils";
-
-export const validSizes = ["large", "small"] as const;
+import { validSizes } from "./constants";
export interface ButtonEvent<T extends Event> {
originalEvent: T;
diff --git a/src/components/ebay-button/constants.ts b/src/components/ebay-button/constants.ts
new file mode 100644
index 000000000..89a10fc9d
--- /dev/null
+++ b/src/components/ebay-button/constants.ts
@@ -0,0 +1 @@
+export const validSizes = ["large", "small"] as const;
diff --git a/src/components/ebay-button/index.marko b/src/components/ebay-button/index.marko
index 8bced0f15..3cd220509 100644
--- a/src/components/ebay-button/index.marko
+++ b/src/components/ebay-button/index.marko
@@ -1,5 +1,5 @@
import { processHtmlAttributes } from "../../common/html-attributes"
-import { validSizes } from "./component-browser"
+import {validSizes} from "./constants"
static function toJSON(this: any) {
return {
diff --git a/src/components/ebay-carousel/index.marko b/src/components/ebay-carousel/index.marko
index a0c6fa55e..1adfc700d 100644
--- a/src/components/ebay-carousel/index.marko
+++ b/src/components/ebay-carousel/index.marko
@@ -52,30 +52,15 @@ $ var config = data.config;
id:scoped='list'
>
<for|item| of=data.items>
- <if(config.preserveItems)>
- <li
- ...item.htmlAttributes
- key=item.key
- class=item.class
- style=item.style
- aria-hidden=!item.fullyVisible && 'true'
- no-update-body
- >
- <${item.renderBody}/>
- </li>
- </if>
- <else>
- <!-- completely identical to above, without no-update-body -->
- <li
- ...item.htmlAttributes
- key=item.key
- class=item.class
- style=item.style
- aria-hidden=!item.fullyVisible && 'true'
- >
- <${item.renderBody}/>
- </li>
- </else>
+ <li
+ ...item.htmlAttributes
+ key=item.key
+ class=item.class
+ style=item.style
+ aria-hidden=!item.fullyVisible && 'true'
+ >
+ <${item.renderBody}/>
+ </li>
</for>
</ul>
</div>
diff --git a/src/components/ebay-listbox/index.marko b/src/components/ebay-listbox/index.marko
index 830605d51..abfbbf7cb 100644
--- a/src/components/ebay-listbox/index.marko
+++ b/src/components/ebay-listbox/index.marko
@@ -10,7 +10,7 @@ $ const {
...htmlInput
} = input;
-$ var selectedOption = (options as Option[])?.[state.selectedIndex];
+$ var selectedOption = (options as Option[])[state.selectedIndex];
<div
...processHtmlAttributes(htmlInput)
diff --git a/src/components/ebay-menu-button/style.ts b/src/components/ebay-menu-button/style.ts
index b5c6ecbd2..f0bb079d6 100644
--- a/src/components/ebay-menu-button/style.ts
+++ b/src/components/ebay-menu-button/style.ts
@@ -1,2 +1 @@
import "@ebay/skin/menu-button";
-import "./ebay-menu-button.css";
diff --git a/tsconfig.json b/tsconfig.json
index 94e764963..28baa4aec 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -9,9 +9,9 @@
"compilerOptions": {
"allowSyntheticDefaultImports": true,
"incremental": true,
- "lib": ["dom", "ESNext"],
- "module": "ESNext",
- "moduleResolution": "bundler",
+ "lib": ["dom"],
+ "module": "commonjs",
+ "moduleResolution": "node",
"noImplicitOverride": true,
"noUnusedLocals": true,
"outDir": "dist",
@@ -19,7 +19,7 @@
"rootDir": "src",
"skipLibCheck": true,
"strict": true,
- "target": "ES6",
+ "target": "ES2015",
"tsBuildInfoFile": "dist/tsconfig.tsbuildinfo"
}
}