@graupl/graupl 1.0.0-alpha.11 → 1.0.0-alpha.13

package/src/scss/utilities/typography/_variables.scss

@@ -1,3 +1,6 @@
-// Variables referencing custom properties.
+// @graupl/graupl typography utilities variables.
+//
+// These values are to be used to directly style components and provide a
+// cleaner way to reference custom properties.
 
 @forward "defaults";

package/src/scss/utilities/visibility/_defaults.scss

@@ -1,8 +1,10 @@
-// Default values for Graupl.
+// @graupl/graupl visibility utilities default values.
 //
-// Generally, these should not be used directly when styling components.
-// They are mainly used to provide default fallbacks for custom properties
-// which can be found in the `variables.scss` file.
+// Generally, these should not be used directly when styling components unless a static value is needed.
+// They are mainly used to provide class selectors, fallbacks for custom properties, or loop values.
+//
+// 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 "sass:map";
 

package/src/scss/utilities/visibility/_index.scss

@@ -1,4 +1,4 @@
-// Graupl visibility utilities.
+// @gruapl/graupl visibility utilities styles.
 
 @use "variables" as *;
 @use "defaults" as defaults;

package/src/scss/utilities/visibility/_variables.scss

@@ -1,3 +1,6 @@
-// Variables referencing custom properties.
+// @graupl/graupl visibility utilities variables.
+//
+// These values are to be used to directly style components and provide a
+// cleaner way to reference custom properties.
 
 @forward "defaults";

package/dist/component/button.css

