@graupl/icons 1.0.0-beta.0 → 1.0.0-beta.10

package/dist/css/base/button.css

@@ -0,0 +1,2 @@
+@layer graupl.theme{.button{--graupl-icon-color:var(--graupl-button-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))))))}.button.visited,.button:visited{--graupl-icon-color:var(--graupl-button-visited-color,var(--graupl-button-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)))))))}.button.focus{--graupl-icon-color:var(--graupl-button-focus-color,var(--graupl-button-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)))))))}.button:focus-visible{--graupl-icon-color:var(--graupl-button-focus-color,var(--graupl-button-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)))))))}.button.hover,.button:hover{--graupl-icon-color:var(--graupl-button-hover-color,var(--graupl-background,var(--graupl-root-background,var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff))))))}.button.active,.button:active{--graupl-icon-color:var(--graupl-button-active-color,var(--graupl-button-hover-color,var(--graupl-background,var(--graupl-root-background,var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff)))))))}.button.disabled,.button.disabled.focus,.button.disabled.visited,.button.disabled:visited{--graupl-icon-color:var(--graupl-button-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}.button.disabled:focus-visible{--graupl-icon-color:var(--graupl-button-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}.button.disabled.active,.button.disabled.disabled,.button.disabled.hover,.button.disabled:active,.button.disabled:disabled,.button.disabled:hover,.button.disabled[aria-disabled=true],.button.disabled[disabled],.button:disabled,.button:disabled.focus,.button:disabled.visited,.button:disabled:visited{--graupl-icon-color:var(--graupl-button-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}.button:disabled:focus-visible{--graupl-icon-color:var(--graupl-button-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}.button:disabled.active,.button:disabled.disabled,.button:disabled.hover,.button:disabled:active,.button:disabled:disabled,.button:disabled:hover,.button:disabled[aria-disabled=true],.button:disabled[disabled],.button[disabled],.button[disabled].focus,.button[disabled].visited,.button[disabled]:visited{--graupl-icon-color:var(--graupl-button-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}.button[disabled]:focus-visible{--graupl-icon-color:var(--graupl-button-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}.button[aria-disabled=true],.button[aria-disabled=true].focus,.button[aria-disabled=true].visited,.button[aria-disabled=true]:visited,.button[disabled].active,.button[disabled].disabled,.button[disabled].hover,.button[disabled]:active,.button[disabled]:disabled,.button[disabled]:hover,.button[disabled][aria-disabled=true],.button[disabled][disabled]{--graupl-icon-color:var(--graupl-button-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}.button[aria-disabled=true]:focus-visible{--graupl-icon-color:var(--graupl-button-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}.button[aria-disabled=true].active,.button[aria-disabled=true].disabled,.button[aria-disabled=true].hover,.button[aria-disabled=true]:active,.button[aria-disabled=true]:disabled,.button[aria-disabled=true]:hover,.button[aria-disabled=true][aria-disabled=true],.button[aria-disabled=true][disabled]{--graupl-icon-color:var(--graupl-button-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}}
+/*# sourceMappingURL=button.css.map */

package/dist/css/base/button.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../node_modules/@graupl/core/src/scss/mixins/_layer.scss","../../../src/scss/base/button/_index.scss","button.css"],"names":[],"mappings":"AASI,oBCkBF,QACE,+MCxBF,CD6BM,gCACE,kPCxBR,CDuBM,cACE,gPCrBR,CDoBM,sBACE,gPClBR,CDiBM,4BACE,+NCZR,CDWM,8BACE,iQCNR,CDgBc,0FACE,2KCLhB,CDIc,+BACE,2KCFhB,CDCc,4SACE,2KCkChB,CDnCc,+BACE,2KCqChB,CDtCc,gTACE,2KCyEhB,CD1Ec,gCACE,2KC4EhB,CD7Ec,gWACE,2KCgHhB,CDjHc,0CACE,2KCmHhB,CDpHc,0SACE,2KC2IhB,CACF","file":"button.css"}

package/dist/css/base/link.css

@@ -0,0 +1,2 @@
+@layer graupl.theme{a{--graupl-icon-color:var(--graupl-link-color,var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1))))}a.visited,a:visited{--graupl-icon-color:var(--graupl-link-visited-color,var(--graupl-link-color,var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)))))}a.focus{--graupl-icon-color:var(--graupl-link-focus-color,var(--graupl-link-color,var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)))))}a:focus-visible{--graupl-icon-color:var(--graupl-link-focus-color,var(--graupl-link-color,var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)))))}a.hover,a:hover{--graupl-icon-color:var(--graupl-link-hover-color,var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46))))}a.active,a:active{--graupl-icon-color:var(--graupl-link-active-color,var(--graupl-link-hover-color,var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46)))))}a.disabled,a.disabled.focus,a.disabled.visited,a.disabled:visited{--graupl-icon-color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}a.disabled:focus-visible{--graupl-icon-color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}a.disabled.active,a.disabled.disabled,a.disabled.hover,a.disabled:active,a.disabled:disabled,a.disabled:hover,a.disabled[aria-disabled=true],a.disabled[disabled],a:disabled,a:disabled.focus,a:disabled.visited,a:disabled:visited{--graupl-icon-color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}a:disabled:focus-visible{--graupl-icon-color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}a:disabled.active,a:disabled.disabled,a:disabled.hover,a:disabled:active,a:disabled:disabled,a:disabled:hover,a:disabled[aria-disabled=true],a:disabled[disabled],a[disabled],a[disabled].focus,a[disabled].visited,a[disabled]:visited{--graupl-icon-color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}a[disabled]:focus-visible{--graupl-icon-color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}a[aria-disabled=true],a[aria-disabled=true].focus,a[aria-disabled=true].visited,a[aria-disabled=true]:visited,a[disabled].active,a[disabled].disabled,a[disabled].hover,a[disabled]:active,a[disabled]:disabled,a[disabled]:hover,a[disabled][aria-disabled=true],a[disabled][disabled]{--graupl-icon-color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}a[aria-disabled=true]:focus-visible{--graupl-icon-color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}a[aria-disabled=true].active,a[aria-disabled=true].disabled,a[aria-disabled=true].hover,a[aria-disabled=true]:active,a[aria-disabled=true]:disabled,a[aria-disabled=true]:hover,a[aria-disabled=true][aria-disabled=true],a[aria-disabled=true][disabled]{--graupl-icon-color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}}
+/*# sourceMappingURL=link.css.map */

package/dist/css/base/link.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../node_modules/@graupl/core/src/scss/mixins/_layer.scss","../../../src/scss/base/link/_index.scss","link.css"],"names":[],"mappings":"AASI,oBCkBkC,EAClC,gKCzBF,CD8BM,oBACE,iMCzBR,CDwBM,QACE,+LCtBR,CDqBM,gBACE,+LCnBR,CDkBM,gBACE,yKCbR,CDYM,kBACE,yMCPR,CDiBc,kEACE,yKCNhB,CDKc,yBACE,yKCHhB,CDEc,oOACE,yKCiChB,CDlCc,yBACE,yKCoChB,CDrCc,wOACE,yKCwEhB,CDzEc,0BACE,yKC2EhB,CD5Ec,wRACE,yKC+GhB,CDhHc,oCACE,yKCkHhB,CDnHc,0PACE,yKC0IhB,CACF","file":"link.css"}

package/dist/css/base.css

