@ptcwebops/ptcw-design 6.4.20-beta → 6.4.22-beta

package/package.json

@@ -1,101 +1,101 @@
-{
-  "name": "@ptcwebops/ptcw-design",
-  "version": "6.4.20-beta",
-  "description": "Stencil Component Starter",
-  "main": "dist/index.cjs.js",
-  "module": "./dist/index.js",
-  "es2015": "dist/esm/index.mjs",
-  "es2017": "dist/esm/index.mjs",
-  "types": "dist/custom-elements/index.d.ts",
-  "collection": "dist/collection/collection-manifest.json",
-  "collection:main": "dist/collection/index.js",
-  "unpkg": "dist/ptcw-design/ptcw-design.esm.js",
-  "files": [
-    "dist/",
-    "loader/"
-  ],
-  "scripts": {
-    "build": "stencil build --docs",
-    "start": "stencil build --dev --watch --serve",
-    "test": "stencil test --spec --e2e",
-    "test.watch": "stencil test --spec --e2e --watchAll",
-    "test.unit": "stencil test --spec",
-    "test.end-to-end": "stencil test --e2e",
-    "test.unit.watch": "stencil test --spec --watch",
-    "generate": "stencil generate",
-    "prepare": "stencil build --docs",
-    "storybook": "storybook dev -p 6006",
-    "build-storybook": "storybook build",
-    "generate-story": "node scripts/storyGenerator",
-    "generate-unit-tests": "node scripts/unitTestGenerator",
-    "generate-bulk-tests": "node scripts/bulkTestGenerator",
-    "start:tailwind": "npx tailwindcss -i ./src/global/tailwindcss/input.css -o ./src/global/tailwindcss/output.css --watch",
-    "start:tailwind-stencil": "npx tailwindcss -i ./src/global/tailwindcss/input.css -o ./src/global/tailwindcss/output.css && npm run start",
-    "build:tailwind-stencil": "npx tailwindcss -i ./src/global/tailwindcss/input.css -o ./src/global/tailwindcss/output.css --minify && npm run build",
-    "format:prettier": "prettier --write \"src/**/*.{tsx,html,scss}\""
-  },
-  "dependencies": {
-    "@daveberning/griddle": "^0.3.0",
-    "@material/checkbox": "^14.0.0",
-    "@material/form-field": "^14.0.0",
-    "@material/select": "^14.0.0",
-    "@material/textfield": "^14.0.0",
-    "@stencil/core": "^2.20.0",
-    "@stencil/postcss": "^2.1.0",
-    "@teamhive/lottie-player": "^1.0.0",
-    "@types/intl-tel-input": "^17.0.6",
-    "autoprefixer": "^10.4.21",
-    "dayjs": "^1.11.13",
-    "focus-trap": "^7.6.4",
-    "intl-tel-input": "^18.2.1",
-    "npmrc": "^1.1.1",
-    "postcss": "^8.5.6",
-    "resize-observer-polyfill": "^1.5.1",
-    "swiper": "^9.1.1"
-  },
-  "license": "MIT",
-  "devDependencies": {
-    "@babel/preset-env": "^7.22.4",
-    "@stencil/sass": "^1.4.1",
-    "@storybook/addon-designs": "^7.0.7",
-    "@storybook/addon-essentials": "^7.1.0-alpha.29",
-    "@storybook/addon-links": "^7.1.0-alpha.29",
-    "@storybook/blocks": "^7.1.0-alpha.29",
-    "@storybook/web-components": "^7.1.0-alpha.29",
-    "@storybook/web-components-webpack5": "^7.1.0-alpha.29",
-    "@types/jest": "^27.0.3",
-    "ejs": "^3.1.9",
-    "jest": "^27.4.5",
-    "jest-cli": "^27.4.5",
-    "lit": "^2.7.4",
-    "marked": "^5.1.0",
-    "mobile-select": "^1.1.2",
-    "node-html-parser": "^6.1.5",
-    "prettier": "3.6.2",
-    "puppeteer": "^10.0.0",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "stencil-inline-svg": "^1.1.0",
-    "storybook": "^7.1.0-alpha.29",
-    "tailwindcss": "^3.4.17",
-    "util": "^0.12.5",
-    "yargs": "^17.7.2"
-  },
-  "directories": {
-    "doc": "docs"
-  },
-  "repository": {
-    "type": "git",
-    "url": "git+https://@bitbucket.org/ptc-sitecore-workspace/ptc-design-system.git"
-  },
-  "keywords": [
-    "design system",
-    "web components",
-    "stenciljs"
-  ],
-  "author": "Yunfeng Qian",
-  "homepage": "https://bitbucket.org/ptc-sitecore-workspace/ptc-design-system#readme",
-  "publishConfig": {
-    "registry": "https://registry.npmjs.org/"
-  }
-}
+{
+  "name": "@ptcwebops/ptcw-design",
+  "version": "6.4.22-beta",
+  "description": "Stencil Component Starter",
+  "main": "dist/index.cjs.js",
+  "module": "./dist/index.js",
+  "es2015": "dist/esm/index.mjs",
+  "es2017": "dist/esm/index.mjs",
+  "types": "dist/custom-elements/index.d.ts",
+  "collection": "dist/collection/collection-manifest.json",
+  "collection:main": "dist/collection/index.js",
+  "unpkg": "dist/ptcw-design/ptcw-design.esm.js",
+  "files": [
+    "dist/",
+    "loader/"
+  ],
+  "scripts": {
+    "build": "stencil build --docs",
+    "start": "stencil build --dev --watch --serve",
+    "test": "stencil test --spec --e2e",
+    "test.watch": "stencil test --spec --e2e --watchAll",
+    "test.unit": "stencil test --spec",
+    "test.end-to-end": "stencil test --e2e",
+    "test.unit.watch": "stencil test --spec --watch",
+    "generate": "stencil generate",
+    "prepare": "stencil build --docs",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build",
+    "generate-story": "node scripts/storyGenerator",
+    "generate-unit-tests": "node scripts/unitTestGenerator",
+    "generate-bulk-tests": "node scripts/bulkTestGenerator",
+    "start:tailwind": "npx tailwindcss -i ./src/global/tailwindcss/input.css -o ./src/global/tailwindcss/output.css --watch",
+    "start:tailwind-stencil": "npx tailwindcss -i ./src/global/tailwindcss/input.css -o ./src/global/tailwindcss/output.css && npm run start",
+    "build:tailwind-stencil": "npx tailwindcss -i ./src/global/tailwindcss/input.css -o ./src/global/tailwindcss/output.css --minify && npm run build",
+    "format:prettier": "prettier --write \"src/**/*.{tsx,html,scss}\""
+  },
+  "dependencies": {
+    "@daveberning/griddle": "^0.3.0",
+    "@material/checkbox": "^14.0.0",
+    "@material/form-field": "^14.0.0",
+    "@material/select": "^14.0.0",
+    "@material/textfield": "^14.0.0",
+    "@stencil/core": "^2.20.0",
+    "@stencil/postcss": "^2.1.0",
+    "@teamhive/lottie-player": "^1.0.0",
+    "@types/intl-tel-input": "^17.0.6",
+    "autoprefixer": "^10.4.21",
+    "dayjs": "^1.11.13",
+    "focus-trap": "^7.6.4",
+    "intl-tel-input": "^18.2.1",
+    "npmrc": "^1.1.1",
+    "postcss": "^8.5.6",
+    "resize-observer-polyfill": "^1.5.1",
+    "swiper": "^9.1.1"
+  },
+  "license": "MIT",
+  "devDependencies": {
+    "@babel/preset-env": "^7.22.4",
+    "@stencil/sass": "^1.4.1",
+    "@storybook/addon-designs": "^7.0.7",
+    "@storybook/addon-essentials": "^7.1.0-alpha.29",
+    "@storybook/addon-links": "^7.1.0-alpha.29",
+    "@storybook/blocks": "^7.1.0-alpha.29",
+    "@storybook/web-components": "^7.1.0-alpha.29",
+    "@storybook/web-components-webpack5": "^7.1.0-alpha.29",
+    "@types/jest": "^27.0.3",
+    "ejs": "^3.1.9",
+    "jest": "^27.4.5",
+    "jest-cli": "^27.4.5",
+    "lit": "^2.7.4",
+    "marked": "^5.1.0",
+    "mobile-select": "^1.1.2",
+    "node-html-parser": "^6.1.5",
+    "prettier": "3.6.2",
+    "puppeteer": "^10.0.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "stencil-inline-svg": "^1.1.0",
+    "storybook": "^7.1.0-alpha.29",
+    "tailwindcss": "^3.4.17",
+    "util": "^0.12.5",
+    "yargs": "^17.7.2"
+  },
+  "directories": {
+    "doc": "docs"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://@bitbucket.org/ptc-sitecore-workspace/ptc-design-system.git"
+  },
+  "keywords": [
+    "design system",
+    "web components",
+    "stenciljs"
+  ],
+  "author": "Yunfeng Qian",
+  "homepage": "https://bitbucket.org/ptc-sitecore-workspace/ptc-design-system#readme",
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/"
+  }
+}