@@ -1,2 +0,0 @@
-@layer graupl.component{.button{align-items:center;border-radius:var(--graupl-button-border-radius,var(--graupl-border-radius,.125rem));border-style:var(--graupl-botton-border-style,var(--graupl-border-style,solid));border-width:var(--graupl-button-border-width,var(--graupl-border-width,2px));cursor:pointer;display:flex;font-size:var(--graupl-button-font-size,var(--graupl-font-base,calc(var(--graupl-font-base, 1rem)*1)));justify-content:center;min-height:var(--graupl-button-min-height,44px);min-width:var(--graupl-button-min-width,44px);padding:var(--graupl-button-padding,var(--graupl-button-padding-y,var(--graupl-spacer-3,calc(var(--graupl-spacer, 1rem)*.5))) var(--graupl-button-padding-x,var(--graupl-spacer-5,calc(var(--graupl-spacer, 1rem)*1))));transition:var(--graupl-button-transition,background var(--graupl-transition-duration-fast,.15s) var(--graupl-transition-timing-function,ease),color var(--graupl-transition-duration-fast,.15s) var(--graupl-transition-timing-function,ease),transform var(--graupl-transition-duration-fast,.15s) var(--graupl-transition-timing-function,ease))}.button:hover{transform:var(--graupl-button-hover-transform,none)}.button:active{transform:var(--graupl-button-active-transform,scale(.95))}.button:disabled{cursor:not-allowed}.button:disabled:active,.button:disabled:hover{transform:none}.button.link{border:0;font-size:inherit;min-height:auto;min-width:auto;padding:0;-webkit-text-decoration:var(--graupl-link-text-decoration,underline);text-decoration:var(--graupl-link-text-decoration,underline);text-decoration-thickness:var(--graupl-link-text-decoration-thickness,var(--graupl-border-width,2px))}@media (prefers-reduced-motion:reduce){.button{transition:var(--graupl-button-transition-reduced-motion,background var(--graupl-transition-timing-function,ease),color var(--graupl-transition-timing-function,ease))}.button:hover{transform:var(--graupl-button-hover-transform-reduced-motion,none)}.button:active{transform:var(--graupl-button-active-transform-reduced-motion,scale(.98))}}}@layer graupl.theme{.button{background:var(--graupl-button-background,var(--graupl-root-background,var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff)))));border-color:var(--graupl-button-border-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))));color:var(--graupl-button-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))))}.button.primary{--graupl-button-color:var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)));--graupl-button-border-color:var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)));--graupl-button-hover-color:var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff)));--graupl-button-hover-background:var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)));--graupl-button-hover-border-color:var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)));--graupl-button-active-color:var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff)));--graupl-button-active-background:var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)));--graupl-button-active-border-color:var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)));--graupl-button-disabled-color:var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa)));--graupl-button-disabled-border-color:var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa)))}.button.secondary{--graupl-button-color:var(--graupl-theme-active--secondary--900,var(--graupl-theme-light--secondary--900,var(--graupl-secondary--900,#0f1124)));--graupl-button-border-color:var(--graupl-theme-active--secondary--700,var(--graupl-theme-light--secondary--700,var(--graupl-secondary--700,#474a6b)));--graupl-button-hover-color:var(--graupl-theme-active--secondary--100,var(--graupl-theme-light--secondary--100,var(--graupl-secondary--100,#edeef7)));--graupl-button-hover-background:var(--graupl-theme-active--secondary--700,var(--graupl-theme-light--secondary--700,var(--graupl-secondary--700,#474a6b)));--graupl-button-hover-border-color:var(--graupl-theme-active--secondary--700,var(--graupl-theme-light--secondary--700,var(--graupl-secondary--700,#474a6b)));--graupl-button-active-color:var(--graupl-theme-active--secondary--100,var(--graupl-theme-light--secondary--100,var(--graupl-secondary--100,#edeef7)));--graupl-button-active-background:var(--graupl-theme-active--secondary--700,var(--graupl-theme-light--secondary--700,var(--graupl-secondary--700,#474a6b)));--graupl-button-active-border-color:var(--graupl-theme-active--secondary--700,var(--graupl-theme-light--secondary--700,var(--graupl-secondary--700,#474a6b)));--graupl-button-disabled-color:var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb)));--graupl-button-disabled-border-color:var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb)))}.button.tertiary{--graupl-button-color:var(--graupl-theme-active--tertiary--900,var(--graupl-theme-light--tertiary--900,var(--graupl-tertiary--900,#2f0412)));--graupl-button-border-color:var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46)));--graupl-button-hover-color:var(--graupl-theme-active--tertiary--100,var(--graupl-theme-light--tertiary--100,var(--graupl-tertiary--100,#fde7ef)));--graupl-button-hover-background:var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46)));--graupl-button-hover-border-color:var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46)));--graupl-button-active-color:var(--graupl-theme-active--tertiary--100,var(--graupl-theme-light--tertiary--100,var(--graupl-tertiary--100,#fde7ef)));--graupl-button-active-background:var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46)));--graupl-button-active-border-color:var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46)));--graupl-button-disabled-color:var(--graupl-theme-active--tertiary--200,var(--graupl-theme-light--tertiary--200,var(--graupl-tertiary--200,#f2a6bf)));--graupl-button-disabled-border-color:var(--graupl-theme-active--tertiary--200,var(--graupl-theme-light--tertiary--200,var(--graupl-tertiary--200,#f2a6bf)))}.button.link{--graupl-button-color:var(--graupl-link-color,var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1))));--graupl-button-hover-color:var(--graupl-link-hover-color,var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46))));--graupl-button-active-color:var(--graupl-link-active-color,var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46))));--graupl-button-disabled-color:var(--graupl-link-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))));--graupl-button-background:none;--graupl-button-hover-background:none;--graupl-button-active-background:none;--graupl-button-disabled-background:none;--graupl-button-border-color:none;--graupl-button-hover-border-color:none;--graupl-button-active-border-color:none;--graupl-button-disabled-border-color:none;--graupl-button-hover-transform:none;--graupl-button-active-transform:none}.button:not(.link){--graupl-link-color:var(--graupl-button-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))));--graupl-link-hover-color:var(--graupl-button-hover-color,var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff))));--graupl-link-active-color:var(--graupl-button-active-color,var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff))));--graupl-link-visited-color:var(--graupl-button-hover-color,var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff))));--graupl-link-disabled-color:var(--graupl-button-disabled-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))))}.button:hover{--graupl-button-border-color:var(--graupl-button-hover-border-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))));--graupl-button-background:var(--graupl-button-hover-background,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))));--graupl-button-color:var(--graupl-button-hover-color,var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff))))}.button:active{--graupl-button-border-color:var(--graupl-button-active-border-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))));--graupl-button-background:var(--graupl-button-active-background,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))));--graupl-button-color:var(--graupl-button-active-color,var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff))))}.button:disabled,.button:disabled:active,.button:disabled:hover{--graupl-button-border-color:var(--graupl-button-disabled-border-color,var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa))));--graupl-button-background:var(--graupl-button-disabled-background,var(--graupl-root-background,var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff)))));--graupl-button-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/component/button.css.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/scss/mixins/_layer.scss","../../src/scss/component/button/_index.scss","../../src/scss/component/button/_variables.scss","button.css","../../src/scss/base/link/_variables.scss","../../src/scss/mixins/_media-queries.scss"],"names":[],"mappings":"AASI,wBCGF,QAEE,kBAAA,CAQA,oFCwFmB,CDzFnB,+ECqFkB,CDtFlB,6ECkFkB,CD9ElB,cAAA,CAXA,YAAA,CAUA,sGCQe,CDhBf,sBAAA,CAEA,+CCFgB,CDChB,6CCLe,CDOf,uNCSa,CDRb,mVEJF,CFWE,cACE,mDETJ,CFYE,eACE,0DEVJ,CFaE,iBACE,kBEXJ,CFaI,+CAEE,cEZN,CFgBE,aAIE,QAAA,CACA,iBAAA,CAHA,eAAA,CADA,cAAA,CAEA,SAAA,CAGA,oEGzCiB,CHyCjB,4DGzCiB,CH0CjB,qGEdJ,CEtBA,uCJyCE,QACE,sKEhBF,CFkBE,cACE,kEEhBJ,CFmBE,eACE,yEEjBJ,CACF,CACF,CHvCI,oBC6DF,QAEE,4LCNgB,CDKhB,kKC6CkB,CD3ClB,oJEnBF,CFsBI,gBAEI,yIAAA,CAAA,gJAAA,CAAA,+IAAA,CAAA,oJAAA,CAAA,sJAAA,CAAA,gJAAA,CAAA,qJAAA,CAAA,uJAAA,CAAA,kJAAA,CAAA,yJEZR,CFUI,kBAEI,+IAAA,CAAA,sJAAA,CAAA,qJAAA,CAAA,0JAAA,CAAA,4JAAA,CAAA,sJAAA,CAAA,2JAAA,CAAA,6JAAA,CAAA,wJAAA,CAAA,+JEAR,CFFI,iBAEI,4IAAA,CAAA,mJAAA,CAAA,kJAAA,CAAA,uJAAA,CAAA,yJAAA,CAAA,mJAAA,CAAA,wJAAA,CAAA,0JAAA,CAAA,qJAAA,CAAA,4JEYR,CFPE,aACE,kKAAA,CACA,iLAAA,CACA,mLAAA,CACA,oLAAA,CACA,+BAAA,CACA,qCAAA,CACA,sCAAA,CACA,wCAAA,CACA,iCAAA,CACA,uCAAA,CACA,wCAAA,CACA,0CAAA,CACA,oCAAA,CACA,qCESJ,CFNE,mBACE,kKAAA,CACA,8KAAA,CACA,gLAAA,CACA,gLAAA,CACA,oLEQJ,CFLE,cACE,wLAAA,CACA,oLAAA,CACA,0KEOJ,CFJE,eACE,yLAAA,CACA,qLAAA,CACA,2KEMJ,CFEI,gEAEE,2LAAA,CACA,qNAAA,CACA,6KEIN,CACF","file":"button.css"}

package/dist/component/table.css

@@ -1,2 +0,0 @@
-@layer graupl.component{table .primary,table.primary{--graupl-table-header-background:var(--graupl-theme-active--primary--700,var(--graupl-theme-light--primary--700,var(--graupl-primary--700,#1244a1)));--graupl-table-header-color:var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff)));--graupl-table-striped-background:var(--graupl-theme-active--primary--200,var(--graupl-theme-light--primary--200,var(--graupl-primary--200,#9ebefa)));--graupl-table-striped-color:var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)));--graupl-table-hover-background:var(--graupl-theme-active--primary--300,var(--graupl-theme-light--primary--300,var(--graupl-primary--300,#5e90ed)));--graupl-table-hover-color:var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)));--graupl-table-border-color:var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)));--graupl-table-highlight-background:var(--graupl-theme-active--primary--500,var(--graupl-theme-light--primary--500,var(--graupl-primary--500,#2063df)));--graupl-table-highlight-color:var(--graupl-theme-active--primary--100,var(--graupl-theme-light--primary--100,var(--graupl-primary--100,#e6eeff)))}table .secondary,table.secondary{--graupl-table-header-background:var(--graupl-theme-active--secondary--700,var(--graupl-theme-light--secondary--700,var(--graupl-secondary--700,#474a6b)));--graupl-table-header-color:var(--graupl-theme-active--secondary--100,var(--graupl-theme-light--secondary--100,var(--graupl-secondary--100,#edeef7)));--graupl-table-striped-background:var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb)));--graupl-table-striped-color:var(--graupl-theme-active--secondary--900,var(--graupl-theme-light--secondary--900,var(--graupl-secondary--900,#0f1124)));--graupl-table-hover-background:var(--graupl-theme-active--secondary--300,var(--graupl-theme-light--secondary--300,var(--graupl-secondary--300,#9497b8)));--graupl-table-hover-color:var(--graupl-theme-active--secondary--900,var(--graupl-theme-light--secondary--900,var(--graupl-secondary--900,#0f1124)));--graupl-table-border-color:var(--graupl-theme-active--secondary--900,var(--graupl-theme-light--secondary--900,var(--graupl-secondary--900,#0f1124)));--graupl-table-highlight-background:var(--graupl-theme-active--secondary--500,var(--graupl-theme-light--secondary--500,var(--graupl-secondary--500,#6c7093)));--graupl-table-highlight-color:var(--graupl-theme-active--secondary--100,var(--graupl-theme-light--secondary--100,var(--graupl-secondary--100,#edeef7)))}table .tertiary,table.tertiary{--graupl-table-header-background:var(--graupl-theme-active--tertiary--700,var(--graupl-theme-light--tertiary--700,var(--graupl-tertiary--700,#931f46)));--graupl-table-header-color:var(--graupl-theme-active--tertiary--100,var(--graupl-theme-light--tertiary--100,var(--graupl-tertiary--100,#fde7ef)));--graupl-table-striped-background:var(--graupl-theme-active--tertiary--200,var(--graupl-theme-light--tertiary--200,var(--graupl-tertiary--200,#f2a6bf)));--graupl-table-striped-color:var(--graupl-theme-active--tertiary--900,var(--graupl-theme-light--tertiary--900,var(--graupl-tertiary--900,#2f0412)));--graupl-table-hover-background:var(--graupl-theme-active--tertiary--300,var(--graupl-theme-light--tertiary--300,var(--graupl-tertiary--300,#e06c92)));--graupl-table-hover-color:var(--graupl-theme-active--tertiary--900,var(--graupl-theme-light--tertiary--900,var(--graupl-tertiary--900,#2f0412)));--graupl-table-border-color:var(--graupl-theme-active--tertiary--900,var(--graupl-theme-light--tertiary--900,var(--graupl-tertiary--900,#2f0412)));--graupl-table-highlight-background:var(--graupl-theme-active--tertiary--500,var(--graupl-theme-light--tertiary--500,var(--graupl-tertiary--500,#c36)));--graupl-table-highlight-color:var(--graupl-theme-active--tertiary--100,var(--graupl-theme-light--tertiary--100,var(--graupl-tertiary--100,#fde7ef)))}table.bordered{border-collapse:collapse;border-color:var(--graupl-table-border-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233))));border-style:var(--graupl-table-border-style,var(--graupl-border-style,solid));border-width:var(--graupl-table-border-width,var(--graupl-border-width,2px))}table.bordered tr>*{border-color:var(--graupl-table-cell-border-color,var(--graupl-table-border-color,var(--graupl-theme-active--primary--900,var(--graupl-theme-light--primary--900,var(--graupl-primary--900,#001233)))));border-style:var(--graupl-table-cell-border-style,var(--graupl-table-border-style,var(--graupl-border-style,solid)));border-width:var(--graupl-table-cell-border-width,var(--graupl-table-border-width,var(--graupl-border-width,2px)))}table.striped-columns tbody tr:nth-child(odd)>*,table.striped-rows tbody tr>:nth-child(odd){background:var(--graupl-table-striped-background,var(--graupl-theme-active--secondary--200,var(--graupl-theme-light--secondary--200,var(--graupl-secondary--200,#bdbfdb))));color:var(--graupl-table-striped-color,var(--graupl-theme-active--secondary--900,var(--graupl-theme-light--secondary--900,var(--graupl-secondary--900,#0f1124))))}table.hoverable tbody tr:hover>*{background:var(--graupl-table-hover-background,var(--graupl-theme-active--secondary--300,var(--graupl-theme-light--secondary--300,var(--graupl-secondary--300,#9497b8))));color:var(--graupl-table-hover-color,var(--graupl-theme-active--secondary--900,var(--graupl-theme-light--secondary--900,var(--graupl-secondary--900,#0f1124))))}table .highlight{--graupl-table-cell-background:var(--graupl-table-highlight-background,var(--graupl-theme-active--secondary--500,var(--graupl-theme-light--secondary--500,var(--graupl-secondary--500,#6c7093))));--graupl-table-cell-color:var(--graupl-table-highlight-color,var(--graupl-theme-active--secondary--100,var(--graupl-theme-light--secondary--100,var(--graupl-secondary--100,#edeef7))));--graupl-table-header-background:var(--graupl-table-highlight-background,var(--graupl-theme-active--secondary--500,var(--graupl-theme-light--secondary--500,var(--graupl-secondary--500,#6c7093))));--graupl-table-header-color:var(--graupl-table-highlight-color,var(--graupl-theme-active--secondary--100,var(--graupl-theme-light--secondary--100,var(--graupl-secondary--100,#edeef7))));--graupl-table-striped-background:var(--graupl-table-highlight-background,var(--graupl-theme-active--secondary--500,var(--graupl-theme-light--secondary--500,var(--graupl-secondary--500,#6c7093))));--graupl-table-striped-color:var(--graupl-table-highlight-color,var(--graupl-theme-active--secondary--100,var(--graupl-theme-light--secondary--100,var(--graupl-secondary--100,#edeef7))))}.responsive-table{display:block;overflow:scroll hidden;width:100%}.responsive-table table{margin-bottom:0;width:100%}}
-/*# sourceMappingURL=table.css.map */

package/dist/component/table.css.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/scss/mixins/_layer.scss","../../src/scss/component/table/_index.scss","table.css","../../src/scss/component/table/_variables.scss"],"names":[],"mappings":"AASI,wBCEE,6BAGI,oJAAA,CAAA,+IAAA,CAAA,qJAAA,CAAA,gJAAA,CAAA,mJAAA,CAAA,8IAAA,CAAA,+IAAA,CAAA,uJAAA,CAAA,kJCFR,CDDI,iCAGI,0JAAA,CAAA,qJAAA,CAAA,2JAAA,CAAA,sJAAA,CAAA,yJAAA,CAAA,oJAAA,CAAA,qJAAA,CAAA,6JAAA,CAAA,wJCUR,CDbI,+BAGI,uJAAA,CAAA,kJAAA,CAAA,wJAAA,CAAA,mJAAA,CAAA,sJAAA,CAAA,iJAAA,CAAA,kJAAA,CAAA,uJAAA,CAAA,qJCsBR,CDdE,eACE,wBAAA,CAGA,iKEVe,CFSf,8EEbe,CFYf,4ECkBJ,CDdI,oBAGE,uMEDkB,CFAlB,oHEJkB,CFGlB,kHCkBN,CDJI,4FACE,2KERmB,CFSnB,iKCUN,CDLI,iCACE,yKELiB,CFMjB,+JCON,CDHE,iBACE,iMAAA,CACA,uLAAA,CACA,mMAAA,CACA,yLAAA,CACA,oMAAA,CACA,0LCKJ,CDDA,kBACE,aAAA,CAEA,sBAAA,CADA,UCIF,CDDE,wBAEE,eAAA,CADA,UCIJ,CACF","file":"table.css"}

package/scss/component/button.scss

@@ -1,3 +0,0 @@
-// Graupl Button Component.
-
-@forward "../../src/scss/component/button";

package/scss/component/table.scss

@@ -1,3 +0,0 @@
-// Table component styles.
-
-@forward "../../src/scss/component/table";

package/src/scss/component/button/_defaults.scss

@@ -1,39 +0,0 @@
-// Default values for Graupl.
-//
-// Generally, these should not be used directly when styling components.
-// They are mainly used to provide default fallbacks for custom properties
-// which can be found in the `variables.scss` file.
-
-@use "sass:map";
-
-$button-hover-transform: none !default;
-$button-hover-transform-reduced-motion: none !default;
-$button-active-transform: scale(0.95) !default;
-$button-active-transform-reduced-motion: scale(0.98) !default;
-
-// Button state theme defaults.
-// This map is used to define the default colour shades for the
-// themed button components.
-//
-// e.g.
-// Primary buttons will use primary--900 as the text colour, primary--100 as the background
-// and primary--900 as the border colour.
-//
-// Secondary/tertiary buttons will use the same shade for their respective colours.
-$base-button-state-theme-map: (
-  color: 900,
-  border-color: 700,
-  hover-color: 100,
-  hover-background: 700,
-  hover-border-color: 700,
-  active-color: 100,
-  active-background: 700,
-  active-border-color: 700,
-  disabled-color: 200,
-  disabled-border-color: 200,
-);
-$custom-button-state-theme-map: () !default;
-$button-state-theme-map: map.merge(
-  $base-button-state-theme-map,
-  $custom-button-state-theme-map
-);

package/src/scss/component/button/_index.scss

@@ -1,134 +0,0 @@
-// Graupl Button Component.
-
-@use "defaults";
-@use "../../defaults" as root-defaults;
-@use "../../theme/color/variables" as color;
-@use "../../base/link/variables" as link;
-@use "variables" as *;
-@use "../../mixins/layer" as *;
-@use "../../mixins/media-queries" as *;
-@use "sass:map";
-
-@include layer(component) {
-  .button {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    min-width: $button-min-width;
-    min-height: $button-min-height;
-    padding: $button-padding;
-    transition: $button-transition;
-    border-width: $button-border-width;
-    border-style: $button-border-style;
-    border-radius: $button-border-radius;
-    font-size: $button-font-size;
-    cursor: pointer;
-
-    &:hover {
-      transform: $button-hover-transform;
-    }
-
-    &:active {
-      transform: $button-active-transform;
-    }
-
-    &:disabled {
-      cursor: not-allowed;
-
-      &:hover,
-      &:active {
-        transform: none;
-      }
-    }
-
-    &.link {
-      min-width: auto;
-      min-height: auto;
-      padding: 0;
-      border: 0;
-      font-size: inherit;
-      text-decoration: link.$link-text-decoration;
-      text-decoration-thickness: link.$link-text-decoration-thickness;
-    }
-  }
-
-  @include animation-off {
-    .button {
-      transition: $button-transition-reduced-motion;
-
-      &:hover {
-        transform: $button-hover-transform-reduced-motion;
-      }
-
-      &:active {
-        transform: $button-active-transform-reduced-motion;
-      }
-    }
-  }
-}
-
-@include layer(theme) {
-  .button {
-    border-color: $button-border-color;
-    background: $button-background;
-    color: $button-color;
-
-    @each $color, $map in color.$theme-active {
-      &.#{$color} {
-        @each $prop, $shade in defaults.$button-state-theme-map {
-          --#{root-defaults.$prefix}-button-#{$prop}: #{map.get($map, $shade)};
-        }
-      }
-    }
-
-    &.link {
-      --#{root-defaults.$prefix}-button-color: #{link.$link-color};
-      --#{root-defaults.$prefix}-button-hover-color: #{link.$link-hover-color};
-      --#{root-defaults.$prefix}-button-active-color: #{link.$link-active-color};
-      --#{root-defaults.$prefix}-button-disabled-color: #{link.$link-disabled-color};
-      --#{root-defaults.$prefix}-button-background: none;
-      --#{root-defaults.$prefix}-button-hover-background: none;
-      --#{root-defaults.$prefix}-button-active-background: none;
-      --#{root-defaults.$prefix}-button-disabled-background: none;
-      --#{root-defaults.$prefix}-button-border-color: none;
-      --#{root-defaults.$prefix}-button-hover-border-color: none;
-      --#{root-defaults.$prefix}-button-active-border-color: none;
-      --#{root-defaults.$prefix}-button-disabled-border-color: none;
-      --#{root-defaults.$prefix}-button-hover-transform: none;
-      --#{root-defaults.$prefix}-button-active-transform: none;
-    }
-
-    &:not(.link) {
-      --#{root-defaults.$prefix}-link-color: #{$button-color};
-      --#{root-defaults.$prefix}-link-hover-color: #{$button-hover-color};
-      --#{root-defaults.$prefix}-link-active-color: #{$button-active-color};
-      --#{root-defaults.$prefix}-link-visited-color: #{$button-hover-color};
-      --#{root-defaults.$prefix}-link-disabled-color: #{$button-disabled-color};
-    }
-
-    &:hover {
-      --#{root-defaults.$prefix}-button-border-color: #{$button-hover-border-color};
-      --#{root-defaults.$prefix}-button-background: #{$button-hover-background};
-      --#{root-defaults.$prefix}-button-color: #{$button-hover-color};
-    }
-
-    &:active {
-      --#{root-defaults.$prefix}-button-border-color: #{$button-active-border-color};
-      --#{root-defaults.$prefix}-button-background: #{$button-active-background};
-      --#{root-defaults.$prefix}-button-color: #{$button-active-color};
-    }
-
-    &:disabled {
-      --#{root-defaults.$prefix}-button-border-color: #{$button-disabled-border-color};
-      --#{root-defaults.$prefix}-button-background: #{$button-disabled-background};
-      --#{root-defaults.$prefix}-button-color: #{$button-disabled-color};
-
-      &:hover,
-      &:active {
-        --#{root-defaults.$prefix}-button-border-color: #{$button-disabled-border-color};
-        --#{root-defaults.$prefix}-button-background: #{$button-disabled-background};
-        --#{root-defaults.$prefix}-button-color: #{$button-disabled-color};
-      }
-    }
-  }
-}

package/src/scss/component/table/_defaults.scss

@@ -1,30 +0,0 @@
-// Default values for Graupl.
-//
-// Generally, these should not be used directly when styling components.
-// They are mainly used to provide default fallbacks for custom properties
-// which can be found in the `variables.scss` file.
-
-@use "sass:map";
-
-// Table theme defaults.
-// This map is used to define the default colour shades for the
-// themed table components.
-//
-// e.g.
-// Primary tables will use primary--700 as the header background,
-// and primary--100 as the header text colour.
-//
-// Secondary/tertiary tables will use the same shade for their respective colours.
-$base-table-theme-map: (
-  header-background: 700,
-  header-color: 100,
-  striped-background: 200,
-  striped-color: 900,
-  hover-background: 300,
-  hover-color: 900,
-  border-color: 900,
-  highlight-background: 500,
-  highlight-color: 100,
-);
-$custom-table-theme-map: () !default;
-$table-theme-map: map.merge($base-table-theme-map, $custom-table-theme-map);

package/src/scss/component/table/_index.scss

@@ -1,77 +0,0 @@
-// Table component styles.
-
-@use "variables" as *;
-@use "defaults";
-@use "../../mixins/layer" as *;
-@use "../../defaults" as root-defaults;
-@use "../../functions/theme";
-
-@include layer(component) {
-  table {
-    @each $variant in theme.variants() {
-      &.#{$variant},
-      .#{$variant} {
-        @each $prop, $key in defaults.$table-theme-map {
-          --#{root-defaults.$prefix}-table-#{$prop}: #{theme.get(
-              $variant,
-              $key
-            )};
-        }
-      }
-    }
-
-    &.bordered {
-      border-collapse: collapse;
-      border-width: $table-border-width;
-      border-style: $table-border-style;
-      border-color: $table-border-color;
-
-      tr > * {
-        border-width: $table-cell-border-width;
-        border-style: $table-cell-border-style;
-        border-color: $table-cell-border-color;
-      }
-    }
-
-    &.striped-columns {
-      tbody tr:nth-child(odd) > * {
-        background: $table-striped-background;
-        color: $table-striped-color;
-      }
-    }
-
-    &.striped-rows {
-      tbody tr > :nth-child(odd) {
-        background: $table-striped-background;
-        color: $table-striped-color;
-      }
-    }
-
-    &.hoverable {
-      tbody tr:hover > * {
-        background: $table-hover-background;
-        color: $table-hover-color;
-      }
-    }
-
-    .highlight {
-      --#{root-defaults.$prefix}-table-cell-background: #{$table-highlight-background};
-      --#{root-defaults.$prefix}-table-cell-color: #{$table-highlight-color};
-      --#{root-defaults.$prefix}-table-header-background: #{$table-highlight-background};
-      --#{root-defaults.$prefix}-table-header-color: #{$table-highlight-color};
-      --#{root-defaults.$prefix}-table-striped-background: #{$table-highlight-background};
-      --#{root-defaults.$prefix}-table-striped-color: #{$table-highlight-color};
-    }
-  }
-
-  .responsive-table {
-    display: block;
-    width: 100%;
-    overflow: scroll hidden;
-
-    table {
-      width: 100%;
-      margin-bottom: 0;
-    }
-  }
-}

package/src/scss/component/table/_variables.scss

@@ -1,64 +0,0 @@
-// Variables referencing custom properties.
-
-@use "defaults";
-@use "../../defaults" as root-defaults;
-@use "../../variables" as root-variables;
-@use "../../functions/theme";
-
-// Table border properties.
-$table-border-width: var(
-  --#{root-defaults.$prefix}-table-border-width,
-  #{root-variables.$border-width}
-);
-$table-border-style: var(
-  --#{root-defaults.$prefix}-table-border-style,
-  #{root-variables.$border-style}
-);
-$table-border-color: var(
-  --#{root-defaults.$prefix}-table-border-color,
-  #{theme.get(primary, 900)}
-);
-
-// Table cell border properties.
-$table-cell-border-width: var(
-  --#{root-defaults.$prefix}-table-cell-border-width,
-  #{$table-border-width}
-);
-$table-cell-border-style: var(
-  --#{root-defaults.$prefix}-table-cell-border-style,
-  #{$table-border-style}
-);
-$table-cell-border-color: var(
-  --#{root-defaults.$prefix}-table-cell-border-color,
-  #{$table-border-color}
-);
-
-// Table striped properties.
-$table-striped-background: var(
-  --#{root-defaults.$prefix}-table-striped-background,
-  #{theme.get(secondary, 200)}
-);
-$table-striped-color: var(
-  --#{root-defaults.$prefix}-table-striped-color,
-  #{theme.get(secondary, 900)}
-);
-
-// Table hover properties.
-$table-hover-background: var(
-  --#{root-defaults.$prefix}-table-hover-background,
-  #{theme.get(secondary, 300)}
-);
-$table-hover-color: var(
-  --#{root-defaults.$prefix}-table-hover-color,
-  #{theme.get(secondary, 900)}
-);
-
-// Table highlight properties.
-$table-highlight-background: var(
-  --#{root-defaults.$prefix}-table-highlight-background,
-  #{theme.get(secondary, 500)}
-);
-$table-highlight-color: var(
-  --#{root-defaults.$prefix}-table-highlight-color,
-  #{theme.get(secondary, 100)}
-);