@@ -0,0 +1,2 @@
+@layer graupl.theme{.button{--graupl-icon-color:var(--graupl-button-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))))))}.button.visited,.button:visited{--graupl-icon-color:var(--graupl-button-visited-color,var(--graupl-button-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)))))))}.button.focus{--graupl-icon-color:var(--graupl-button-focus-color,var(--graupl-button-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)))))))}.button:focus-visible{--graupl-icon-color:var(--graupl-button-focus-color,var(--graupl-button-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)))))))}.button.hover,.button:hover{--graupl-icon-color:var(--graupl-button-hover-color,var(--graupl-background,var(--graupl-root-background,var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff))))))}.button.active,.button:active{--graupl-icon-color:var(--graupl-button-active-color,var(--graupl-button-hover-color,var(--graupl-background,var(--graupl-root-background,var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff)))))))}.button.disabled,.button.disabled.focus,.button.disabled.visited,.button.disabled:visited{--graupl-icon-color:var(--graupl-button-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}.button.disabled:focus-visible{--graupl-icon-color:var(--graupl-button-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}.button.disabled.active,.button.disabled.disabled,.button.disabled.hover,.button.disabled:active,.button.disabled:disabled,.button.disabled:hover,.button.disabled[aria-disabled=true],.button.disabled[disabled],.button:disabled,.button:disabled.focus,.button:disabled.visited,.button:disabled:visited{--graupl-icon-color:var(--graupl-button-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}.button:disabled:focus-visible{--graupl-icon-color:var(--graupl-button-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}.button:disabled.active,.button:disabled.disabled,.button:disabled.hover,.button:disabled:active,.button:disabled:disabled,.button:disabled:hover,.button:disabled[aria-disabled=true],.button:disabled[disabled],.button[disabled],.button[disabled].focus,.button[disabled].visited,.button[disabled]:visited{--graupl-icon-color:var(--graupl-button-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}.button[disabled]:focus-visible{--graupl-icon-color:var(--graupl-button-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}.button[aria-disabled=true],.button[aria-disabled=true].focus,.button[aria-disabled=true].visited,.button[aria-disabled=true]:visited,.button[disabled].active,.button[disabled].disabled,.button[disabled].hover,.button[disabled]:active,.button[disabled]:disabled,.button[disabled]:hover,.button[disabled][aria-disabled=true],.button[disabled][disabled]{--graupl-icon-color:var(--graupl-button-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}.button[aria-disabled=true]:focus-visible{--graupl-icon-color:var(--graupl-button-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}.button[aria-disabled=true].active,.button[aria-disabled=true].disabled,.button[aria-disabled=true].hover,.button[aria-disabled=true]:active,.button[aria-disabled=true]:disabled,.button[aria-disabled=true]:hover,.button[aria-disabled=true][aria-disabled=true],.button[aria-disabled=true][disabled]{--graupl-icon-color:var(--graupl-button-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}a{--graupl-icon-color:var(--graupl-link-color,var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1))))}a.visited,a:visited{--graupl-icon-color:var(--graupl-link-visited-color,var(--graupl-link-color,var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)))))}a.focus{--graupl-icon-color:var(--graupl-link-focus-color,var(--graupl-link-color,var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)))))}}@layer graupl.theme{a:focus-visible{--graupl-icon-color:var(--graupl-link-focus-color,var(--graupl-link-color,var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)))))}a.hover,a:hover{--graupl-icon-color:var(--graupl-link-hover-color,var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46))))}a.active,a:active{--graupl-icon-color:var(--graupl-link-active-color,var(--graupl-link-hover-color,var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46)))))}a.disabled,a.disabled.focus,a.disabled.visited,a.disabled:visited{--graupl-icon-color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}a.disabled:focus-visible{--graupl-icon-color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}a.disabled.active,a.disabled.disabled,a.disabled.hover,a.disabled:active,a.disabled:disabled,a.disabled:hover,a.disabled[aria-disabled=true],a.disabled[disabled],a:disabled,a:disabled.focus,a:disabled.visited,a:disabled:visited{--graupl-icon-color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}a:disabled:focus-visible{--graupl-icon-color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}a:disabled.active,a:disabled.disabled,a:disabled.hover,a:disabled:active,a:disabled:disabled,a:disabled:hover,a:disabled[aria-disabled=true],a:disabled[disabled],a[disabled],a[disabled].focus,a[disabled].visited,a[disabled]:visited{--graupl-icon-color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}a[disabled]:focus-visible{--graupl-icon-color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}a[aria-disabled=true],a[aria-disabled=true].focus,a[aria-disabled=true].visited,a[aria-disabled=true]:visited,a[disabled].active,a[disabled].disabled,a[disabled].hover,a[disabled]:active,a[disabled]:disabled,a[disabled]:hover,a[disabled][aria-disabled=true],a[disabled][disabled]{--graupl-icon-color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}a[aria-disabled=true]:focus-visible{--graupl-icon-color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}a[aria-disabled=true].active,a[aria-disabled=true].disabled,a[aria-disabled=true].hover,a[aria-disabled=true]:active,a[aria-disabled=true]:disabled,a[aria-disabled=true]:hover,a[aria-disabled=true][aria-disabled=true],a[aria-disabled=true][disabled]{--graupl-icon-color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}}
+/*# sourceMappingURL=base.css.map */

package/dist/css/base.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../node_modules/@graupl/core/src/scss/mixins/_layer.scss","../../src/scss/base/button/_index.scss","base.css","../../src/scss/base/link/_index.scss"],"names":[],"mappings":"AASI,oBCkBF,QACE,+MCxBF,CD6BM,gCACE,kPCxBR,CDuBM,cACE,gPCrBR,CDoBM,sBACE,gPClBR,CDiBM,4BACE,+NCZR,CDWM,8BACE,iQCNR,CDgBc,0FACE,2KCLhB,CDIc,+BACE,2KCFhB,CDCc,4SACE,2KCkChB,CDnCc,+BACE,2KCqChB,CDtCc,gTACE,2KCyEhB,CD1Ec,gCACE,2KC4EhB,CD7Ec,gWACE,2KCgHhB,CDjHc,0CACE,2KCmHhB,CDpHc,0SACE,2KC2IhB,CC7JoC,EAClC,gKDiKF,CC5JM,oBACE,iMDiKR,CClKM,QACE,+LDoKR,CAbF,CFhLI,oBGwBI,gBACE,+LDuKR,CCxKM,gBACE,yKD6KR,CC9KM,kBACE,yMDmLR,CCzKc,kEACE,yKDoLhB,CCrLc,yBACE,yKDuLhB,CCxLc,oOACE,yKD2NhB,CC5Nc,yBACE,yKD8NhB,CC/Nc,wOACE,yKDkQhB,CCnQc,0BACE,yKDqQhB,CCtQc,wRACE,yKDyShB,CC1Sc,oCACE,yKD4ShB,CC7Sc,0PACE,yKDoUhB,CACF","file":"base.css"}

package/dist/css/component/icon.css

