@scouterna/ui-webc 3.0.0 → 3.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/{index-Ce767IpB.js → index-BPpKjjvS.js} +3 -0
- package/dist/cjs/{inputMixin-C0BVMAoq.js → inputMixin-D0IzcaXz.js} +1 -1
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/scout-app-bar.cjs.entry.js +1 -1
- package/dist/cjs/scout-bottom-bar-item.cjs.entry.js +1 -1
- package/dist/cjs/scout-bottom-bar.cjs.entry.js +1 -1
- package/dist/cjs/scout-button.cjs.entry.js +1 -1
- package/dist/cjs/scout-card.cjs.entry.js +1 -1
- package/dist/cjs/scout-checkbox_2.cjs.entry.js +2 -2
- package/dist/cjs/scout-divider.cjs.entry.js +1 -1
- package/dist/cjs/scout-field.cjs.entry.js +1 -1
- package/dist/cjs/scout-input.cjs.entry.js +2 -2
- package/dist/cjs/scout-link.cjs.entry.js +1 -1
- package/dist/cjs/scout-list-view-item.cjs.entry.js +13 -2
- package/dist/cjs/scout-list-view-subheader.cjs.entry.js +1 -1
- package/dist/cjs/scout-list-view.cjs.entry.js +1 -1
- package/dist/cjs/scout-loader.cjs.entry.js +1 -1
- package/dist/cjs/scout-select.cjs.entry.js +2 -2
- package/dist/cjs/scout-stack.cjs.entry.js +1 -1
- package/dist/cjs/scout-switch.cjs.entry.js +2 -2
- package/dist/cjs/scout-tabs-tab.cjs.entry.js +18 -0
- package/dist/cjs/scout-tabs.cjs.entry.js +74 -0
- package/dist/cjs/ui-webc.cjs.js +2 -2
- package/dist/collection/collection-manifest.json +3 -1
- package/dist/collection/components/list-view-item/list-view-item.js +37 -1
- package/dist/collection/components/tabs/tabs.css +17 -0
- package/dist/collection/components/tabs/tabs.js +142 -0
- package/dist/collection/components/tabs-tab/tabs-tab.css +44 -0
- package/dist/collection/components/tabs-tab/tabs-tab.js +19 -0
- package/dist/components/index.js +1 -1
- package/dist/components/{p-6CRt7yuE.js → p-CXXyN7aY.js} +1 -1
- package/dist/components/{p-CoqVDaml.js → p-CYcNS38J.js} +1 -1
- package/dist/components/p-CpD1flSg.js +1 -0
- package/dist/components/{p-CtQG_9wf.js → p-a16hBieR.js} +1 -1
- package/dist/components/scout-app-bar.js +1 -1
- package/dist/components/scout-bottom-bar-item.js +1 -1
- package/dist/components/scout-bottom-bar.js +1 -1
- package/dist/components/scout-button.js +1 -1
- package/dist/components/scout-card.js +1 -1
- package/dist/components/scout-checkbox.js +1 -1
- package/dist/components/scout-divider.js +1 -1
- package/dist/components/scout-field.js +1 -1
- package/dist/components/scout-input.js +1 -1
- package/dist/components/scout-link.js +1 -1
- package/dist/components/scout-list-view-item.js +1 -1
- package/dist/components/scout-list-view-subheader.js +1 -1
- package/dist/components/scout-list-view.js +1 -1
- package/dist/components/scout-loader.js +1 -1
- package/dist/components/scout-radio-button.js +1 -1
- package/dist/components/scout-select.js +1 -1
- package/dist/components/scout-stack.js +1 -1
- package/dist/components/scout-switch.js +1 -1
- package/dist/components/scout-tabs-tab.d.ts +11 -0
- package/dist/components/scout-tabs-tab.js +1 -0
- package/dist/components/scout-tabs.d.ts +11 -0
- package/dist/components/scout-tabs.js +1 -0
- package/dist/custom-elements.json +131 -1
- package/dist/esm/{index-oi0_K_Yh.js → index-CBq_WkdR.js} +3 -0
- package/dist/esm/{inputMixin-DcoTF4zg.js → inputMixin-CArDsEiI.js} +1 -1
- package/dist/esm/loader.js +3 -3
- package/dist/esm/scout-app-bar.entry.js +1 -1
- package/dist/esm/scout-bottom-bar-item.entry.js +1 -1
- package/dist/esm/scout-bottom-bar.entry.js +1 -1
- package/dist/esm/scout-button.entry.js +1 -1
- package/dist/esm/scout-card.entry.js +1 -1
- package/dist/esm/scout-checkbox_2.entry.js +2 -2
- package/dist/esm/scout-divider.entry.js +1 -1
- package/dist/esm/scout-field.entry.js +1 -1
- package/dist/esm/scout-input.entry.js +2 -2
- package/dist/esm/scout-link.entry.js +1 -1
- package/dist/esm/scout-list-view-item.entry.js +13 -2
- package/dist/esm/scout-list-view-subheader.entry.js +1 -1
- package/dist/esm/scout-list-view.entry.js +1 -1
- package/dist/esm/scout-loader.entry.js +1 -1
- package/dist/esm/scout-select.entry.js +2 -2
- package/dist/esm/scout-stack.entry.js +1 -1
- package/dist/esm/scout-switch.entry.js +2 -2
- package/dist/esm/scout-tabs-tab.entry.js +16 -0
- package/dist/esm/scout-tabs.entry.js +72 -0
- package/dist/esm/ui-webc.js +3 -3
- package/dist/types/components/list-view-item/list-view-item.d.ts +7 -0
- package/dist/types/components/tabs/tabs.d.ts +31 -0
- package/dist/types/components/tabs-tab/tabs-tab.d.ts +3 -0
- package/dist/types/components.d.ts +95 -2
- package/dist/ui-webc/p-0e444b1f.entry.js +1 -0
- package/dist/ui-webc/{p-f950e96f.entry.js → p-189879c2.entry.js} +1 -1
- package/dist/ui-webc/p-60cd6c7e.entry.js +1 -0
- package/dist/ui-webc/{p-2c6e4b7d.entry.js → p-6287efe7.entry.js} +1 -1
- package/dist/ui-webc/{p-4aaacbd0.entry.js → p-6825e415.entry.js} +1 -1
- package/dist/ui-webc/{p-D1IdWeS2.js → p-6xDaXBJm.js} +1 -1
- package/dist/ui-webc/{p-46b60b66.entry.js → p-78126f74.entry.js} +1 -1
- package/dist/ui-webc/{p-48c5903e.entry.js → p-8f5965aa.entry.js} +1 -1
- package/dist/ui-webc/{p-oi0_K_Yh.js → p-CBq_WkdR.js} +2 -2
- package/dist/ui-webc/{p-0719ebb3.entry.js → p-a153023c.entry.js} +1 -1
- package/dist/ui-webc/{p-9ddc49ea.entry.js → p-a2c09e05.entry.js} +1 -1
- package/dist/ui-webc/{p-c6ba8ea7.entry.js → p-b699617e.entry.js} +1 -1
- package/dist/ui-webc/{p-82967f79.entry.js → p-c0696c1f.entry.js} +1 -1
- package/dist/ui-webc/{p-0dfc0d2d.entry.js → p-c4f7cfa2.entry.js} +1 -1
- package/dist/ui-webc/{p-e4afe429.entry.js → p-cdc127de.entry.js} +1 -1
- package/dist/ui-webc/p-db40c987.entry.js +1 -0
- package/dist/ui-webc/{p-b12d091a.entry.js → p-f799b2d8.entry.js} +1 -1
- package/dist/ui-webc/{p-a89ea43b.entry.js → p-f8099e5b.entry.js} +1 -1
- package/dist/ui-webc/{p-9a3bea26.entry.js → p-f8a4ef3d.entry.js} +1 -1
- package/dist/ui-webc/p-fe2020a1.entry.js +1 -0
- package/dist/ui-webc/{p-565fedf0.entry.js → p-ff537388.entry.js} +1 -1
- package/dist/ui-webc/ui-webc.esm.js +1 -1
- package/package.json +1 -1
- package/dist/components/p-Dx5d3FdC.js +0 -1
- package/dist/ui-webc/p-110bba25.entry.js +0 -1
- package/dist/ui-webc/p-85619324.entry.js +0 -1
|
@@ -2275,6 +2275,9 @@ var parsePropertyValue = (propValue, propType, isFormAssociated) => {
|
|
|
2275
2275
|
return propValue === "false" ? false : propValue === "" || !!propValue;
|
|
2276
2276
|
}
|
|
2277
2277
|
}
|
|
2278
|
+
if (propType & 2 /* Number */) {
|
|
2279
|
+
return typeof propValue === "string" ? parseFloat(propValue) : typeof propValue === "number" ? propValue : NaN;
|
|
2280
|
+
}
|
|
2278
2281
|
if (propType & 1 /* String */) {
|
|
2279
2282
|
return String(propValue);
|
|
2280
2283
|
}
|
package/dist/cjs/loader.cjs.js
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-BPpKjjvS.js');
|
|
4
4
|
|
|
5
5
|
const defineCustomElements = async (win, options) => {
|
|
6
6
|
if (typeof window === 'undefined') return undefined;
|
|
7
7
|
await index.globalScripts();
|
|
8
|
-
return index.bootstrapLazy([["scout-list-view-item.cjs",[[529,"scout-list-view-item",{"icon":[1],"primary":[1],"secondary":[1],"type":[1],"href":[1],"target":[1],"rel":[1],"name":[1],"value":[1],"checked":[4],"disabled":[4]}]]],["scout-app-bar.cjs",[[785,"scout-app-bar",{"titleText":[1,"title-text"]}]]],["scout-bottom-bar.cjs",[[273,"scout-bottom-bar"]]],["scout-bottom-bar-item.cjs",[[529,"scout-bottom-bar-item",{"type":[1],"href":[1],"target":[1],"rel":[1],"icon":[1],"label":[1],"active":[4]}]]],["scout-button.cjs",[[772,"scout-button",{"type":[1],"href":[1],"target":[1],"rel":[1],"size":[1],"variant":[1],"icon":[1],"iconPosition":[1,"icon-position"],"iconOnly":[4,"icon-only"]}]]],["scout-card.cjs",[[273,"scout-card"]]],["scout-divider.cjs",[[17,"scout-divider"]]],["scout-field.cjs",[[774,"scout-field",{"label":[1],"helpText":[1,"help-text"],"inputId":[32],"errorText":[32],"errorHidden":[32]},[[0,"_scoutFieldId","catchFieldId"],[0,"_scoutValidityChanged","handleValidation"],[0,"scoutBlur","showError"],[0,"_scoutInvalid","showError"]]]]],["scout-input.cjs",[[514,"scout-input",{"validity":[1],"size":[1],"variant":[1],"type":[1],"inputmode":[1],"pattern":[1],"value":[1],"name":[1],"disabled":[4],"placeholder":[1],"ariaId":[32]},null,{"validity":[{"runValidation":0}]}]]],["scout-link.cjs",[[529,"scout-link",{"href":[1],"label":[1],"rel":[1],"linkAriaLabel":[1,"link-aria-label"],"type":[1],"target":[1]}]]],["scout-list-view.cjs",[[273,"scout-list-view",null,[[0,"scoutChecked","onScoutChecked"]]]]],["scout-list-view-subheader.cjs",[[529,"scout-list-view-subheader",{"text":[1],"headingLevel":[1,"heading-level"]}]]],["scout-loader.cjs",[[513,"scout-loader",{"text":[1],"size":[1]}]]],["scout-select.cjs",[[774,"scout-select",{"validity":[1],"value":[1],"disabled":[4],"name":[1],"ariaId":[32]},null,{"validity":[{"runValidation":0}]}]]],["scout-stack.cjs",[[785,"scout-stack",{"direction":[1],"gapSize":[1,"gap-size"]}]]],["scout-switch.cjs",[[529,"scout-switch",{"validity":[1],"toggled":[4],"disabled":[4],"ariaLabelledby":[1,"aria-labelledby"],"label":[1],"ariaId":[32]},null,{"validity":[{"runValidation":0}]}]]],["scout-checkbox_2.cjs",[[514,"scout-checkbox",{"validity":[1],"checked":[4],"disabled":[4],"ariaLabelledby":[1,"aria-labelledby"],"label":[1],"value":[1],"name":[1],"ariaId":[32]},null,{"validity":[{"runValidation":0}]}],[514,"scout-radio-button",{"validity":[1],"checked":[4],"disabled":[4],"ariaLabelledby":[1,"aria-labelledby"],"label":[1],"value":[1],"name":[1],"ariaId":[32]},null,{"validity":[{"runValidation":0}]}]]]], options);
|
|
8
|
+
return index.bootstrapLazy([["scout-list-view-item.cjs",[[529,"scout-list-view-item",{"icon":[1],"primary":[1],"secondary":[1],"type":[1],"action":[1],"href":[1],"target":[1],"rel":[1],"name":[1],"value":[1],"checked":[4],"disabled":[4]}]]],["scout-app-bar.cjs",[[785,"scout-app-bar",{"titleText":[1,"title-text"]}]]],["scout-bottom-bar.cjs",[[273,"scout-bottom-bar"]]],["scout-bottom-bar-item.cjs",[[529,"scout-bottom-bar-item",{"type":[1],"href":[1],"target":[1],"rel":[1],"icon":[1],"label":[1],"active":[4]}]]],["scout-button.cjs",[[772,"scout-button",{"type":[1],"href":[1],"target":[1],"rel":[1],"size":[1],"variant":[1],"icon":[1],"iconPosition":[1,"icon-position"],"iconOnly":[4,"icon-only"]}]]],["scout-card.cjs",[[273,"scout-card"]]],["scout-divider.cjs",[[17,"scout-divider"]]],["scout-field.cjs",[[774,"scout-field",{"label":[1],"helpText":[1,"help-text"],"inputId":[32],"errorText":[32],"errorHidden":[32]},[[0,"_scoutFieldId","catchFieldId"],[0,"_scoutValidityChanged","handleValidation"],[0,"scoutBlur","showError"],[0,"_scoutInvalid","showError"]]]]],["scout-input.cjs",[[514,"scout-input",{"validity":[1],"size":[1],"variant":[1],"type":[1],"inputmode":[1],"pattern":[1],"value":[1],"name":[1],"disabled":[4],"placeholder":[1],"ariaId":[32]},null,{"validity":[{"runValidation":0}]}]]],["scout-link.cjs",[[529,"scout-link",{"href":[1],"label":[1],"rel":[1],"linkAriaLabel":[1,"link-aria-label"],"type":[1],"target":[1]}]]],["scout-list-view.cjs",[[273,"scout-list-view",null,[[0,"scoutChecked","onScoutChecked"]]]]],["scout-list-view-subheader.cjs",[[529,"scout-list-view-subheader",{"text":[1],"headingLevel":[1,"heading-level"]}]]],["scout-loader.cjs",[[513,"scout-loader",{"text":[1],"size":[1]}]]],["scout-select.cjs",[[774,"scout-select",{"validity":[1],"value":[1],"disabled":[4],"name":[1],"ariaId":[32]},null,{"validity":[{"runValidation":0}]}]]],["scout-stack.cjs",[[785,"scout-stack",{"direction":[1],"gapSize":[1,"gap-size"]}]]],["scout-switch.cjs",[[529,"scout-switch",{"validity":[1],"toggled":[4],"disabled":[4],"ariaLabelledby":[1,"aria-labelledby"],"label":[1],"ariaId":[32]},null,{"validity":[{"runValidation":0}]}]]],["scout-tabs.cjs",[[785,"scout-tabs",{"value":[2],"widths":[32],"lefts":[32]},[[2,"click","handleClick"]],{"value":[{"updateChildrenClasses":0},{"calculateIndicatorSizes":0}]}]]],["scout-tabs-tab.cjs",[[273,"scout-tabs-tab"]]],["scout-checkbox_2.cjs",[[514,"scout-checkbox",{"validity":[1],"checked":[4],"disabled":[4],"ariaLabelledby":[1,"aria-labelledby"],"label":[1],"value":[1],"name":[1],"ariaId":[32]},null,{"validity":[{"runValidation":0}]}],[514,"scout-radio-button",{"validity":[1],"checked":[4],"disabled":[4],"ariaLabelledby":[1,"aria-labelledby"],"label":[1],"value":[1],"name":[1],"ariaId":[32]},null,{"validity":[{"runValidation":0}]}]]]], options);
|
|
9
9
|
};
|
|
10
10
|
|
|
11
11
|
exports.setNonce = index.setNonce;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-BPpKjjvS.js');
|
|
4
4
|
|
|
5
5
|
const appBarCss = () => `:host{display:flex;width:100%}::slotted(scout-button){height:100% !important}.container{display:flex;flex:1;height:var(--spacing-14);background-color:var(--color-white);border-bottom:1px solid var(--color-neutral-100);color:var(--color-text-brand-base);padding:var(--spacing-1)}.title{flex:1;display:flex;align-items:center;font:var(--type-body-lg);font-weight:500;padding:0 var(--spacing-2)}`;
|
|
6
6
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-BPpKjjvS.js');
|
|
4
4
|
|
|
5
5
|
function r(e){var t,f,n="";if("string"==typeof e||"number"==typeof e)n+=e;else if("object"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=" "),n+=f);}else for(f in e)e[f]&&(n&&(n+=" "),n+=f);return n}function clsx(){for(var e,t,f=0,n="",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=" "),n+=t);return n}
|
|
6
6
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-BPpKjjvS.js');
|
|
4
4
|
|
|
5
5
|
const bottomBarCss = () => `:host{display:flex;width:100%}.container{display:flex;flex:1;height:var(--spacing-14);border-top:1px solid var(--color-neutral-100)}`;
|
|
6
6
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-BPpKjjvS.js');
|
|
4
4
|
|
|
5
5
|
const buttonCss = () => `scout-button{display:inline-block;height:var(--spacing-10);font:var(--type-body-base)}scout-button[data-size="large"]{height:var(--spacing-12);font:var(--type-body-lg)}scout-button .button{flex:1;display:inline-flex;width:100%;height:100%;align-items:center;justify-content:center;gap:var(--spacing-3);padding:0 var(--spacing-4);border-radius:var(--spacing-2);border:1px solid transparent;cursor:pointer;-webkit-text-decoration:none;text-decoration:none;box-sizing:border-box}scout-button[data-size="large"] .button{padding:0 var(--spacing-5)}scout-button .icon{width:var(--spacing-5);height:var(--spacing-5);margin:0 calc(var(--spacing-1) * -1)}scout-button .icon svg{width:100%;height:100%}scout-button[data-icon-only] .button{aspect-ratio:1 / 1;justify-content:center;padding:0}scout-button[data-icon-only] .icon{margin:0}scout-button[data-icon-only] .content{clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;position:absolute;white-space:nowrap;width:1px}scout-button .button.primary{background-color:var(--color-background-brand-base);color:var(--color-text-brand-inverse)}@media (hover: hover){scout-button .button.primary:hover{background-color:var(--color-background-brand-hovered)}}scout-button .button.primary:active{background-color:var(--color-background-brand-pressed)}scout-button .button.outlined{background-color:transparent;border-color:var(--color-background-brand-subtle-base);color:var(--color-text-brand-base)}@media (hover: hover){scout-button .button.outlined:hover{background-color:var(--color-background-brand-subtle-hovered)}}scout-button .button.outlined:active{background-color:var(--color-background-brand-subtle-pressed)}scout-button .button.text{background-color:transparent;border-color:transparent;color:var(--color-text-brand-base)}@media (hover: hover){scout-button .button.text:hover{background-color:var(--color-background-brand-subtle-hovered)}}scout-button .button.text:active{background-color:var(--color-background-brand-subtle-pressed)}scout-button .button.caution{background-color:var(--color-background-caution-bold-base);color:var(--color-text-caution-bold-base)}@media (hover: hover){scout-button .button.caution:hover{background-color:var(--color-background-caution-bold-hovered)}}scout-button .button.caution:active{background-color:var(--color-background-caution-bold-pressed)}scout-button .button.danger{background-color:var(--color-background-danger-bold-base);color:var(--color-text-danger-bold-base)}@media (hover: hover){scout-button .button.danger:hover{background-color:var(--color-background-danger-bold-hovered)}}scout-button .button.danger:active{background-color:var(--color-background-danger-bold-pressed)}`;
|
|
6
6
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-BPpKjjvS.js');
|
|
4
4
|
|
|
5
5
|
const cardCss = () => `:host{display:contents}.card{display:block;border-radius:var(--spacing-2);border:1px solid var(--color-gray-100);padding:var(--spacing-2);box-shadow:0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1)}`;
|
|
6
6
|
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
4
|
-
var inputMixin = require('./inputMixin-
|
|
3
|
+
var index = require('./index-BPpKjjvS.js');
|
|
4
|
+
var inputMixin = require('./inputMixin-D0IzcaXz.js');
|
|
5
5
|
|
|
6
6
|
const checkSvg = 'data:image/svg+xml;base64,PHN2ZwogIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICB3aWR0aD0iMjQiCiAgaGVpZ2h0PSIyNCIKICB2aWV3Qm94PSIwIDAgMjQgMjQiCiAgZmlsbD0ibm9uZSIKICBzdHJva2U9ImN1cnJlbnRDb2xvciIKICBzdHJva2Utd2lkdGg9IjIiCiAgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIgogIHN0cm9rZS1saW5lam9pbj0icm91bmQiCiAgY2xhc3M9Imljb24gaWNvbi10YWJsZXIgaWNvbnMtdGFibGVyLW91dGxpbmUgaWNvbi10YWJsZXItY2hlY2siCj4KICA8cGF0aCBzdHJva2U9Im5vbmUiIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiLz4KICA8cGF0aCBkPSJNNSAxMmw1IDVsMTAgLTEwIiAvPgo8L3N2Zz4=';
|
|
7
7
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-BPpKjjvS.js');
|
|
4
4
|
|
|
5
5
|
const fieldCss = () => `.field.sc-scout-field{display:flex;flex-direction:column}.label.sc-scout-field{font:var(--type-label-sm);font-weight:600;color:var(--color-text-base)}.error-text.sc-scout-field{font:var(--type-label-sm);color:var(--color-text-danger-base);margin:var(--spacing-1) 0 0 0}.error-text.sc-scout-field:empty{margin:0}.help-text.sc-scout-field{font:var(--type-label-sm);color:var(--color-gray-600);margin:var(--spacing-1) 0 0 0}`;
|
|
6
6
|
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
4
|
-
var inputMixin = require('./inputMixin-
|
|
3
|
+
var index = require('./index-BPpKjjvS.js');
|
|
4
|
+
var inputMixin = require('./inputMixin-D0IzcaXz.js');
|
|
5
5
|
|
|
6
6
|
const inputCss = () => `.sc-scout-input-h{display:flex;height:var(--spacing-10);--scout-input-padding:var(--spacing-2);--scout-input-border-radius:var(--spacing-2);--scout-input-type:var(--type-body-base)}.large.sc-scout-input-h{height:var(--spacing-14);--scout-input-padding:var(--spacing-3);--scout-input-border-radius:var(--spacing-3);--scout-input-type:var(--type-body-lg)}.input.sc-scout-input{flex:1;padding:var(--scout-input-padding);font:var(--scout-input-type);border:1px solid var(--color-gray-300);border-radius:var(--scout-input-border-radius);background-color:var(--color-white);color:var(--color-text-base)}.input.sc-scout-input:disabled{background-color:var(--color-gray-100);color:var(--color-gray-700);cursor:not-allowed}.elevated.sc-scout-input-h .input.sc-scout-input{box-shadow:0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);border-color:transparent}`;
|
|
7
7
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-BPpKjjvS.js');
|
|
4
4
|
|
|
5
5
|
const linkCss = () => `:host{display:inline}a,button{color:var(--color-text-brand-base);-webkit-text-decoration:none;text-decoration:none}@media (hover: hover){a:hover,button:hover{-webkit-text-decoration:underline;text-decoration:underline;color:var(--color-background-brand-hover)}}a:active,button:active{color:var(--color-background-brand-pressed)}button{display:inline;background:none;border:none;padding:0;cursor:pointer}`;
|
|
6
6
|
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-BPpKjjvS.js');
|
|
4
|
+
|
|
5
|
+
const chevronRightSvg = 'data:image/svg+xml;base64,PHN2ZwogIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICB3aWR0aD0iMjQiCiAgaGVpZ2h0PSIyNCIKICB2aWV3Qm94PSIwIDAgMjQgMjQiCiAgZmlsbD0ibm9uZSIKICBzdHJva2U9ImN1cnJlbnRDb2xvciIKICBzdHJva2Utd2lkdGg9IjIiCiAgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIgogIHN0cm9rZS1saW5lam9pbj0icm91bmQiCiAgY2xhc3M9Imljb24gaWNvbi10YWJsZXIgaWNvbnMtdGFibGVyLW91dGxpbmUgaWNvbi10YWJsZXItY2hldnJvbi1yaWdodCIKPgogIDxwYXRoIHN0cm9rZT0ibm9uZSIgZD0iTTAgMGgyNHYyNEgweiIgZmlsbD0ibm9uZSIvPgogIDxwYXRoIGQ9Ik05IDZsNiA2bC02IDYiIC8+Cjwvc3ZnPg==';
|
|
4
6
|
|
|
5
7
|
const listViewItemCss = () => `:host{display:flex}.button{flex:1;display:flex;align-items:center;text-align:inherit;min-height:var(--spacing-12);color:var(--color-text-base);padding:var(--spacing-2) var(--spacing-4);cursor:pointer;border:none;background-color:transparent;-webkit-text-decoration:none;text-decoration:none}@media (hover: hover){.button:hover{background-color:var(--color-background-brand-subtle-hovered)}}.prefix-icon,.suffix-icon{display:flex;align-items:center;height:var(--spacing-6);color:var(--color-neutral-700)}.prefix-icon svg,.suffix-icon svg,.prefix-icon .icon,.suffix-icon .icon{width:var(--spacing-6);height:var(--spacing-6)}.prefix-icon{justify-content:flex-start;width:var(--spacing-14)}.suffix-icon{justify-content:flex-end;width:var(--spacing-8)}.suffix-icon .icon{background-color:currentColor;-webkit-mask-image:var(--icon);mask-image:var(--icon);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%}.content{flex:1;display:flex;flex-direction:column;justify-content:center}.primary{font:var(--type-body-base)}.secondary{font:var(--type-body-sm);color:var(--color-neutral-700)}`;
|
|
6
8
|
|
|
@@ -13,6 +15,12 @@ const ScoutListViewItem = class {
|
|
|
13
15
|
primary;
|
|
14
16
|
secondary;
|
|
15
17
|
type = "button";
|
|
18
|
+
/**
|
|
19
|
+
* The action to display on the right side of the item. For example, a
|
|
20
|
+
* chevron. This is purely visual and does not affect the behavior of the item
|
|
21
|
+
* in any way. Not visible when the type is "radio" or "checkbox".
|
|
22
|
+
*/
|
|
23
|
+
action = null;
|
|
16
24
|
href;
|
|
17
25
|
target;
|
|
18
26
|
rel;
|
|
@@ -36,7 +44,7 @@ const ScoutListViewItem = class {
|
|
|
36
44
|
(this.target === "_blank" ? "noopener noreferrer" : undefined),
|
|
37
45
|
}
|
|
38
46
|
: {};
|
|
39
|
-
return (index.h(index.Host, { key: '
|
|
47
|
+
return (index.h(index.Host, { key: 'a91a63b4ed66f3ea5139f83d0024b342cd7095d1', role: "listitem" }, index.h(Tag, { key: '9c4e5c7e24c0f152f5e13b77a91c9eff0f73192d', class: "button", ...linkProps, onClick: () => this.scoutClick.emit() }, this.getPrefix(), this.getContent(), this.getSuffix())));
|
|
40
48
|
}
|
|
41
49
|
getPrefix() {
|
|
42
50
|
if (!this.icon) {
|
|
@@ -54,6 +62,9 @@ const ScoutListViewItem = class {
|
|
|
54
62
|
if (this.type === "checkbox") {
|
|
55
63
|
return (index.h("scout-checkbox", { name: this.name, value: this.value, checked: this.checked, disabled: this.disabled }));
|
|
56
64
|
}
|
|
65
|
+
if (this.action === "chevron") {
|
|
66
|
+
return (index.h("div", { class: "suffix-icon" }, index.h("div", { class: "icon", style: { "--icon": `url(${chevronRightSvg})` } })));
|
|
67
|
+
}
|
|
57
68
|
return null;
|
|
58
69
|
}
|
|
59
70
|
static get delegatesFocus() { return true; }
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-BPpKjjvS.js');
|
|
4
4
|
|
|
5
5
|
const listViewSubheaderCss = () => `:host{display:flex;align-items:center;justify-content:flex-start;padding:0 var(--spacing-4) !important;height:var(--spacing-12);border:none !important;background-color:transparent}.heading{margin:0;padding:0;font:var(--type-body-sm);color:var(--color-gray-800);font-weight:500}`;
|
|
6
6
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-BPpKjjvS.js');
|
|
4
4
|
|
|
5
5
|
const adventurerSvg = 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjwhLS0gQ3JlYXRlZCB3aXRoIElua3NjYXBlIChodHRwOi8vd3d3Lmlua3NjYXBlLm9yZy8pIC0tPgoKPHN2ZwogICB3aWR0aD0iMjU2IgogICBoZWlnaHQ9IjI1NiIKICAgdmlld0JveD0iMCAwIDI1NiAyNTYiCiAgIHZlcnNpb249IjEuMSIKICAgaWQ9InN2ZzEiCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPGRlZnMKICAgICBpZD0iZGVmczEiIC8+CiAgPGcKICAgICBpZD0ibGF5ZXIxIgogICAgIHRyYW5zZm9ybT0ibWF0cml4KDMuNzc5NTA2NSwwLDAsMy43Nzk1MDY1LC0zMDkuODc3MDcsLTM3OS41OTg3MSkiPgogICAgPHBhdGgKICAgICAgIHN0eWxlPSJmaWxsOmN1cnJlbnRDb2xvciIKICAgICAgIGQ9Im0gOTYuNzE5NTg3LDE2NS42NTE2OSBjIDAuMDMyMSwtMC4wNzU4IDAuMDgwMiwtMC4yNTQ5OCAwLjEwNjgzLC0wLjM5ODIyIDAuMDI5NSwtMC4xNTg4MiAyLjUwNjA1LC00LjAwNjA1IDYuMzQ2NjkzLC05Ljg1OTQ2IDYuMDQ0NTgsLTkuMjEyMzggNi4zMDc4MSwtOS41OTkwNiA2LjUzNTI0LC05LjYwMDI4IDAuMjE5NzksLTAuMDAxIDAuMzQ0MzUsMC4xNDcwMyAxLjcxODYxLDIuMDQ0OSAwLjgxNDksMS4xMjUzOSAxLjUwNjkxLDIuMDYxNzkgMS41Mzc4MSwyLjA4MDg4IDAuMDMwOSwwLjAxOTEgMC42Nzc5NSwtMS40NTk2NiAxLjQzNzkxLC0zLjI4NjEzIDEuMzY3NjYsLTMuMjg3MDEgMS4zODQwNSwtMy4zMjA4NSAxLjYwODUzLC0zLjMyMDg1IDAuMjIzMzQsMCAwLjIzNDg5LDAuMDIyOCAwLjc1NzMsMS40OTU4MyAyLjEwMjI0LDUuOTI3NjEgMi41NDAxMiw3LjEyMDgyIDIuNTkzNTcsNy4wNjczNCAwLjA4MzgsLTAuMDgzOSAzLjA2MDEsLTUuNzEyMDIgMy4wNjAxLC01Ljc4NjY2IDAsLTAuMDMzMiAwLjEwNTIsLTAuMDYwNCAwLjIzMzc5LC0wLjA2MDQgMC4yMDIzOCwwIDAuMjg1NDEsMC4wNzY3IDAuNjE4MTUsMC41NzA3OCAwLjIxMTQxLDAuMzEzOTMgMi45MTA0NSw0LjYwOTU1IDUuOTk3ODgsOS41NDU4MSA0LjMxNTgsNi45MDAyMSA1LjYyNjAyLDkuMDUyMzggNS42Njc2Myw5LjMwOTYzIGwgMC4wNTQxLDAuMzM0NTkgaCAtMTkuMTY2MjkgYyAtMTguMjIzMzczLDAgLTE5LjE2MzQxMywtMC4wMDcgLTE5LjEwNzg3MywtMC4xMzc3NyB6IG0gMjIuNzI5NDkzLC0yMC41ODc0NiBjIC0wLjE3ODY5LC0wLjIyMTM4IC0wLjkzODA0LC0xLjgzNDQ4IC0yLjE0MDk2LC00LjU0ODA4IC0wLjcwMDI0LC0xLjU3OTYzIC0xLjMwMTE1LC0yLjkwMDU4IC0xLjMzNTM2LC0yLjkzNTQzIC0wLjA5ODksLTAuMTAwOCAtMS4yMzMzOCwyLjUxOTEzIC0yLjU1ODY2LDUuOTA4OTQgLTAuNzE3MTMsMS44MzQyOSAtMC41NzMwMiwxLjg1MjYgLTIuMjk5NDUsLTAuMjkyMTcgLTAuNzMwNiwtMC45MDc2NCAtMS4zNTE1LC0xLjY1MTYyIC0xLjM3OTc5LC0xLjY1MzMgLTAuMDI4MywtMC4wMDIgLTAuNTI0MjcsMC42NTIyNiAtMS4xMDIxOSwxLjQ1MzE5IC0xLjM0OTQzLDEuODcwMTQgLTEuMzMwMDEsMS44NjQ3OSAtMS43ODQ5MywwLjQ5MjI4IC0wLjU1NzU2LC0xLjY4MjIxIC0wLjY2NDUyLC0yLjM4NjgzIC0wLjYxODQ0LC00LjA3NDE5IDAuMDMxNSwtMS4xNTE1NyAwLjA5MTgsLTEuNzUzMTMgMC4yODg0NiwtMi44NzM1OCAwLjI4Nzg1LC0xLjY0MDM0IDAuMzMzMjIsLTIuODg3MjQgMC4xMzc2MywtMy43ODI2MiAtMC4wODQ2LC0wLjM4NzMzIC0wLjM1NjQzLC0xLjAxNyAtMC45MDA2NSwtMi4wODYzIC0wLjgzMDQxLC0xLjYzMTYyIC0xLjI1MTA4LC0yLjc2MDUyIC0xLjUwOTQ5LC00LjA1MDg1IC0wLjg0MzQxLC00LjIxMTM2IC0wLjAwNiwtOS45ODc0MyAyLjA1MTU4LC0xNC4xNDMzMSAxLjYxNTM2LC0zLjI2MzQgNC4wMzYyNywtNS45NzY5NiA3LjE4OTY5LC04LjA1ODgxIDEuMjQxMTYsLTAuODE5NCAyLjM2NTI2LC0xLjQwMTYxIDIuODM0MjIsLTEuNDY3OTUgMC4yMTY1LC0wLjAzMDYgMC40OTYzMywtMC4wODEgMC42MjE4NCwtMC4xMTE4OCAwLjE2MjUsLTAuMDQgMC4yMTIxNiwtMC4wMzAyIDAuMTcyNDksMC4wMzQgLTAuMDMxNiwwLjA1MTIgLTAuMDA4LDAuMDkwMSAwLjA1MzgsMC4wOTAxIDAuMDg4MywwIDAuMDY1NiwwLjIyNTM1IC0wLjExNjY1LDEuMTYxMjQgLTAuMzUzMzIsMS44MTQxNiAtMC45MDE2Nyw1LjEyNTAzIC0xLjA4NTQ5LDYuNTU0MTQgLTAuMzUyNjcsMi43NDE4NiAtMC4yOTM4MiwzLjk0NDM0IDAuMjc2NDcsNS42NDg3OSAwLjI4NTc2LDAuODU0MDkgMC45OTE3LDIuMzMzODcgMS4zODg1NSwyLjkxMDY3IGwgMC4yMzczNywwLjM0NSAxLjUwMTQ1LC0zLjExMzg1IGMgMS43Mzc0MiwtMy42MDMyMyAxLjYzNTAyLC0zLjQ4MzY3IDIuMjExODMsLTIuNTgyNDQgMS44OTkyOCwyLjk2NzUgNC4yOTMwMSw3LjM2NDQ3IDUuMjM5NjUsOS42MjQ1NCAxLjE1MzcyLDIuNzU0NDkgMS45NDkzMSw1LjIwNDg3IDIuMzQ4MjksNy4yMzI2OCAwLjE5NzgsMS4wMDUzMiAwLjIxMTM1LDEuMjEyNTIgMC4yMTQyMywzLjI3NzU1IDAuMDAzLDIuMTEzMzggLTAuMDA2LDIuMjQ1ODYgLTAuMjEyOTgsMy4yMDg2NSAtMC40OTA1MywyLjI3OTk4IC0xLjQyMTU4LDQuNDM1NDQgLTIuOTA1MDMsNi43MjU0IC0wLjcwNTgxLDEuMDg5NTQgLTAuNjA1NzgsMS4xNDMwNyAtMi4yMzA0NSwtMS4xOTM3OCAtMC43MzYxMSwtMS4wNTg3OSAtMS4zNTk2NSwtMS45MjYyNCAtMS4zODU2NCwtMS45Mjc2NyAtMC4wMjYsLTAuMDAxIC0wLjQ2NjI3LDAuNjc5MzkgLTAuOTc4NDEsMS41MTI5MiAtMS42MjE0MSwyLjYzODk1IC0xLjc0MzM1LDIuODE0NTQgLTEuOTU0NiwyLjgxNDU0IC0wLjEwMzkyLDAgLTAuMjI0NywtMC4wNDQzIC0wLjI2ODM4LC0wLjA5ODQgeiBtIC0wLjczNDEyLC0xMi4xNTIwNiBjIDEuMDk5NywtMS41Mzg3OCAxLjcxNDU0LC0yLjc3NTE4IDIuMDkxMzEsLTQuMjA1NDcgMC4yMTYzNiwtMC44MjEzNSAwLjU0NjY2LC0yLjcwMTA4IDAuNjMyNTksLTMuNjAwMSAwLjA1MjgsLTAuNTUyNzYgMC4wNjEyLC0wLjU3MDc4IDAuMjY1MjMsLTAuNTcwNzggMC4zMDIzLDAgMS42MjkwNCwxLjI2Nzk5IDIuNTgwODgsMi40NjY2IDAuNDE4NDcsMC41MjY5NCAwLjgwODY5LDEuMDEwNDMgMC44NjcxOCwxLjA3NDQxIDAuMTExOTQsMC4xMjI0NSAtMC4yOTMyOCwtMC45NTg2NyAtMC44OTAyLC0yLjM3NTAyIC0wLjQxNTMzLC0wLjk4NTQ5IC0xLjE2MTA0LC0yLjMxMjE0IC0yLjIyNjM5LC0zLjk2MDg1IC0xLjE0NzUsLTEuNzc1ODMgLTEuMzAxODMsLTIuMDA0NjEgLTEuMzUzMjQsLTIuMDA2MTUgLTAuMDI2LC03LjhlLTQgLTAuNTQxODEsMS4yMTE5OCAtMS4xNDYzNCwyLjY5NTAzIC0xLjM0MDc0LDMuMjg5MTggLTEuMjM4NDksMy4xOTMxNiAtMi4wMTY4OSwxLjg5Mzk2IC0xLjYxMjM4LC0yLjY5MTE1IC0zLjE4MTIzLC01LjYwNzU2IC0zLjUyNzc1LC02LjU1Nzg3IC0wLjQ2MjQ1LC0xLjI2ODI5IC0xLjA4NTI3LC00LjAzOTIxIC0xLjM0MzAyLC01Ljk3NTA5IC0wLjA1MjUsLTAuMzk0NjYgLTAuMTIxMDMsLTAuNzE3NTYgLTAuMTUyMTgsLTAuNzE3NTYgLTAuMDg3NywwIC0wLjgyNTUyLDAuODI5MzIgLTEuNDM1OTUsMS42MTM5MyAtMS44NzY0NiwyLjQxMTg5IC0zLjI3MzE2LDUuMjM4NSAtMy43NTM3NCw3LjU5Njc1IC0wLjM0ODk1LDEuNzEyMzUgLTAuMzYyMjQsMy45OTkxNiAtMC4wMzM1LDUuNzY3NDEgMC4xNTE4LDAuODE2NDkgMC41MTI1NiwyLjE4NDcgMC41NzYwMywyLjE4NDYyIDAuMDI2MywtNGUtNSAwLjE4MjgzLC0wLjY5OTc0IDAuMzQ3ODIsLTEuNTU0ODkgMC4zNzA3NCwtMS45MjE1NCAwLjYyMjczLC0yLjY5MzA5IDEuMzA1NzUsLTMuOTk4MDIgMC40ODM1NCwtMC45MjM4MyAwLjU1NjA4LC0xLjAyMzA0IDAuNzYzMzEsLTEuMDQzOTIgMC4yMjc2NSwtMC4wMjI5IDAuMjM5NjMsLTAuMDAyIDIuMDM5NzQsMy42MTYwNiAxLjg0OTI5LDMuNzE2NiAyLjExMzg4LDQuMTY1NzIgMy4xOTUsNS40MjMzNiAwLjU4NTc2LDAuNjgxNCAyLjY2NzksMi44MzI4OCAyLjczOTc0LDIuODMwOTggMC4wMjY3LC03LjFlLTQgMC4yNDAzMiwtMC4yNjk1MyAwLjQ3NDYzLC0wLjU5NzM5IHoiCiAgICAgICBpZD0icGF0aDUiIC8+CiAgPC9nPgo8L3N2Zz4K';
|
|
6
6
|
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
4
|
-
var inputMixin = require('./inputMixin-
|
|
3
|
+
var index = require('./index-BPpKjjvS.js');
|
|
4
|
+
var inputMixin = require('./inputMixin-D0IzcaXz.js');
|
|
5
5
|
|
|
6
6
|
const chevronDownSvg = 'data:image/svg+xml;base64,PHN2ZwogIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICB3aWR0aD0iMjQiCiAgaGVpZ2h0PSIyNCIKICB2aWV3Qm94PSIwIDAgMjQgMjQiCiAgZmlsbD0ibm9uZSIKICBzdHJva2U9ImN1cnJlbnRDb2xvciIKICBzdHJva2Utd2lkdGg9IjIiCiAgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIgogIHN0cm9rZS1saW5lam9pbj0icm91bmQiCiAgY2xhc3M9Imljb24gaWNvbi10YWJsZXIgaWNvbnMtdGFibGVyLW91dGxpbmUgaWNvbi10YWJsZXItY2hldnJvbi1kb3duIgo+CiAgPHBhdGggc3Ryb2tlPSJub25lIiBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIi8+CiAgPHBhdGggZD0iTTYgOWw2IDZsNiAtNiIgLz4KPC9zdmc+';
|
|
7
7
|
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
4
|
-
var inputMixin = require('./inputMixin-
|
|
3
|
+
var index = require('./index-BPpKjjvS.js');
|
|
4
|
+
var inputMixin = require('./inputMixin-D0IzcaXz.js');
|
|
5
5
|
|
|
6
6
|
const switchCss = () => `.switch{width:var(--spacing-10);height:var(--spacing-6);-moz-appearance:none;appearance:none;-webkit-appearance:none;border-radius:var(--spacing-8);background-color:var(--color-text-brand-inverse);border:2px solid var(--color-gray-300);position:relative;display:flex;align-content:center;justify-content:center;transition-property:border-color;transition-duration:0.3s;transition-timing-function:ease-in-out;cursor:pointer;--switch-ball-padding:calc(var(--spacing-1) / 4);--switch-ball-size:calc(var(--spacing-5) - var(--switch-ball-padding) * 2)}@media (hover: hover){.switch:hover{transition-property:none;border-color:var(--color-gray-400);background-color:var(--color-background-brand-subtle-hovered)}}.switch:active{background-color:var(--color-background-brand-subtle-pressed)}.switch:checked{border-color:var(--color-background-brand-base)}@media (hover: hover){.switch:hover::before{background-color:var(--color-gray-400)}}.switch::before{content:"";background-color:var(--color-gray-300);width:var(--switch-ball-size);height:var(--switch-ball-size);border-radius:50%;position:absolute;top:var(--switch-ball-padding);left:var(--switch-ball-padding);transition-duration:0.3s;transition-property:left, right}.switch:checked::before{content:"";background-color:var(--color-background-brand-base);left:calc(100% - (var(--switch-ball-size) + var(--switch-ball-padding)));left:calc(100% - calc(var(--switch-ball-size) + var(--switch-ball-padding)))}.switch:disabled{pointer-events:none;background-color:var(--color-gray-100);border-color:var(--color-gray-100)}.switch:disabled::before{background-color:var(--color-gray-300)}label{display:flex;flex-direction:row-reverse;align-items:center;font:var(--type-label-base);color:var(--color-text-base)}.inlineDivider{width:var(--spacing-2)}`;
|
|
7
7
|
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var index = require('./index-BPpKjjvS.js');
|
|
4
|
+
|
|
5
|
+
const tabsTabCss = () => `:host{flex:1;display:block;width:auto}.button-native{position:relative;display:block;width:100%;height:100%;color:var(--color-gray-600);background-color:transparent;border:none;cursor:pointer;padding:var(--spacing-1) var(--spacing-1) calc(var(--spacing-1) + var(--tabs-indicator-height)) var(--spacing-1);font-weight:500;text-transform:uppercase;font-size:0.875rem;letter-spacing:0.04em}.inner-container{display:flex;justify-content:center;align-items:center;width:100%;height:100%;border-radius:var(--spacing-2);background-color:transparent}.button-native:hover{color:var(--color-text-base)}.button-native:hover .inner-container{background-color:var(--color-background-brand-subtle-hovered)}:host([data-active]) .button-native{color:var(--color-text-base)}`;
|
|
6
|
+
|
|
7
|
+
const ScoutTabsTab = class {
|
|
8
|
+
constructor(hostRef) {
|
|
9
|
+
index.registerInstance(this, hostRef);
|
|
10
|
+
}
|
|
11
|
+
render() {
|
|
12
|
+
return (index.h("button", { key: '59f92f5a3d9b5a022a78d9adc7756bda10b68be3', class: "button-native", type: "button" }, index.h("div", { key: '96fc99711da308360451041dd44e21391c08d6eb', class: "inner-container" }, index.h("slot", { key: '83234bf67c2605179c7d80febbc6d0fbff730670' }))));
|
|
13
|
+
}
|
|
14
|
+
static get delegatesFocus() { return true; }
|
|
15
|
+
};
|
|
16
|
+
ScoutTabsTab.style = tabsTabCss();
|
|
17
|
+
|
|
18
|
+
exports.scout_tabs_tab = ScoutTabsTab;
|
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var index = require('./index-BPpKjjvS.js');
|
|
4
|
+
|
|
5
|
+
const tabsCss = () => `:host{position:relative;width:100%;display:flex;height:var(--spacing-12);--tabs-indicator-height:2px}.indicator{position:absolute;bottom:0;left:0;width:0;height:var(--tabs-indicator-height);background-color:var(--color-background-brand-base);transition:all 0.3s ease}`;
|
|
6
|
+
|
|
7
|
+
const ScoutTabs = class {
|
|
8
|
+
constructor(hostRef) {
|
|
9
|
+
index.registerInstance(this, hostRef);
|
|
10
|
+
this.scoutChange = index.createEvent(this, "scoutChange");
|
|
11
|
+
}
|
|
12
|
+
get el() { return index.getElement(this); }
|
|
13
|
+
/**
|
|
14
|
+
* Zero-based index of the currently active tab.
|
|
15
|
+
*/
|
|
16
|
+
value = 0;
|
|
17
|
+
/**
|
|
18
|
+
* Emitted when the active tab changes as a result of a user click.
|
|
19
|
+
* The `value` in the event detail is the zero-based index of the newly selected tab.
|
|
20
|
+
*/
|
|
21
|
+
scoutChange;
|
|
22
|
+
widths = [];
|
|
23
|
+
lefts = [];
|
|
24
|
+
render() {
|
|
25
|
+
return (index.h(index.Host, { key: 'dffbae0bba3543f50cbe7046bad52c7bdff7ba55' }, index.h("slot", { key: 'cad95b2ae6c8b2bc659bfa6510c0b193d2e08dd9' }), this.getIndicator()));
|
|
26
|
+
}
|
|
27
|
+
componentDidLoad() {
|
|
28
|
+
this.updateChildrenClasses();
|
|
29
|
+
this.calculateIndicatorSizes();
|
|
30
|
+
}
|
|
31
|
+
getIndicator() {
|
|
32
|
+
const width = this.widths[this.value] || 0;
|
|
33
|
+
const left = this.lefts[this.value] || 0;
|
|
34
|
+
const indicatorStyle = {
|
|
35
|
+
width: `${width}px`,
|
|
36
|
+
transform: `translateX(${left}px)`,
|
|
37
|
+
};
|
|
38
|
+
return index.h("div", { "aria-hidden": "true", class: "indicator", style: indicatorStyle });
|
|
39
|
+
}
|
|
40
|
+
handleClick(event) {
|
|
41
|
+
const target = event.target;
|
|
42
|
+
const tabs = Array.from(this.el.children);
|
|
43
|
+
const clickedIndex = tabs.indexOf(target);
|
|
44
|
+
if (clickedIndex !== -1 && clickedIndex !== this.value) {
|
|
45
|
+
this.scoutChange.emit({ value: clickedIndex });
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
updateChildrenClasses() {
|
|
49
|
+
Array.from(this.el.children).forEach((child, index) => {
|
|
50
|
+
const tab = child;
|
|
51
|
+
if (index === this.value) {
|
|
52
|
+
tab.setAttribute("data-active", "true");
|
|
53
|
+
}
|
|
54
|
+
else {
|
|
55
|
+
tab.removeAttribute("data-active");
|
|
56
|
+
}
|
|
57
|
+
});
|
|
58
|
+
}
|
|
59
|
+
calculateIndicatorSizes() {
|
|
60
|
+
this.widths = Array.from(this.el.children).map((child) => child.offsetWidth);
|
|
61
|
+
this.lefts = this.widths.map((_, index) => this.widths.slice(0, index).reduce((acc, w) => acc + w, 0));
|
|
62
|
+
}
|
|
63
|
+
static get delegatesFocus() { return true; }
|
|
64
|
+
static get watchers() { return {
|
|
65
|
+
"value": [{
|
|
66
|
+
"updateChildrenClasses": 0
|
|
67
|
+
}, {
|
|
68
|
+
"calculateIndicatorSizes": 0
|
|
69
|
+
}]
|
|
70
|
+
}; }
|
|
71
|
+
};
|
|
72
|
+
ScoutTabs.style = tabsCss();
|
|
73
|
+
|
|
74
|
+
exports.scout_tabs = ScoutTabs;
|
package/dist/cjs/ui-webc.cjs.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-BPpKjjvS.js');
|
|
4
4
|
|
|
5
5
|
var _documentCurrentScript = typeof document !== 'undefined' ? document.currentScript : null;
|
|
6
6
|
/*
|
|
@@ -18,7 +18,7 @@ var patchBrowser = () => {
|
|
|
18
18
|
|
|
19
19
|
patchBrowser().then(async (options) => {
|
|
20
20
|
await index.globalScripts();
|
|
21
|
-
return index.bootstrapLazy([["scout-list-view-item.cjs",[[529,"scout-list-view-item",{"icon":[1],"primary":[1],"secondary":[1],"type":[1],"href":[1],"target":[1],"rel":[1],"name":[1],"value":[1],"checked":[4],"disabled":[4]}]]],["scout-app-bar.cjs",[[785,"scout-app-bar",{"titleText":[1,"title-text"]}]]],["scout-bottom-bar.cjs",[[273,"scout-bottom-bar"]]],["scout-bottom-bar-item.cjs",[[529,"scout-bottom-bar-item",{"type":[1],"href":[1],"target":[1],"rel":[1],"icon":[1],"label":[1],"active":[4]}]]],["scout-button.cjs",[[772,"scout-button",{"type":[1],"href":[1],"target":[1],"rel":[1],"size":[1],"variant":[1],"icon":[1],"iconPosition":[1,"icon-position"],"iconOnly":[4,"icon-only"]}]]],["scout-card.cjs",[[273,"scout-card"]]],["scout-divider.cjs",[[17,"scout-divider"]]],["scout-field.cjs",[[774,"scout-field",{"label":[1],"helpText":[1,"help-text"],"inputId":[32],"errorText":[32],"errorHidden":[32]},[[0,"_scoutFieldId","catchFieldId"],[0,"_scoutValidityChanged","handleValidation"],[0,"scoutBlur","showError"],[0,"_scoutInvalid","showError"]]]]],["scout-input.cjs",[[514,"scout-input",{"validity":[1],"size":[1],"variant":[1],"type":[1],"inputmode":[1],"pattern":[1],"value":[1],"name":[1],"disabled":[4],"placeholder":[1],"ariaId":[32]},null,{"validity":[{"runValidation":0}]}]]],["scout-link.cjs",[[529,"scout-link",{"href":[1],"label":[1],"rel":[1],"linkAriaLabel":[1,"link-aria-label"],"type":[1],"target":[1]}]]],["scout-list-view.cjs",[[273,"scout-list-view",null,[[0,"scoutChecked","onScoutChecked"]]]]],["scout-list-view-subheader.cjs",[[529,"scout-list-view-subheader",{"text":[1],"headingLevel":[1,"heading-level"]}]]],["scout-loader.cjs",[[513,"scout-loader",{"text":[1],"size":[1]}]]],["scout-select.cjs",[[774,"scout-select",{"validity":[1],"value":[1],"disabled":[4],"name":[1],"ariaId":[32]},null,{"validity":[{"runValidation":0}]}]]],["scout-stack.cjs",[[785,"scout-stack",{"direction":[1],"gapSize":[1,"gap-size"]}]]],["scout-switch.cjs",[[529,"scout-switch",{"validity":[1],"toggled":[4],"disabled":[4],"ariaLabelledby":[1,"aria-labelledby"],"label":[1],"ariaId":[32]},null,{"validity":[{"runValidation":0}]}]]],["scout-checkbox_2.cjs",[[514,"scout-checkbox",{"validity":[1],"checked":[4],"disabled":[4],"ariaLabelledby":[1,"aria-labelledby"],"label":[1],"value":[1],"name":[1],"ariaId":[32]},null,{"validity":[{"runValidation":0}]}],[514,"scout-radio-button",{"validity":[1],"checked":[4],"disabled":[4],"ariaLabelledby":[1,"aria-labelledby"],"label":[1],"value":[1],"name":[1],"ariaId":[32]},null,{"validity":[{"runValidation":0}]}]]]], options);
|
|
21
|
+
return index.bootstrapLazy([["scout-list-view-item.cjs",[[529,"scout-list-view-item",{"icon":[1],"primary":[1],"secondary":[1],"type":[1],"action":[1],"href":[1],"target":[1],"rel":[1],"name":[1],"value":[1],"checked":[4],"disabled":[4]}]]],["scout-app-bar.cjs",[[785,"scout-app-bar",{"titleText":[1,"title-text"]}]]],["scout-bottom-bar.cjs",[[273,"scout-bottom-bar"]]],["scout-bottom-bar-item.cjs",[[529,"scout-bottom-bar-item",{"type":[1],"href":[1],"target":[1],"rel":[1],"icon":[1],"label":[1],"active":[4]}]]],["scout-button.cjs",[[772,"scout-button",{"type":[1],"href":[1],"target":[1],"rel":[1],"size":[1],"variant":[1],"icon":[1],"iconPosition":[1,"icon-position"],"iconOnly":[4,"icon-only"]}]]],["scout-card.cjs",[[273,"scout-card"]]],["scout-divider.cjs",[[17,"scout-divider"]]],["scout-field.cjs",[[774,"scout-field",{"label":[1],"helpText":[1,"help-text"],"inputId":[32],"errorText":[32],"errorHidden":[32]},[[0,"_scoutFieldId","catchFieldId"],[0,"_scoutValidityChanged","handleValidation"],[0,"scoutBlur","showError"],[0,"_scoutInvalid","showError"]]]]],["scout-input.cjs",[[514,"scout-input",{"validity":[1],"size":[1],"variant":[1],"type":[1],"inputmode":[1],"pattern":[1],"value":[1],"name":[1],"disabled":[4],"placeholder":[1],"ariaId":[32]},null,{"validity":[{"runValidation":0}]}]]],["scout-link.cjs",[[529,"scout-link",{"href":[1],"label":[1],"rel":[1],"linkAriaLabel":[1,"link-aria-label"],"type":[1],"target":[1]}]]],["scout-list-view.cjs",[[273,"scout-list-view",null,[[0,"scoutChecked","onScoutChecked"]]]]],["scout-list-view-subheader.cjs",[[529,"scout-list-view-subheader",{"text":[1],"headingLevel":[1,"heading-level"]}]]],["scout-loader.cjs",[[513,"scout-loader",{"text":[1],"size":[1]}]]],["scout-select.cjs",[[774,"scout-select",{"validity":[1],"value":[1],"disabled":[4],"name":[1],"ariaId":[32]},null,{"validity":[{"runValidation":0}]}]]],["scout-stack.cjs",[[785,"scout-stack",{"direction":[1],"gapSize":[1,"gap-size"]}]]],["scout-switch.cjs",[[529,"scout-switch",{"validity":[1],"toggled":[4],"disabled":[4],"ariaLabelledby":[1,"aria-labelledby"],"label":[1],"ariaId":[32]},null,{"validity":[{"runValidation":0}]}]]],["scout-tabs.cjs",[[785,"scout-tabs",{"value":[2],"widths":[32],"lefts":[32]},[[2,"click","handleClick"]],{"value":[{"updateChildrenClasses":0},{"calculateIndicatorSizes":0}]}]]],["scout-tabs-tab.cjs",[[273,"scout-tabs-tab"]]],["scout-checkbox_2.cjs",[[514,"scout-checkbox",{"validity":[1],"checked":[4],"disabled":[4],"ariaLabelledby":[1,"aria-labelledby"],"label":[1],"value":[1],"name":[1],"ariaId":[32]},null,{"validity":[{"runValidation":0}]}],[514,"scout-radio-button",{"validity":[1],"checked":[4],"disabled":[4],"ariaLabelledby":[1,"aria-labelledby"],"label":[1],"value":[1],"name":[1],"ariaId":[32]},null,{"validity":[{"runValidation":0}]}]]]], options);
|
|
22
22
|
});
|
|
23
23
|
|
|
24
24
|
exports.setNonce = index.setNonce;
|
|
@@ -17,7 +17,9 @@
|
|
|
17
17
|
"components/radio-button/radio-button.js",
|
|
18
18
|
"components/select/select.js",
|
|
19
19
|
"components/stack/stack.js",
|
|
20
|
-
"components/switch/switch.js"
|
|
20
|
+
"components/switch/switch.js",
|
|
21
|
+
"components/tabs/tabs.js",
|
|
22
|
+
"components/tabs-tab/tabs-tab.js"
|
|
21
23
|
],
|
|
22
24
|
"compiler": {
|
|
23
25
|
"name": "@stencil/core",
|
|
@@ -1,9 +1,16 @@
|
|
|
1
1
|
import { Host, h, } from "@stencil/core";
|
|
2
|
+
import ChevronRightIcon from "@tabler/icons/outline/chevron-right.svg";
|
|
2
3
|
export class ScoutListViewItem {
|
|
3
4
|
icon;
|
|
4
5
|
primary;
|
|
5
6
|
secondary;
|
|
6
7
|
type = "button";
|
|
8
|
+
/**
|
|
9
|
+
* The action to display on the right side of the item. For example, a
|
|
10
|
+
* chevron. This is purely visual and does not affect the behavior of the item
|
|
11
|
+
* in any way. Not visible when the type is "radio" or "checkbox".
|
|
12
|
+
*/
|
|
13
|
+
action = null;
|
|
7
14
|
href;
|
|
8
15
|
target;
|
|
9
16
|
rel;
|
|
@@ -27,7 +34,7 @@ export class ScoutListViewItem {
|
|
|
27
34
|
(this.target === "_blank" ? "noopener noreferrer" : undefined),
|
|
28
35
|
}
|
|
29
36
|
: {};
|
|
30
|
-
return (h(Host, { key: '
|
|
37
|
+
return (h(Host, { key: 'a91a63b4ed66f3ea5139f83d0024b342cd7095d1', role: "listitem" }, h(Tag, { key: '9c4e5c7e24c0f152f5e13b77a91c9eff0f73192d', class: "button", ...linkProps, onClick: () => this.scoutClick.emit() }, this.getPrefix(), this.getContent(), this.getSuffix())));
|
|
31
38
|
}
|
|
32
39
|
getPrefix() {
|
|
33
40
|
if (!this.icon) {
|
|
@@ -45,6 +52,9 @@ export class ScoutListViewItem {
|
|
|
45
52
|
if (this.type === "checkbox") {
|
|
46
53
|
return (h("scout-checkbox", { name: this.name, value: this.value, checked: this.checked, disabled: this.disabled }));
|
|
47
54
|
}
|
|
55
|
+
if (this.action === "chevron") {
|
|
56
|
+
return (h("div", { class: "suffix-icon" }, h("div", { class: "icon", style: { "--icon": `url(${ChevronRightIcon})` } })));
|
|
57
|
+
}
|
|
48
58
|
return null;
|
|
49
59
|
}
|
|
50
60
|
static get is() { return "scout-list-view-item"; }
|
|
@@ -145,6 +155,32 @@ export class ScoutListViewItem {
|
|
|
145
155
|
"attribute": "type",
|
|
146
156
|
"defaultValue": "\"button\""
|
|
147
157
|
},
|
|
158
|
+
"action": {
|
|
159
|
+
"type": "string",
|
|
160
|
+
"mutable": false,
|
|
161
|
+
"complexType": {
|
|
162
|
+
"original": "ActionType",
|
|
163
|
+
"resolved": "\"chevron\"",
|
|
164
|
+
"references": {
|
|
165
|
+
"ActionType": {
|
|
166
|
+
"location": "local",
|
|
167
|
+
"path": "/home/runner/work/j26-components/j26-components/packages/ui-webc/src/components/list-view-item/list-view-item.tsx",
|
|
168
|
+
"id": "src/components/list-view-item/list-view-item.tsx::ActionType"
|
|
169
|
+
}
|
|
170
|
+
}
|
|
171
|
+
},
|
|
172
|
+
"required": false,
|
|
173
|
+
"optional": false,
|
|
174
|
+
"docs": {
|
|
175
|
+
"tags": [],
|
|
176
|
+
"text": "The action to display on the right side of the item. For example, a\nchevron. This is purely visual and does not affect the behavior of the item\nin any way. Not visible when the type is \"radio\" or \"checkbox\"."
|
|
177
|
+
},
|
|
178
|
+
"getter": false,
|
|
179
|
+
"setter": false,
|
|
180
|
+
"reflect": false,
|
|
181
|
+
"attribute": "action",
|
|
182
|
+
"defaultValue": "null"
|
|
183
|
+
},
|
|
148
184
|
"href": {
|
|
149
185
|
"type": "string",
|
|
150
186
|
"mutable": false,
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
:host {
|
|
2
|
+
position: relative;
|
|
3
|
+
width: 100%;
|
|
4
|
+
display: flex;
|
|
5
|
+
height: var(--spacing-12);
|
|
6
|
+
--tabs-indicator-height: 2px;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
.indicator {
|
|
10
|
+
position: absolute;
|
|
11
|
+
bottom: 0;
|
|
12
|
+
left: 0;
|
|
13
|
+
width: 0;
|
|
14
|
+
height: var(--tabs-indicator-height);
|
|
15
|
+
background-color: var(--color-background-brand-base);
|
|
16
|
+
transition: all 0.3s ease;
|
|
17
|
+
}
|