@scouterna/ui-webc 0.2.0

package/dist/ui-webc/scout-bottom-bar-item.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scout-bottom-bar-item.entry.esm.js","sources":["../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.mjs","src/components/bottom-bar-item/bottom-bar-item.css?tag=scout-bottom-bar-item&encapsulation=shadow","src/components/bottom-bar-item/bottom-bar-item.tsx"],"sourcesContent":["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}export 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}export default clsx;",":host {\n  display: flex;\n  flex: 1;\n}\n\n.button {\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n  justify-content: center;\n  align-items: center;\n  background-color: transparent;\n  border: none;\n  color: var(--color-text-base);\n  cursor: pointer;\n}\n\n.button:hover {\n  background-color: var(--color-neutral-50);\n}\n\n.button.active {\n  background-color: var(--color-blue-50);\n  color: var(--color-blue-500);\n}\n\n.button .icon {\n  width: var(--spacing-6);\n  height: var(--spacing-6);\n}\n\n.button .label {\n  font: var(--type-label-sm);\n}\n\na {\n  text-decoration: none;\n}","import { Component, Event, type EventEmitter, h, Prop } from \"@stencil/core\";\nimport clsx from \"clsx\";\n\nexport type ItemType = \"button\" | \"link\";\n\n/**\n * A bottom bar item used within the bottom bar for navigation. Should not be\n * used outside of a bottom bar.\n */\n@Component({\n  tag: \"scout-bottom-bar-item\",\n  styleUrl: \"bottom-bar-item.css\",\n  shadow: true,\n})\nexport class ScoutBottomBarItem {\n  @Prop() type: ItemType = \"button\";\n  @Prop() href?: string;\n\n  @Prop() icon!: string;\n  @Prop() label!: string;\n  @Prop() active?: boolean;\n\n  @Event()\n  scoutClick: EventEmitter<void>;\n\n  render() {\n    const Tag = this.type === \"link\" ? \"a\" : \"button\";\n\n    const props =\n      this.type === \"link\"\n        ? {\n            href: this.href,\n          }\n        : {};\n\n    return (\n      <Tag\n        class={clsx(\"button\", this.active && \"active\")}\n        onClick={() => this.scoutClick.emit()}\n        {...props}\n      >\n        <span class=\"icon\" innerHTML={this.icon} />\n        <span class=\"label\">{this.label}</span>\n      </Tag>\n    );\n  }\n}\n"],"names":[],"mappings":";;AAAA,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,GAAG,QAAQ,EAAE,OAAO,CAAC,EAAE,QAAQ,EAAE,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,KAAK,GAAG,QAAQ,EAAE,OAAO,CAAC,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,EAAC,CAAC,KAAK,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC,CAAQ,SAAS,IAAI,EAAE,CAAC,IAAI,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC;;ACA/W,MAAM,gBAAgB,GAAG,+eAA+e;;MCc3f,kBAAkB,GAAA,MAAA;;;;;IACrB,IAAI,GAAa,QAAQ;AACzB,IAAA,IAAI;AAEJ,IAAA,IAAI;AACJ,IAAA,KAAK;AACL,IAAA,MAAM;AAGd,IAAA,UAAU;IAEV,MAAM,GAAA;AACJ,QAAA,MAAM,GAAG,GAAG,IAAI,CAAC,IAAI,KAAK,MAAM,GAAG,GAAG,GAAG,QAAQ;AAEjD,QAAA,MAAM,KAAK,GACT,IAAI,CAAC,IAAI,KAAK;AACZ,cAAE;gBACE,IAAI,EAAE,IAAI,CAAC,IAAI;AAChB;cACD,EAAE;AAER,QAAA,QACE,CAAA,CAAC,GAAG,EAAA,EAAA,GAAA,EAAA,0CAAA,EACF,KAAK,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,MAAM,IAAI,QAAQ,CAAC,EAC9C,OAAO,EAAE,MAAM,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,KACjC,KAAK,EAAA,EAET,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,MAAM,EAAC,SAAS,EAAE,IAAI,CAAC,IAAI,EAAI,CAAA,EAC3C,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,OAAO,EAAE,EAAA,IAAI,CAAC,KAAK,CAAQ,CACnC;;;;;;;","x_google_ignoreList":[0]}

