@gov-design-system-ce/components 0.0.6 → 0.0.7

package/dist/collection/components/gov-breadcrumbs/gov-breadcrumbs.js.map

@@ -1 +1 @@
-{"version":3,"file":"gov-breadcrumbs.js","sourceRoot":"","sources":["../../../../../../src/components/gov-breadcrumbs/gov-breadcrumbs.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, h, Host, Method, Prop, State, Event, EventEmitter } from '@stencil/core'\nimport { BreadcrumbsClass } from './constants'\nimport { validateWcagLabel } from '../../helpers/Validate/wcag'\nimport { canValidateWcagOnRender } from '../../helpers/Dom/win'\nimport { delay } from '../../utils/utils'\nimport { GovBreadcrumbsChangeEvent } from './gov-breadcrumbs.d'\nimport { booleanString, govHost } from '../../helpers/Dom/template'\nimport { GovHost } from '../../helpers/Dom/template.types'\n\n@Component({\n\ttag: 'gov-breadcrumbs',\n\tstyleUrl: 'gov-breadcrumbs.scss',\n})\nexport class GovBreadcrumbs {\n\tprivate h: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() readonly host: HTMLGovBreadcrumbsElement\n\t@State() isExpandedState: boolean\n\t/**\n\t * Defines wether the components can be collapsible when element doesn't fit in one row.\n\t */\n\t@Prop() readonly collapsible: boolean = false\n\t/**\n\t * Defines whether the breadcrumbs are open or closed by default\n\t */\n\t@Prop({ attribute: 'is-expanded' }) readonly isExpanded: boolean = false\n\t/**\n\t * Adds accessible label for the pagination that is only shown for screen readers.\n\t */\n\t@Prop({ attribute: 'wcag-label' }) readonly wcagLabel: string\n\t/**\n\t * Indicates the id of a component that labels the pagination.\n\t */\n\t@Prop({ attribute: 'wcag-labelded-by' }) readonly wcagLabelledBy: string\n\n\t/**\n\t * Called when the Breadrumbs state changes\n\t */\n\t@Event({ eventName: 'gov-change' }) govChange: EventEmitter<GovBreadcrumbsChangeEvent>\n\n\tprivate emmitChange(): void {\n\t\tthis.govChange.emit({ open: this.isExpandedState, element: this.host })\n\t}\n\n\tasync componentDidRender() {\n\t\tif (canValidateWcagOnRender()) {\n\t\t\tawait delay(500)\n\t\t\tawait this.validateWcag()\n\t\t}\n\t}\n\n\trender() {\n\t\tconst { isExpandedState } = this\n\n\t\treturn (\n\t\t\t<Host class={this.h.classes(BreadcrumbsClass.root)} collapsible={this.collapsible}>\n\t\t\t\t<nav aria-label={this.wcagLabel} aria-labelledby={this.wcagLabelledBy}>\n\t\t\t\t\t<ul class={BreadcrumbsClass.list}>\n\t\t\t\t\t\t<li class={BreadcrumbsClass.item}>\n\t\t\t\t\t\t\t<a href=\"#\" class=\"gov-link\">\n\t\t\t\t\t\t\t\tDomů\n\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t<gov-icon class={BreadcrumbsClass.arrow} name=\"arrow-right\"></gov-icon>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<li class={BreadcrumbsClass.item}>\n\t\t\t\t\t\t\t<a href=\"#\" class=\"gov-link\">\n\t\t\t\t\t\t\t\tKam dál\n\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t<gov-icon class={BreadcrumbsClass.arrow} name=\"arrow-right\"></gov-icon>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<li class={BreadcrumbsClass.item}>\n\t\t\t\t\t\t\t<a href=\"#\" class=\"gov-link\">\n\t\t\t\t\t\t\t\tČeský eGovernment\n\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t<gov-icon class={BreadcrumbsClass.arrow} name=\"arrow-right\"></gov-icon>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<li class={BreadcrumbsClass.item}>\n\t\t\t\t\t\t\t<strong>Czech POINT</strong>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t</ul>\n\t\t\t\t</nav>\n\n\t\t\t\t{this.collapsible && (\n\t\t\t\t\t<gov-button aria-expanded={booleanString(isExpandedState)} class={BreadcrumbsClass.button} variant=\"primary\" size=\"s\" inverse>\n\t\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"arrow-down\" onClick={() => this.toggle()}></gov-icon>\n\t\t\t\t\t</gov-button>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t)\n\t}\n\t/**\n\t * Opening the Breadcrumbs\n\t */\n\t@Method()\n\tasync open(): Promise<void> {\n\t\tthis.isExpandedState = true\n\t\tthis.emmitChange()\n\t}\n\n\t/**\n\t * Closing the Breadcrumbs\n\t */\n\t@Method()\n\tasync close(): Promise<void> {\n\t\tthis.isExpandedState = false\n\t\tthis.emmitChange()\n\t}\n\n\t/**\n\t * Breadcrumbs switch\n\t */\n\t@Method()\n\tasync toggle(): Promise<void> {\n\t\tthis.isExpandedState = !this.isExpandedState\n\t\tthis.emmitChange()\n\t}\n\n\t/**\n\t * Validate the WCAG attributes of the component\n\t */\n\t@Method()\n\tasync validateWcag(): Promise<void> {\n\t\tvalidateWcagLabel(this.wcagLabel, this.wcagLabelledBy, BreadcrumbsClass.root)\n\t}\n}\n"]}
+{"version":3,"file":"gov-breadcrumbs.js","sourceRoot":"","sources":["../../../../../../src/components/gov-breadcrumbs/gov-breadcrumbs.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,OAAO,EAAE,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAgB,MAAM,eAAe,CAAA;AACrG,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAA;AAC9C,OAAO,EAAE,iBAAiB,EAAE,MAAM,6BAA6B,CAAA;AAC/D,OAAO,EAAE,uBAAuB,EAAE,MAAM,uBAAuB,CAAA;AAC/D,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AAEzC,OAAO,EAAE,aAAa,EAAE,OAAO,EAAE,MAAM,4BAA4B,CAAA;AAOnE,MAAM,OAAO,cAAc;EAG1B;;uBASwC,KAAK;sBAIsB,KAAK;;;IAZvE,IAAI,CAAC,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;GAC3B;EA0BO,WAAW;IAClB,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,IAAI,CAAC,eAAe,EAAE,OAAO,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC,CAAA;EACxE,CAAC;EAED,KAAK,CAAC,kBAAkB;IACvB,IAAI,uBAAuB,EAAE,EAAE;MAC9B,MAAM,KAAK,CAAC,GAAG,CAAC,CAAA;MAChB,MAAM,IAAI,CAAC,YAAY,EAAE,CAAA;KACzB;EACF,CAAC;EAED,MAAM;IACL,MAAM,EAAE,eAAe,EAAE,GAAG,IAAI,CAAA;IAEhC,OAAO,CACN,EAAC,IAAI,IAAC,KAAK,EAAE,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,gBAAgB,CAAC,IAAI,CAAC,EAAE,WAAW,EAAE,IAAI,CAAC,WAAW;MAChF,yBAAiB,IAAI,CAAC,SAAS,qBAAmB,IAAI,CAAC,cAAc;QACpE,UAAI,KAAK,EAAE,gBAAgB,CAAC,IAAI;UAC/B,UAAI,KAAK,EAAE,gBAAgB,CAAC,IAAI;YAC/B,SAAG,IAAI,EAAC,GAAG,EAAC,KAAK,EAAC,UAAU,gBAExB;YACJ,gBAAU,KAAK,EAAE,gBAAgB,CAAC,KAAK,EAAE,IAAI,EAAC,eAAe,GAAY,CACrE;UACL,UAAI,KAAK,EAAE,gBAAgB,CAAC,IAAI;YAC/B,SAAG,IAAI,EAAC,GAAG,EAAC,KAAK,EAAC,UAAU,mBAExB;YACJ,gBAAU,KAAK,EAAE,gBAAgB,CAAC,KAAK,EAAE,IAAI,EAAC,eAAe,GAAY,CACrE;UACL,UAAI,KAAK,EAAE,gBAAgB,CAAC,IAAI;YAC/B,SAAG,IAAI,EAAC,GAAG,EAAC,KAAK,EAAC,UAAU,kCAExB;YACJ,gBAAU,KAAK,EAAE,gBAAgB,CAAC,KAAK,EAAE,IAAI,EAAC,eAAe,GAAY,CACrE;UACL,UAAI,KAAK,EAAE,gBAAgB,CAAC,IAAI;YAC/B,gCAA4B,CACxB,CACD,CACA;MAEL,IAAI,CAAC,WAAW,IAAI,CACpB,mCAA2B,aAAa,CAAC,eAAe,CAAC,EAAE,KAAK,EAAE,gBAAgB,CAAC,MAAM,EAAE,OAAO,EAAC,SAAS,EAAC,IAAI,EAAC,GAAG,EAAC,OAAO;QAC5H,gBAAU,IAAI,EAAC,WAAW,EAAC,IAAI,EAAC,cAAc,EAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,EAAE,GAAa,CAC5E,CACb,CACK,CACP,CAAA;EACF,CAAC;EACD;;KAEG;EAEH,KAAK,CAAC,IAAI;IACT,IAAI,CAAC,eAAe,GAAG,IAAI,CAAA;IAC3B,IAAI,CAAC,WAAW,EAAE,CAAA;EACnB,CAAC;EAED;;KAEG;EAEH,KAAK,CAAC,KAAK;IACV,IAAI,CAAC,eAAe,GAAG,KAAK,CAAA;IAC5B,IAAI,CAAC,WAAW,EAAE,CAAA;EACnB,CAAC;EAED;;KAEG;EAEH,KAAK,CAAC,MAAM;IACX,IAAI,CAAC,eAAe,GAAG,CAAC,IAAI,CAAC,eAAe,CAAA;IAC5C,IAAI,CAAC,WAAW,EAAE,CAAA;EACnB,CAAC;EAED;;KAEG;EAEH,KAAK,CAAC,YAAY;IACjB,iBAAiB,CAAC,IAAI,CAAC,SAAS,EAAE,IAAI,CAAC,cAAc,EAAE,gBAAgB,CAAC,IAAI,CAAC,CAAA;EAC9E,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACD","sourcesContent":["import { Component, Element, h, Host, Method, Prop, State, Event, EventEmitter } from '@stencil/core'\nimport { BreadcrumbsClass } from './constants'\nimport { validateWcagLabel } from '../../helpers/Validate/wcag'\nimport { canValidateWcagOnRender } from '../../helpers/Dom/win'\nimport { delay } from '../../utils/utils'\nimport { GovBreadcrumbsChangeEvent } from './gov-breadcrumbs.d'\nimport { booleanString, govHost } from '../../helpers/Dom/template'\nimport { GovHost } from '../../helpers/Dom/template.types'\n\n@Component({\n\ttag: 'gov-breadcrumbs',\n\tstyleUrl: 'gov-breadcrumbs.scss',\n})\nexport class GovBreadcrumbs {\n\tprivate h: GovHost\n\n\tconstructor() {\n\t\tthis.h = govHost(this.host)\n\t}\n\n\t@Element() readonly host: HTMLGovBreadcrumbsElement\n\t@State() isExpandedState: boolean\n\t/**\n\t * Defines wether the components can be collapsible when element doesn't fit in one row.\n\t */\n\t@Prop() readonly collapsible: boolean = false\n\t/**\n\t * Defines whether the breadcrumbs are open or closed by default\n\t */\n\t@Prop({ attribute: 'is-expanded' }) readonly isExpanded: boolean = false\n\t/**\n\t * Adds accessible label for the pagination that is only shown for screen readers.\n\t */\n\t@Prop({ attribute: 'wcag-label' }) readonly wcagLabel: string\n\t/**\n\t * Indicates the id of a component that labels the pagination.\n\t */\n\t@Prop({ attribute: 'wcag-labelded-by' }) readonly wcagLabelledBy: string\n\n\t/**\n\t * Called when the Breadrumbs state changes\n\t */\n\t@Event({ eventName: 'gov-change' }) govChange: EventEmitter<GovBreadcrumbsChangeEvent>\n\n\tprivate emmitChange(): void {\n\t\tthis.govChange.emit({ open: this.isExpandedState, element: this.host })\n\t}\n\n\tasync componentDidRender() {\n\t\tif (canValidateWcagOnRender()) {\n\t\t\tawait delay(500)\n\t\t\tawait this.validateWcag()\n\t\t}\n\t}\n\n\trender() {\n\t\tconst { isExpandedState } = this\n\n\t\treturn (\n\t\t\t<Host class={this.h.classes(BreadcrumbsClass.root)} collapsible={this.collapsible}>\n\t\t\t\t<nav aria-label={this.wcagLabel} aria-labelledby={this.wcagLabelledBy}>\n\t\t\t\t\t<ul class={BreadcrumbsClass.list}>\n\t\t\t\t\t\t<li class={BreadcrumbsClass.item}>\n\t\t\t\t\t\t\t<a href=\"#\" class=\"gov-link\">\n\t\t\t\t\t\t\t\tDomů\n\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t<gov-icon class={BreadcrumbsClass.arrow} name=\"chevron-right\"></gov-icon>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<li class={BreadcrumbsClass.item}>\n\t\t\t\t\t\t\t<a href=\"#\" class=\"gov-link\">\n\t\t\t\t\t\t\t\tKam dál\n\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t<gov-icon class={BreadcrumbsClass.arrow} name=\"chevron-right\"></gov-icon>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<li class={BreadcrumbsClass.item}>\n\t\t\t\t\t\t\t<a href=\"#\" class=\"gov-link\">\n\t\t\t\t\t\t\t\tČeský eGovernment\n\t\t\t\t\t\t\t</a>\n\t\t\t\t\t\t\t<gov-icon class={BreadcrumbsClass.arrow} name=\"chevron-right\"></gov-icon>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<li class={BreadcrumbsClass.item}>\n\t\t\t\t\t\t\t<strong>Czech POINT</strong>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t</ul>\n\t\t\t\t</nav>\n\n\t\t\t\t{this.collapsible && (\n\t\t\t\t\t<gov-button aria-expanded={booleanString(isExpandedState)} class={BreadcrumbsClass.button} variant=\"primary\" size=\"s\" inverse>\n\t\t\t\t\t\t<gov-icon slot=\"left-icon\" name=\"chevron-down\" onClick={() => this.toggle()}></gov-icon>\n\t\t\t\t\t</gov-button>\n\t\t\t\t)}\n\t\t\t</Host>\n\t\t)\n\t}\n\t/**\n\t * Opening the Breadcrumbs\n\t */\n\t@Method()\n\tasync open(): Promise<void> {\n\t\tthis.isExpandedState = true\n\t\tthis.emmitChange()\n\t}\n\n\t/**\n\t * Closing the Breadcrumbs\n\t */\n\t@Method()\n\tasync close(): Promise<void> {\n\t\tthis.isExpandedState = false\n\t\tthis.emmitChange()\n\t}\n\n\t/**\n\t * Breadcrumbs switch\n\t */\n\t@Method()\n\tasync toggle(): Promise<void> {\n\t\tthis.isExpandedState = !this.isExpandedState\n\t\tthis.emmitChange()\n\t}\n\n\t/**\n\t * Validate the WCAG attributes of the component\n\t */\n\t@Method()\n\tasync validateWcag(): Promise<void> {\n\t\tvalidateWcagLabel(this.wcagLabel, this.wcagLabelledBy, BreadcrumbsClass.root)\n\t}\n}\n"]}

package/dist/collection/components/gov-button/constants.js

@@ -1,13 +1,14 @@
 import { Sizes } from '../../core/constants/sizes';
 import { Variants } from '../../core/constants/variants';
 import { pick } from '../../utils/utils';
-export const ButtonSizes = pick(Sizes, ['_S', '_M', '_L', '_XL']);
+export const ButtonSizes = pick(Sizes, ['_XS', '_S', '_M', '_L', '_XL']);
 export const ButtonVariants = pick(Variants, ['PRIMARY', 'SECONDARY', 'SUCCESS', 'ERROR', 'WARNING']);
 export var Type;
 (function (Type) {
   Type["SOLID"] = "solid";
   Type["OUTLINED"] = "outlined";
   Type["BASE"] = "base";
+  Type["LINK"] = "link";
 })(Type || (Type = {}));
 export var NativeType;
 (function (NativeType) {

package/dist/collection/components/gov-button/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../../../../../src/components/gov-button/constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,4BAA4B,CAAA;AAClD,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAA;AAExD,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAA;AAExC,MAAM,CAAC,MAAM,WAAW,GAAG,IAAI,CAAC,KAAK,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,CAAC,CAAC,CAAA;AAGjE,MAAM,CAAC,MAAM,cAAc,GAAG,IAAI,CAAC,QAAQ,EAAE,CAAC,SAAS,EAAE,WAAW,EAAE,SAAS,EAAE,OAAO,EAAE,SAAS,CAAC,CAAC,CAAA;AAGrG,MAAM,CAAN,IAAY,IAIX;AAJD,WAAY,IAAI;EACf,uBAAe,CAAA;EACf,6BAAqB,CAAA;EACrB,qBAAa,CAAA;AACd,CAAC,EAJW,IAAI,KAAJ,IAAI,QAIf;AAID,MAAM,CAAN,IAAY,UAIX;AAJD,WAAY,UAAU;EACrB,+BAAiB,CAAA;EACjB,+BAAiB,CAAA;EACjB,6BAAe,CAAA;AAChB,CAAC,EAJW,UAAU,KAAV,UAAU,QAIrB;AAID,MAAM,CAAN,IAAY,YAIX;AAJD,WAAY,YAAY;EACvB,gCAAgB,CAAA;EAChB,8BAAc,CAAA;EACd,4BAAY,CAAA;AACb,CAAC,EAJW,YAAY,KAAZ,YAAY,QAIvB;AAGD,MAAM,CAAC,MAAM,WAAW,GAAG;EAC1B,IAAI,EAAE,YAAY;EAClB,YAAY,EAAE,oBAAoB;CAClC,CAAA","sourcesContent":["import { Sizes } from '../../core/constants/sizes'\nimport { Variants } from '../../core/constants/variants'\nimport { ValueOf } from '../../types/interfaces'\nimport { pick } from '../../utils/utils'\n\nexport const ButtonSizes = pick(Sizes, ['_S', '_M', '_L', '_XL'])\nexport type ButtonSizesType = `${ValueOf<typeof ButtonSizes>}`\n\nexport const ButtonVariants = pick(Variants, ['PRIMARY', 'SECONDARY', 'SUCCESS', 'ERROR', 'WARNING'])\nexport type ButtonVariantType = `${ValueOf<typeof ButtonVariants>}`\n\nexport enum Type {\n\tSOLID = 'solid',\n\tOUTLINED = 'outlined',\n\tBASE = 'base',\n}\n\nexport type TypesType = `${ValueOf<typeof Type>}`\n\nexport enum NativeType {\n\tSUBMIT = 'submit',\n\tBUTTON = 'button',\n\tRESET = 'reset',\n}\n\nexport type NativeTypesType = `${ValueOf<typeof NativeType>}`\n\nexport enum ButtonTarget {\n\tBLANK = '_blank',\n\tSELF = '_self',\n\tNEW = '_new',\n}\nexport type ButtonTargetType = `${ValueOf<typeof ButtonTarget>}`\n\nexport const ButtonClass = {\n\troot: 'gov-button',\n\trootWithIcon: 'gov-button--w-icon',\n}\n"]}
+{"version":3,"file":"constants.js","sourceRoot":"","sources":["../../../../../../src/components/gov-button/constants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,4BAA4B,CAAA;AAClD,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAA;AAExD,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAA;AAExC,MAAM,CAAC,MAAM,WAAW,GAAG,IAAI,CAAC,KAAK,EAAE,CAAC,KAAK,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,CAAC,CAAC,CAAA;AAGxE,MAAM,CAAC,MAAM,cAAc,GAAG,IAAI,CAAC,QAAQ,EAAE,CAAC,SAAS,EAAE,WAAW,EAAE,SAAS,EAAE,OAAO,EAAE,SAAS,CAAC,CAAC,CAAA;AAGrG,MAAM,CAAN,IAAY,IAKX;AALD,WAAY,IAAI;EACf,uBAAe,CAAA;EACf,6BAAqB,CAAA;EACrB,qBAAa,CAAA;EACb,qBAAa,CAAA;AACd,CAAC,EALW,IAAI,KAAJ,IAAI,QAKf;AAID,MAAM,CAAN,IAAY,UAIX;AAJD,WAAY,UAAU;EACrB,+BAAiB,CAAA;EACjB,+BAAiB,CAAA;EACjB,6BAAe,CAAA;AAChB,CAAC,EAJW,UAAU,KAAV,UAAU,QAIrB;AAID,MAAM,CAAN,IAAY,YAIX;AAJD,WAAY,YAAY;EACvB,gCAAgB,CAAA;EAChB,8BAAc,CAAA;EACd,4BAAY,CAAA;AACb,CAAC,EAJW,YAAY,KAAZ,YAAY,QAIvB;AAGD,MAAM,CAAC,MAAM,WAAW,GAAG;EAC1B,IAAI,EAAE,YAAY;EAClB,YAAY,EAAE,oBAAoB;CAClC,CAAA","sourcesContent":["import { Sizes } from '../../core/constants/sizes'\nimport { Variants } from '../../core/constants/variants'\nimport { ValueOf } from '../../types/interfaces'\nimport { pick } from '../../utils/utils'\n\nexport const ButtonSizes = pick(Sizes, ['_XS' ,'_S', '_M', '_L', '_XL'])\nexport type ButtonSizesType = `${ValueOf<typeof ButtonSizes>}`\n\nexport const ButtonVariants = pick(Variants, ['PRIMARY', 'SECONDARY', 'SUCCESS', 'ERROR', 'WARNING'])\nexport type ButtonVariantType = `${ValueOf<typeof ButtonVariants>}`\n\nexport enum Type {\n\tSOLID = 'solid',\n\tOUTLINED = 'outlined',\n\tBASE = 'base',\n\tLINK = 'link',\n}\n\nexport type TypesType = `${ValueOf<typeof Type>}`\n\nexport enum NativeType {\n\tSUBMIT = 'submit',\n\tBUTTON = 'button',\n\tRESET = 'reset',\n}\n\nexport type NativeTypesType = `${ValueOf<typeof NativeType>}`\n\nexport enum ButtonTarget {\n\tBLANK = '_blank',\n\tSELF = '_self',\n\tNEW = '_new',\n}\nexport type ButtonTargetType = `${ValueOf<typeof ButtonTarget>}`\n\nexport const ButtonClass = {\n\troot: 'gov-button',\n\trootWithIcon: 'gov-button--w-icon',\n}\n"]}

package/dist/collection/components/gov-button/gov-button.css

@@ -148,6 +148,9 @@
 /*
  -	Variables - Form multiselect
  */
+/*
+ -	Variables - Form password power
+ */
 /*
  -	Variables - Form checkbox & radio
  */
@@ -379,6 +382,41 @@
     color: var(--gov-button-primary-base-inverse-active-color, var(--gov-color-neutral-white));
   }
 }
+[type=link][variant=primary].gov-button .element {
+  color: var(--gov-button-primary-link-color, var(--gov-color-primary));
+  border-width: 0;
+}
+[type=link][variant=primary][inverse=""].gov-button .element, [type=link][variant=primary][inverse=true i].gov-button .element, [type=link][variant=primary][inverse="1"].gov-button .element {
+  color: var(--gov-button-primary-link-inverse-color, var(--gov-color-neutral-white));
+  background-color: var(--gov-button-primary-link-inverse-bg, transparent);
+}
+[type=link][variant=primary][disabled=""].gov-button .element, [type=link][variant=primary][disabled=true i].gov-button .element, [type=link][variant=primary][disabled="1"].gov-button .element {
+  color: var(--gov-button-primary-link-disabled-color, var(--gov-color-primary-400));
+}
+[type=link][variant=primary][disabled=""][inverse=""].gov-button .element, [type=link][variant=primary][disabled=""][inverse=true i].gov-button .element, [type=link][variant=primary][disabled=""][inverse="1"].gov-button .element, [type=link][variant=primary][disabled=true i][inverse=""].gov-button .element, [type=link][variant=primary][disabled=true i][inverse=true i].gov-button .element, [type=link][variant=primary][disabled=true i][inverse="1"].gov-button .element, [type=link][variant=primary][disabled="1"][inverse=""].gov-button .element, [type=link][variant=primary][disabled="1"][inverse=true i].gov-button .element, [type=link][variant=primary][disabled="1"][inverse="1"].gov-button .element {
+  background-color: var(--gov-button-primary-link-inverse-disabled-bg, transparent);
+  color: var(--gov-button-primary-link-inverse-disabled-color, var(--gov-color-primary-400));
+}
+@media not all and (pointer: coarse) {
+  [type=link][variant=primary][hoverable].gov-button .element:hover {
+    background-color: var(--gov-button-primary-link-hover-bg, transparent);
+    color: var(--gov-button-primary-link-hover-color, var(--gov-color-primary));
+  }
+  [type=link][variant=primary][hoverable].gov-button .element:hover:active {
+    background-color: var(--gov-button-primary-link-active-bg, transparent);
+    color: var(--gov-button-primary-link-active-color, var(--gov-color-primary-700));
+  }
+}
+@media not all and (pointer: coarse) {
+  [type=link][variant=primary][hoverable][inverse=""].gov-button .element:hover, [type=link][variant=primary][hoverable][inverse=true i].gov-button .element:hover, [type=link][variant=primary][hoverable][inverse="1"].gov-button .element:hover {
+    background-color: var(--gov-button-primary-link-inverse-hover-bg, transparent);
+    color: var(--gov-button-primary-link-inverse-hover-color, var(--gov-color-neutral-white));
+  }
+  [type=link][variant=primary][hoverable][inverse=""].gov-button .element:hover:active, [type=link][variant=primary][hoverable][inverse=true i].gov-button .element:hover:active, [type=link][variant=primary][hoverable][inverse="1"].gov-button .element:hover:active {
+    background-color: var(--gov-button-primary-link-inverse-active-bg, transparent);
+    color: var(--gov-button-primary-link-inverse-active-color, var(--gov-color-primary-200));
+  }
+}
 [type=solid][variant=secondary].gov-button .element {
   background-color: var(--gov-button-secondary-solid-bg, var(--gov-color-secondary));
   color: var(--gov-button-secondary-solid-color, var(--gov-color-neutral-white));
@@ -493,6 +531,41 @@
     color: var(--gov-button-secondary-base-inverse-active-color, var(--gov-color-secondary));
   }
 }
+[type=link][variant=secondary].gov-button .element {
+  color: var(--gov-button-secondary-link-color, var(--gov-color-secondary));
+  border-width: 0;
+}
+[type=link][variant=secondary][inverse=""].gov-button .element, [type=link][variant=secondary][inverse=true i].gov-button .element, [type=link][variant=secondary][inverse="1"].gov-button .element {
+  color: var(--gov-button-secondary-link-inverse-color, var(--gov-color-neutral-white));
+  background-color: var(--gov-button-secondary-link-inverse-bg, transparent);
+}
+[type=link][variant=secondary][disabled=""].gov-button .element, [type=link][variant=secondary][disabled=true i].gov-button .element, [type=link][variant=secondary][disabled="1"].gov-button .element {
+  color: var(--gov-button-secondary-link-disabled-color, var(--gov-color-secondary-600));
+}
+[type=link][variant=secondary][disabled=""][inverse=""].gov-button .element, [type=link][variant=secondary][disabled=""][inverse=true i].gov-button .element, [type=link][variant=secondary][disabled=""][inverse="1"].gov-button .element, [type=link][variant=secondary][disabled=true i][inverse=""].gov-button .element, [type=link][variant=secondary][disabled=true i][inverse=true i].gov-button .element, [type=link][variant=secondary][disabled=true i][inverse="1"].gov-button .element, [type=link][variant=secondary][disabled="1"][inverse=""].gov-button .element, [type=link][variant=secondary][disabled="1"][inverse=true i].gov-button .element, [type=link][variant=secondary][disabled="1"][inverse="1"].gov-button .element {
+  background-color: var(--gov-button-secondary-link-inverse-disabled-bg, transparent);
+  color: var(--gov-button-secondary-link-inverse-disabled-color, var(--gov-color-secondary-600));
+}
+@media not all and (pointer: coarse) {
+  [type=link][variant=secondary][hoverable].gov-button .element:hover {
+    background-color: var(--gov-button-secondary-link-hover-bg, transparent);
+    color: var(--gov-button-secondary-link-hover-color, var(--gov-color-secondary));
+  }
+  [type=link][variant=secondary][hoverable].gov-button .element:hover:active {
+    background-color: var(--gov-button-secondary-link-active-bg, transparent);
+    color: var(--gov-button-primary-link-active-color, var(--gov-color-secondary));
+  }
+}
+@media not all and (pointer: coarse) {
+  [type=link][variant=secondary][hoverable][inverse=""].gov-button .element:hover, [type=link][variant=secondary][hoverable][inverse=true i].gov-button .element:hover, [type=link][variant=secondary][hoverable][inverse="1"].gov-button .element:hover {
+    background-color: var(--gov-button-secondary-link-inverse-hover-bg, transparent);
+    color: var(--gov-button-secondary-link-inverse-hover-color, var(--gov-color-neutral-white));
+  }
+  [type=link][variant=secondary][hoverable][inverse=""].gov-button .element:hover:active, [type=link][variant=secondary][hoverable][inverse=true i].gov-button .element:hover:active, [type=link][variant=secondary][hoverable][inverse="1"].gov-button .element:hover:active {
+    background-color: var(--gov-button-secondary-link-inverse-active-bg, transparent);
+    color: var(--gov-button-secondary-link-inverse-active-color, var(--gov-color-secondary-500));
+  }
+}
 [type=solid][variant=error].gov-button .element {
   background-color: var(--gov-button-error-solid-bg, var(--gov-color-error));
   color: var(--gov-button-error-solid-color, var(--gov-color-neutral-white));
@@ -605,6 +678,41 @@
     color: var(--gov-button-error-base-inverse-active-color, var(--gov-color-neutral-white));
   }
 }
