@abgov/react-components 4.0.0-alpha.36 → 4.0.0-alpha.39

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.
Files changed (5) hide show
  1. package/lib/button/button.d.ts +2 -2
  2. package/lib/container/container.d.ts +7 -7
  3. package/package.json +1 -1
  4. package/react-components.esm.js +13 -13
  5. package/react-components.umd.js +10 -13
package/lib/button/button.d.ts CHANGED
@@ -2,8 +2,8 @@ import React, { FC, ReactNode } from 'react';
2
2
  import './button.css';
3
3
  import { GoAIconType } from '../icons';
4
4
  export declare type ButtonType = 'primary' | 'secondary' | 'tertiary' | 'start';
5
- export declare type ButtonSize = 'compact' | '';
6
- export declare type ButtonVariant = '' | 'destructive';
5
+ export declare type ButtonSize = 'compact' | 'normal';
6
+ export declare type ButtonVariant = 'normal' | 'destructive';
7
7
  interface WCProps {
8
8
  type?: ButtonType;
9
9
  size?: ButtonSize;
package/lib/container/container.d.ts CHANGED
@@ -1,12 +1,12 @@
1
1
  import React, { FC, ReactNode } from 'react';
2
- declare type ContainerVariant = 'primary' | 'info' | 'error' | 'success' | 'warning' | 'default';
2
+ declare type ContainerVariant = 'interactive' | 'non-interactive' | 'info' | 'error' | 'success' | 'warning';
3
3
  declare type HeadingSize = 'large' | 'small' | 'none';
4
4
  declare type ContainerPadding = "relaxed" | "compact";
5
5
  interface WCProps {
6
- variant: ContainerVariant;
7
- headingsize: HeadingSize;
8
- colored: boolean;
9
- padding: ContainerPadding;
6
+ variant?: ContainerVariant;
7
+ headingsize?: HeadingSize;
8
+ colored?: boolean;
9
+ padding?: ContainerPadding;
10
10
  }
11
11
  declare global {
12
12
  namespace JSX {
@@ -16,11 +16,11 @@ declare global {
16
16
  }
17
17
  }
18
18
  interface Props {
19
- headingSize: HeadingSize;
19
+ headingSize?: HeadingSize;
20
20
  variant?: ContainerVariant;
21
21
  title?: ReactNode;
22
22
  colored?: boolean;
23
- padding: ContainerPadding;
23
+ padding?: ContainerPadding;
24
24
  actions?: ReactNode;
25
25
  }
26
26
  export declare const GoAContainer: FC<Props>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@abgov/react-components",
3
- "version": "4.0.0-alpha.36",
3
+ "version": "4.0.0-alpha.39",
4
4
  "description": "Government of Alberta - UI components for React",
5
5
  "bugs": {
6
6
  "url": "https://github.com/GovAlta/ui-components/issues"
package/react-components.esm.js CHANGED
@@ -2114,9 +2114,9 @@ function clickHandler(e) {
2114
2114
  function instance$w($$self, $$props, $$invalidate) {
2115
2115
  let isDisabled;
2116
2116
  let isButtonDark;
2117
- const BUTTON_TYPES = ["primary", "secondary", "tertiary", "start"];
2118
- const SIZES = ["", "compact"];
2119
- const VARIANTS = ["", "destructive"]; // type check functions
2117
+ const BUTTON_TYPES = ["primary", "submit", "secondary", "tertiary", "start"];
2118
+ const SIZES = ["normal", "compact"];
2119
+ const VARIANTS = ["normal", "destructive"]; // type check functions
2120
2120
 
2121
2121
  function isButtonType(value) {
2122
2122
  return BUTTON_TYPES.includes(value);
@@ -2134,10 +2134,10 @@ function instance$w($$self, $$props, $$invalidate) {
2134
2134
  type = "primary"
2135
2135
  } = $$props;
2136
2136
  let {
2137
- size = ""
2137
+ size = "normal"
2138
2138
  } = $$props;
2139
2139
  let {
2140
- variant = ""
2140
+ variant = "normal"
2141
2141
  } = $$props;
2142
2142
  let {
2143
2143
  title = ""
@@ -2200,7 +2200,7 @@ class Button extends SvelteElement {
2200
2200
  constructor(options) {
2201
2201
  super();
2202
2202
  this.shadowRoot.innerHTML = `<style>:host{box-sizing:border-box;font-family:var(--font-family)}@media(max-width: 480px){:host{width:100%}button{width:100%}}button{display:inline-flex;box-sizing:border-box;border-radius:0.25rem;border:2px solid var(--goa-color-interactive);box-sizing:border-box;cursor:pointer;font-family:var(--font-family);font-size:var(--fs-lg);font-weight:400;height:var(--button-height);letter-spacing:0.5px;line-height:100%;padding:0 0.75rem;gap:0.5rem;align-items:center;justify-content:center;transition:transform 0.1s ease-in-out, background-color 0.2s ease-in-out,
2203
- border-color 0.2s ease-in-out}.text{padding-bottom:var(--font-valign-fix)}button:disabled{pointer-events:none;opacity:0.5}button.compact{height:var(--button-height-compact);font-size:var(--fs-base)}button.start{height:var(--button-height-tall);font-weight:var(--fw-bold)}button.start,button.primary{border:2px solid var(--goa-color-interactive);background:var(--goa-color-interactive);color:var(--goa-color-text-light)}button.start:hover,button.primary:hover{border-color:var(--goa-color-interactive--hover);background:var(--goa-color-interactive--hover)}button.start:focus,button.start:active,button.primary:focus,button.primary:active{box-shadow:0 0 0 3px var(--goa-color-interactive--focus);border-color:var(--goa-color-interactive--active);background:var(--goa-color-interactive--active);outline:none}button.secondary{border:2px solid var(--goa-color-interactive);background:var(--color-white);color:var(--goa-color-interactive)}button.secondary:hover{border-color:var(--goa-color-interactive--hover);color:var(--goa-color-interactive--hover);background:var(--color-gray-100)}button.secondary:focus,button.secondary:active{border-color:var(--goa-color-interactive--active);box-shadow:0 0 0 3px var(--goa-color-interactive--focus);background:var(--color-gray-100);outline:none}button.tertiary{border:1px solid transparent;background:transparent;color:var(--goa-color-interactive);text-decoration:underline}button.tertiary:hover{border-color:var(--color-gray-100);color:var(--goa-color-interactive--hover);background:var(--color-gray-100)}button.tertiary:focus,button.tertiary:active{border-color:var(--color-gray-100);background:var(--color-gray-100);color:var(--goa-color-interactive--active);box-shadow:0 0 0 3px var(--goa-color-interactive--focus);outline:none}.primary.destructive{color:var(--color-white);background:var(--goa-color-status-emergency);border-color:var(--goa-color-status-emergency)}.primary.destructive:hover{background:var(--goa-color-status-emergency-dark);border-color:var(--goa-color-status-emergency-dark)}.primary.destructive:focus,.primary.destructive:active{background:var(--goa-color-status-emergency-dark);border-color:var(--goa-color-status-emergency-dark)}.secondary.destructive{color:var(--goa-color-status-emergency);border-color:var(--goa-color-status-emergency);background:var(--color-white)}.secondary.destructive:hover{border-color:var(--goa-color-status-emergency-dark);color:var(--goa-color-status-emergency-dark);background:var(--color-white)}.secondary.destructive:focus,.secondary.destructive:active{color:var(--goa-color-status-emergency-dark);border-color:var(--goa-color-status-emergency-dark);background:var(--color-white)}.tertiary.destructive{color:var(--goa-color-status-emergency);border-color:var(--color-gray-200);background:var(--color-white)}.tertiary.destructive:hover{border-color:var(--goa-color-status-emergency-dark);color:var(--goa-color-status-emergency-dark);background:var(--color-white)}.tertiary.destructive:focus,.tertiary.destructive:active{color:var(--goa-color-status-emergency-dark);border-color:var(--goa-color-status-emergency-dark);background:var(--color-white)}</style>`;
2203
+ border-color 0.2s ease-in-out}.text{padding-bottom:var(--font-valign-fix)}button:disabled{pointer-events:none;opacity:0.5}button.compact{height:var(--button-height-compact);font-size:var(--fs-base)}button.start{height:var(--button-height-tall);font-weight:var(--fw-bold)}button.start,button.submit,button.primary{border:2px solid var(--goa-color-interactive);background:var(--goa-color-interactive);color:var(--goa-color-text-light)}button.start:hover,button.submit:hover,button.primary:hover{border-color:var(--goa-color-interactive--hover);background:var(--goa-color-interactive--hover)}button.start:focus,button.start:active,button.submit:focus,button.submit:active,button.primary:focus,button.primary:active{box-shadow:0 0 0 3px var(--goa-color-interactive--focus);border-color:var(--goa-color-interactive--active);background:var(--goa-color-interactive--active);outline:none}button.secondary{border:2px solid var(--goa-color-interactive);background:var(--color-white);color:var(--goa-color-interactive)}button.secondary:hover{border-color:var(--goa-color-interactive--hover);color:var(--goa-color-interactive--hover);background:var(--color-gray-100)}button.secondary:focus,button.secondary:active{border-color:var(--goa-color-interactive--active);box-shadow:0 0 0 3px var(--goa-color-interactive--focus);background:var(--color-gray-100);outline:none}button.tertiary{border:1px solid transparent;background:transparent;color:var(--goa-color-interactive);text-decoration:underline}button.tertiary:hover{border-color:var(--color-gray-100);color:var(--goa-color-interactive--hover);background:var(--color-gray-100)}button.tertiary:focus,button.tertiary:active{border-color:var(--color-gray-100);background:var(--color-gray-100);color:var(--goa-color-interactive--active);box-shadow:0 0 0 3px var(--goa-color-interactive--focus);outline:none}.submit.destructive,.primary.destructive{color:var(--color-white);background:var(--goa-color-status-emergency);border-color:var(--goa-color-status-emergency)}.submit.destructive:hover,.primary.destructive:hover{background:var(--goa-color-status-emergency-dark);border-color:var(--goa-color-status-emergency-dark)}.submit.destructive:focus,.primary.destructive:focus,.primary.destructive:active{background:var(--goa-color-status-emergency-dark);border-color:var(--goa-color-status-emergency-dark)}.secondary.destructive{color:var(--goa-color-status-emergency);border-color:var(--goa-color-status-emergency);background:var(--color-white)}.secondary.destructive:hover{border-color:var(--goa-color-status-emergency-dark);color:var(--goa-color-status-emergency-dark);background:var(--color-white)}.secondary.destructive:focus,.secondary.destructive:active{color:var(--goa-color-status-emergency-dark);border-color:var(--goa-color-status-emergency-dark);background:var(--color-white)}.tertiary.destructive{color:var(--goa-color-status-emergency);border-color:var(--color-gray-200);background:var(--color-white)}.tertiary.destructive:hover{border-color:var(--goa-color-status-emergency-dark);color:var(--goa-color-status-emergency-dark);background:var(--color-white)}.tertiary.destructive:focus,.tertiary.destructive:active{color:var(--goa-color-status-emergency-dark);border-color:var(--goa-color-status-emergency-dark);background:var(--color-white)}</style>`;
2204
2204
  init(this, {
2205
2205
  target: this.shadowRoot,
2206
2206
  props: attribute_to_object(this.attributes),
@@ -4059,7 +4059,7 @@ function instance$p($$self, $$props, $$invalidate) {
4059
4059
  class Container extends SvelteElement {
4060
4060
  constructor(options) {
4061
4061
  super();
4062
- this.shadowRoot.innerHTML = `<style>:host{box-sizing:border-box;font-family:var(--font-family);font-size:var(--fs-base)}.goa-container{margin-bottom:1rem;box-sizing:border-box}.goa-container *{box-sizing:border-box}header{display:flex;align-items:center;justify-content:space-between;font-weight:700;font-size:var(--fs-base);border-width:1px;border-style:solid;border-top-left-radius:var(--border-radius);border-top-right-radius:var(--border-radius)}.content{border-bottom:1px solid var(--color-gray-200);border-left:1px solid var(--color-gray-200);border-right:1px solid var(--color-gray-200);border-bottom-left-radius:var(--border-radius);border-bottom-right-radius:var(--border-radius)}.goa-container--non-interactive.colored .content{border-color:var(--color-gray-200);background-color:var(--color-gray-100)}.goa-container--important.colored .content{border-color:var(--goa-color-status-warning);background-color:var(--goa-color-status-warning-50)}.goa-container--error.colored .content{border-color:var(--goa-color-status-emergency);background-color:var(--goa-color-status-emergency-50)}.goa-container--success.colored .content{border-color:var(--goa-color-status-success);background-color:var(--goa-color-status-success-50)}.goa-container--info.colored .content{border-color:var(--goa-color-status-info);background-color:var(--goa-color-status-info-50)}.title>*,.actions>*{line-height:3rem}.padding--relaxed header{padding:0 1.5rem}.padding--relaxed .content{padding:1.5rem}.padding--compact header,.padding--compact .content{padding:0 1rem}.padding--compact header{padding:0 1rem}.padding--compact .content{padding:1rem}@media screen and (max-width: 480px){.padding--relaxed header{padding:0 1rem}.padding--relaxed .content{padding:1rem}}.goa-container--non-interactive header{background-color:var(--color-gray-100);border-color:var(--color-gray-200);color:var(--color-black)}.goa-container--interactive header{background-color:var(--goa-color-brand);border-color:var(--goa-color-brand);color:var(--color-white)}.goa-container--info header{background-color:var(--goa-color-status-info);border-color:var(--goa-color-status-info);color:var(--color-white)}.goa-container--error header{background-color:var(--goa-color-status-emergency);border-color:var(--goa-color-status-emergency);color:var(--color-white)}.goa-container--success header{background-color:var(--goa-color-status-success);border-color:var(--goa-color-status-success);color:var(--color-white)}.goa-container--important header{background-color:var(--goa-color-status-warning);border-color:var(--goa-color-status-warning);color:var(--color-white)}.heading--large{padding:0.5rem 1.5rem;max-height:3rem;min-height:1rem}.heading--large .title{line-height:2rem}.heading--small{height:0.5rem}.heading--none{display:none}.heading--none~.content{border-top:1px solid var(--color-gray-200);border-top-left-radius:var(--border-radius);border-top-right-radius:var(--border-radius)}.heading--small .title,.heading--small .actions{display:none}.actions{display:flex;align-items:center}</style>`;
4062
+ this.shadowRoot.innerHTML = `<style>:host{box-sizing:border-box;font-family:var(--font-family);font-size:var(--fs-base)}.goa-container{margin-bottom:1rem;box-sizing:border-box}.goa-container *{box-sizing:border-box}header{display:flex;align-items:center;justify-content:space-between;font-weight:700;font-size:var(--fs-base);border-width:1px;border-style:solid;border-top-left-radius:var(--border-radius);border-top-right-radius:var(--border-radius)}.content{border-bottom:1px solid var(--color-gray-200);border-left:1px solid var(--color-gray-200);border-right:1px solid var(--color-gray-200);border-bottom-left-radius:var(--border-radius);border-bottom-right-radius:var(--border-radius)}.goa-container--non-interactive.colored .content{border-color:var(--color-gray-200);background-color:var(--color-gray-100)}.goa-container--important.colored .content{border-color:var(--goa-color-status-warning);background-color:var(--goa-color-status-warning-50)}.goa-container--error.colored .content{border-color:var(--goa-color-status-emergency);background-color:var(--goa-color-status-emergency-50)}.goa-container--success.colored .content{border-color:var(--goa-color-status-success);background-color:var(--goa-color-status-success-50)}.goa-container--info.colored .content{border-color:var(--goa-color-status-info);background-color:var(--goa-color-status-info-50)}.title,.actions{padding:0.5rem 0}.padding--relaxed header{padding:0 1.5rem}.padding--relaxed .content{padding:1.5rem}.padding--compact header,.padding--compact .content{padding:0 1rem}.padding--compact header{padding:0 1rem}.padding--compact .content{padding:1rem}@media screen and (max-width: 480px){.padding--relaxed header{padding:0 1rem}.padding--relaxed .content{padding:1rem}}.goa-container--non-interactive header{background-color:var(--color-gray-100);border-color:var(--color-gray-200);color:var(--color-black)}.goa-container--interactive header{background-color:var(--goa-color-brand);border-color:var(--goa-color-brand);color:var(--color-white)}.goa-container--info header{background-color:var(--goa-color-status-info);border-color:var(--goa-color-status-info);color:var(--color-white)}.goa-container--error header{background-color:var(--goa-color-status-emergency);border-color:var(--goa-color-status-emergency);color:var(--color-white)}.goa-container--success header{background-color:var(--goa-color-status-success);border-color:var(--goa-color-status-success);color:var(--color-white)}.goa-container--important header{background-color:var(--goa-color-status-warning);border-color:var(--goa-color-status-warning);color:var(--color-white)}.heading--large{padding:0.5rem 1.5rem;max-height:3rem;min-height:1rem}.heading--large .title{line-height:2rem}.heading--small{height:0.5rem}.heading--none{display:none}.heading--none~.content{border-top:1px solid var(--color-gray-200);border-top-left-radius:var(--border-radius);border-top-right-radius:var(--border-radius)}.heading--small .title,.heading--small .actions{display:none}.actions{display:flex;align-items:center}</style>`;
4063
4063
  init(this, {
4064
4064
  target: this.shadowRoot,
4065
4065
  props: attribute_to_object(this.attributes),
@@ -14081,8 +14081,8 @@ const GoAButton = ({
14081
14081
  title,
14082
14082
  disabled: _disabled = false,
14083
14083
  type: _type = 'primary',
14084
- size: _size = '',
14085
- variant: _variant = '',
14084
+ size,
14085
+ variant,
14086
14086
  leadingIcon,
14087
14087
  trailingIcon,
14088
14088
  children,
@@ -14109,8 +14109,8 @@ const GoAButton = ({
14109
14109
  ref: el,
14110
14110
  role: "button",
14111
14111
  type: _type,
14112
- size: _size,
14113
- variant: _variant,
14112
+ size: size,
14113
+ variant: variant,
14114
14114
  disabled: _disabled,
14115
14115
  title: title,
14116
14116
  leadingicon: leadingIcon,
@@ -14245,10 +14245,10 @@ const GoAContainer = ({
14245
14245
  padding,
14246
14246
  children,
14247
14247
  actions,
14248
- variant: _variant = 'default'
14248
+ variant
14249
14249
  }) => {
14250
14250
  return jsxs("goa-container", Object.assign({
14251
- variant: _variant,
14251
+ variant: variant,
14252
14252
  padding: padding,
14253
14253
  headingsize: headingSize,
14254
14254
  colored: _colored
package/react-components.umd.js CHANGED
@@ -2169,9 +2169,9 @@
2169
2169
  function instance$w($$self, $$props, $$invalidate) {
2170
2170
  let isDisabled;
2171
2171
  let isButtonDark;
2172
- const BUTTON_TYPES = ["primary", "secondary", "tertiary", "start"];
2173
- const SIZES = ["", "compact"];
2174
- const VARIANTS = ["", "destructive"]; // type check functions
2172
+ const BUTTON_TYPES = ["primary", "submit", "secondary", "tertiary", "start"];
2173
+ const SIZES = ["normal", "compact"];
2174
+ const VARIANTS = ["normal", "destructive"]; // type check functions
2175
2175
 
2176
2176
  function isButtonType(value) {
2177
2177
  return BUTTON_TYPES.includes(value);
@@ -2189,10 +2189,10 @@
2189
2189
  type = "primary"
2190
2190
  } = $$props;
2191
2191
  let {
2192
- size = ""
2192
+ size = "normal"
2193
2193
  } = $$props;
2194
2194
  let {
2195
- variant = ""
2195
+ variant = "normal"
2196
2196
  } = $$props;
2197
2197
  let {
2198
2198
  title = ""
@@ -2255,7 +2255,7 @@
2255
2255
  constructor(options) {
2256
2256
  super();
2257
2257
  this.shadowRoot.innerHTML = `<style>:host{box-sizing:border-box;font-family:var(--font-family)}@media(max-width: 480px){:host{width:100%}button{width:100%}}button{display:inline-flex;box-sizing:border-box;border-radius:0.25rem;border:2px solid var(--goa-color-interactive);box-sizing:border-box;cursor:pointer;font-family:var(--font-family);font-size:var(--fs-lg);font-weight:400;height:var(--button-height);letter-spacing:0.5px;line-height:100%;padding:0 0.75rem;gap:0.5rem;align-items:center;justify-content:center;transition:transform 0.1s ease-in-out, background-color 0.2s ease-in-out,
2258
- border-color 0.2s ease-in-out}.text{padding-bottom:var(--font-valign-fix)}button:disabled{pointer-events:none;opacity:0.5}button.compact{height:var(--button-height-compact);font-size:var(--fs-base)}button.start{height:var(--button-height-tall);font-weight:var(--fw-bold)}button.start,button.primary{border:2px solid var(--goa-color-interactive);background:var(--goa-color-interactive);color:var(--goa-color-text-light)}button.start:hover,button.primary:hover{border-color:var(--goa-color-interactive--hover);background:var(--goa-color-interactive--hover)}button.start:focus,button.start:active,button.primary:focus,button.primary:active{box-shadow:0 0 0 3px var(--goa-color-interactive--focus);border-color:var(--goa-color-interactive--active);background:var(--goa-color-interactive--active);outline:none}button.secondary{border:2px solid var(--goa-color-interactive);background:var(--color-white);color:var(--goa-color-interactive)}button.secondary:hover{border-color:var(--goa-color-interactive--hover);color:var(--goa-color-interactive--hover);background:var(--color-gray-100)}button.secondary:focus,button.secondary:active{border-color:var(--goa-color-interactive--active);box-shadow:0 0 0 3px var(--goa-color-interactive--focus);background:var(--color-gray-100);outline:none}button.tertiary{border:1px solid transparent;background:transparent;color:var(--goa-color-interactive);text-decoration:underline}button.tertiary:hover{border-color:var(--color-gray-100);color:var(--goa-color-interactive--hover);background:var(--color-gray-100)}button.tertiary:focus,button.tertiary:active{border-color:var(--color-gray-100);background:var(--color-gray-100);color:var(--goa-color-interactive--active);box-shadow:0 0 0 3px var(--goa-color-interactive--focus);outline:none}.primary.destructive{color:var(--color-white);background:var(--goa-color-status-emergency);border-color:var(--goa-color-status-emergency)}.primary.destructive:hover{background:var(--goa-color-status-emergency-dark);border-color:var(--goa-color-status-emergency-dark)}.primary.destructive:focus,.primary.destructive:active{background:var(--goa-color-status-emergency-dark);border-color:var(--goa-color-status-emergency-dark)}.secondary.destructive{color:var(--goa-color-status-emergency);border-color:var(--goa-color-status-emergency);background:var(--color-white)}.secondary.destructive:hover{border-color:var(--goa-color-status-emergency-dark);color:var(--goa-color-status-emergency-dark);background:var(--color-white)}.secondary.destructive:focus,.secondary.destructive:active{color:var(--goa-color-status-emergency-dark);border-color:var(--goa-color-status-emergency-dark);background:var(--color-white)}.tertiary.destructive{color:var(--goa-color-status-emergency);border-color:var(--color-gray-200);background:var(--color-white)}.tertiary.destructive:hover{border-color:var(--goa-color-status-emergency-dark);color:var(--goa-color-status-emergency-dark);background:var(--color-white)}.tertiary.destructive:focus,.tertiary.destructive:active{color:var(--goa-color-status-emergency-dark);border-color:var(--goa-color-status-emergency-dark);background:var(--color-white)}</style>`;
2258
+ border-color 0.2s ease-in-out}.text{padding-bottom:var(--font-valign-fix)}button:disabled{pointer-events:none;opacity:0.5}button.compact{height:var(--button-height-compact);font-size:var(--fs-base)}button.start{height:var(--button-height-tall);font-weight:var(--fw-bold)}button.start,button.submit,button.primary{border:2px solid var(--goa-color-interactive);background:var(--goa-color-interactive);color:var(--goa-color-text-light)}button.start:hover,button.submit:hover,button.primary:hover{border-color:var(--goa-color-interactive--hover);background:var(--goa-color-interactive--hover)}button.start:focus,button.start:active,button.submit:focus,button.submit:active,button.primary:focus,button.primary:active{box-shadow:0 0 0 3px var(--goa-color-interactive--focus);border-color:var(--goa-color-interactive--active);background:var(--goa-color-interactive--active);outline:none}button.secondary{border:2px solid var(--goa-color-interactive);background:var(--color-white);color:var(--goa-color-interactive)}button.secondary:hover{border-color:var(--goa-color-interactive--hover);color:var(--goa-color-interactive--hover);background:var(--color-gray-100)}button.secondary:focus,button.secondary:active{border-color:var(--goa-color-interactive--active);box-shadow:0 0 0 3px var(--goa-color-interactive--focus);background:var(--color-gray-100);outline:none}button.tertiary{border:1px solid transparent;background:transparent;color:var(--goa-color-interactive);text-decoration:underline}button.tertiary:hover{border-color:var(--color-gray-100);color:var(--goa-color-interactive--hover);background:var(--color-gray-100)}button.tertiary:focus,button.tertiary:active{border-color:var(--color-gray-100);background:var(--color-gray-100);color:var(--goa-color-interactive--active);box-shadow:0 0 0 3px var(--goa-color-interactive--focus);outline:none}.submit.destructive,.primary.destructive{color:var(--color-white);background:var(--goa-color-status-emergency);border-color:var(--goa-color-status-emergency)}.submit.destructive:hover,.primary.destructive:hover{background:var(--goa-color-status-emergency-dark);border-color:var(--goa-color-status-emergency-dark)}.submit.destructive:focus,.primary.destructive:focus,.primary.destructive:active{background:var(--goa-color-status-emergency-dark);border-color:var(--goa-color-status-emergency-dark)}.secondary.destructive{color:var(--goa-color-status-emergency);border-color:var(--goa-color-status-emergency);background:var(--color-white)}.secondary.destructive:hover{border-color:var(--goa-color-status-emergency-dark);color:var(--goa-color-status-emergency-dark);background:var(--color-white)}.secondary.destructive:focus,.secondary.destructive:active{color:var(--goa-color-status-emergency-dark);border-color:var(--goa-color-status-emergency-dark);background:var(--color-white)}.tertiary.destructive{color:var(--goa-color-status-emergency);border-color:var(--color-gray-200);background:var(--color-white)}.tertiary.destructive:hover{border-color:var(--goa-color-status-emergency-dark);color:var(--goa-color-status-emergency-dark);background:var(--color-white)}.tertiary.destructive:focus,.tertiary.destructive:active{color:var(--goa-color-status-emergency-dark);border-color:var(--goa-color-status-emergency-dark);background:var(--color-white)}</style>`;
2259
2259
  init(this, {
2260
2260
  target: this.shadowRoot,
2261
2261
  props: attribute_to_object(this.attributes),
@@ -4114,7 +4114,7 @@
4114
4114
  class Container extends SvelteElement {
4115
4115
  constructor(options) {
4116
4116
  super();
4117
- this.shadowRoot.innerHTML = `<style>:host{box-sizing:border-box;font-family:var(--font-family);font-size:var(--fs-base)}.goa-container{margin-bottom:1rem;box-sizing:border-box}.goa-container *{box-sizing:border-box}header{display:flex;align-items:center;justify-content:space-between;font-weight:700;font-size:var(--fs-base);border-width:1px;border-style:solid;border-top-left-radius:var(--border-radius);border-top-right-radius:var(--border-radius)}.content{border-bottom:1px solid var(--color-gray-200);border-left:1px solid var(--color-gray-200);border-right:1px solid var(--color-gray-200);border-bottom-left-radius:var(--border-radius);border-bottom-right-radius:var(--border-radius)}.goa-container--non-interactive.colored .content{border-color:var(--color-gray-200);background-color:var(--color-gray-100)}.goa-container--important.colored .content{border-color:var(--goa-color-status-warning);background-color:var(--goa-color-status-warning-50)}.goa-container--error.colored .content{border-color:var(--goa-color-status-emergency);background-color:var(--goa-color-status-emergency-50)}.goa-container--success.colored .content{border-color:var(--goa-color-status-success);background-color:var(--goa-color-status-success-50)}.goa-container--info.colored .content{border-color:var(--goa-color-status-info);background-color:var(--goa-color-status-info-50)}.title>*,.actions>*{line-height:3rem}.padding--relaxed header{padding:0 1.5rem}.padding--relaxed .content{padding:1.5rem}.padding--compact header,.padding--compact .content{padding:0 1rem}.padding--compact header{padding:0 1rem}.padding--compact .content{padding:1rem}@media screen and (max-width: 480px){.padding--relaxed header{padding:0 1rem}.padding--relaxed .content{padding:1rem}}.goa-container--non-interactive header{background-color:var(--color-gray-100);border-color:var(--color-gray-200);color:var(--color-black)}.goa-container--interactive header{background-color:var(--goa-color-brand);border-color:var(--goa-color-brand);color:var(--color-white)}.goa-container--info header{background-color:var(--goa-color-status-info);border-color:var(--goa-color-status-info);color:var(--color-white)}.goa-container--error header{background-color:var(--goa-color-status-emergency);border-color:var(--goa-color-status-emergency);color:var(--color-white)}.goa-container--success header{background-color:var(--goa-color-status-success);border-color:var(--goa-color-status-success);color:var(--color-white)}.goa-container--important header{background-color:var(--goa-color-status-warning);border-color:var(--goa-color-status-warning);color:var(--color-white)}.heading--large{padding:0.5rem 1.5rem;max-height:3rem;min-height:1rem}.heading--large .title{line-height:2rem}.heading--small{height:0.5rem}.heading--none{display:none}.heading--none~.content{border-top:1px solid var(--color-gray-200);border-top-left-radius:var(--border-radius);border-top-right-radius:var(--border-radius)}.heading--small .title,.heading--small .actions{display:none}.actions{display:flex;align-items:center}</style>`;
4117
+ this.shadowRoot.innerHTML = `<style>:host{box-sizing:border-box;font-family:var(--font-family);font-size:var(--fs-base)}.goa-container{margin-bottom:1rem;box-sizing:border-box}.goa-container *{box-sizing:border-box}header{display:flex;align-items:center;justify-content:space-between;font-weight:700;font-size:var(--fs-base);border-width:1px;border-style:solid;border-top-left-radius:var(--border-radius);border-top-right-radius:var(--border-radius)}.content{border-bottom:1px solid var(--color-gray-200);border-left:1px solid var(--color-gray-200);border-right:1px solid var(--color-gray-200);border-bottom-left-radius:var(--border-radius);border-bottom-right-radius:var(--border-radius)}.goa-container--non-interactive.colored .content{border-color:var(--color-gray-200);background-color:var(--color-gray-100)}.goa-container--important.colored .content{border-color:var(--goa-color-status-warning);background-color:var(--goa-color-status-warning-50)}.goa-container--error.colored .content{border-color:var(--goa-color-status-emergency);background-color:var(--goa-color-status-emergency-50)}.goa-container--success.colored .content{border-color:var(--goa-color-status-success);background-color:var(--goa-color-status-success-50)}.goa-container--info.colored .content{border-color:var(--goa-color-status-info);background-color:var(--goa-color-status-info-50)}.title,.actions{padding:0.5rem 0}.padding--relaxed header{padding:0 1.5rem}.padding--relaxed .content{padding:1.5rem}.padding--compact header,.padding--compact .content{padding:0 1rem}.padding--compact header{padding:0 1rem}.padding--compact .content{padding:1rem}@media screen and (max-width: 480px){.padding--relaxed header{padding:0 1rem}.padding--relaxed .content{padding:1rem}}.goa-container--non-interactive header{background-color:var(--color-gray-100);border-color:var(--color-gray-200);color:var(--color-black)}.goa-container--interactive header{background-color:var(--goa-color-brand);border-color:var(--goa-color-brand);color:var(--color-white)}.goa-container--info header{background-color:var(--goa-color-status-info);border-color:var(--goa-color-status-info);color:var(--color-white)}.goa-container--error header{background-color:var(--goa-color-status-emergency);border-color:var(--goa-color-status-emergency);color:var(--color-white)}.goa-container--success header{background-color:var(--goa-color-status-success);border-color:var(--goa-color-status-success);color:var(--color-white)}.goa-container--important header{background-color:var(--goa-color-status-warning);border-color:var(--goa-color-status-warning);color:var(--color-white)}.heading--large{padding:0.5rem 1.5rem;max-height:3rem;min-height:1rem}.heading--large .title{line-height:2rem}.heading--small{height:0.5rem}.heading--none{display:none}.heading--none~.content{border-top:1px solid var(--color-gray-200);border-top-left-radius:var(--border-radius);border-top-right-radius:var(--border-radius)}.heading--small .title,.heading--small .actions{display:none}.actions{display:flex;align-items:center}</style>`;
4118
4118
  init(this, {
4119
4119
  target: this.shadowRoot,
4120
4120
  props: attribute_to_object(this.attributes),
@@ -14128,10 +14128,8 @@
14128
14128
  disabled = _b === void 0 ? false : _b,
14129
14129
  _c = _a.type,
14130
14130
  type = _c === void 0 ? 'primary' : _c,
14131
- _d = _a.size,
14132
- size = _d === void 0 ? '' : _d,
14133
- _e = _a.variant,
14134
- variant = _e === void 0 ? '' : _e,
14131
+ size = _a.size,
14132
+ variant = _a.variant,
14135
14133
  leadingIcon = _a.leadingIcon,
14136
14134
  trailingIcon = _a.trailingIcon,
14137
14135
  children = _a.children,
@@ -14293,8 +14291,7 @@
14293
14291
  padding = _a.padding,
14294
14292
  children = _a.children,
14295
14293
  actions = _a.actions,
14296
- _c = _a.variant,
14297
- variant = _c === void 0 ? 'default' : _c;
14294
+ variant = _a.variant;
14298
14295
  return jsxRuntime.jsxs("goa-container", __assign({
14299
14296
  variant: variant,
14300
14297
  padding: padding,