package/dist/ui-webc/scout-bottom-bar.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scout-bottom-bar.entry.esm.js","sources":["src/components/bottom-bar/bottom-bar.css?tag=scout-bottom-bar&encapsulation=shadow","src/components/bottom-bar/bottom-bar.tsx"],"sourcesContent":[":host {\n  display: flex;\n  width: 100%;\n}\n\n.container {\n  display: flex;\n  flex: 1;\n  height: var(--spacing-14);\n  border-top: 1px solid var(--color-neutral-100);\n}","import { Component, h } from \"@stencil/core\";\n\n/**\n * The bottom bar component is used in the Jamboree26 app to provide\n * navigation at the bottom of the screen.\n */\n@Component({\n  tag: \"scout-bottom-bar\",\n  styleUrl: \"bottom-bar.css\",\n  shadow: true,\n})\nexport class ScoutBottomBar {\n  render() {\n    return (\n      <nav class=\"container\">\n        <slot />\n      </nav>\n    );\n  }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,YAAY,GAAG,sIAAsI;;MCW9I,cAAc,GAAA,MAAA;;;;IACzB,MAAM,GAAA;QACJ,QACE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAK,KAAK,EAAC,WAAW,EAAA,EACpB,CAAQ,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACJ;;;;;;;"}

package/dist/ui-webc/scout-button.entry.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scout-button.entry.esm.js","sources":["src/components/button/button.css?tag=scout-button&encapsulation=shadow","src/components/button/button.tsx"],"sourcesContent":[":host {\n  display: inline-flex;\n}\n\nbutton {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  gap: var(--spacing-3);\n  height: var(--spacing-10);\n  padding: 0 var(--spacing-4);\n  font: var(--type-body-base);\n  border-radius: var(--spacing-2);\n  border: 1px solid transparent;\n  cursor: pointer;\n}\n\n.icon {\n  width: var(--spacing-5);\n  height: var(--spacing-5);\n  margin: 0 calc(var(--spacing-1) * -1);\n}\n\n.icon svg {\n  width: 100%;\n  height: 100%;\n}\n\nbutton.primary {\n  background-color: var(--color-background-brand-base);\n  color: var(--color-text-brand-inverse);\n\n  &:hover {\n    background-color: var(--color-background-brand-hovered);\n  }\n  &:active {\n    background-color: var(--color-background-brand-pressed);\n  }\n}\n\nbutton.outlined {\n  background-color: transparent;\n  border-color: var(--color-background-brand-subtle-base);\n  color: var(--color-text-brand-base);\n\n  &:hover {\n    background-color: var(--color-background-brand-subtle-hovered);\n  }\n  &:active {\n    background-color: var(--color-background-brand-subtle-pressed);\n  }\n}\n\nbutton.text {\n  background-color: transparent;\n  border-color: transparent;\n  color: var(--color-text-brand-base);\n\n  &:hover {\n    background-color: var(--color-background-brand-subtle-hovered);\n  }\n  &:active {\n    background-color: var(--color-background-brand-subtle-pressed);\n  }\n}\n\nbutton.caution {\n  background-color: var(--color-background-caution-bold-base);\n  color: var(--color-text-caution-bold-base);\n\n  &:hover {\n    background-color: var(--color-background-caution-bold-hovered);\n  }\n  &:active {\n    background-color: var(--color-background-caution-bold-pressed);\n  }\n}\n\nbutton.danger {\n  background-color: var(--color-background-danger-bold-base);\n  color: var(--color-text-danger-bold-base);\n\n  &:hover {\n    background-color: var(--color-background-danger-bold-hovered);\n  }\n  &:active {\n    background-color: var(--color-background-danger-bold-pressed);\n  }\n}\n","import { Component, Event, type EventEmitter, h, Prop } from \"@stencil/core\";\n\nexport type Variant = \"primary\" | \"outlined\" | \"text\" | \"caution\" | \"danger\";\n\n/**\n * A simple button component.\n */\n@Component({\n  tag: \"scout-button\",\n  styleUrl: \"button.css\",\n  shadow: true,\n})\nexport class ScoutButton {\n  @Prop() type: \"button\" | \"submit\" | \"reset\" = \"button\";\n\n  @Prop() variant: Variant = \"outlined\";\n\n  @Prop() icon?: string;\n\n  @Event()\n  scoutClick: EventEmitter<void>;\n\n  render() {\n    return (\n      <button\n        type={this.type}\n        class={this.variant}\n        onClick={() => this.scoutClick.emit()}\n      >\n        <slot />\n        {this.icon && <span class=\"icon\" innerHTML={this.icon} />}\n      </button>\n    );\n  }\n}\n"],"names":[],"mappings":";;AAAA,MAAM,SAAS,GAAG,kvDAAkvD;;MCYvvD,WAAW,GAAA,MAAA;;;;;IACd,IAAI,GAAkC,QAAQ;IAE9C,OAAO,GAAY,UAAU;AAE7B,IAAA,IAAI;AAGZ,IAAA,UAAU;IAEV,MAAM,GAAA;AACJ,QAAA,QACE,CACE,CAAA,QAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,KAAK,EAAE,IAAI,CAAC,OAAO,EACnB,OAAO,EAAE,MAAM,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,EAAA,EAErC,CAAQ,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,EACP,IAAI,CAAC,IAAI,IAAI,CAAM,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAC,MAAM,EAAC,SAAS,EAAE,IAAI,CAAC,IAAI,EAAI,CAAA,CAClD;;;;;;;"}