+[type=link][variant=error].gov-button .element {
+  color: var(--gov-button-error-link-color, var(--gov-color-error));
+  border-width: 0;
+}
+[type=link][variant=error][inverse=""].gov-button .element, [type=link][variant=error][inverse=true i].gov-button .element, [type=link][variant=error][inverse="1"].gov-button .element {
+  color: var(--gov-button-error-link-inverse-color, var(--gov-color-neutral-white));
+  background-color: var(--gov-button-error-link-inverse-bg, transparent);
+}
+[type=link][variant=error][disabled=""].gov-button .element, [type=link][variant=error][disabled=true i].gov-button .element, [type=link][variant=error][disabled="1"].gov-button .element {
+  color: var(--gov-button-error-link-disabled-color, var(--gov-color-error-200));
+}
+[type=link][variant=error][disabled=""][inverse=""].gov-button .element, [type=link][variant=error][disabled=""][inverse=true i].gov-button .element, [type=link][variant=error][disabled=""][inverse="1"].gov-button .element, [type=link][variant=error][disabled=true i][inverse=""].gov-button .element, [type=link][variant=error][disabled=true i][inverse=true i].gov-button .element, [type=link][variant=error][disabled=true i][inverse="1"].gov-button .element, [type=link][variant=error][disabled="1"][inverse=""].gov-button .element, [type=link][variant=error][disabled="1"][inverse=true i].gov-button .element, [type=link][variant=error][disabled="1"][inverse="1"].gov-button .element {
+  background-color: var(--gov-button-error-link-inverse-disabled-bg, transparent);
+  color: var(--gov-button-error-link-inverse-disabled-color, var(--gov-color-error-200));
+}
+@media not all and (pointer: coarse) {
+  [type=link][variant=error][hoverable].gov-button .element:hover {
+    background-color: var(--gov-button-error-link-hover-bg, transparent);
+    color: var(--gov-button-error-link-hover-color, var(--gov-color-error));
+  }
+  [type=link][variant=error][hoverable].gov-button .element:hover:active {
+    background-color: var(--gov-button-error-link-active-bg, transparent);
+    color: var(--gov-button-primary-link-active-color, var(--gov-color-error-500));
+  }
+}
+@media not all and (pointer: coarse) {
+  [type=link][variant=error][hoverable][inverse=""].gov-button .element:hover, [type=link][variant=error][hoverable][inverse=true i].gov-button .element:hover, [type=link][variant=error][hoverable][inverse="1"].gov-button .element:hover {
+    background-color: var(--gov-button-error-link-inverse-hover-bg, transparent);
+    color: var(--gov-button-error-link-inverse-hover-color, var(--gov-color-neutral-white));
+  }
+  [type=link][variant=error][hoverable][inverse=""].gov-button .element:hover:active, [type=link][variant=error][hoverable][inverse=true i].gov-button .element:hover:active, [type=link][variant=error][hoverable][inverse="1"].gov-button .element:hover:active {
+    background-color: var(--gov-button-error-link-inverse-active-bg, transparent);
+    color: var(--gov-button-error-link-inverse-active-color, var(--gov-color-neutral-white));
+  }
+}
 [type=solid][variant=success].gov-button .element {
   background-color: var(--gov-button-success-solid-bg, var(--gov-color-success-500));
   color: var(--gov-button-success-solid-color, var(--gov-color-neutral-white));
@@ -717,6 +825,41 @@
     color: var(--gov-button-success-base-inverse-active-color, var(--gov-color-neutral-white));
   }
 }