@@ -0,0 +1,2 @@
+@layer graupl.component{.icon{background-position:50%;background-repeat:no-repeat;background-size:contain;display:var(--graupl-icon-display,inline-block);height:var(--graupl-icon-height,var(--graupl-icon-size,1.25em));margin-inline:var(--graupl-icon-spacer,var(--graupl-spacer-2,calc(var(--graupl-spacer, 1rem)*.25))) var(--graupl-icon-spacer,var(--graupl-spacer-2,calc(var(--graupl-spacer, 1rem)*.25)));-webkit-mask-image:var(--graupl-icon,none);mask-image:var(--graupl-icon,none);-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;vertical-align:sub;width:var(--graupl-icon-width,var(--graupl-icon-size,1.25em))}.icon-before:before{margin-inline-end:var(--graupl-icon-spacer,var(--graupl-spacer-2,calc(var(--graupl-spacer, 1rem)*.25)))}.icon-after:after,.icon-before:before{background-position:50%;background-repeat:no-repeat;background-size:contain;content:"";display:var(--graupl-icon-display,inline-block);height:var(--graupl-icon-height,var(--graupl-icon-size,1.25em));-webkit-mask-image:var(--graupl-icon,none);mask-image:var(--graupl-icon,none);-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;vertical-align:sub;width:var(--graupl-icon-width,var(--graupl-icon-size,1.25em))}.icon-after:after{margin-inline-start:var(--graupl-icon-spacer,var(--graupl-spacer-2,calc(var(--graupl-spacer, 1rem)*.25)))}}@layer graupl.theme{.icon,.icon-after:after,.icon-before:before{background-color:var(--graupl-icon-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))))))}.icon-after.primary-100,.icon-before.primary-100,.icon.primary-100{--graupl-icon-color:var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff)))}.icon-after.primary-200,.icon-before.primary-200,.icon.primary-200{--graupl-icon-color:var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa)))}.icon-after.primary-300,.icon-before.primary-300,.icon.primary-300{--graupl-icon-color:var(--graupl-theme-active--primary--300,var(--graupl-theme-light--primary--300,var(--graupl-primary--300,#5e90ed)))}.icon-after.primary-400,.icon-before.primary-400,.icon.primary-400{--graupl-icon-color:var(--graupl-theme-active--primary--400,var(--graupl-theme-light--primary--400,var(--graupl-primary--400,#3672e2)))}.icon-after.primary-500,.icon-before.primary-500,.icon.primary-500{--graupl-icon-color:var(--graupl-theme-active--primary--500,var(--graupl-theme-light--primary--500,var(--graupl-primary--500,#2063df)))}.icon-after.primary-600,.icon-before.primary-600,.icon.primary-600{--graupl-icon-color:var(--graupl-theme-active--primary--600,var(--graupl-theme-light--primary--600,var(--graupl-primary--600,#1d59c9)))}.icon-after.primary-700,.icon-before.primary-700,.icon.primary-700{--graupl-icon-color:var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)))}.icon-after.primary-800,.icon-before.primary-800,.icon.primary-800{--graupl-icon-color:var(--graupl-theme-active--primary--800,var(--graupl-theme-light--primary--800,var(--graupl-primary--800,#052561)))}.icon-after.primary-900,.icon-before.primary-900,.icon.primary-900{--graupl-icon-color:var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)))}.icon-after.secondary-100,.icon-before.secondary-100,.icon.secondary-100{--graupl-icon-color:var(--graupl-theme-active--secondary--100,var(--graupl-theme-light--secondary--100,var(--graupl-secondary--100,#edeef7)))}.icon-after.secondary-200,.icon-before.secondary-200,.icon.secondary-200{--graupl-icon-color:var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb)))}.icon-after.secondary-300,.icon-before.secondary-300,.icon.secondary-300{--graupl-icon-color:var(--graupl-theme-active--secondary--300,var(--graupl-theme-light--secondary--300,var(--graupl-secondary--300,#9497b8)))}.icon-after.secondary-400,.icon-before.secondary-400,.icon.secondary-400{--graupl-icon-color:var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))}.icon-after.secondary-500,.icon-before.secondary-500,.icon.secondary-500{--graupl-icon-color:var(--graupl-theme-active--secondary--500,var(--graupl-theme-light--secondary--500,var(--graupl-secondary--500,#6c7093)))}.icon-after.secondary-600,.icon-before.secondary-600,.icon.secondary-600{--graupl-icon-color:var(--graupl-theme-active--secondary--600,var(--graupl-theme-light--secondary--600,var(--graupl-secondary--600,#626484)))}.icon-after.secondary-700,.icon-before.secondary-700,.icon.secondary-700{--graupl-icon-color:var(--graupl-theme-active--secondary--700,var(--graupl-theme-light--secondary--700,var(--graupl-secondary--700,#474a6b)))}.icon-after.secondary-800,.icon-before.secondary-800,.icon.secondary-800{--graupl-icon-color:var(--graupl-theme-active--secondary--800,var(--graupl-theme-light--secondary--800,var(--graupl-secondary--800,#242642)))}.icon-after.secondary-900,.icon-before.secondary-900,.icon.secondary-900{--graupl-icon-color:var(--graupl-theme-active--secondary--900,var(--graupl-theme-light--secondary--900,var(--graupl-secondary--900,#0f1124)))}.icon-after.tertiary-100,.icon-before.tertiary-100,.icon.tertiary-100{--graupl-icon-color:var(--graupl-theme-active--tertiary--100,var(--graupl-theme-light--tertiary--100,var(--graupl-tertiary--100,#fde7ef)))}.icon-after.tertiary-200,.icon-before.tertiary-200,.icon.tertiary-200{--graupl-icon-color:var(--graupl-theme-active--tertiary--200,var(--graupl-theme-light--tertiary--200,var(--graupl-tertiary--200,#f2a6bf)))}.icon-after.tertiary-300,.icon-before.tertiary-300,.icon.tertiary-300{--graupl-icon-color:var(--graupl-theme-active--tertiary--300,var(--graupl-theme-light--tertiary--300,var(--graupl-tertiary--300,#e06c92)))}.icon-after.tertiary-400,.icon-before.tertiary-400,.icon.tertiary-400{--graupl-icon-color:var(--graupl-theme-active--tertiary--400,var(--graupl-theme-light--tertiary--400,var(--graupl-tertiary--400,#d14775)))}.icon-after.tertiary-500,.icon-before.tertiary-500,.icon.tertiary-500{--graupl-icon-color:var(--graupl-theme-active--tertiary--500,var(--graupl-theme-light--tertiary--500,var(--graupl-tertiary--500,#c36)))}.icon-after.tertiary-600,.icon-before.tertiary-600,.icon.tertiary-600{--graupl-icon-color:var(--graupl-theme-active--tertiary--600,var(--graupl-theme-light--tertiary--600,var(--graupl-tertiary--600,#b82e5c)))}.icon-after.tertiary-700,.icon-before.tertiary-700,.icon.tertiary-700{--graupl-icon-color:var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46)))}.icon-after.tertiary-800,.icon-before.tertiary-800,.icon.tertiary-800{--graupl-icon-color:var(--graupl-theme-active--tertiary--800,var(--graupl-theme-light--tertiary--800,var(--graupl-tertiary--800,#590d26)))}.icon-after.tertiary-900,.icon-before.tertiary-900,.icon.tertiary-900{--graupl-icon-color:var(--graupl-theme-active--tertiary--900,var(--graupl-theme-light--tertiary--900,var(--graupl-tertiary--900,#2f0412)))}}
+/*# sourceMappingURL=icon.css.map */

package/dist/css/component/icon.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../node_modules/@graupl/core/src/scss/mixins/_layer.scss","../../../src/scss/component/icon/_index.scss","../../../src/scss/component/icon/_mixins.scss","../../../src/scss/component/icon/_variables.scss","icon.css"],"names":[],"mappings":"AASI,wBCCF,MCDA,uBAAA,CADA,2BAAA,CAEA,uBAAA,CALA,+CCMa,CDJb,+DCUY,CDuBV,yLAAA,CA5BF,0CCOK,CDPL,kCCOK,CDJL,4BAAA,CAAA,oBAAA,CAFA,6BAAA,CAAA,qBAAA,CACA,yBAAA,CAAA,iBAAA,CAHA,kBAAA,CALA,6DEQA,CFUE,oBAIE,uGECJ,CFEE,sCAtBF,uBAAA,CADA,2BAAA,CAEA,uBAAA,CAiBI,UAAA,CAtBJ,+CCMa,CDJb,+DCUY,CDLZ,0CCOK,CDPL,kCCOK,CDJL,4BAAA,CAAA,oBAAA,CAFA,6BAAA,CAAA,qBAAA,CACA,yBAAA,CAAA,iBAAA,CAHA,kBAAA,CALA,6DEsCA,CFbE,kBAIE,yGESJ,CACF,CJpCI,oBEyCA,4CA/BF,0MEoCA,CHFM,mEACE,uIGMR,CHPM,mEACE,uIGWR,CHZM,mEACE,uIGgBR,CHjBM,mEACE,uIGqBR,CHtBM,mEACE,uIG0BR,CH3BM,mEACE,uIG+BR,CHhCM,mEACE,uIGoCR,CHrCM,mEACE,uIGyCR,CH1CM,mEACE,uIG8CR,CH/CM,yEACE,6IGmDR,CHpDM,yEACE,6IGwDR,CHzDM,yEACE,6IG6DR,CH9DM,yEACE,6IGkER,CHnEM,yEACE,6IGuER,CHxEM,yEACE,6IG4ER,CH7EM,yEACE,6IGiFR,CHlFM,yEACE,6IGsFR,CHvFM,yEACE,6IG2FR,CH5FM,sEACE,0IGgGR,CHjGM,sEACE,0IGqGR,CHtGM,sEACE,0IG0GR,CH3GM,sEACE,0IG+GR,CHhHM,sEACE,uIGoHR,CHrHM,sEACE,0IGyHR,CH1HM,sEACE,0IG8HR,CH/HM,sEACE,0IGmIR,CHpIM,sEACE,0IGwIR,CACF","file":"icon.css"}

package/dist/css/component.css

@@ -0,0 +1,2 @@
+@layer graupl.component{.icon{background-position:50%;background-repeat:no-repeat;background-size:contain;display:var(--graupl-icon-display,inline-block);height:var(--graupl-icon-height,var(--graupl-icon-size,1.25em));margin-inline:var(--graupl-icon-spacer,var(--graupl-spacer-2,calc(var(--graupl-spacer, 1rem)*.25))) var(--graupl-icon-spacer,var(--graupl-spacer-2,calc(var(--graupl-spacer, 1rem)*.25)));-webkit-mask-image:var(--graupl-icon,none);mask-image:var(--graupl-icon,none);-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;vertical-align:sub;width:var(--graupl-icon-width,var(--graupl-icon-size,1.25em))}.icon-before:before{margin-inline-end:var(--graupl-icon-spacer,var(--graupl-spacer-2,calc(var(--graupl-spacer, 1rem)*.25)))}.icon-after:after,.icon-before:before{background-position:50%;background-repeat:no-repeat;background-size:contain;content:"";display:var(--graupl-icon-display,inline-block);height:var(--graupl-icon-height,var(--graupl-icon-size,1.25em));-webkit-mask-image:var(--graupl-icon,none);mask-image:var(--graupl-icon,none);-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;vertical-align:sub;width:var(--graupl-icon-width,var(--graupl-icon-size,1.25em))}.icon-after:after{margin-inline-start:var(--graupl-icon-spacer,var(--graupl-spacer-2,calc(var(--graupl-spacer, 1rem)*.25)))}}@layer graupl.theme{.icon,.icon-after:after,.icon-before:before{background-color:var(--graupl-icon-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))))))}.icon-after.primary-100,.icon-before.primary-100,.icon.primary-100{--graupl-icon-color:var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff)))}.icon-after.primary-200,.icon-before.primary-200,.icon.primary-200{--graupl-icon-color:var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa)))}.icon-after.primary-300,.icon-before.primary-300,.icon.primary-300{--graupl-icon-color:var(--graupl-theme-active--primary--300,var(--graupl-theme-light--primary--300,var(--graupl-primary--300,#5e90ed)))}.icon-after.primary-400,.icon-before.primary-400,.icon.primary-400{--graupl-icon-color:var(--graupl-theme-active--primary--400,var(--graupl-theme-light--primary--400,var(--graupl-primary--400,#3672e2)))}.icon-after.primary-500,.icon-before.primary-500,.icon.primary-500{--graupl-icon-color:var(--graupl-theme-active--primary--500,var(--graupl-theme-light--primary--500,var(--graupl-primary--500,#2063df)))}.icon-after.primary-600,.icon-before.primary-600,.icon.primary-600{--graupl-icon-color:var(--graupl-theme-active--primary--600,var(--graupl-theme-light--primary--600,var(--graupl-primary--600,#1d59c9)))}.icon-after.primary-700,.icon-before.primary-700,.icon.primary-700{--graupl-icon-color:var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)))}.icon-after.primary-800,.icon-before.primary-800,.icon.primary-800{--graupl-icon-color:var(--graupl-theme-active--primary--800,var(--graupl-theme-light--primary--800,var(--graupl-primary--800,#052561)))}.icon-after.primary-900,.icon-before.primary-900,.icon.primary-900{--graupl-icon-color:var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)))}.icon-after.secondary-100,.icon-before.secondary-100,.icon.secondary-100{--graupl-icon-color:var(--graupl-theme-active--secondary--100,var(--graupl-theme-light--secondary--100,var(--graupl-secondary--100,#edeef7)))}.icon-after.secondary-200,.icon-before.secondary-200,.icon.secondary-200{--graupl-icon-color:var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb)))}.icon-after.secondary-300,.icon-before.secondary-300,.icon.secondary-300{--graupl-icon-color:var(--graupl-theme-active--secondary--300,var(--graupl-theme-light--secondary--300,var(--graupl-secondary--300,#9497b8)))}.icon-after.secondary-400,.icon-before.secondary-400,.icon.secondary-400{--graupl-icon-color:var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))}.icon-after.secondary-500,.icon-before.secondary-500,.icon.secondary-500{--graupl-icon-color:var(--graupl-theme-active--secondary--500,var(--graupl-theme-light--secondary--500,var(--graupl-secondary--500,#6c7093)))}.icon-after.secondary-600,.icon-before.secondary-600,.icon.secondary-600{--graupl-icon-color:var(--graupl-theme-active--secondary--600,var(--graupl-theme-light--secondary--600,var(--graupl-secondary--600,#626484)))}.icon-after.secondary-700,.icon-before.secondary-700,.icon.secondary-700{--graupl-icon-color:var(--graupl-theme-active--secondary--700,var(--graupl-theme-light--secondary--700,var(--graupl-secondary--700,#474a6b)))}.icon-after.secondary-800,.icon-before.secondary-800,.icon.secondary-800{--graupl-icon-color:var(--graupl-theme-active--secondary--800,var(--graupl-theme-light--secondary--800,var(--graupl-secondary--800,#242642)))}.icon-after.secondary-900,.icon-before.secondary-900,.icon.secondary-900{--graupl-icon-color:var(--graupl-theme-active--secondary--900,var(--graupl-theme-light--secondary--900,var(--graupl-secondary--900,#0f1124)))}.icon-after.tertiary-100,.icon-before.tertiary-100,.icon.tertiary-100{--graupl-icon-color:var(--graupl-theme-active--tertiary--100,var(--graupl-theme-light--tertiary--100,var(--graupl-tertiary--100,#fde7ef)))}.icon-after.tertiary-200,.icon-before.tertiary-200,.icon.tertiary-200{--graupl-icon-color:var(--graupl-theme-active--tertiary--200,var(--graupl-theme-light--tertiary--200,var(--graupl-tertiary--200,#f2a6bf)))}.icon-after.tertiary-300,.icon-before.tertiary-300,.icon.tertiary-300{--graupl-icon-color:var(--graupl-theme-active--tertiary--300,var(--graupl-theme-light--tertiary--300,var(--graupl-tertiary--300,#e06c92)))}.icon-after.tertiary-400,.icon-before.tertiary-400,.icon.tertiary-400{--graupl-icon-color:var(--graupl-theme-active--tertiary--400,var(--graupl-theme-light--tertiary--400,var(--graupl-tertiary--400,#d14775)))}.icon-after.tertiary-500,.icon-before.tertiary-500,.icon.tertiary-500{--graupl-icon-color:var(--graupl-theme-active--tertiary--500,var(--graupl-theme-light--tertiary--500,var(--graupl-tertiary--500,#c36)))}.icon-after.tertiary-600,.icon-before.tertiary-600,.icon.tertiary-600{--graupl-icon-color:var(--graupl-theme-active--tertiary--600,var(--graupl-theme-light--tertiary--600,var(--graupl-tertiary--600,#b82e5c)))}.icon-after.tertiary-700,.icon-before.tertiary-700,.icon.tertiary-700{--graupl-icon-color:var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46)))}.icon-after.tertiary-800,.icon-before.tertiary-800,.icon.tertiary-800{--graupl-icon-color:var(--graupl-theme-active--tertiary--800,var(--graupl-theme-light--tertiary--800,var(--graupl-tertiary--800,#590d26)))}.icon-after.tertiary-900,.icon-before.tertiary-900,.icon.tertiary-900{--graupl-icon-color:var(--graupl-theme-active--tertiary--900,var(--graupl-theme-light--tertiary--900,var(--graupl-tertiary--900,#2f0412)))}}
+/*# sourceMappingURL=component.css.map */

package/dist/css/component.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../node_modules/@graupl/core/src/scss/mixins/_layer.scss","../../src/scss/component/icon/_index.scss","../../src/scss/component/icon/_mixins.scss","../../src/scss/component/icon/_variables.scss","component.css"],"names":[],"mappings":"AASI,wBCCF,MCDA,uBAAA,CADA,2BAAA,CAEA,uBAAA,CALA,+CCMa,CDJb,+DCUY,CDuBV,yLAAA,CA5BF,0CCOK,CDPL,kCCOK,CDJL,4BAAA,CAAA,oBAAA,CAFA,6BAAA,CAAA,qBAAA,CACA,yBAAA,CAAA,iBAAA,CAHA,kBAAA,CALA,6DEQA,CFUE,oBAIE,uGECJ,CFEE,sCAtBF,uBAAA,CADA,2BAAA,CAEA,uBAAA,CAiBI,UAAA,CAtBJ,+CCMa,CDJb,+DCUY,CDLZ,0CCOK,CDPL,kCCOK,CDJL,4BAAA,CAAA,oBAAA,CAFA,6BAAA,CAAA,qBAAA,CACA,yBAAA,CAAA,iBAAA,CAHA,kBAAA,CALA,6DEsCA,CFbE,kBAIE,yGESJ,CACF,CJpCI,oBEyCA,4CA/BF,0MEoCA,CHFM,mEACE,uIGMR,CHPM,mEACE,uIGWR,CHZM,mEACE,uIGgBR,CHjBM,mEACE,uIGqBR,CHtBM,mEACE,uIG0BR,CH3BM,mEACE,uIG+BR,CHhCM,mEACE,uIGoCR,CHrCM,mEACE,uIGyCR,CH1CM,mEACE,uIG8CR,CH/CM,yEACE,6IGmDR,CHpDM,yEACE,6IGwDR,CHzDM,yEACE,6IG6DR,CH9DM,yEACE,6IGkER,CHnEM,yEACE,6IGuER,CHxEM,yEACE,6IG4ER,CH7EM,yEACE,6IGiFR,CHlFM,yEACE,6IGsFR,CHvFM,yEACE,6IG2FR,CH5FM,sEACE,0IGgGR,CHjGM,sEACE,0IGqGR,CHtGM,sEACE,0IG0GR,CH3GM,sEACE,0IG+GR,CHhHM,sEACE,uIGoHR,CHrHM,sEACE,0IGyHR,CH1HM,sEACE,0IG8HR,CH/HM,sEACE,0IGmIR,CHpIM,sEACE,0IGwIR,CACF","file":"component.css"}

package/dist/css/icon.css

@@ -0,0 +1,2 @@
+@layer graupl.theme{.button{--graupl-icon-color:var(--graupl-button-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))))))}.button.visited,.button:visited{--graupl-icon-color:var(--graupl-button-visited-color,var(--graupl-button-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)))))))}.button.focus{--graupl-icon-color:var(--graupl-button-focus-color,var(--graupl-button-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)))))))}.button:focus-visible{--graupl-icon-color:var(--graupl-button-focus-color,var(--graupl-button-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)))))))}.button.hover,.button:hover{--graupl-icon-color:var(--graupl-button-hover-color,var(--graupl-background,var(--graupl-root-background,var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff))))))}.button.active,.button:active{--graupl-icon-color:var(--graupl-button-active-color,var(--graupl-button-hover-color,var(--graupl-background,var(--graupl-root-background,var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff)))))))}.button.disabled,.button.disabled.focus,.button.disabled.visited,.button.disabled:visited{--graupl-icon-color:var(--graupl-button-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}.button.disabled:focus-visible{--graupl-icon-color:var(--graupl-button-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}.button.disabled.active,.button.disabled.disabled,.button.disabled.hover,.button.disabled:active,.button.disabled:disabled,.button.disabled:hover,.button.disabled[aria-disabled=true],.button.disabled[disabled],.button:disabled,.button:disabled.focus,.button:disabled.visited,.button:disabled:visited{--graupl-icon-color:var(--graupl-button-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}.button:disabled:focus-visible{--graupl-icon-color:var(--graupl-button-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}.button:disabled.active,.button:disabled.disabled,.button:disabled.hover,.button:disabled:active,.button:disabled:disabled,.button:disabled:hover,.button:disabled[aria-disabled=true],.button:disabled[disabled],.button[disabled],.button[disabled].focus,.button[disabled].visited,.button[disabled]:visited{--graupl-icon-color:var(--graupl-button-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}.button[disabled]:focus-visible{--graupl-icon-color:var(--graupl-button-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}.button[aria-disabled=true],.button[aria-disabled=true].focus,.button[aria-disabled=true].visited,.button[aria-disabled=true]:visited,.button[disabled].active,.button[disabled].disabled,.button[disabled].hover,.button[disabled]:active,.button[disabled]:disabled,.button[disabled]:hover,.button[disabled][aria-disabled=true],.button[disabled][disabled]{--graupl-icon-color:var(--graupl-button-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}.button[aria-disabled=true]:focus-visible{--graupl-icon-color:var(--graupl-button-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}.button[aria-disabled=true].active,.button[aria-disabled=true].disabled,.button[aria-disabled=true].hover,.button[aria-disabled=true]:active,.button[aria-disabled=true]:disabled,.button[aria-disabled=true]:hover,.button[aria-disabled=true][aria-disabled=true],.button[aria-disabled=true][disabled]{--graupl-icon-color:var(--graupl-button-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}a{--graupl-icon-color:var(--graupl-link-color,var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1))))}a.visited,a:visited{--graupl-icon-color:var(--graupl-link-visited-color,var(--graupl-link-color,var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)))))}a.focus{--graupl-icon-color:var(--graupl-link-focus-color,var(--graupl-link-color,var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)))))}}@layer graupl.theme{a:focus-visible{--graupl-icon-color:var(--graupl-link-focus-color,var(--graupl-link-color,var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)))))}a.hover,a:hover{--graupl-icon-color:var(--graupl-link-hover-color,var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46))))}a.active,a:active{--graupl-icon-color:var(--graupl-link-active-color,var(--graupl-link-hover-color,var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46)))))}a.disabled,a.disabled.focus,a.disabled.visited,a.disabled:visited{--graupl-icon-color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}a.disabled:focus-visible{--graupl-icon-color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}a.disabled.active,a.disabled.disabled,a.disabled.hover,a.disabled:active,a.disabled:disabled,a.disabled:hover,a.disabled[aria-disabled=true],a.disabled[disabled],a:disabled,a:disabled.focus,a:disabled.visited,a:disabled:visited{--graupl-icon-color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}a:disabled:focus-visible{--graupl-icon-color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}a:disabled.active,a:disabled.disabled,a:disabled.hover,a:disabled:active,a:disabled:disabled,a:disabled:hover,a:disabled[aria-disabled=true],a:disabled[disabled],a[disabled],a[disabled].focus,a[disabled].visited,a[disabled]:visited{--graupl-icon-color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}a[disabled]:focus-visible{--graupl-icon-color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}a[aria-disabled=true],a[aria-disabled=true].focus,a[aria-disabled=true].visited,a[aria-disabled=true]:visited,a[disabled].active,a[disabled].disabled,a[disabled].hover,a[disabled]:active,a[disabled]:disabled,a[disabled]:hover,a[disabled][aria-disabled=true],a[disabled][disabled]{--graupl-icon-color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}a[aria-disabled=true]:focus-visible{--graupl-icon-color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}a[aria-disabled=true].active,a[aria-disabled=true].disabled,a[aria-disabled=true].hover,a[aria-disabled=true]:active,a[aria-disabled=true]:disabled,a[aria-disabled=true]:hover,a[aria-disabled=true][aria-disabled=true],a[aria-disabled=true][disabled]{--graupl-icon-color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}}@layer graupl.component{.icon{background-position:50%;background-repeat:no-repeat;background-size:contain;display:var(--graupl-icon-display,inline-block);height:var(--graupl-icon-height,var(--graupl-icon-size,1.25em));margin-inline:var(--graupl-icon-spacer,var(--graupl-spacer-2,calc(var(--graupl-spacer, 1rem)*.25))) var(--graupl-icon-spacer,var(--graupl-spacer-2,calc(var(--graupl-spacer, 1rem)*.25)));-webkit-mask-image:var(--graupl-icon,none);mask-image:var(--graupl-icon,none);-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;vertical-align:sub;width:var(--graupl-icon-width,var(--graupl-icon-size,1.25em))}.icon-before:before{margin-inline-end:var(--graupl-icon-spacer,var(--graupl-spacer-2,calc(var(--graupl-spacer, 1rem)*.25)))}.icon-after:after,.icon-before:before{background-position:50%;background-repeat:no-repeat;background-size:contain;content:"";display:var(--graupl-icon-display,inline-block);height:var(--graupl-icon-height,var(--graupl-icon-size,1.25em));-webkit-mask-image:var(--graupl-icon,none);mask-image:var(--graupl-icon,none);-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;vertical-align:sub;width:var(--graupl-icon-width,var(--graupl-icon-size,1.25em))}.icon-after:after{margin-inline-start:var(--graupl-icon-spacer,var(--graupl-spacer-2,calc(var(--graupl-spacer, 1rem)*.25)))}}@layer graupl.theme{.icon,.icon-after:after,.icon-before:before{background-color:var(--graupl-icon-color,var(--graupl-color,var(--graupl-root-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))))))}.icon-after.primary-100,.icon-before.primary-100,.icon.primary-100{--graupl-icon-color:var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff)))}.icon-after.primary-200,.icon-before.primary-200,.icon.primary-200{--graupl-icon-color:var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa)))}.icon-after.primary-300,.icon-before.primary-300,.icon.primary-300{--graupl-icon-color:var(--graupl-theme-active--primary--300,var(--graupl-theme-light--primary--300,var(--graupl-primary--300,#5e90ed)))}.icon-after.primary-400,.icon-before.primary-400,.icon.primary-400{--graupl-icon-color:var(--graupl-theme-active--primary--400,var(--graupl-theme-light--primary--400,var(--graupl-primary--400,#3672e2)))}.icon-after.primary-500,.icon-before.primary-500,.icon.primary-500{--graupl-icon-color:var(--graupl-theme-active--primary--500,var(--graupl-theme-light--primary--500,var(--graupl-primary--500,#2063df)))}.icon-after.primary-600,.icon-before.primary-600,.icon.primary-600{--graupl-icon-color:var(--graupl-theme-active--primary--600,var(--graupl-theme-light--primary--600,var(--graupl-primary--600,#1d59c9)))}.icon-after.primary-700,.icon-before.primary-700,.icon.primary-700{--graupl-icon-color:var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)))}.icon-after.primary-800,.icon-before.primary-800,.icon.primary-800{--graupl-icon-color:var(--graupl-theme-active--primary--800,var(--graupl-theme-light--primary--800,var(--graupl-primary--800,#052561)))}.icon-after.primary-900,.icon-before.primary-900,.icon.primary-900{--graupl-icon-color:var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)))}.icon-after.secondary-100,.icon-before.secondary-100,.icon.secondary-100{--graupl-icon-color:var(--graupl-theme-active--secondary--100,var(--graupl-theme-light--secondary--100,var(--graupl-secondary--100,#edeef7)))}.icon-after.secondary-200,.icon-before.secondary-200,.icon.secondary-200{--graupl-icon-color:var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb)))}.icon-after.secondary-300,.icon-before.secondary-300,.icon.secondary-300{--graupl-icon-color:var(--graupl-theme-active--secondary--300,var(--graupl-theme-light--secondary--300,var(--graupl-secondary--300,#9497b8)))}.icon-after.secondary-400,.icon-before.secondary-400,.icon.secondary-400{--graupl-icon-color:var(--graupl-theme-active--secondary--400,var(--graupl-theme-light--secondary--400,var(--graupl-secondary--400,#7b7e9d)))}.icon-after.secondary-500,.icon-before.secondary-500,.icon.secondary-500{--graupl-icon-color:var(--graupl-theme-active--secondary--500,var(--graupl-theme-light--secondary--500,var(--graupl-secondary--500,#6c7093)))}.icon-after.secondary-600,.icon-before.secondary-600,.icon.secondary-600{--graupl-icon-color:var(--graupl-theme-active--secondary--600,var(--graupl-theme-light--secondary--600,var(--graupl-secondary--600,#626484)))}.icon-after.secondary-700,.icon-before.secondary-700,.icon.secondary-700{--graupl-icon-color:var(--graupl-theme-active--secondary--700,var(--graupl-theme-light--secondary--700,var(--graupl-secondary--700,#474a6b)))}.icon-after.secondary-800,.icon-before.secondary-800,.icon.secondary-800{--graupl-icon-color:var(--graupl-theme-active--secondary--800,var(--graupl-theme-light--secondary--800,var(--graupl-secondary--800,#242642)))}.icon-after.secondary-900,.icon-before.secondary-900,.icon.secondary-900{--graupl-icon-color:var(--graupl-theme-active--secondary--900,var(--graupl-theme-light--secondary--900,var(--graupl-secondary--900,#0f1124)))}.icon-after.tertiary-100,.icon-before.tertiary-100,.icon.tertiary-100{--graupl-icon-color:var(--graupl-theme-active--tertiary--100,var(--graupl-theme-light--tertiary--100,var(--graupl-tertiary--100,#fde7ef)))}.icon-after.tertiary-200,.icon-before.tertiary-200,.icon.tertiary-200{--graupl-icon-color:var(--graupl-theme-active--tertiary--200,var(--graupl-theme-light--tertiary--200,var(--graupl-tertiary--200,#f2a6bf)))}.icon-after.tertiary-300,.icon-before.tertiary-300,.icon.tertiary-300{--graupl-icon-color:var(--graupl-theme-active--tertiary--300,var(--graupl-theme-light--tertiary--300,var(--graupl-tertiary--300,#e06c92)))}.icon-after.tertiary-400,.icon-before.tertiary-400,.icon.tertiary-400{--graupl-icon-color:var(--graupl-theme-active--tertiary--400,var(--graupl-theme-light--tertiary--400,var(--graupl-tertiary--400,#d14775)))}.icon-after.tertiary-500,.icon-before.tertiary-500,.icon.tertiary-500{--graupl-icon-color:var(--graupl-theme-active--tertiary--500,var(--graupl-theme-light--tertiary--500,var(--graupl-tertiary--500,#c36)))}.icon-after.tertiary-600,.icon-before.tertiary-600,.icon.tertiary-600{--graupl-icon-color:var(--graupl-theme-active--tertiary--600,var(--graupl-theme-light--tertiary--600,var(--graupl-tertiary--600,#b82e5c)))}.icon-after.tertiary-700,.icon-before.tertiary-700,.icon.tertiary-700{--graupl-icon-color:var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46)))}.icon-after.tertiary-800,.icon-before.tertiary-800,.icon.tertiary-800{--graupl-icon-color:var(--graupl-theme-active--tertiary--800,var(--graupl-theme-light--tertiary--800,var(--graupl-tertiary--800,#590d26)))}.icon-after.tertiary-900,.icon-before.tertiary-900,.icon.tertiary-900{--graupl-icon-color:var(--graupl-theme-active--tertiary--900,var(--graupl-theme-light--tertiary--900,var(--graupl-tertiary--900,#2f0412)))}}
+/*# sourceMappingURL=icon.css.map */

package/dist/css/icon.css.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../node_modules/@graupl/core/src/scss/mixins/_layer.scss","../../src/scss/base/button/_index.scss","icon.css","../../src/scss/base/link/_index.scss","../../src/scss/component/icon/_index.scss","../../src/scss/component/icon/_mixins.scss","../../src/scss/component/icon/_variables.scss"],"names":[],"mappings":"AASI,oBCkBF,QACE,+MCxBF,CD6BM,gCACE,kPCxBR,CDuBM,cACE,gPCrBR,CDoBM,sBACE,gPClBR,CDiBM,4BACE,+NCZR,CDWM,8BACE,iQCNR,CDgBc,0FACE,2KCLhB,CDIc,+BACE,2KCFhB,CDCc,4SACE,2KCkChB,CDnCc,+BACE,2KCqChB,CDtCc,gTACE,2KCyEhB,CD1Ec,gCACE,2KC4EhB,CD7Ec,gWACE,2KCgHhB,CDjHc,0CACE,2KCmHhB,CDpHc,0SACE,2KC2IhB,CC7JoC,EAClC,gKDiKF,CC5JM,oBACE,iMDiKR,CClKM,QACE,+LDoKR,CAbF,CFhLI,oBGwBI,gBACE,+LDuKR,CCxKM,gBACE,yKD6KR,CC9KM,kBACE,yMDmLR,CCzKc,kEACE,yKDoLhB,CCrLc,yBACE,yKDuLhB,CCxLc,oOACE,yKD2NhB,CC5Nc,yBACE,yKD8NhB,CC/Nc,wOACE,yKDkQhB,CCnQc,0BACE,yKDqQhB,CCtQc,wRACE,yKDyShB,CC1Sc,oCACE,yKD4ShB,CC7Sc,0PACE,yKDoUhB,CACF,CFzWI,wBICF,MCDA,uBAAA,CADA,2BAAA,CAEA,uBAAA,CALA,+CCMa,CDJb,+DCUY,CDuBV,yLAAA,CA5BF,0CCOK,CDPL,kCCOK,CDJL,4BAAA,CAAA,oBAAA,CAFA,6BAAA,CAAA,qBAAA,CACA,yBAAA,CAAA,iBAAA,CAHA,kBAAA,CALA,6DH2XA,CGzWE,oBAIE,uGHoXJ,CGjXE,sCAtBF,uBAAA,CADA,2BAAA,CAEA,uBAAA,CAiBI,UAAA,CAtBJ,+CCMa,CDJb,+DCUY,CDLZ,0CCOK,CDPL,kCCOK,CDJL,4BAAA,CAAA,oBAAA,CAFA,6BAAA,CAAA,qBAAA,CACA,yBAAA,CAAA,iBAAA,CAHA,kBAAA,CALA,6DHyZA,CGhYE,kBAIE,yGH4XJ,CACF,CFvZI,oBKyCA,4CA/BF,0MHuZA,CErXM,mEACE,uIFyXR,CE1XM,mEACE,uIF8XR,CE/XM,mEACE,uIFmYR,CEpYM,mEACE,uIFwYR,CEzYM,mEACE,uIF6YR,CE9YM,mEACE,uIFkZR,CEnZM,mEACE,uIFuZR,CExZM,mEACE,uIF4ZR,CE7ZM,mEACE,uIFiaR,CElaM,yEACE,6IFsaR,CEvaM,yEACE,6IF2aR,CE5aM,yEACE,6IFgbR,CEjbM,yEACE,6IFqbR,CEtbM,yEACE,6IF0bR,CE3bM,yEACE,6IF+bR,CEhcM,yEACE,6IFocR,CErcM,yEACE,6IFycR,CE1cM,yEACE,6IF8cR,CE/cM,sEACE,0IFmdR,CEpdM,sEACE,0IFwdR,CEzdM,sEACE,0IF6dR,CE9dM,sEACE,0IFkeR,CEneM,sEACE,uIFueR,CExeM,sEACE,0IF4eR,CE7eM,sEACE,0IFifR,CElfM,sEACE,0IFsfR,CEvfM,sEACE,0IF2fR,CACF","file":"icon.css"}

package/package.json

@@ -1,8 +1,13 @@
 {
   "name": "@graupl/icons",
-  "version": "1.0.0-beta.0",
+  "version": "1.0.0-beta.10",
   "description": "A plugin for Graupl that provides bare-minimum icon components.",
   "type": "module",
+  "files": [
+    "dist",
+    "scss",
+    "src"
+  ],
   "exports": {
     ".": {
       "sass": "./scss/icon.scss"
@@ -14,58 +19,30 @@
       "sass": "./src/scss/*.scss"
     }
   },
-  "scripts": {
-    "prepare": "husky",
-    "commit": "git cz",
-    "eslint": "eslint .",
-    "prettier": "prettier '**/*.{js,mjs,cjs,scss,sass}'",
-    "stylelint": "stylelint '**/*.scss' --allow-empty-input",
-    "lint": "npm run eslint -- --fix && npm run stylelint -- --fix && npm run prettier --  --write",
-    "sass": "rm -rf dist && sass scss:dist --pkg-importer=node",
-    "postcss": "postcss 'dist/**/*.css' --replace",
-    "build": "npm run sass && npm run postcss",
-    "release": "git add dist/. && standard-version -a",
-    "prerelease": "npm run lint && npm run build"
-  },
   "repository": {
     "type": "git",
-    "url": "git+ssh://git@github.com/Graupl/graupl.git"
+    "url": "git+https://github.com/Graupl/graupl.git",
+    "directory": "packages/icons"
   },
-  "author": "",
-  "license": "ISC",
+  "keywords": [
+    "graupl"
+  ],
+  "author": "Nick Milton",
+  "contributors": [
+    {
+      "name": "Coldfront Labs Inc.",
+      "url": "https://coldfrontlabs.ca"
+    }
+  ],
   "bugs": {
-    "url": "https://github.com/Graupl/icons/issues"
+    "url": "https://github.com/Graupl/graupl/issues"
   },
-  "homepage": "https://github.com/Graupl/icons#readme",
+  "license": "ISC",
+  "homepage": "https://github.com/Graupl/graupl/tree/main/packages/icons#readme",
   "devDependencies": {
-    "@commitlint/cli": "^19.2.1",
-    "@commitlint/config-conventional": "^19.1.0",
-    "@eslint/js": "^9.0.0",
-    "@graupl/graupl": "^1.0.0-beta.0",
-    "autoprefixer": "^10.4.19",
-    "commitizen": "^4.3.0",
-    "cssnano": "^7.0.1",
-    "cz-conventional-changelog": "^3.3.0",
-    "eslint": "^8.57.0",
-    "eslint-config-prettier": "^9.1.0",
-    "eslint-config-standard": "^17.1.0",
-    "eslint-plugin-jsdoc": "^48.2.3",
-    "globals": "^15.0.0",
-    "husky": "^9.0.11",
-    "lint-staged": "^15.2.2",
-    "postcss": "^8.4.38",
-    "postcss-cli": "^11.0.0",
-    "postcss-discard-comments": "^7.0.0",
-    "prettier": "^3.2.5",
-    "sass": "^1.69.5",
-    "standard-version": "^9.5.0",
-    "stylelint": "^16.3.1",
-    "stylelint-config-property-sort-order-smacss": "^10.0.0",
-    "stylelint-config-sass-guidelines": "^11.1.0",
-    "stylelint-config-standard-scss": "^13.1.0",
-    "stylelint-prettier": "^5.0.0"
+    "sass": "^1.89.2"
   },
-  "peerDependencies": {
-    "@graupl/graupl": ">=1.0.0-beta.0"
+  "dependencies": {
+    "@graupl/core": "*"
   }
 }

package/src/scss/base/button/_index.scss

@@ -1,13 +1,58 @@
 // @gruapl/icons button base styles.
+//
+// This module provides icon component integration for the button component.
+//
+// It sets the `--graupl-icon-color` custom property to the appropriate `--graupl-button-color` property.
+//
+// The following selectors are generated by default:
+// - `.button`: The button component.
+//
+// The following custom properties control the generated selectors:
+// - N/A
+//
+// The following variables control the generated selectors:
+// - N/A
+//
+// @example
+// <button class="button icon-after">Button</button>
 
+@use "pkg:@graupl/core/src/base/button/defaults" as button-defaults;
+@use "pkg:@graupl/core/src/base/button/variables" as button;
+@use "pkg:@graupl/core/src/defaults" as root-defaults;
+@use "pkg:@graupl/core/src/mixins/layer" as *;
+@use "sass:map";
 @use "variables" as *;
-@use "pkg:@graupl/graupl/src/defaults" as root-defaults;
-@use "pkg:@graupl/graupl/src/base/button/defaults" as button-defaults;
-@use "pkg:@graupl/graupl/src/base/button/variables" as button;
-@use "pkg:@graupl/graupl/src/mixins/layer" as *;
 
 @include layer(theme) {
-  #{button-defaults.$button-selector} {
-    --#{root-defaults.$prefix}-icon-color: #{button.$button-color};
+  // .button
+  #{button-defaults.$button-selector-base}#{button-defaults.$button-selector} {
+    --#{root-defaults.$prefix}icon-color: #{button.$button-color};
+
+    @each $state, $selectors in root-defaults.$state-selectors {
+      @each $selector in $selectors {
+        // e.g &:visited, &:focus-visible, &:hover, &:active, &:disabled
+        &#{$selector} {
+          --#{root-defaults.$prefix}icon-color: #{map.get(
+              button.$button-color-states,
+              $state
+            )};
+
+          // If the state is disabled, we want that to supersede all other states.
+          @if $state == "disabled" {
+            @each $sub-state, $sub-selectors in root-defaults.$state-selectors {
+              @each $sub-selector in $sub-selectors {
+                // e.g &:visited, &:focus-visible, &:hover, &:active
+                &#{$sub-selector} {
+                  --#{root-defaults.$prefix}icon-color: #{map.get(
+                      button.$button-color-states,
+                      $state
+                    )};
+                }
+              }
+            }
+          }
+        }
+      }
+    }
   }
 }