package/readme.md

@@ -1,23 +1,23 @@
-![Built With Stencil](https://img.shields.io/badge/-Built%20With%20Stencil-16161d.svg?logo=data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CPD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjIuMSwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCA1MTIgNTEyIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA1MTIgNTEyOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI%2BCjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI%2BCgkuc3Qwe2ZpbGw6I0ZGRkZGRjt9Cjwvc3R5bGU%2BCjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik00MjQuNywzNzMuOWMwLDM3LjYtNTUuMSw2OC42LTkyLjcsNjguNkgxODAuNGMtMzcuOSwwLTkyLjctMzAuNy05Mi43LTY4LjZ2LTMuNmgzMzYuOVYzNzMuOXoiLz4KPHBhdGggY2xhc3M9InN0MCIgZD0iTTQyNC43LDI5Mi4xSDE4MC40Yy0zNy42LDAtOTIuNy0zMS05Mi43LTY4LjZ2LTMuNkgzMzJjMzcuNiwwLDkyLjcsMzEsOTIuNyw2OC42VjI5Mi4xeiIvPgo8cGF0aCBjbGFzcz0ic3QwIiBkPSJNNDI0LjcsMTQxLjdIODcuN3YtMy42YzAtMzcuNiw1NC44LTY4LjYsOTIuNy02OC42SDMzMmMzNy45LDAsOTIuNywzMC43LDkyLjcsNjguNlYxNDEuN3oiLz4KPC9zdmc%2BCg%3D%3D&colorA=16161d&style=flat-square)
-
-# PTC Design 6.4.20-beta
-
-The site is the place for documentation on PTC Design System
-
-## Building the Site
-
-To build the site from the source, ensure you're using the most recent versions of Node and Npm, and pull the latest from master. Next, run `npm install`, `npm run docs` to build the docs files and `npm run start` to launch the site in development mode.
-
-## Project Tools
-
-- stenciljs 2.20.0
-- Node 18.13.0
-- npm 8.19.3
-- jest 27.4.5
-- puppeteer 10.0.0
-
-## License
-
-## Release notes
-
-TODO: figure out how to do release notes with npm
+![Built With Stencil](https://img.shields.io/badge/-Built%20With%20Stencil-16161d.svg?logo=data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CPD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjIuMSwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCA1MTIgNTEyIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA1MTIgNTEyOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI%2BCjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI%2BCgkuc3Qwe2ZpbGw6I0ZGRkZGRjt9Cjwvc3R5bGU%2BCjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik00MjQuNywzNzMuOWMwLDM3LjYtNTUuMSw2OC42LTkyLjcsNjguNkgxODAuNGMtMzcuOSwwLTkyLjctMzAuNy05Mi43LTY4LjZ2LTMuNmgzMzYuOVYzNzMuOXoiLz4KPHBhdGggY2xhc3M9InN0MCIgZD0iTTQyNC43LDI5Mi4xSDE4MC40Yy0zNy42LDAtOTIuNy0zMS05Mi43LTY4LjZ2LTMuNkgzMzJjMzcuNiwwLDkyLjcsMzEsOTIuNyw2OC42VjI5Mi4xeiIvPgo8cGF0aCBjbGFzcz0ic3QwIiBkPSJNNDI0LjcsMTQxLjdIODcuN3YtMy42YzAtMzcuNiw1NC44LTY4LjYsOTIuNy02OC42SDMzMmMzNy45LDAsOTIuNywzMC43LDkyLjcsNjguNlYxNDEuN3oiLz4KPC9zdmc%2BCg%3D%3D&colorA=16161d&style=flat-square)
+
+# PTC Design 6.4.22-beta
+
+The site is the place for documentation on PTC Design System
+
+## Building the Site
+
+To build the site from the source, ensure you're using the most recent versions of Node and Npm, and pull the latest from master. Next, run `npm install`, `npm run docs` to build the docs files and `npm run start` to launch the site in development mode.
+
+## Project Tools
+
+- stenciljs 2.20.0
+- Node 18.13.0
+- npm 8.19.3
+- jest 27.4.5
+- puppeteer 10.0.0
+
+## License
+
+## Release notes
+
+TODO: figure out how to do release notes with npm

package/dist/cjs/ptc-search-field.cjs.entry.js

@@ -1,95 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-63ddc79c.js');
-
-const ptcSearchFieldCss = "h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}:host .search-div{position:relative;display:flex;align-items:stretch;height:51px;border-radius:var(--ptc-border-radius-standard)}:host .search-div:focus-visible{outline:5px solid var(--keyboard-nav-outline) !important;border-radius:var(--ptc-border-radius-standard) !important}:host .search-div .input-wrap{position:relative;width:100%;box-sizing:border-box;display:flex}:host .search-div .input-wrap input{height:100%}:host .search-div input{background-color:var(--color-white);height:-webkit-fill-available;border:0 solid var(--color-gray-12);border-radius:var(--ptc-border-radius-standard) 0 0 var(--ptc-border-radius-standard);flex-grow:2;padding-left:var(--ptc-element-spacing-04);line-height:var(--ptc-line-height-loose);padding-right:54px;width:100%;box-sizing:border-box;margin-right:0px}:host .search-div input:focus-visible{border-radius:var(--ptc-border-radius-standard) 0 0 var(--ptc-border-radius-standard);outline:none}:host .search-div input::-moz-placeholder{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-regular);font-size:var(--ptc-font-size-small);position:relative;top:1px;color:var(--color-gray-10)}:host .search-div input::placeholder{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-regular);font-size:var(--ptc-font-size-small);position:relative;top:1px;color:var(--color-gray-10)}:host .search-div div#searchBtnID{z-index:1}:host .search-div .search-btn{cursor:pointer;height:51px;min-width:51px;border-radius:0 var(--ptc-border-radius-standard) var(--ptc-border-radius-standard) 0;background-color:var(--color-gray-12);border:0 solid var(--color-gray-12);transition:background-color var(--ptc-ease-inout) var(--ptc-transition-medium);margin:0}:host .search-div .search-btn:active{transition:none;background-color:var(--color-black)}:host .search-div .search-btn:hover{background-color:var(--color-gray-10)}:host .search-div .search-btn:focus-visible{z-index:1;border-radius:var(--ptc-border-radius-standard);border:2px solid white;outline:5px solid var(--keyboard-nav-outline)}:host(.dark){z-index:999;position:relative;margin-top:20px}:host(.dark) .search-div{height:43px;width:208px}@media (max-width: 480px){:host(.dark) .search-div{width:100%}}@media only screen and (min-width: 992px){:host(.dark) .search-div{width:246px}}:host(.dark) .search-div input{background-color:var(--color-gray-12);border:1px solid var(--color-gray-08);color:var(--color-white);padding-left:unset;text-indent:var(--ptc-element-spacing-04);padding-right:2px}:host(.dark) .search-div input::-moz-placeholder{color:var(--color-white);font-size:var(--ptc-font-size-x-small)}:host(.dark) .search-div input::placeholder{color:var(--color-white);font-size:var(--ptc-font-size-x-small)}:host(.dark) .search-div .search-btn{height:43px;width:43px;background-color:var(--color-gray-10);border:1px solid var(--color-gray-08);border-left:0}:host(.dark) .search-div .search-btn:hover{background-color:var(--color-gray-08)}:host(.news){z-index:999;position:relative;margin-top:20px}:host(.news) .search-div{height:43px}@media (max-width: 480px){:host(.news) .search-div{width:100%}}@media only screen and (min-width: 992px){:host(.news) .search-div{width:246px}}:host(.news) .search-div .search-btn{height:43px}:host(.x-small) .search-div{box-shadow:var(--ptc-shadow-x-small)}:host(.small) .search-div{box-shadow:var(--ptc-shadow-small)}:host(.medium) .search-div{box-shadow:var(--ptc-shadow-medium)}:host(.large) .search-div{box-shadow:var(--ptc-shadow-large)}:host(.x-large) .search-div{box-shadow:var(--ptc-shadow-x-large)}@media (max-width: 480px){input{width:75%}}.icon-wrapper{padding:16px 20px 0;background-color:transparent;position:absolute;right:0;top:-2px;height:100%;box-sizing:border-box}.icon-wrapper .cls{cursor:pointer;display:block}:host(.dark) .icon-wrapper{padding:12px 20px 0;background-color:var(--color-gray-12);border:1px solid var(--color-gray-08);border-left-width:0;position:initial;right:auto;top:auto}:host(.dark):host(.enable-clear) input{border-right-width:0}@media only screen and (min-width: 992px){.cls{display:none}}.tracker-div{display:inline}";
-
-const PtcSearchField = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.valueChanged = index.createEvent(this, "valueChanged", 7);
-    this.clicked = index.createEvent(this, "clicked", 7);
-    this.textValue = undefined;
-    this.placeholderLabel = undefined;
-    this.darkTheme = undefined;
-    this.isNews = undefined;
-    this.elevation = "small";
-    this.enableClear = false;
-    this.styles = undefined;
-  }
-  textChangedHandler(event) {
-    this.valueChanged.emit({
-      sender: this,
-      event: event,
-      searchTerm: this.getSearchValue(),
-    });
-  }
-  buttonClickHandler(event) {
-    this.clicked.emit({
-      sender: this,
-      event: event,
-      searchTerm: this.getSearchValue(),
-    });
-  }
-  keyDownHandler(event) {
-    if (event.key == "Enter") {
-      this.clicked.emit({
-        sender: this,
-        event: event,
-        searchTerm: this.getSearchValue(),
-      });
-    }
-    if (this.getSearchValue() && this.enableClear) ;
-  }
-  keyUpHandler() {
-    if (!this.darkTheme) {
-      this.enableClear = !(this.getSearchValue() == "");
-    }
-  }
-  getSearchValue() {
-    let result = "";
-    let input = this.el.shadowRoot.querySelector("input");
-    if (input) {
-      result = input.value;
-    }
-    return result;
-  }
-  async clearSearchValue() {
-    this.textValue = "";
-    let input = this.el.shadowRoot.querySelector("input");
-    if (input) {
-      input.value = "";
-      this.enableClear = false;
-    }
-  }
-  render() {
-    const classMap = this.getCssClassMap();
-    const clearIconColor = this.darkTheme ? "white" : "black";
-    return (index.h(index.Host, { class: classMap }, this.styles && index.h("style", null, this.styles), index.h("div", { class: "search-div" }, index.h("div", { class: "input-wrap mf-listen", id: "searchTextID" }, index.h("input", { id: "ptc-search-input", type: "text", value: this.textValue, placeholder: this.placeholderLabel, onKeyDown: (e) => {
-        this.keyDownHandler(e);
-      }, onKeyUp: () => {
-        this.keyUpHandler();
-      }, onChange: (e) => {
-        this.textChangedHandler(e);
-      } }), this.enableClear && (index.h("div", { class: "icon-wrapper" }, index.h("icon-asset", { class: "cls", type: "ptc", color: clearIconColor, name: "times", size: "xxx-small", onClick: (e) => {
-        this.clearSearchValue();
-        this.buttonClickHandler(e);
-      } })))), index.h("div", { class: "tracker-div mf-listen", id: "searchBtnID" }, index.h("button", { type: "button", color: "blackgrey", class: "search-btn", onClick: (e) => {
-        this.buttonClickHandler(e);
-      } }, index.h("icon-asset", { type: "ptc", size: "medium", name: "new-search", color: "white" }))))));
-  }
-  getCssClassMap() {
-    return {
-      ["dark"]: this.darkTheme ? true : false,
-      [this.elevation]: true,
-      ["enable-clear"]: this.enableClear,
-      ["news"]: this.isNews ? true : false,
-    };
-  }
-  get el() { return index.getElement(this); }
-};
-PtcSearchField.style = ptcSearchFieldCss;
-
-exports.ptc_search_field = PtcSearchField;