+[type=link][variant=success].gov-button .element {
+  color: var(--gov-button-success-link-color, var(--gov-color-success-500));
+  border-width: 0;
+}
+[type=link][variant=success][inverse=""].gov-button .element, [type=link][variant=success][inverse=true i].gov-button .element, [type=link][variant=success][inverse="1"].gov-button .element {
+  color: var(--gov-button-success-link-inverse-color, var(--gov-color-neutral-white));
+  background-color: var(--gov-button-success-link-inverse-bg, transparent);
+}
+[type=link][variant=success][disabled=""].gov-button .element, [type=link][variant=success][disabled=true i].gov-button .element, [type=link][variant=success][disabled="1"].gov-button .element {
+  color: var(--gov-button-success-link-disabled-color, var(--gov-color-success-300));
+}
+[type=link][variant=success][disabled=""][inverse=""].gov-button .element, [type=link][variant=success][disabled=""][inverse=true i].gov-button .element, [type=link][variant=success][disabled=""][inverse="1"].gov-button .element, [type=link][variant=success][disabled=true i][inverse=""].gov-button .element, [type=link][variant=success][disabled=true i][inverse=true i].gov-button .element, [type=link][variant=success][disabled=true i][inverse="1"].gov-button .element, [type=link][variant=success][disabled="1"][inverse=""].gov-button .element, [type=link][variant=success][disabled="1"][inverse=true i].gov-button .element, [type=link][variant=success][disabled="1"][inverse="1"].gov-button .element {
+  background-color: var(--gov-button-success-link-inverse-disabled-bg, transparent);
+  color: var(--gov-button-success-link-inverse-disabled-color, var(--gov-color-success-400));
+}
+@media not all and (pointer: coarse) {
+  [type=link][variant=success][hoverable].gov-button .element:hover {
+    background-color: var(--gov-button-success-link-hover-bg, transparent);
+    color: var(--gov-button-success-link-hover-color, var(--gov-color-success-500));
+  }
+  [type=link][variant=success][hoverable].gov-button .element:hover:active {
+    background-color: var(--gov-button-success-link-active-bg, transparent);
+    color: var(--gov-button-primary-link-active-color, var(--gov-color-success-600));
+  }
+}
+@media not all and (pointer: coarse) {
+  [type=link][variant=success][hoverable][inverse=""].gov-button .element:hover, [type=link][variant=success][hoverable][inverse=true i].gov-button .element:hover, [type=link][variant=success][hoverable][inverse="1"].gov-button .element:hover {
+    background-color: var(--gov-button-success-link-inverse-hover-bg, transparent);
+    color: var(--gov-button-success-link-inverse-hover-color, var(--gov-color-neutral-white));
+  }
+  [type=link][variant=success][hoverable][inverse=""].gov-button .element:hover:active, [type=link][variant=success][hoverable][inverse=true i].gov-button .element:hover:active, [type=link][variant=success][hoverable][inverse="1"].gov-button .element:hover:active {
+    background-color: var(--gov-button-success-link-inverse-active-bg, transparent);
+    color: var(--gov-button-success-link-inverse-active-color, var(--gov-color-neutral-white));
+  }
+}
 [type=solid][variant=warning].gov-button .element {
   background-color: var(--gov-button-warning-solid-bg, var(--gov-color-warning-500));
   color: var(--gov-button-warning-solid-color, var(--gov-color-neutral-white));
@@ -829,6 +972,41 @@
     color: var(--gov-button-warning-base-inverse-active-color, var(--gov-color-neutral-white));
   }
 }