package/src/scss/base/button/_variables.scss

@@ -4,4 +4,4 @@
 // cleaner way to reference custom properties.
 
 @use "defaults";
-@use "pkg:@graupl/graupl/src/defaults" as root-defaults;
+@use "pkg:@graupl/core/src/defaults" as root-defaults;

package/src/scss/base/link/_index.scss

@@ -1,13 +1,58 @@
 // @gruapl/icons link base styles.
+//
+// This module provides icon component integration for the link component.
+//
+// It sets the `--graupl-icon-color` custom property to the appropriate `--graupl-link-color` property.
+//
+// The following selectors are generated by default:
+// - `a`: The link component.
+//
+// The following custom properties control the generated selectors:
+// - N/A
+//
+// The following variables control the generated selectors:
+// - N/A
+//
+// @example
+// <a href="#" class="icon-after">Link</a>
 
+@use "pkg:@graupl/core/src/base/link/defaults" as link-defaults;
+@use "pkg:@graupl/core/src/base/link/variables" as link;
+@use "pkg:@graupl/core/src/defaults" as root-defaults;
+@use "pkg:@graupl/core/src/mixins/layer" as *;
+@use "sass:map";
 @use "variables" as *;
-@use "pkg:@graupl/graupl/src/defaults" as root-defaults;
-@use "pkg:@graupl/graupl/src/base/link/defaults" as link-defaults;
-@use "pkg:@graupl/graupl/src/base/link/variables" as link;
-@use "pkg:@graupl/graupl/src/mixins/layer" as *;
 
 @include layer(theme) {
-  #{link-defaults.$link-selector} {
-    --#{root-defaults.$prefix}-icon-color: #{link.$link-color};
+  // a
+  #{link-defaults.$link-selector-base}#{link-defaults.$link-selector} {
+    --#{root-defaults.$prefix}icon-color: #{link.$link-color};
+
+    @each $state, $selectors in root-defaults.$state-selectors {
+      @each $selector in $selectors {
+        // e.g &:visited, &:focus-visible, &:hover, &:active, &:disabled
+        &#{$selector} {
+          --#{root-defaults.$prefix}icon-color: #{map.get(
+              link.$link-color-states,
+              $state
+            )};
+
+          // If the state is disabled, we want that to supersede all other states.
+          @if $state == "disabled" {
+            @each $sub-state, $sub-selectors in root-defaults.$state-selectors {
+              @each $sub-selector in $sub-selectors {
+                // e.g &:visited, &:focus-visible, &:hover, &:active
+                &#{$sub-selector} {
+                  --#{root-defaults.$prefix}icon-color: #{map.get(
+                      link.$link-color-states,
+                      $state
+                    )};
+                }
+              }
+            }
+          }
+        }
+      }
+    }
   }
 }