package/dist/ui-webc/ui-webc.css

@@ -0,0 +1 @@
+:root{--misc-color-annotations:#ff00ff;--color-blue-50:#e6eeff;--color-blue-100:#d0e0ff;--color-blue-200:#9cc3ff;--color-blue-300:#58a6ff;--color-blue-400:#0087e3;--color-blue-500:#006bb5;--color-blue-600:#00508a;--color-blue-700:#003660;--color-blue-800:#002748;--color-blue-900:#00162d;--color-blue-950:#000f21;--color-neutral-50:#ebf1f7;--color-neutral-100:#d7e4f0;--color-neutral-200:#b1cde3;--color-neutral-300:#87b3d4;--color-neutral-400:#749bb7;--color-neutral-500:#608199;--color-neutral-600:#4c667a;--color-neutral-700:#374b5a;--color-neutral-800:#25343f;--color-neutral-900:#131d24;--color-neutral-950:#0a1217;--color-white:#ffffff;--color-challengerpink-50:#fff0f2;--color-challengerpink-100:#ffdde3;--color-challengerpink-200:#ffbac7;--color-challengerpink-300:#ff93ab;--color-challengerpink-400:#ff668e;--color-challengerpink-500:#ff1271;--color-challengerpink-600:#da005e;--color-challengerpink-700:#a60046;--color-challengerpink-800:#72002e;--color-challengerpink-900:#470019;--color-challengerpink-950:#30000f;--color-orange-50:#fffbeb;--color-orange-100:#fef3c7;--color-orange-200:#fde68a;--color-orange-300:#fcd34d;--color-orange-400:#fbbf24;--color-orange-500:#f59e0b;--color-orange-600:#d97706;--color-orange-700:#b45309;--color-orange-800:#92400e;--color-orange-900:#78350f;--color-orange-950:#451a03;--color-gray-50:#f3f3f4;--color-gray-100:#e5e5e6;--color-gray-200:#cbccce;--color-gray-300:#b2b3b6;--color-gray-400:#9c9ea1;--color-gray-500:#85868a;--color-gray-600:#6e7073;--color-gray-700:#585a5c;--color-gray-800:#444547;--color-gray-900:#252627;--color-gray-950:#151616;--color-discovererblue-50:#eaf5ff;--color-discovererblue-100:#cde9ff;--color-discovererblue-200:#92d4ff;--color-discovererblue-300:#1ec0ff;--color-discovererblue-400:#00a8e1;--color-discovererblue-500:#008bbb;--color-discovererblue-600:#006d94;--color-discovererblue-700:#01516f;--color-discovererblue-800:#00394f;--color-discovererblue-900:#00202f;--color-discovererblue-950:#00131d;--color-trackergreen-50:#ccfec6;--color-trackergreen-100:#85fd72;--color-trackergreen-200:#5be23d;--color-trackergreen-300:#4ec333;--color-trackergreen-400:#41a629;--color-trackergreen-500:#348821;--color-trackergreen-600:#286c18;--color-trackergreen-700:#1c5110;--color-trackergreen-800:#113808;--color-trackergreen-900:#072103;--color-trackergreen-950:#031501;--color-green-50:#f0fdf4;--color-green-100:#dcfce7;--color-green-200:#b9f8cf;--color-green-300:#7bf1a8;--color-green-400:#05df72;--color-green-500:#00c950;--color-green-600:#00a63e;--color-green-700:#008236;--color-green-800:#016630;--color-green-900:#0d542b;--color-green-950:#032e15;--color-red-50:#fef2f2;--color-red-100:#ffe2e2;--color-red-200:#ffc9c9;--color-red-300:#ffa2a2;--color-red-400:#ff6467;--color-red-500:#fb2c36;--color-red-600:#e7000b;--color-red-700:#c10007;--color-red-800:#9f0712;--color-red-900:#82181a;--color-red-950:#460809;--color-black:#000000;--color-roveryellow-50:#fffd62;--color-roveryellow-100:#f4f203;--color-roveryellow-200:#e2e000;--color-roveryellow-300:#c3c100;--color-roveryellow-400:#a4a300;--color-roveryellow-500:#878500;--color-roveryellow-600:#6a6900;--color-roveryellow-700:#515000;--color-roveryellow-800:#373700;--color-roveryellow-900:#1f1f00;--color-roveryellow-950:#121200;--color-adventurerorange-50:#fff1ee;--color-adventurerorange-100:#fee2dd;--color-adventurerorange-200:#fec0b4;--color-adventurerorange-300:#fda18b;--color-adventurerorange-400:#fd7a4c;--color-adventurerorange-500:#e95f13;--color-adventurerorange-600:#b94a0d;--color-adventurerorange-700:#8e3708;--color-adventurerorange-800:#622303;--color-adventurerorange-900:#3c1301;--color-adventurerorange-950:#280a01;--fontsize-base:16px;--fontfamily-sans:"Source Sans 3 Variable", sans-serif;--spacing-base:4px;--color-text-caution-base:var(--color-orange-700);--color-text-caution-bold-base:var(--color-orange-50);--color-text-brand-base:var(--color-blue-700);--color-text-brand-inverse:var(--color-white);--color-text-danger-base:var(--color-red-700);--color-text-danger-bold-base:var(--color-red-50);--color-text-positive-bold-base:var(--color-green-50);--color-text-positive-base:var(--color-green-700);--color-text-base:var(--color-neutral-800);--color-background-danger-base:var(--color-red-100);--color-background-danger-bold-base:var(--color-red-700);--color-background-danger-bold-hovered:var(--color-red-800);--color-background-danger-bold-pressed:var(--color-red-900);--color-background-brand-subtle-hovered:var(--color-blue-50);--color-background-brand-subtle-pressed:var(--color-blue-100);--color-background-brand-subtle-base:var(--color-blue-700);--color-background-brand-hovered:var(--color-blue-800);--color-background-brand-pressed:var(--color-blue-900);--color-background-brand-base:var(--color-blue-700);--color-background-positive-base:var(--color-green-100);--color-background-positive-bold-base:var(--color-green-700);--color-background-positive-bold-hovered:var(--color-green-800);--color-background-positive-bold-pressed:var(--color-green-900);--color-background-caution-base:var(--color-orange-100);--color-background-caution-bold-base:var(--color-orange-700);--color-background-caution-bold-hovered:var(--color-orange-800);--color-background-caution-bold-pressed:var(--color-orange-900);--fontsize-lg:calc(var(--fontsize-base)*1.125);--fontsize-sm:calc(var(--fontsize-base)*0.875);--fontsize-xs:calc(var(--fontsize-base)*0.75);--fontsize-3xl:calc(var(--fontsize-base)*1.875);--fontsize-4xl:calc(var(--fontsize-base)*2.25);--fontsize-2xl:calc(var(--fontsize-base)*1.5);--fontsize-xl:calc(var(--fontsize-base)*1.25);--fontsize-6xl:calc(var(--fontsize-base)*3.75);--fontsize-5xl:calc(var(--fontsize-base)*3);--spacing-1:calc(var(--spacing-base)*1);--spacing-2:calc(var(--spacing-base)*2);--spacing-3:calc(var(--spacing-base)*3);--spacing-4:calc(var(--spacing-base)*4);--spacing-5:calc(var(--spacing-base)*5);--spacing-6:calc(var(--spacing-base)*6);--spacing-7:calc(var(--spacing-base)*7);--spacing-8:calc(var(--spacing-base)*8);--spacing-10:calc(var(--spacing-base)*10);--spacing-11:calc(var(--spacing-base)*11);--spacing-12:calc(var(--spacing-base)*12);--spacing-14:calc(var(--spacing-base)*14);--spacing-16:calc(var(--spacing-base)*16);--spacing-17:calc(var(--spacing-base)*17);--spacing-18:calc(var(--spacing-base)*18);--spacing-20:calc(var(--spacing-base)*20);--spacing-24:calc(var(--spacing-base)*24);--spacing-28:calc(var(--spacing-base)*28);--spacing-32:calc(var(--spacing-base)*32);--spacing-36:calc(var(--spacing-base)*36);--spacing-40:calc(var(--spacing-base)*40);--spacing-48:calc(var(--spacing-base)*48);--spacing-52:calc(var(--spacing-base)*52);--spacing-56:calc(var(--spacing-base)*56);--spacing-60:calc(var(--spacing-base)*60);--spacing-64:calc(var(--spacing-base)*64);--spacing-72:calc(var(--spacing-base)*72);--spacing-80:calc(var(--spacing-base)*80);--spacing-96:calc(var(--spacing-base)*96);--spacing-180:calc(var(--spacing-base)*180);--spacing-195:calc(var(--spacing-base)*195);--spacing-212:calc(var(--spacing-base)*212);--spacing-380:calc(var(--spacing-base)*380);--type-body-base:400 var(--fontsize-base)/1.5 var(--fontfamily-sans);--type-body-sm:400 var(--fontsize-sm)/1.5 var(--fontfamily-sans);--type-body-lg:400 var(--fontsize-lg)/1.5 var(--fontfamily-sans);--type-body-xl:400 var(--fontsize-xl)/1.5 var(--fontfamily-sans);--type-body-2xl:400 var(--fontsize-2xl)/1.5 var(--fontfamily-sans);--type-heading-xl:600 var(--fontsize-6xl)/1.2 var(--fontfamily-sans);--type-heading-lg:600 var(--fontsize-5xl)/1.2 var(--fontfamily-sans);--type-heading-base:600 var(--fontsize-4xl)/1.2 var(--fontfamily-sans);--type-heading-sm:600 var(--fontsize-3xl)/1.2 var(--fontfamily-sans);--type-heading-xs:600 var(--fontsize-2xl)/1.2 var(--fontfamily-sans);--type-label-base:400 var(--fontsize-base)/1.2 var(--fontfamily-sans);--type-label-2xl:400 var(--fontsize-2xl)/1.2 var(--fontfamily-sans);--type-label-lg:400 var(--fontsize-lg)/1.2 var(--fontfamily-sans);--type-label-sm:400 var(--fontsize-sm)/1.2 var(--fontfamily-sans);--type-label-xl:400 var(--fontsize-xl)/1.2 var(--fontfamily-sans)}/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;-webkit-text-decoration:underline;text-decoration:underline;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0;}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px;}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}.scout-button{display:inline-flex;align-items:center;justify-content:center;gap:calc(4px*3);gap:var(--spacing-3);height:calc(4px*10);height:var(--spacing-10);padding:0 calc(4px*4);padding:0 var(--spacing-4);font:400 16px/1.5 "Source Sans 3 Variable", sans-serif;font:var(--type-body-base);border-radius:calc(4px*2);border-radius:var(--spacing-2);border:1px solid transparent;cursor:pointer}.scout-button svg{width:calc(4px*5);width:var(--spacing-5);height:calc(4px*5);height:var(--spacing-5);margin:0 calc((4px*1) * -1);margin:0 calc(calc(4px*1) * -1);margin:0 calc(var(--spacing-1) * -1)}.scout-button.primary{background-color:#003660;background-color:var(--color-background-brand-base);color:#ffffff;color:var(--color-text-brand-inverse)}.scout-button.primary:hover{background-color:#002748;background-color:var(--color-background-brand-hovered)}.scout-button.primary:active{background-color:#00162d;background-color:var(--color-background-brand-pressed)}.scout-button.outlined{background-color:transparent;border-color:#003660;border-color:var(--color-background-brand-subtle-base);color:#003660;color:var(--color-text-brand-base)}.scout-button.outlined:hover{background-color:#e6eeff;background-color:var(--color-background-brand-subtle-hovered)}.scout-button.outlined:active{background-color:#d0e0ff;background-color:var(--color-background-brand-subtle-pressed)}.scout-button.text{background-color:transparent;border-color:transparent;color:#003660;color:var(--color-text-brand-base)}.scout-button.text:hover{background-color:#e6eeff;background-color:var(--color-background-brand-subtle-hovered)}.scout-button.text:active{background-color:#d0e0ff;background-color:var(--color-background-brand-subtle-pressed)}.scout-button.caution{background-color:#b45309;background-color:var(--color-background-caution-bold-base);color:#fffbeb;color:var(--color-text-caution-bold-base)}.scout-button.caution:hover{background-color:#92400e;background-color:var(--color-background-caution-bold-hovered)}.scout-button.caution:active{background-color:#78350f;background-color:var(--color-background-caution-bold-pressed)}.scout-button.danger{background-color:#c10007;background-color:var(--color-background-danger-bold-base);color:#fef2f2;color:var(--color-text-danger-bold-base)}.scout-button.danger:hover{background-color:#9f0712;background-color:var(--color-background-danger-bold-hovered)}.scout-button.danger:active{background-color:#82181a;background-color:var(--color-background-danger-bold-pressed)}.scout-type-body-base{font:400 16px/1.5 "Source Sans 3 Variable", sans-serif;font:var(--type-body-base)}.scout-type-body-sm{font:400 calc(16px*0.875)/1.5 "Source Sans 3 Variable", sans-serif;font:var(--type-body-sm)}.scout-type-body-lg{font:400 calc(16px*1.125)/1.5 "Source Sans 3 Variable", sans-serif;font:var(--type-body-lg)}.scout-type-body-xl{font:400 calc(16px*1.25)/1.5 "Source Sans 3 Variable", sans-serif;font:var(--type-body-xl)}.scout-type-body-2xl{font:400 calc(16px*1.5)/1.5 "Source Sans 3 Variable", sans-serif;font:var(--type-body-2xl)}.scout-type-heading-xl{font:600 calc(16px*3.75)/1.2 "Source Sans 3 Variable", sans-serif;font:var(--type-heading-xl)}.scout-type-heading-lg{font:600 calc(16px*3)/1.2 "Source Sans 3 Variable", sans-serif;font:var(--type-heading-lg)}.scout-type-heading-base{font:600 calc(16px*2.25)/1.2 "Source Sans 3 Variable", sans-serif;font:var(--type-heading-base)}.scout-type-heading-sm{font:600 calc(16px*1.875)/1.2 "Source Sans 3 Variable", sans-serif;font:var(--type-heading-sm)}.scout-type-heading-xs{font:600 calc(16px*1.5)/1.2 "Source Sans 3 Variable", sans-serif;font:var(--type-heading-xs)}.scout-type-label-base{font:400 16px/1.2 "Source Sans 3 Variable", sans-serif;font:var(--type-label-base)}.scout-type-label-2xl{font:400 calc(16px*1.5)/1.2 "Source Sans 3 Variable", sans-serif;font:var(--type-label-2xl)}.scout-type-label-lg{font:400 calc(16px*1.125)/1.2 "Source Sans 3 Variable", sans-serif;font:var(--type-label-lg)}.scout-type-label-sm{font:400 calc(16px*0.875)/1.2 "Source Sans 3 Variable", sans-serif;font:var(--type-label-sm)}.scout-type-label-xl{font:400 calc(16px*1.25)/1.2 "Source Sans 3 Variable", sans-serif;font:var(--type-label-xl)}:root{font-family:"Source Sans 3 Variable", sans-serif;font-optical-sizing:auto;font-weight:400;font-style:normal}

package/dist/ui-webc/ui-webc.esm.js

@@ -0,0 +1,2 @@
+import{p as t,g as o,b as a}from"./p-BKWL7m90.js";export{s as setNonce}from"./p-BKWL7m90.js";var e=()=>{const o=import.meta.url;const a={};if(o!==""){a.resourcesUrl=new URL(".",o).href}return t(a)};e().then((async t=>{await o();return a([["p-2b13b5cd",[[257,"scout-bottom-bar"]]],["p-81f97666",[[257,"scout-bottom-bar-item",{type:[1],href:[1],icon:[1],label:[1],active:[4]}]]],["p-30ef329b",[[257,"scout-button",{type:[1],variant:[1],icon:[1]}]]]],t)}));
+//# sourceMappingURL=ui-webc.esm.js.map

package/dist/ui-webc/ui-webc.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ui-webc.esm.js","sources":["../../node_modules/.pnpm/@stencil+core@4.38.1/node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.38.1 | MIT Licensed | https://stenciljs.com\n */\n\n// src/client/client-patch-browser.ts\nimport { BUILD, NAMESPACE } from \"@stencil/core/internal/app-data\";\nimport { consoleDevInfo, H, promiseResolve, win } from \"@stencil/core\";\nvar patchBrowser = () => {\n  if (BUILD.isDev && !BUILD.isTesting) {\n    consoleDevInfo(\"Running in development mode.\");\n  }\n  if (BUILD.cloneNodeFix) {\n    patchCloneNodeFix(H.prototype);\n  }\n  const scriptElm = BUILD.scriptDataOpts ? win.document && Array.from(win.document.querySelectorAll(\"script\")).find(\n    (s) => new RegExp(`/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) || s.getAttribute(\"data-stencil-namespace\") === NAMESPACE\n  ) : null;\n  const importMeta = import.meta.url;\n  const opts = BUILD.scriptDataOpts ? (scriptElm || {})[\"data-opts\"] || {} : {};\n  if (importMeta !== \"\") {\n    opts.resourcesUrl = new URL(\".\", importMeta).href;\n  }\n  return promiseResolve(opts);\n};\nvar patchCloneNodeFix = (HTMLElementPrototype) => {\n  const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n  HTMLElementPrototype.cloneNode = function(deep) {\n    if (this.nodeName === \"TEMPLATE\") {\n      return nativeCloneNodeFn.call(this, deep);\n    }\n    const clonedNode = nativeCloneNodeFn.call(this, false);\n    const srcChildNodes = this.childNodes;\n    if (deep) {\n      for (let i = 0; i < srcChildNodes.length; i++) {\n        if (srcChildNodes[i].nodeType !== 2) {\n          clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n        }\n      }\n    }\n    return clonedNode;\n  };\n};\nexport {\n  patchBrowser\n};\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(async (options) => {\n  await globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"names":[],"mappings":";;;AAAA;AACA;AACA;;AAKA,IAAI,YAAY,GAAG,MAAM;AAUzB,EAAE,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,GAAG;AACpC,EAAE,MAAM,IAAI,GAAiE,EAAE;AAC/E,EAAE,IAAI,UAAU,KAAK,EAAE,EAAE;AACzB,IAAI,IAAI,CAAC,YAAY,GAAG,IAAI,GAAG,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC,IAAI;AACrD;AACA,EAAE,OAAO,cAAc,CAAC,IAAI,CAAC;AAC7B,CAAC;;ACnBD,YAAY,EAAE,CAAC,IAAI,CAAC,OAAO,OAAO,KAAK;AACvC,EAAE,MAAM,aAAa,EAAE;AACvB,EAAE,OAAO,aAAa,CAAC,4BAA4B,EAAE,OAAO,CAAC;AAC7D,CAAC,CAAC","x_google_ignoreList":[0]}

package/loader/cdn.js

@@ -0,0 +1 @@
+module.exports = require('../dist/cjs/loader.cjs.js');

package/loader/index.cjs.js

@@ -0,0 +1 @@
+module.exports = require('../dist/cjs/loader.cjs.js');

package/loader/index.d.ts

@@ -0,0 +1,24 @@
+export * from '../dist/types/components';
+export interface CustomElementsDefineOptions {
+  exclude?: string[];
+  resourcesUrl?: string;
+  syncQueue?: boolean;
+  jmp?: (c: Function) => any;
+  raf?: (c: FrameRequestCallback) => number;
+  ael?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
+  rel?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
+}
+export declare function defineCustomElements(win?: Window, opts?: CustomElementsDefineOptions): void;
+/**
+ * @deprecated
+ */
+export declare function applyPolyfills(): Promise<void>;
+
+/**
+ * Used to specify a nonce value that corresponds with an application's CSP.
+ * When set, the nonce will be added to all dynamically created script and style tags at runtime.
+ * Alternatively, the nonce value can be set on a meta tag in the DOM head
+ * (<meta name="csp-nonce" content="{ nonce value here }" />) which
+ * will result in the same behavior.
+ */
+export declare function setNonce(nonce: string): void;

package/loader/index.es2017.js

@@ -0,0 +1 @@
+export * from '../dist/esm/loader.js';

package/loader/index.js

@@ -0,0 +1,2 @@
+(function(){if("undefined"!==typeof window&&void 0!==window.Reflect&&void 0!==window.customElements){var a=HTMLElement;window.HTMLElement=function(){return Reflect.construct(a,[],this.constructor)};HTMLElement.prototype=a.prototype;HTMLElement.prototype.constructor=HTMLElement;Object.setPrototypeOf(HTMLElement,a)}})();
+export * from '../dist/esm/loader.js';

package/package.json

@@ -0,0 +1,73 @@
+{
+  "name": "@scouterna/ui-webc",
+  "version": "0.2.0",
+  "type": "module",
+  "description": "Stencil Component Starter",
+  "main": "dist/index.cjs.js",
+  "module": "dist/index.js",
+  "types": "dist/types/index.d.ts",
+  "collection": "dist/collection/collection-manifest.json",
+  "collection:main": "dist/collection/index.js",
+  "unpkg": "dist/ui-webc/ui-webc.esm.js",
+  "exports": {
+    ".": {
+      "import": "./dist/ui-webc/ui-webc.esm.js",
+      "require": "./dist/ui-webc/ui-webc.cjs.js"
+    },
+    "./style.css": {
+      "import": "./dist/ui-webc/ui-webc.css",
+      "require": "./dist/ui-webc/ui-webc.css"
+    },
+    "./dist/*": {
+      "import": "./dist/*",
+      "types": "./dist/*"
+    },
+    "./components/*": {
+      "import": "./dist/components/*.js",
+      "types": "./dist/components/*.d.ts"
+    },
+    "./loader": {
+      "import": "./loader/index.js",
+      "require": "./loader/index.cjs",
+      "types": "./loader/index.d.ts"
+    }
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/stenciljs/component-starter.git"
+  },
+  "files": [
+    "dist/",
+    "loader/"
+  ],
+  "dependencies": {
+    "@stencil/react-output-target": "^1.2.0",
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
+    "iconoir": "^7.11.0",
+    "normalize.css": "^8.0.1",
+    "@scouterna/design-tokens": "^0.0.1"
+  },
+  "devDependencies": {
+    "@stencil-community/postcss": "^2.2.0",
+    "@stencil/core": "^4.38.1",
+    "@types/jest": "^29.5.14",
+    "@types/node": "^22.13.5",
+    "jest": "^29.7.0",
+    "jest-cli": "^29.7.0",
+    "plop": "^4.0.4",
+    "postcss-import": "^16.1.1",
+    "postcss-preset-env": "^10.4.0",
+    "puppeteer": "^24.3.0"
+  },
+  "license": "MIT",
+  "scripts": {
+    "build": "stencil build",
+    "dev": "stencil build --watch",
+    "serve": "stencil build --watch --serve",
+    "test": "stencil test --spec --e2e",
+    "test:watch": "stencil test --spec --e2e --watchAll",
+    "generate": "stencil generate",
+    "plop": "plop"
+  }
+}

package/readme.md

@@ -0,0 +1,111 @@
+[![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)](https://stenciljs.com)
+
+# Stencil Component Starter
+
+> This is a starter project for building a standalone Web Components using Stencil.
+
+Stencil is a compiler for building fast web apps using Web Components.
+
+Stencil combines the best concepts of the most popular frontend frameworks into a compile-time rather than runtime tool. Stencil takes TypeScript, JSX, a tiny virtual DOM layer, efficient one-way data binding, an asynchronous rendering pipeline (similar to React Fiber), and lazy-loading out of the box, and generates 100% standards-based Web Components that run in any browser supporting the Custom Elements specification.
+
+Stencil components are just Web Components, so they work in any major framework or with no framework at all.
+
+## Getting Started
+
+To start building a new web component using Stencil, clone this repo to a new directory:
+
+```bash
+git clone https://github.com/stenciljs/component-starter.git my-component
+cd my-component
+git remote rm origin
+```
+
+and run:
+
+```bash
+npm install
+npm start
+```
+
+To build the component for production, run:
+
+```bash
+npm run build
+```
+
+To run the unit tests for the components, run:
+
+```bash
+npm test
+```
+
+Need help? Check out our docs [here](https://stenciljs.com/docs/my-first-component).
+
+## Naming Components
+
+When creating new component tags, we recommend _not_ using `stencil` in the component name (ex: `<stencil-datepicker>`). This is because the generated component has little to nothing to do with Stencil; it's just a web component!
+
+Instead, use a prefix that fits your company or any name for a group of related components. For example, all of the [Ionic-generated](https://ionicframework.com/) web components use the prefix `ion`.
+
+## Using this component
+
+There are two strategies we recommend for using web components built with Stencil.
+
+The first step for all two of these strategies is to [publish to NPM](https://docs.npmjs.com/getting-started/publishing-npm-packages).
+
+You can read more about these different approaches in the [Stencil docs](https://stenciljs.com/docs/publishing).
+
+### Lazy Loading
+
+If your Stencil project is built with the [`dist`](https://stenciljs.com/docs/distribution) output target, you can import a small bootstrap script that registers all components and allows you to load individual component scripts lazily.
+
+For example, given your Stencil project namespace is called `my-design-system`, to use `my-component` on any website, inject this into your HTML:
+
+```html
+<script type="module" src="https://unpkg.com/my-design-system"></script>
+<!--
+To avoid unpkg.com redirects to the actual file, you can also directly import:
+https://unpkg.com/foobar-design-system@0.0.1/dist/foobar-design-system/foobar-design-system.esm.js
+-->
+<my-component first="Stencil" middle="'Don't call me a framework'" last="JS"></my-component>
+```
+
+This will only load the necessary scripts needed to render `<my-component />`. Once more components of this package are used, they will automatically be loaded lazily.
+
+You can also import the script as part of your `node_modules` in your applications entry file:
+
+```tsx
+import 'foobar-design-system/dist/foobar-design-system/foobar-design-system.esm.js';
+```
+
+Check out this [Live Demo](https://stackblitz.com/edit/vitejs-vite-y6v26a?file=src%2Fmain.tsx).
+
+### Standalone
+
+If you are using a Stencil component library with `dist-custom-elements`, we recommend importing Stencil components individually in those files where they are needed.
+
+To export Stencil components as standalone components make sure you have the [`dist-custom-elements`](https://stenciljs.com/docs/custom-elements) output target defined in your `stencil.config.ts`.
+
+For example, given you'd like to use `<my-component />` as part of a React component, you can import the component directly via:
+
+```tsx
+import 'foobar-design-system/my-component';
+
+function App() {
+  return (
+    <>
+      <div>
+        <my-component
+          first="Stencil"
+          middle="'Don't call me a framework'"
+          last="JS"
+        ></my-component>
+      </div>
+    </>
+  );
+}
+
+export default App;
+```
+
+Check out this [Live Demo](https://stackblitz.com/edit/vitejs-vite-b6zuds?file=src%2FApp.tsx).