+[type=link][variant=warning].gov-button .element {
+  color: var(--gov-button-warning-link-color, var(--gov-color-warning-500));
+  border-width: 0;
+}
+[type=link][variant=warning][inverse=""].gov-button .element, [type=link][variant=warning][inverse=true i].gov-button .element, [type=link][variant=warning][inverse="1"].gov-button .element {
+  color: var(--gov-button-warning-link-inverse-color, var(--gov-color-neutral-white));
+  background-color: var(--gov-button-warning-link-inverse-bg, transparent);
+}
+[type=link][variant=warning][disabled=""].gov-button .element, [type=link][variant=warning][disabled=true i].gov-button .element, [type=link][variant=warning][disabled="1"].gov-button .element {
+  color: var(--gov-button-warning-link-disabled-color, var(--gov-color-warning));
+}
+[type=link][variant=warning][disabled=""][inverse=""].gov-button .element, [type=link][variant=warning][disabled=""][inverse=true i].gov-button .element, [type=link][variant=warning][disabled=""][inverse="1"].gov-button .element, [type=link][variant=warning][disabled=true i][inverse=""].gov-button .element, [type=link][variant=warning][disabled=true i][inverse=true i].gov-button .element, [type=link][variant=warning][disabled=true i][inverse="1"].gov-button .element, [type=link][variant=warning][disabled="1"][inverse=""].gov-button .element, [type=link][variant=warning][disabled="1"][inverse=true i].gov-button .element, [type=link][variant=warning][disabled="1"][inverse="1"].gov-button .element {
+  background-color: var(--gov-button-warning-link-inverse-disabled-bg, transparent);
+  color: var(--gov-button-warning-link-inverse-disabled-color, var(--gov-color-warning-400));
+}
+@media not all and (pointer: coarse) {
+  [type=link][variant=warning][hoverable].gov-button .element:hover {
+    background-color: var(--gov-button-warning-link-hover-bg, transparent);
+    color: var(--gov-button-warning-link-hover-color, var(--gov-color-warning-500));
+  }
+  [type=link][variant=warning][hoverable].gov-button .element:hover:active {
+    background-color: var(--gov-button-warning-link-active-bg, transparent);
+    color: var(--gov-button-primary-link-active-color, var(--gov-color-warning-600));
+  }
+}
+@media not all and (pointer: coarse) {
+  [type=link][variant=warning][hoverable][inverse=""].gov-button .element:hover, [type=link][variant=warning][hoverable][inverse=true i].gov-button .element:hover, [type=link][variant=warning][hoverable][inverse="1"].gov-button .element:hover {
+    background-color: var(--gov-button-warning-link-inverse-hover-bg, transparent);
+    color: var(--gov-button-warning-link-inverse-hover-color, var(--gov-color-neutral-white));
+  }
+  [type=link][variant=warning][hoverable][inverse=""].gov-button .element:hover:active, [type=link][variant=warning][hoverable][inverse=true i].gov-button .element:hover:active, [type=link][variant=warning][hoverable][inverse="1"].gov-button .element:hover:active {
+    background-color: var(--gov-button-warning-link-inverse-active-bg, transparent);
+    color: var(--gov-button-warning-link-inverse-active-color, var(--gov-color-neutral-white));
+  }
+}
 [size=xs].gov-button .element {
   font-weight: var(--gov-button-text-xs-font-weight, var(--gov-text-xs-font-weight));
   font-size: var(--gov-button-text-xs-font-size, var(--gov-text-xs-font-size));
@@ -843,22 +1021,6 @@
   width: var(--gov-button-xs-icon-size, 1rem);
   height: var(--gov-button-xs-icon-size, 1rem);
 }
