diff --git a/bootstrap/_reboot.scss b/bootstrap/_reboot.scss index f5edd0b11e..79fedc6cad 100644 --- a/bootstrap/_reboot.scss +++ b/bootstrap/_reboot.scss @@ -1,5 +1,6 @@ // stylelint-disable declaration-no-important, selector-no-qualifying-type, property-no-vendor-prefix + // Reboot // // Normalization of HTML elements, manually forked from Normalize.css to remove @@ -7,6 +8,7 @@ // // Normalize is licensed MIT. https://github.com/necolas/normalize.css + // Document // // Change from `box-sizing: content-box` so that `width` is not affected by `padding` or `border`. @@ -17,12 +19,13 @@ box-sizing: border-box; } + // Root // // Ability to the value of the root font sizes, affecting the value of `rem`. // null by default, thus nothing is generated. -:host { +:root { @if $font-size-root != null { font-size: var(--#{$variable-prefix}root-font-size); } @@ -34,6 +37,7 @@ } } + // Body // // 1. Remove the margin in all browsers. @@ -56,6 +60,7 @@ body { } // scss-docs-end reboot-body-rules + // Content grouping // // 1. Reset Firefox's gray color @@ -73,6 +78,7 @@ hr:not([size]) { height: $hr-height; // 2 } + // Typography // // 1. Remove top margins from headings @@ -119,6 +125,7 @@ h6 { @include font-size($h6-font-size); } + // Reset margins on paragraphs // // Similarly, the top margin on `