package/src/scss/base/link/_variables.scss

@@ -4,4 +4,4 @@
 // cleaner way to reference custom properties.
 
 @use "defaults";
-@use "pkg:@graupl/graupl/src/defaults" as root-defaults;
+@use "pkg:@graupl/core/src/defaults" as root-defaults;

package/src/scss/component/icon/_defaults.scss

@@ -6,12 +6,19 @@
 // They should not be used to define direct property values (i.e. font-size, color, etc.).
 // Those should be defined as custom properties in the `_variables.scss` file.
 
+@use "pkg:@graupl/core/src/scss/defaults" as root-defaults;
+
 // Icon selectors.
-$icon-selector: ".icon" !default;
+$selector-base: root-defaults.$component-selector-base !default;
+$modifier-selector-base: root-defaults.$modifier-selector-base !default;
+$icon-selector-base: $selector-base !default;
+$icon-selector: "icon" !default;
 $icon-before-selector: "#{$icon-selector}-before" !default;
 $icon-after-selector: "#{$icon-selector}-after" !default;
-$icon-prefix-selector: "." !default;
-$icon-color-prefix-selector: "." !default;
+$icon-prefix-selector-base: $modifier-selector-base !default;
+$icon-prefix-selector: "" !default;
+$icon-color-prefix-selector-base: $modifier-selector-base !default;
+$icon-color-prefix-selector: "" !default;
 
 // Icon properties.
 $icon-display: inline-block !default;