-@media (min-width: 48em) {
-  [size=xs].gov-button .element {
-    font-weight: var(--gov-button-text-xs-font-weight, var(--gov-text-xs-font-weight));
-    font-size: var(--gov-button-text-xs-font-size, var(--gov-text-xs-font-size));
-    line-height: var(--gov-button-text-xs-line-height, var(--gov-text-xs-line-height));
-    letter-spacing: var(--gov-button-text-xs-letter-spacing, var(--gov-text-xs-letter-spacing));
-    -moz-column-gap: var(--gov-button-xs-padding-x, 0.625rem);
-         column-gap: var(--gov-button-xs-padding-x, 0.625rem);
-    min-height: var(--gov-button-xs-min-height, 1.5rem);
-    padding: var(--gov-button-xs-padding-y, 0.125rem) var(--gov-button-xs-padding-x, 0.625rem);
-  }
-  [size=xs].gov-button .element .gov-icon {
-    width: var(--gov-button-xs-icon-size, 1rem);
-    height: var(--gov-button-xs-icon-size, 1rem);
-  }
-}
 [size=s].gov-button .element {
   font-weight: var(--gov-button-text-s-font-weight, var(--gov-text-s-font-weight));
   font-size: var(--gov-button-text-s-font-size, var(--gov-text-s-font-size));
@@ -873,53 +1035,7 @@
   width: var(--gov-button-s-icon-size, 1rem);
   height: var(--gov-button-s-icon-size, 1rem);
 }