package/dist/esm/ptc-search-field.entry.js

@@ -1,91 +0,0 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-c83db688.js';
-
-const ptcSearchFieldCss = "h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}:host .search-div{position:relative;display:flex;align-items:stretch;height:51px;border-radius:var(--ptc-border-radius-standard)}:host .search-div:focus-visible{outline:5px solid var(--keyboard-nav-outline) !important;border-radius:var(--ptc-border-radius-standard) !important}:host .search-div .input-wrap{position:relative;width:100%;box-sizing:border-box;display:flex}:host .search-div .input-wrap input{height:100%}:host .search-div input{background-color:var(--color-white);height:-webkit-fill-available;border:0 solid var(--color-gray-12);border-radius:var(--ptc-border-radius-standard) 0 0 var(--ptc-border-radius-standard);flex-grow:2;padding-left:var(--ptc-element-spacing-04);line-height:var(--ptc-line-height-loose);padding-right:54px;width:100%;box-sizing:border-box;margin-right:0px}:host .search-div input:focus-visible{border-radius:var(--ptc-border-radius-standard) 0 0 var(--ptc-border-radius-standard);outline:none}:host .search-div input::-moz-placeholder{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-regular);font-size:var(--ptc-font-size-small);position:relative;top:1px;color:var(--color-gray-10)}:host .search-div input::placeholder{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);font-weight:var(--ptc-font-weight-regular);font-size:var(--ptc-font-size-small);position:relative;top:1px;color:var(--color-gray-10)}:host .search-div div#searchBtnID{z-index:1}:host .search-div .search-btn{cursor:pointer;height:51px;min-width:51px;border-radius:0 var(--ptc-border-radius-standard) var(--ptc-border-radius-standard) 0;background-color:var(--color-gray-12);border:0 solid var(--color-gray-12);transition:background-color var(--ptc-ease-inout) var(--ptc-transition-medium);margin:0}:host .search-div .search-btn:active{transition:none;background-color:var(--color-black)}:host .search-div .search-btn:hover{background-color:var(--color-gray-10)}:host .search-div .search-btn:focus-visible{z-index:1;border-radius:var(--ptc-border-radius-standard);border:2px solid white;outline:5px solid var(--keyboard-nav-outline)}:host(.dark){z-index:999;position:relative;margin-top:20px}:host(.dark) .search-div{height:43px;width:208px}@media (max-width: 480px){:host(.dark) .search-div{width:100%}}@media only screen and (min-width: 992px){:host(.dark) .search-div{width:246px}}:host(.dark) .search-div input{background-color:var(--color-gray-12);border:1px solid var(--color-gray-08);color:var(--color-white);padding-left:unset;text-indent:var(--ptc-element-spacing-04);padding-right:2px}:host(.dark) .search-div input::-moz-placeholder{color:var(--color-white);font-size:var(--ptc-font-size-x-small)}:host(.dark) .search-div input::placeholder{color:var(--color-white);font-size:var(--ptc-font-size-x-small)}:host(.dark) .search-div .search-btn{height:43px;width:43px;background-color:var(--color-gray-10);border:1px solid var(--color-gray-08);border-left:0}:host(.dark) .search-div .search-btn:hover{background-color:var(--color-gray-08)}:host(.news){z-index:999;position:relative;margin-top:20px}:host(.news) .search-div{height:43px}@media (max-width: 480px){:host(.news) .search-div{width:100%}}@media only screen and (min-width: 992px){:host(.news) .search-div{width:246px}}:host(.news) .search-div .search-btn{height:43px}:host(.x-small) .search-div{box-shadow:var(--ptc-shadow-x-small)}:host(.small) .search-div{box-shadow:var(--ptc-shadow-small)}:host(.medium) .search-div{box-shadow:var(--ptc-shadow-medium)}:host(.large) .search-div{box-shadow:var(--ptc-shadow-large)}:host(.x-large) .search-div{box-shadow:var(--ptc-shadow-x-large)}@media (max-width: 480px){input{width:75%}}.icon-wrapper{padding:16px 20px 0;background-color:transparent;position:absolute;right:0;top:-2px;height:100%;box-sizing:border-box}.icon-wrapper .cls{cursor:pointer;display:block}:host(.dark) .icon-wrapper{padding:12px 20px 0;background-color:var(--color-gray-12);border:1px solid var(--color-gray-08);border-left-width:0;position:initial;right:auto;top:auto}:host(.dark):host(.enable-clear) input{border-right-width:0}@media only screen and (min-width: 992px){.cls{display:none}}.tracker-div{display:inline}";
-
-const PtcSearchField = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.valueChanged = createEvent(this, "valueChanged", 7);
-    this.clicked = createEvent(this, "clicked", 7);
-    this.textValue = undefined;
-    this.placeholderLabel = undefined;
-    this.darkTheme = undefined;
-    this.isNews = undefined;
-    this.elevation = "small";
-    this.enableClear = false;
-    this.styles = undefined;
-  }
-  textChangedHandler(event) {
-    this.valueChanged.emit({
-      sender: this,
-      event: event,
-      searchTerm: this.getSearchValue(),
-    });
-  }
-  buttonClickHandler(event) {
-    this.clicked.emit({
-      sender: this,
-      event: event,
-      searchTerm: this.getSearchValue(),
-    });
-  }
-  keyDownHandler(event) {
-    if (event.key == "Enter") {
-      this.clicked.emit({
-        sender: this,
-        event: event,
-        searchTerm: this.getSearchValue(),
-      });
-    }
-    if (this.getSearchValue() && this.enableClear) ;
-  }
-  keyUpHandler() {
-    if (!this.darkTheme) {
-      this.enableClear = !(this.getSearchValue() == "");
-    }
-  }
-  getSearchValue() {
-    let result = "";
-    let input = this.el.shadowRoot.querySelector("input");
-    if (input) {
-      result = input.value;
-    }
-    return result;
-  }
-  async clearSearchValue() {
-    this.textValue = "";
-    let input = this.el.shadowRoot.querySelector("input");
-    if (input) {
-      input.value = "";
-      this.enableClear = false;
-    }
-  }
-  render() {
-    const classMap = this.getCssClassMap();
-    const clearIconColor = this.darkTheme ? "white" : "black";
-    return (h(Host, { class: classMap }, this.styles && h("style", null, this.styles), h("div", { class: "search-div" }, h("div", { class: "input-wrap mf-listen", id: "searchTextID" }, h("input", { id: "ptc-search-input", type: "text", value: this.textValue, placeholder: this.placeholderLabel, onKeyDown: (e) => {
-        this.keyDownHandler(e);
-      }, onKeyUp: () => {
-        this.keyUpHandler();
-      }, onChange: (e) => {
-        this.textChangedHandler(e);
-      } }), this.enableClear && (h("div", { class: "icon-wrapper" }, h("icon-asset", { class: "cls", type: "ptc", color: clearIconColor, name: "times", size: "xxx-small", onClick: (e) => {
-        this.clearSearchValue();
-        this.buttonClickHandler(e);
-      } })))), h("div", { class: "tracker-div mf-listen", id: "searchBtnID" }, h("button", { type: "button", color: "blackgrey", class: "search-btn", onClick: (e) => {
-        this.buttonClickHandler(e);
-      } }, h("icon-asset", { type: "ptc", size: "medium", name: "new-search", color: "white" }))))));
-  }
-  getCssClassMap() {
-    return {
-      ["dark"]: this.darkTheme ? true : false,
-      [this.elevation]: true,
-      ["enable-clear"]: this.enableClear,
-      ["news"]: this.isNews ? true : false,
-    };
-  }
-  get el() { return getElement(this); }
-};
-PtcSearchField.style = ptcSearchFieldCss;
-
-export { PtcSearchField as ptc_search_field };