package/src/scss/component/icon/_index.scss

@@ -1,46 +1,58 @@
 // @gruapl/icons icon component styles.
 
 @use "defaults";
-@use "pkg:@graupl/graupl/src/defaults" as root-defaults;
-@use "pkg:@graupl/graupl/src/theme/color/variables" as color;
-@use "pkg:@graupl/graupl/src/mixins/layer" as *;
-@use "../../mixins/icon";
+@use "pkg:@graupl/core/src/defaults" as root-defaults;
+@use "pkg:@graupl/core/src/theme/color/variables" as color;
+@use "pkg:@graupl/core/src/mixins/layer" as *;
+@use "mixins" as *;
 @use "sass:map";
 
 @include layer(component) {
-  #{defaults.$icon-selector} {
-    @include icon.apply;
+  #{defaults.$icon-selector-base}#{defaults.$icon-selector} {
+    @include apply-component;
   }
 
-  #{defaults.$icon-before-selector} {
-    @include icon.apply("before");
+  #{defaults.$icon-selector-base}#{defaults.$icon-before-selector} {
+    @include apply-component("before");
   }
 
-  #{defaults.$icon-after-selector} {
-    @include icon.apply("after");
+  #{defaults.$icon-selector-base}#{defaults.$icon-after-selector} {
+    @include apply-component("after");
   }
 