-@media (min-width: 48em) {
-  [size=s].gov-button .element {
-    font-weight: var(--gov-button-text-s-font-weight, var(--gov-text-s-font-weight));
-    font-size: var(--gov-button-text-s-font-size, var(--gov-text-s-font-size));
-    line-height: var(--gov-button-text-s-line-height, var(--gov-text-s-line-height));
-    letter-spacing: var(--gov-button-text-s-letter-spacing, var(--gov-text-s-letter-spacing));
-    -moz-column-gap: var(--gov-button-s-padding-x, 0.75rem);
-         column-gap: var(--gov-button-s-padding-x, 0.75rem);
-    min-height: var(--gov-button-s-min-height, 2rem);
-    padding: var(--gov-button-s-padding-y, 0.25rem) var(--gov-button-s-padding-x, 0.75rem);
-  }
-  [size=s].gov-button .element .gov-icon {
-    width: var(--gov-button-s-icon-size, 1rem);
-    height: var(--gov-button-s-icon-size, 1rem);
-  }
-}
 [size=m].gov-button .element {
-  font-weight: var(--gov-button-text-s-font-weight, var(--gov-text-s-font-weight));
-  font-size: var(--gov-button-text-s-font-size, var(--gov-text-s-font-size));
-  line-height: var(--gov-button-text-s-line-height, var(--gov-text-s-line-height));
-  letter-spacing: var(--gov-button-text-s-letter-spacing, var(--gov-text-s-letter-spacing));
-  -moz-column-gap: var(--gov-button-s-padding-x, 0.75rem);
-       column-gap: var(--gov-button-s-padding-x, 0.75rem);
-  min-height: var(--gov-button-s-min-height, 2rem);
-  padding: var(--gov-button-s-padding-y, 0.25rem) var(--gov-button-s-padding-x, 0.75rem);
-}
-[size=m].gov-button .element .gov-icon {
-  width: var(--gov-button-s-icon-size, 1rem);
-  height: var(--gov-button-s-icon-size, 1rem);
-}
-@media (min-width: 48em) {
-  [size=m].gov-button .element {
-    font-weight: var(--gov-button-text-m-font-weight, var(--gov-text-m-font-weight));
-    font-size: var(--gov-button-text-m-font-size, var(--gov-text-m-font-size));
-    line-height: var(--gov-button-text-m-line-height, var(--gov-text-m-line-height));
-    letter-spacing: var(--gov-button-text-m-letter-spacing, var(--gov-text-m-letter-spacing));
-    -moz-column-gap: var(--gov-button-m-padding-x, 0.75rem);
-         column-gap: var(--gov-button-m-padding-x, 0.75rem);
-    min-height: var(--gov-button-m-min-height, 2.5rem);
-    padding: var(--gov-button-m-padding-y, 0.375rem) var(--gov-button-m-padding-x, 0.75rem);
-  }
-  [size=m].gov-button .element .gov-icon {
-    width: var(--gov-button-m-icon-size, 1.25rem);
-    height: var(--gov-button-m-icon-size, 1.25rem);
-  }
-}
-[size=l].gov-button .element {
   font-weight: var(--gov-button-text-m-font-weight, var(--gov-text-m-font-weight));
   font-size: var(--gov-button-text-m-font-size, var(--gov-text-m-font-size));
   line-height: var(--gov-button-text-m-line-height, var(--gov-text-m-line-height));
@@ -929,27 +1045,11 @@
   min-height: var(--gov-button-m-min-height, 2.5rem);
   padding: var(--gov-button-m-padding-y, 0.375rem) var(--gov-button-m-padding-x, 0.75rem);
 }