`s get reset. However, we also reset the @@ -129,6 +136,7 @@ p { margin-bottom: $paragraph-margin-bottom; } + // Abbreviations // // 1. Duplicate behavior to the data-bs-* attribute for our tooltip plugin @@ -137,13 +145,13 @@ p { // 4. Prevent the text-decoration to be skipped. abbr[title], -abbr[data-bs-original-title] { - // 1 +abbr[data-bs-original-title] { // 1 text-decoration: underline dotted; // 2 cursor: help; // 3 text-decoration-skip-ink: none; // 4 } + // Address address { @@ -152,6 +160,7 @@ address { line-height: inherit; } + // Lists ol, @@ -180,16 +189,18 @@ dt { // 1. Undo browser default dd { - margin-bottom: 0.5rem; + margin-bottom: .5rem; margin-left: 0; // 1 } + // Blockquote blockquote { margin: 0 0 1rem; } + // Strong // // Add the correct font weight in Chrome, Edge, and Safari @@ -199,6 +210,7 @@ strong { font-weight: $font-weight-bolder; } + // Small // // Add the correct font size in all browsers @@ -207,6 +219,7 @@ small { @include font-size($small-font-size); } + // Mark mark { @@ -214,6 +227,7 @@ mark { background-color: $mark-bg; } + // Sub and Sup // // Prevent `sub` and `sup` elements from affecting the line height in @@ -227,12 +241,9 @@ sup { vertical-align: baseline; } -sub { - bottom: -0.25em; -} -sup { - top: -0.5em; -} +sub { bottom: -.25em; } +sup { top: -.5em; } + // Links @@ -259,6 +270,7 @@ a:not([href]):not([class]) { } } + // Code pre, @@ -316,6 +328,7 @@ kbd { } } + // Figures // // Apply a consistent margin strategy (matches our type styles). @@ -324,6 +337,7 @@ figure { margin: 0 0 1rem; } + // Images and content img, @@ -331,6 +345,7 @@ svg { vertical-align: middle; } + // Tables // // Prevent double borders @@ -368,6 +383,7 @@ th { border-width: 0; } + // Forms // // 1. Allow labels to use `margin` for spacing. @@ -554,6 +570,7 @@ legend { padding: 0; } + // Inherit font family and line height for file input buttons ::file-selector-button { @@ -589,6 +606,7 @@ summary { cursor: pointer; } + // Progress // // Add the correct vertical alignment in Chrome, Firefox, and Opera. @@ -597,6 +615,7 @@ progress { vertical-align: baseline; } + // Hidden attribute // // Always hide an element with the `hidden` HTML attribute. diff --git a/bootstrap/_root.scss b/bootstrap/_root.scss index c52c74cbf7..5e138e97b4 100644 --- a/bootstrap/_root.scss +++ b/bootstrap/_root.scss @@ -1,4 +1,4 @@ -:host { +:root { // Note: Custom variable values only support SassScript inside `#{}`. // Colors diff --git a/package-lock.json b/package-lock.json index 8a7c3752e4..3584423eae 100644 --- a/package-lock.json +++ b/package-lock.json @@ -6,6 +6,8 @@ "": { "name": "root", "dependencies": { + "@google-pay/button-element": "^3.0.0", + "@paypal/paypal-js": "^5.0.1", "@rollup/plugin-alias": "^3.1.2", "@rollup/plugin-commonjs": "^18.0.0", "@rollup/plugin-json": "^4.1.0", @@ -207,6 +209,17 @@ "integrity": "sha512-82cpyJyKRoQoRi+14ibCeGPu0CwypgtBAdBhq1WfvagpCZNKqwXbKwXllYSMG91DhmG4jt9gN8eP6lGOtozuaw==", "dev": true }, + "node_modules/@google-pay/button-element": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/@google-pay/button-element/-/button-element-3.0.0.tgz", + "integrity": "sha512-+ycUj6o0CaO7ONziaJRcljeNxMZCNgW1SOCLt+4xUbMCjcqgcb3V+PZvOqy5V5d8c5XS+nAOcrfHV/0Yo62JJA==", + "dependencies": { + "@types/googlepay": "^0.6.3" + }, + "engines": { + "node": ">=8.0.0" + } + }, "node_modules/@humanwhocodes/config-array": { "version": "0.5.0", "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.5.0.tgz", @@ -1537,6 +1550,14 @@ "@octokit/openapi-types": "^11.2.0" } }, + "node_modules/@paypal/paypal-js": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/@paypal/paypal-js/-/paypal-js-5.0.1.tgz", + "integrity": "sha512-qm17kEm/5w6B3AOx95YWFCb167OVis0/CBqDRQNQUBmDjqEe15qxk3U8LLxKeVvIyij5agx4gAyVcwkd8f6nVA==", + "dependencies": { + "promise-polyfill": "^8.2.1" + } + }, "node_modules/@petamoriken/float16": { "version": "3.6.1", "resolved": "https://registry.npmjs.org/@petamoriken/float16/-/float16-3.6.1.tgz", @@ -1705,6 +1726,11 @@ "@types/node": "*" } }, + "node_modules/@types/googlepay": { + "version": "0.6.3", + "resolved": "https://registry.npmjs.org/@types/googlepay/-/googlepay-0.6.3.tgz", + "integrity": "sha512-mA9d9UoSAKbfcP3xYvTtpyBTxFytu1bwjquy8oZdZPG8z0xnfQwtmTI4F44ptyz8OBWiCmvBj8QR0Rb2D/hQXg==" + }, "node_modules/@types/json-schema": { "version": "7.0.9", "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.9.tgz", @@ -7437,6 +7463,11 @@ "integrity": "sha1-mEcocL8igTL8vdhoEputEsPAKeM=", "dev": true }, + "node_modules/promise-polyfill": { + "version": "8.2.1", + "resolved": "https://registry.npmjs.org/promise-polyfill/-/promise-polyfill-8.2.1.tgz", + "integrity": "sha512-3p9zj0cEHbp7NVUxEYUWjQlffXqnXaZIMPkAO7HhFh8u5636xLRDHOUo2vpWSK0T2mqm6fKLXYn1KP6PAZ2gKg==" + }, "node_modules/promise-retry": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/promise-retry/-/promise-retry-2.0.1.tgz", @@ -10484,6 +10515,14 @@ "integrity": "sha512-82cpyJyKRoQoRi+14ibCeGPu0CwypgtBAdBhq1WfvagpCZNKqwXbKwXllYSMG91DhmG4jt9gN8eP6lGOtozuaw==", "dev": true }, + "@google-pay/button-element": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/@google-pay/button-element/-/button-element-3.0.0.tgz", + "integrity": "sha512-+ycUj6o0CaO7ONziaJRcljeNxMZCNgW1SOCLt+4xUbMCjcqgcb3V+PZvOqy5V5d8c5XS+nAOcrfHV/0Yo62JJA==", + "requires": { + "@types/googlepay": "^0.6.3" + } + }, "@humanwhocodes/config-array": { "version": "0.5.0", "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.5.0.tgz", @@ -11583,6 +11622,14 @@ "@octokit/openapi-types": "^11.2.0" } }, + "@paypal/paypal-js": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/@paypal/paypal-js/-/paypal-js-5.0.1.tgz", + "integrity": "sha512-qm17kEm/5w6B3AOx95YWFCb167OVis0/CBqDRQNQUBmDjqEe15qxk3U8LLxKeVvIyij5agx4gAyVcwkd8f6nVA==", + "requires": { + "promise-polyfill": "^8.2.1" + } + }, "@petamoriken/float16": { "version": "3.6.1", "resolved": "https://registry.npmjs.org/@petamoriken/float16/-/float16-3.6.1.tgz", @@ -11710,6 +11757,11 @@ "@types/node": "*" } }, + "@types/googlepay": { + "version": "0.6.3", + "resolved": "https://registry.npmjs.org/@types/googlepay/-/googlepay-0.6.3.tgz", + "integrity": "sha512-mA9d9UoSAKbfcP3xYvTtpyBTxFytu1bwjquy8oZdZPG8z0xnfQwtmTI4F44ptyz8OBWiCmvBj8QR0Rb2D/hQXg==" + }, "@types/json-schema": { "version": "7.0.9", "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.9.tgz", @@ -16063,6 +16115,11 @@ "integrity": "sha1-mEcocL8igTL8vdhoEputEsPAKeM=", "dev": true }, + "promise-polyfill": { + "version": "8.2.1", + "resolved": "https://registry.npmjs.org/promise-polyfill/-/promise-polyfill-8.2.1.tgz", + "integrity": "sha512-3p9zj0cEHbp7NVUxEYUWjQlffXqnXaZIMPkAO7HhFh8u5636xLRDHOUo2vpWSK0T2mqm6fKLXYn1KP6PAZ2gKg==" + }, "promise-retry": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/promise-retry/-/promise-retry-2.0.1.tgz", diff --git a/packages/toast/app/html/webcomponent.svelte b/packages/toast/app/html/webcomponent.svelte index 620467dd9d..3df4ebc157 100644 --- a/packages/toast/app/html/webcomponent.svelte +++ b/packages/toast/app/html/webcomponent.svelte @@ -15,12 +15,26 @@ // import { fade, fly } from "svelte/transition"; // import { quintOut } from "svelte/easing"; - export let id: string; - export let show: "yes" | "no"; - export let title: string; - export let img: string; - export let small: string; - export let content: string; + export let id: string = ""; + export let show: "yes" | "no" = "yes"; + export let role: "" | "alert" | "status" = undefined; + // svelte-ignore unused-export-let + export let live: "" | "off" | "polite" | "assertive" = undefined; + // svelte-ignore unused-export-let + export let atomic: "" | "true" | "false" = undefined; + // svelte-ignore unused-export-let + export let autohide: "" | "true" | "false" = undefined; + // svelte-ignore unused-export-let + export let delay: number = 5000; + export let header_strong: string = undefined; + export let header_img: string = undefined; + export let header_small: string = undefined; + export let body: string = undefined; + export let toast_class: string = ""; + export let btn_close_class: string = ""; + export let custom_content: string = ""; + let isHeaderExists: boolean = false; + let timer; $: { if (!id) id = ""; @@ -83,35 +97,90 @@ // } // Watching changes for Open vairable $: { - if (!content) content = ""; - if (!small) small = ""; - if (!title) title = ""; - if (!img) img = ""; + isHeaderExists = !(!header_img && !header_strong && !header_small && !$$slots.header_img && !$$slots.header_strong && !$$slots.header_small); + if (show === "yes") { + timer = setTimeout(function () { + close(); + }, delay); + } + + if (autohide === "false") { + clearTimeout(timer); + } } {#if show === "yes"} -