-  #{defaults.$icon-selector},
-  #{defaults.$icon-before-selector},
-  #{defaults.$icon-after-selector} {
+  #{defaults.$icon-selector-base}#{defaults.$icon-selector},
+  #{defaults.$icon-selector-base}#{defaults.$icon-before-selector},
+  #{defaults.$icon-selector-base}#{defaults.$icon-after-selector} {
     @each $name, $icon in defaults.$icons {
-      &#{defaults.$icon-prefix-selector}#{$name} {
-        --#{root-defaults.$prefix}-icon: #{$icon};
+      &#{defaults.$icon-prefix-selector-base}#{defaults.$icon-prefix-selector}#{$name} {
+        --#{root-defaults.$prefix}icon: #{$icon};
       }
     }
   }
 }
 
 @include layer(theme) {
-  #{defaults.$icon-selector},
-  #{defaults.$icon-before-selector},
-  #{defaults.$icon-after-selector} {
+  #{defaults.$icon-selector-base}#{defaults.$icon-selector} {
+    @include apply-theme;
+  }
+
+  #{defaults.$icon-selector-base}#{defaults.$icon-before-selector} {
+    @include apply-theme("before");
+  }
+
+  #{defaults.$icon-selector-base}#{defaults.$icon-after-selector} {
+    @include apply-theme("after");
+  }
+
+  #{defaults.$icon-selector-base}#{defaults.$icon-selector},
+  #{defaults.$icon-selector-base}#{defaults.$icon-before-selector},
+  #{defaults.$icon-selector-base}#{defaults.$icon-after-selector} {
     @each $color, $map in map.get(color.$themes, active) {
       @each $shade, $value in $map {
         $name: #{$color}-#{$shade};
 
-        &#{defaults.$icon-color-prefix-selector}#{$name} {
-          --#{root-defaults.$prefix}-icon-color: #{$value};
+        &#{defaults.$icon-color-prefix-selector-base}#{defaults.$icon-color-prefix-selector}#{$name} {
+          --#{root-defaults.$prefix}icon-color: #{$value};
         }
       }
     }