-[size=l].gov-button .element .gov-icon {
+[size=m].gov-button .element .gov-icon {
   width: var(--gov-button-m-icon-size, 1.25rem);
   height: var(--gov-button-m-icon-size, 1.25rem);
 }
-@media (min-width: 48em) {
-  [size=l].gov-button .element {
-    font-weight: var(--gov-button-text-l-font-weight, var(--gov-text-l-font-weight));
-    font-size: var(--gov-button-text-l-font-size, var(--gov-text-l-font-size));
-    line-height: var(--gov-button-text-l-line-height, var(--gov-text-l-line-height));
-    letter-spacing: var(--gov-button-text-l-letter-spacing, var(--gov-text-l-letter-spacing));
-    -moz-column-gap: var(--gov-button-l-padding-x, 1rem);
-         column-gap: var(--gov-button-l-padding-x, 1rem);
-    min-height: var(--gov-button-l-min-height, 3rem);
-    padding: var(--gov-button-l-padding-y, 0.5rem) var(--gov-button-l-padding-x, 1rem);
-  }
-  [size=l].gov-button .element .gov-icon {
-    width: var(--gov-button-l-icon-size, 1.5rem);
-    height: var(--gov-button-l-icon-size, 1.5rem);
-  }
-}
-[size=xl].gov-button .element {
+[size=l].gov-button .element {
   font-weight: var(--gov-button-text-l-font-weight, var(--gov-text-l-font-weight));
   font-size: var(--gov-button-text-l-font-size, var(--gov-text-l-font-size));
   line-height: var(--gov-button-text-l-line-height, var(--gov-text-l-line-height));
@@ -959,25 +1059,23 @@
   min-height: var(--gov-button-l-min-height, 3rem);
   padding: var(--gov-button-l-padding-y, 0.5rem) var(--gov-button-l-padding-x, 1rem);
 }
-[size=xl].gov-button .element .gov-icon {
+[size=l].gov-button .element .gov-icon {
   width: var(--gov-button-l-icon-size, 1.5rem);
   height: var(--gov-button-l-icon-size, 1.5rem);
 }
-@media (min-width: 48em) {
-  [size=xl].gov-button .element {
-    font-weight: var(--gov-button-text-xl-font-weight, var(--gov-text-xl-font-weight));
-    font-size: var(--gov-button-text-xl-font-size, var(--gov-text-xl-font-size));
-    line-height: var(--gov-button-text-xl-line-height, var(--gov-text-xl-line-height));
-    letter-spacing: var(--gov-button-text-xl-letter-spacing, var(--gov-text-xl-letter-spacing));
-    -moz-column-gap: var(--gov-button-xl-padding-x, 1.25rem);
-         column-gap: var(--gov-button-xl-padding-x, 1.25rem);
-    min-height: var(--gov-button-xl-min-height, 3.5rem);
-    padding: var(--gov-button-xl-padding-y, 0.75rem) var(--gov-button-xl-padding-x, 1.25rem);
-  }
-  [size=xl].gov-button .element .gov-icon {
-    width: var(--gov-button-xl-icon-size, 1.75rem);
-    height: var(--gov-button-xl-icon-size, 1.75rem);
-  }
+[size=xl].gov-button .element {
+  font-weight: var(--gov-button-text-xl-font-weight, var(--gov-text-xl-font-weight));
+  font-size: var(--gov-button-text-xl-font-size, var(--gov-text-xl-font-size));
+  line-height: var(--gov-button-text-xl-line-height, var(--gov-text-xl-line-height));
+  letter-spacing: var(--gov-button-text-xl-letter-spacing, var(--gov-text-xl-letter-spacing));
+  -moz-column-gap: var(--gov-button-xl-padding-x, 1.25rem);
+       column-gap: var(--gov-button-xl-padding-x, 1.25rem);
+  min-height: var(--gov-button-xl-min-height, 3.5rem);
+  padding: var(--gov-button-xl-padding-y, 0.75rem) var(--gov-button-xl-padding-x, 1.25rem);
+}
+[size=xl].gov-button .element .gov-icon {
+  width: var(--gov-button-xl-icon-size, 1.75rem);
+  height: var(--gov-button-xl-icon-size, 1.75rem);
 }
 
 .gov-button {
@@ -986,53 +1084,34 @@
 .gov-button .element {
   border-radius: var(--gov-border-radius, 0.1875rem);
 }
+.gov-button[type=link] .element {
+  padding: 0;
+  text-decoration: underline;
+  line-height: inherit;
+  min-height: inherit;
+}
+@media not all and (pointer: coarse) {
+  .gov-button[type=link] .element:hover {
+    text-decoration: none;
+  }
+}
 .gov-button[loading=true] .element > .gov-icon:not(.gov-spin-animation),
 .gov-button[loading=true] .element > gov-icon:not(.gov-spin-animation), .gov-button[loading="1"] .element > .gov-icon:not(.gov-spin-animation),
 .gov-button[loading="1"] .element > gov-icon:not(.gov-spin-animation) {
   display: none;
 }
-.gov-button:not(.gov-button--w-icon)[loading="0"][size=xs] .element, .gov-button:not(.gov-button--w-icon)[loading=false][size=xs] .element, .gov-button:not(.gov-button--w-icon)[loading=""][size=xs] .element {
+.gov-button:not(.gov-button--w-icon)[loading="0"][size=xs] .element, .gov-button:not(.gov-button--w-icon)[loading=false][size=xs] .element, .gov-button:not(.gov-button--w-icon)[loading=""][size=xs] .gov-button:not[type=link] .element {
   padding: var(--gov-button-xs-padding-y, 0.125rem) calc(var(--gov-button-xs-padding-x, 0.625rem) + var(--gov-button-xs-padding-x, 0.625rem) / 2 + var(--gov-button-xs-icon-size, 1rem) / 2);
 }
-.gov-button:not(.gov-button--w-icon)[loading="0"][size=s] .element, .gov-button:not(.gov-button--w-icon)[loading=false][size=s] .element, .gov-button:not(.gov-button--w-icon)[loading=""][size=s] .element {
+.gov-button:not(.gov-button--w-icon)[loading="0"][size=s] .element, .gov-button:not(.gov-button--w-icon)[loading=false][size=s] .element, .gov-button:not(.gov-button--w-icon)[loading=""][size=s] .gov-button:not[type=link] .element {
   padding: var(--gov-button-s-padding-y, 0.25rem) calc(var(--gov-button-s-padding-x, 0.75rem) + var(--gov-button-s-padding-x, 0.75rem) / 2 + var(--gov-button-s-icon-size, 1rem) / 2);
 }
-.gov-button:not(.gov-button--w-icon)[loading="0"][size=m] .element, .gov-button:not(.gov-button--w-icon)[loading=false][size=m] .element, .gov-button:not(.gov-button--w-icon)[loading=""][size=m] .element {
+.gov-button:not(.gov-button--w-icon)[loading="0"][size=m] .element, .gov-button:not(.gov-button--w-icon)[loading=false][size=m] .element, .gov-button:not(.gov-button--w-icon)[loading=""][size=m] .gov-button:not[type=link] .element {
   padding: var(--gov-button-m-padding-y, 0.375rem) calc(var(--gov-button-m-padding-x, 0.75rem) + var(--gov-button-m-padding-x, 0.75rem) / 2 + var(--gov-button-m-icon-size, 1.25rem) / 2);
 }
-.gov-button:not(.gov-button--w-icon)[loading="0"][size=l] .element, .gov-button:not(.gov-button--w-icon)[loading=false][size=l] .element, .gov-button:not(.gov-button--w-icon)[loading=""][size=l] .element {
+.gov-button:not(.gov-button--w-icon)[loading="0"][size=l] .element, .gov-button:not(.gov-button--w-icon)[loading=false][size=l] .element, .gov-button:not(.gov-button--w-icon)[loading=""][size=l] .gov-button:not[type=link] .element {
   padding: var(--gov-button-l-padding-y, 0.5rem) calc(var(--gov-button-l-padding-x, 1rem) + var(--gov-button-l-padding-x, 1rem) / 2 + var(--gov-button-l-icon-size, 1.5rem) / 2);
 }
-.gov-button:not(.gov-button--w-icon)[loading="0"][size=xl] .element, .gov-button:not(.gov-button--w-icon)[loading=false][size=xl] .element, .gov-button:not(.gov-button--w-icon)[loading=""][size=xl] .element {
+.gov-button:not(.gov-button--w-icon)[loading="0"][size=xl] .element, .gov-button:not(.gov-button--w-icon)[loading=false][size=xl] .element, .gov-button:not(.gov-button--w-icon)[loading=""][size=xl] .gov-button:not[type=link] .element {
   padding: var(--gov-button-xl-padding-y, 0.75rem) calc(var(--gov-button-xl-padding-x, 1.25rem) + var(--gov-button-xl-padding-x, 1.25rem) / 2 + var(--gov-button-xl-icon-size, 1.75rem) / 2);
-}
-.gov-button[type=outlined][variant=primary] .gov-spin-animation, .gov-button[type=base][variant=primary] .gov-spin-animation {
-  color: var(--gov-button-primary-outlined-color, var(--gov-color-primary));
-}
-.gov-button[type=outlined][variant=primary][inverse=""] .gov-spin-animation, .gov-button[type=outlined][variant=primary][inverse=true i] .gov-spin-animation, .gov-button[type=outlined][variant=primary][inverse="1"] .gov-spin-animation, .gov-button[type=base][variant=primary][inverse=""] .gov-spin-animation, .gov-button[type=base][variant=primary][inverse=true i] .gov-spin-animation, .gov-button[type=base][variant=primary][inverse="1"] .gov-spin-animation {
-  color: inherit;
-}
-.gov-button[type=outlined][variant=secondary] .gov-spin-animation, .gov-button[type=base][variant=secondary] .gov-spin-animation {
-  color: var(--gov-button-secondary-outlined-color, var(--gov-color-secondary));
-}
-.gov-button[type=outlined][variant=secondary][inverse=""] .gov-spin-animation, .gov-button[type=outlined][variant=secondary][inverse=true i] .gov-spin-animation, .gov-button[type=outlined][variant=secondary][inverse="1"] .gov-spin-animation, .gov-button[type=base][variant=secondary][inverse=""] .gov-spin-animation, .gov-button[type=base][variant=secondary][inverse=true i] .gov-spin-animation, .gov-button[type=base][variant=secondary][inverse="1"] .gov-spin-animation {
-  color: inherit;
-}
-.gov-button[type=outlined][variant=error] .gov-spin-animation, .gov-button[type=base][variant=error] .gov-spin-animation {
-  color: var(--gov-button-error-outlined-color, var(--gov-color-error));
-}
-.gov-button[type=outlined][variant=error][inverse=""] .gov-spin-animation, .gov-button[type=outlined][variant=error][inverse=true i] .gov-spin-animation, .gov-button[type=outlined][variant=error][inverse="1"] .gov-spin-animation, .gov-button[type=base][variant=error][inverse=""] .gov-spin-animation, .gov-button[type=base][variant=error][inverse=true i] .gov-spin-animation, .gov-button[type=base][variant=error][inverse="1"] .gov-spin-animation {
-  color: inherit;
-}
-.gov-button[type=outlined][variant=success] .gov-spin-animation, .gov-button[type=base][variant=success] .gov-spin-animation {
-  color: var(--gov-button-success-outlined-color, var(--gov-color-success-500));
-}
-.gov-button[type=outlined][variant=success][inverse=""] .gov-spin-animation, .gov-button[type=outlined][variant=success][inverse=true i] .gov-spin-animation, .gov-button[type=outlined][variant=success][inverse="1"] .gov-spin-animation, .gov-button[type=base][variant=success][inverse=""] .gov-spin-animation, .gov-button[type=base][variant=success][inverse=true i] .gov-spin-animation, .gov-button[type=base][variant=success][inverse="1"] .gov-spin-animation {
-  color: inherit;
-}
-.gov-button[type=outlined][variant=warning] .gov-spin-animation, .gov-button[type=base][variant=warning] .gov-spin-animation {
-  color: var(--gov-button-warning-outlined-color, var(--gov-color-warning-500));
-}
-.gov-button[type=outlined][variant=warning][inverse=""] .gov-spin-animation, .gov-button[type=outlined][variant=warning][inverse=true i] .gov-spin-animation, .gov-button[type=outlined][variant=warning][inverse="1"] .gov-spin-animation, .gov-button[type=base][variant=warning][inverse=""] .gov-spin-animation, .gov-button[type=base][variant=warning][inverse=true i] .gov-spin-animation, .gov-button[type=base][variant=warning][inverse="1"] .gov-spin-animation {
-  color: inherit;
 }

package/dist/collection/components/gov-button/gov-button.js

@@ -137,14 +137,14 @@ export class GovButton {
           "text": "Style variation of the button"
         },
         "attribute": "variant",
-        "reflect": false
+        "reflect": true
       },
       "size": {
         "type": "string",
         "mutable": false,
         "complexType": {
           "original": "ButtonSizesType",
-          "resolved": "\"l\" | \"m\" | \"s\" | \"xl\"",
+          "resolved": "\"l\" | \"m\" | \"s\" | \"xl\" | \"xs\"",
           "references": {
             "ButtonSizesType": {
               "location": "import",
@@ -159,7 +159,7 @@ export class GovButton {
           "text": "Button\u2019s size"
         },
         "attribute": "size",
-        "reflect": false,
+        "reflect": true,
         "defaultValue": "'m'"
       },
       "type": {
@@ -167,7 +167,7 @@ export class GovButton {
         "mutable": false,
         "complexType": {
           "original": "TypesType",
-          "resolved": "\"base\" | \"outlined\" | \"solid\"",
+          "resolved": "\"base\" | \"link\" | \"outlined\" | \"solid\"",
           "references": {
             "TypesType": {
               "location": "import",
@@ -182,7 +182,7 @@ export class GovButton {
           "text": "Button's type"
         },
         "attribute": "type",
-        "reflect": false,
+        "reflect": true,
         "defaultValue": "'solid'"
       },
       "expanded": {
@@ -253,7 +253,7 @@ export class GovButton {
           "text": "Makes the button component disabled.\nThis prevents users from being able to interact with the button, and conveys its inactive state to assistive technologies"
         },
         "attribute": "disabled",
-        "reflect": false,
+        "reflect": true,
         "defaultValue": "false"
       },
       "nativeType": {