package/src/scss/{mixins/icon.scss → component/icon/_mixins.scss}

@@ -1,12 +1,11 @@
 // @graupl/icons icon mixins.
 
-@use "../component/icon/variables" as *;
+@use "variables" as *;
 
-@mixin apply-base() {
+@mixin _component() {
   display: $icon-display;
   width: $icon-width;
   height: $icon-height;
-  background-color: $icon-color;
   background-repeat: no-repeat;
   background-position: center;
   background-size: contain;
@@ -17,24 +16,47 @@
   mask-position: center;
 }
 
-@mixin apply($target: "self") {
+@mixin _theme() {
+  background-color: $icon-color;
+}
+
+@mixin apply-component($target: "self") {
   @if $target == "before" {
     &::before {
-      @include apply-base;
+      @include _component;
 
       content: "";
       margin-inline-end: $icon-spacer;
     }
   } @else if $target == "after" {
     &::after {
-      @include apply-base;
+      @include _component;
 
       content: "";
       margin-inline-start: $icon-spacer;
     }
   } @else {
-    @include apply-base;
+    @include _component;
 
     margin-inline: $icon-spacer $icon-spacer;
   }
 }
+
+@mixin apply-theme($target: "self") {
+  @if $target == "before" {
+    &::before {
+      @include _theme;
+    }
+  } @else if $target == "after" {
+    &::after {
+      @include _theme;
+    }
+  } @else {
+    @include _theme;
+  }
+}
+
+@mixin apply($target: "self") {
+  @include apply-component($target);
+  @include apply-theme($target);
+}

package/src/scss/component/icon/_variables.scss

@@ -4,21 +4,21 @@
 // cleaner way to reference custom properties.
 
 @use "defaults";
-@use "pkg:@graupl/graupl/src/defaults" as root-defaults;
-@use "pkg:@graupl/graupl/src/theme/color/variables" as theme;
-@use "pkg:@graupl/graupl/src/variables" as root-variables;
+@use "pkg:@graupl/core/src/defaults" as root-defaults;
+@use "pkg:@graupl/core/src/theme/color/variables" as color;
+@use "pkg:@graupl/core/src/variables" as root-variables;
 @use "sass:map";
 
 $icon-display: var(
-  --#{root-defaults.$prefix}-icon-display,
+  --#{root-defaults.$prefix}icon-display,
   #{defaults.$icon-display}
 );
-$icon-size: var(--#{root-defaults.$prefix}-icon-size, #{defaults.$icon-size});
-$icon-width: var(--#{root-defaults.$prefix}-icon-width, #{$icon-size});
-$icon-height: var(--#{root-defaults.$prefix}-icon-height, #{$icon-size});
-$icon-color: var(--#{root-defaults.$prefix}-icon-color, #{theme.$root-color});
-$icon: var(--#{root-defaults.$prefix}-icon, none);
+$icon-size: var(--#{root-defaults.$prefix}icon-size, #{defaults.$icon-size});
+$icon-width: var(--#{root-defaults.$prefix}icon-width, #{$icon-size});
+$icon-height: var(--#{root-defaults.$prefix}icon-height, #{$icon-size});
+$icon-color: var(--#{root-defaults.$prefix}icon-color, #{color.$color});
+$icon: var(--#{root-defaults.$prefix}icon, none);
 $icon-spacer: var(
-  --#{root-defaults.$prefix}-icon-spacer,
+  --#{root-defaults.$prefix}icon-spacer,
   #{map.get(root-variables.$spacers, 2)}
 );

package/.browserslistrc

@@ -1,3 +0,0 @@
-last 2 versions
-> 0.25%
-not dead

package/.czrc

@@ -1,3 +0,0 @@
-{
-  "path": "cz-conventional-changelog"
-}

package/.editorconfig

@@ -1,13 +0,0 @@
-root = true
-
-# All files.
-[*]
-end_of_line = LF
-indent_style = space
-indent_size = 2
-charset = utf-8
-trim_trailing_whitespace = true
-insert_final_newline = true
-
-[*.md]
-trim_trailing_whitespace = false