@graupl/graupl 1.0.0-beta.10 → 1.0.0-beta.11

package/packages/core/src/scss/component/navigation/_index.scss

@@ -1,190 +0,0 @@
-// @graupl/core navigation component styles.
-
-@use "defaults";
-@use "variables" as *;
-@use "../../defaults" as root-defaults;
-@use "../menu/defaults" as menu-defaults;
-@use "../menu/variables" as menu-variables;
-@use "../../mixins/layer" as *;
-@use "../../mixins/screen";
-
-@include layer(component) {
-  // Navigation.
-  #{defaults.$navigation-selector} {
-    display: grid;
-    grid-template-areas:
-      "branding - toggle"
-      "menu menu menu";
-    grid-template-columns: auto 1fr auto;
-    isolation: isolate;
-
-    #{menu-defaults.$menu-selector} {
-      grid-area: menu;
-
-      &#{menu-defaults.$menu-show-selector} {
-        --#{root-defaults.$prefix}menu-display: #{menu-variables.$menu-show-display};
-      }
-
-      &#{menu-defaults.$menu-hide-selector} {
-        --#{root-defaults.$prefix}menu-display: #{menu-variables.$menu-hide-display};
-      }
-    }
-  }
-
-  // Navigation toggle.
-  #{defaults.$navigation-toggle-selector} {
-    display: flex;
-    grid-area: toggle;
-    align-items: center;
-    justify-content: center;
-    min-width: $navigation-toggle-min-width;
-    min-height: $navigation-toggle-min-height;
-    padding: $navigation-toggle-padding;
-    border-width: $navigation-toggle-border-width;
-    border-style: $navigation-toggle-border-style;
-    border-radius: $navigation-toggle-border-radius;
-
-    &::before {
-      content: $navigation-toggle-content;
-      display: block;
-    }
-  }
-
-  // Navigation branding.
-  #{defaults.$navigation-branding-selector} {
-    display: flex;
-    grid-area: branding;
-    align-items: center;
-    justify-content: flex-start;
-    padding: $navigation-branding-padding;
-    font-size: $navigation-branding-font-size;
-    font-weight: $navigation-branding-font-weight;
-    text-decoration: $navigation-branding-text-decoration;
-    text-decoration-style: $navigation-branding-text-decoration-style;
-    text-decoration-thickness: $navigation-branding-text-decoration-thickness;
-
-    &:visited {
-      --#{root-defaults.$prefix}navigation-branding-text-decoration: #{$navigation-branding-visited-text-decoration};
-      --#{root-defaults.$prefix}navigation-branding-text-decoration-thickness: #{$navigation-branding-visited-text-decoration-thickness};
-      --#{root-defaults.$prefix}navigation-branding-text-decoration-style: #{$navigation-branding-visited-text-decoration-style};
-    }
-
-    &:focus-visible {
-      --#{root-defaults.$prefix}navigation-branding-text-decoration: #{$navigation-branding-focus-text-decoration};
-      --#{root-defaults.$prefix}navigation-branding-text-decoration-thickness: #{$navigation-branding-focus-text-decoration-thickness};
-      --#{root-defaults.$prefix}navigation-branding-text-decoration-style: #{$navigation-branding-focus-text-decoration-style};
-    }
-
-    &:hover {
-      --#{root-defaults.$prefix}navigation-branding-text-decoration: #{$navigation-branding-hover-text-decoration};
-      --#{root-defaults.$prefix}navigation-branding-text-decoration-thickness: #{$navigation-branding-hover-text-decoration-thickness};
-      --#{root-defaults.$prefix}navigation-branding-text-decoration-style: #{$navigation-branding-hover-text-decoration-style};
-    }
-
-    &:active {
-      --#{root-defaults.$prefix}navigation-branding-text-decoration: #{$navigation-branding-active-text-decoration};
-      --#{root-defaults.$prefix}navigation-branding-text-decoration-thickness: #{$navigation-branding-active-text-decoration-thickness};
-      --#{root-defaults.$prefix}navigation-branding-text-decoration-style: #{$navigation-branding-active-text-decoration-style};
-    }
-
-    &:disabled,
-    &[disabled] {
-      &,
-      &:visited,
-      &:focus-visible,
-      &:hover,
-      &:active {
-        --#{root-defaults.$prefix}navigation-branding-text-decoration: #{$navigation-branding-disabled-text-decoration};
-        --#{root-defaults.$prefix}navigation-branding-text-decoration-thickness: #{$navigation-branding-disabled-text-decoration-thickness};
-        --#{root-defaults.$prefix}navigation-branding-text-decoration-style: #{$navigation-branding-disabled-text-decoration-style};
-      }
-    }
-  }
-
-  @include screen.trigger(navigation-collapse) {
-    // Navigation.
-    #{defaults.$navigation-selector} {
-      --#{root-defaults.$prefix}menu-flex-direction: column;
-      --#{root-defaults.$prefix}submenu-position: relative;
-      --#{root-defaults.$prefix}menu-item-min-width: 100%;
-      --#{root-defaults.$prefix}submenu-inset: auto;
-    }
-  }
-
-  @include screen.trigger(navigation-expand) {
-    // Navigation.
-    #{defaults.$navigation-selector} {
-      --#{root-defaults.$prefix}menu-hide-display: #{menu-variables.$menu-show-display};
-
-      grid-template-areas: "branding - menu";
-    }
-
-    // Navigation toggle.
-    #{defaults.$navigation-toggle-selector} {
-      display: none;
-    }
-  }
-}
-
-@include layer(theme) {
-  // Navigation.
-  #{defaults.$navigation-selector} {
-    --#{root-defaults.$prefix}menu-background: #{$navigation-background};
-    --#{root-defaults.$prefix}menu-color: #{$navigation-color};
-    --#{root-defaults.$prefix}submenu-background: #{$navigation-background};
-    --#{root-defaults.$prefix}submenu-color: #{$navigation-color};
-
-    background: $navigation-background;
-    color: $navigation-color;
-  }
-
-  // Navigation toggle.
-  #{defaults.$navigation-toggle-selector} {
-    border-color: $navigation-toggle-border-color;
-    background: $navigation-toggle-background;
-    color: $navigation-toggle-color;
-
-    &:hover {
-      --#{root-defaults.$prefix}navigation-toggle-background: #{$navigation-toggle-hover-background};
-      --#{root-defaults.$prefix}navigation-toggle-color: #{$navigation-toggle-hover-color};
-    }
-  }
-
-  // Navigation branding.
-  #{defaults.$navigation-branding-selector} {
-    color: $navigation-branding-color;
-    text-decoration-color: $navigation-branding-text-decoration-color;
-
-    &:visited {
-      --#{root-defaults.$prefix}navigation-branding-color: #{$navigation-branding-visited-color};
-      --#{root-defaults.$prefix}navigation-branding-text-decoration-color: #{$navigation-branding-visited-text-decoration-color};
-    }
-
-    &:focus-visible {
-      --#{root-defaults.$prefix}navigation-branding-color: #{$navigation-branding-focus-color};
-      --#{root-defaults.$prefix}navigation-branding-text-decoration-color: #{$navigation-branding-focus-text-decoration-color};
-    }
-
-    &:hover {
-      --#{root-defaults.$prefix}navigation-branding-color: #{$navigation-branding-hover-color};
-      --#{root-defaults.$prefix}navigation-branding-text-decoration-color: #{$navigation-branding-hover-text-decoration-color};
-    }
-
-    &:active {
-      --#{root-defaults.$prefix}navigation-branding-color: #{$navigation-branding-active-color};
-      --#{root-defaults.$prefix}navigation-branding-text-decoration-color: #{$navigation-branding-active-text-decoration-color};
-    }
-
-    &:disabled,
-    &[disabled] {
-      &,
-      &:visited,
-      &:focus-visible,
-      &:hover,
-      &:active {
-        --#{root-defaults.$prefix}navigation-branding-color: #{$navigation-branding-disabled-color};
-        --#{root-defaults.$prefix}navigation-branding-text-decoration-color: #{$navigation-branding-disabled-text-decoration-color};
-      }
-    }
-  }
-}

package/packages/core/src/scss/component/navigation/_variables.scss

@@ -1,290 +0,0 @@
-// @graupl/core navigation component variables.
-//
-// These values are to be used to directly style components and provide a
-// cleaner way to reference custom properties.
-
-@use "defaults";
-@use "../../defaults" as root-defaults;
-@use "../../variables" as root-variables;
-@use "../../theme/color/variables" as color;
-@use "../../theme/typography/variables" as typography;
-@use "sass:map";
-
-// Navigation colors.
-$navigation-background: var(
-  --#{root-defaults.$prefix}navigation-background,
-  #{color.$background}
-);
-$navigation-color: var(
-  --#{root-defaults.$prefix}navigation-color,
-  #{color.$color}
-);
-
-// Navigation toggle size.
-$navigation-toggle-min-width: var(
-  --#{root-defaults.$prefix}navigation-toggle-min-width,
-  #{root-defaults.$interactive-min-width}
-);
-$navigation-toggle-min-height: var(
-  --#{root-defaults.$prefix}navigation-toggle-min-height,
-  #{root-defaults.$interactive-min-height}
-);
-
-// Navigation toggle spacing.
-$navigation-toggle-padding-x: var(
-  --#{root-defaults.$prefix}navigation-toggle-padding-x,
-  #{map.get(root-variables.$spacers, 5)}
-);
-$navigation-toggle-padding-y: var(
-  --#{root-defaults.$prefix}navigation-toggle-padding-y,
-  #{map.get(root-variables.$spacers, 3)}
-);
-$navigation-toggle-padding: var(
-  --#{root-defaults.$prefix}navigation-toggle-padding,
-  #{$navigation-toggle-padding-y} #{$navigation-toggle-padding-x}
-);
-
-// Navigation toggle colors.
-$navigation-toggle-background: var(
-  --#{root-defaults.$prefix}navigation-toggle-background,
-  #{$navigation-background}
-);
-$navigation-toggle-color: var(
-  --#{root-defaults.$prefix}navigation-toggle-color,
-  #{$navigation-color}
-);
-$navigation-toggle-hover-background: var(
-  --#{root-defaults.$prefix}navigation-toggle-hover-background,
-  #{$navigation-color}
-);
-$navigation-toggle-hover-color: var(
-  --#{root-defaults.$prefix}navigation-toggle-hover-color,
-  #{$navigation-background}
-);
-
-// Navigation toggle border properties.
-$navigation-toggle-border-top-width: var(
-  --#{root-defaults.$prefix}navigation-toggle-border-top-width,
-  #{root-variables.$border-top-width}
-);
-$navigation-toggle-border-right-width: var(
-  --#{root-defaults.$prefix}navigation-toggle-border-right-width,
-  #{root-variables.$border-right-width}
-);
-$navigation-toggle-border-bottom-width: var(
-  --#{root-defaults.$prefix}navigation-toggle-border-bottom-width,
-  #{root-variables.$border-bottom-width}
-);
-$navigation-toggle-border-left-width: var(
-  --#{root-defaults.$prefix}navigation-toggle-border-left-width,
-  #{root-variables.$border-left-width}
-);
-$navigation-toggle-border-width: var(
-  --#{root-defaults.$prefix}navigation-toggle-border-width,
-  #{$navigation-toggle-border-top-width}
-    #{$navigation-toggle-border-right-width}
-    #{$navigation-toggle-border-bottom-width}
-    #{$navigation-toggle-border-left-width}
-);
-$navigation-toggle-border-top-style: var(
-  --#{root-defaults.$prefix}navigation-toggle-border-top-style,
-  #{root-variables.$border-top-style}
-);
-$navigation-toggle-border-right-style: var(
-  --#{root-defaults.$prefix}navigation-toggle-border-right-style,
-  #{root-variables.$border-right-style}
-);
-$navigation-toggle-border-bottom-style: var(
-  --#{root-defaults.$prefix}navigation-toggle-border-bottom-style,
-  #{root-variables.$border-bottom-style}
-);
-$navigation-toggle-border-left-style: var(
-  --#{root-defaults.$prefix}navigation-toggle-border-left-style,
-  #{root-variables.$border-left-style}
-);
-$navigation-toggle-border-style: var(
-  --#{root-defaults.$prefix}navigation-toggle-border-style,
-  #{$navigation-toggle-border-top-style}
-    #{$navigation-toggle-border-right-style}
-    #{$navigation-toggle-border-bottom-style}
-    #{$navigation-toggle-border-left-style}
-);
-$navigation-toggle-border-color: var(
-  --#{root-defaults.$prefix}navigation-toggle-border-color,
-  #{$navigation-toggle-color}
-);
-$navigation-toggle-border-top-left-radius: var(
-  --#{root-defaults.$prefix}navigation-toggle-border-top-left-radius,
-  #{root-variables.$border-top-left-radius}
-);
-$navigation-toggle-border-top-right-radius: var(
-  --#{root-defaults.$prefix}navigation-toggle-border-top-right-radius,
-  #{root-variables.$border-top-right-radius}
-);
-$navigation-toggle-border-bottom-left-radius: var(
-  --#{root-defaults.$prefix}navigation-toggle-border-bottom-left-radius,
-  #{root-variables.$border-bottom-left-radius}
-);
-$navigation-toggle-border-bottom-right-radius: var(
-  --#{root-defaults.$prefix}navigation-toggle-border-bottom-right-radius,
-  #{root-variables.$border-bottom-right-radius}
-);
-$navigation-toggle-border-radius: var(
-  --#{root-defaults.$prefix}navigation-toggle-border-radius,
-  #{$navigation-toggle-border-top-left-radius}
-    #{$navigation-toggle-border-top-right-radius}
-    #{$navigation-toggle-border-bottom-right-radius}
-    #{$navigation-toggle-border-bottom-left-radius}
-);
-
-// Navigation branding properties.
-$navigation-branding-font-size: var(
-  --#{root-defaults.$prefix}navigation-branding-font-size,
-  #{map.get(typography.$font-sizes, "lg")}
-);
-$navigation-branding-font-weight: var(
-  --#{root-defaults.$prefix}navigation-branding-font-weight,
-  #{typography.$font-weight-bold}
-);
-$navigation-branding-padding-x: var(
-  --#{root-defaults.$prefix}navigation-branding-padding-x,
-  #{map.get(root-variables.$spacers, 3)}
-);
-$navigation-branding-padding-y: var(
-  --#{root-defaults.$prefix}navigation-branding-padding-y,
-  #{map.get(root-variables.$spacers, 2)}
-);
-$navigation-branding-padding: var(
-  --#{root-defaults.$prefix}navigation-branding-padding,
-  #{$navigation-branding-padding-y} #{$navigation-branding-padding-x}
-);
-
-// Navigation branding colors.
-$navigation-branding-color: var(
-  --#{root-defaults.$prefix}navigation-branding-color,
-  #{$navigation-color}
-);
-$navigation-branding-visited-color: var(
-  --#{root-defaults.$prefix}navigation-branding-visited-color,
-  #{$navigation-branding-color}
-);
-$navigation-branding-focus-color: var(
-  --#{root-defaults.$prefix}navigation-branding-focus-color,
-  #{$navigation-branding-color}
-);
-$navigation-branding-hover-color: var(
-  --#{root-defaults.$prefix}navigation-branding-hover-color,
-  #{$navigation-color}
-);
-$navigation-branding-active-color: var(
-  --#{root-defaults.$prefix}navigation-branding-active-color,
-  #{$navigation-branding-hover-color}
-);
-$navigation-branding-disabled-color: var(
-  --#{root-defaults.$prefix}navigation-branding-disabled-color,
-  #{$navigation-color}
-);
-
-// Navigation branding text decoration properties.
-$navigation-branding-text-decoration: var(
-  --#{root-defaults.$prefix}navigation-branding-text-decoration,
-  #{defaults.$navigation-branding-initial-text-decoration}
-);
-$navigation-branding-visited-text-decoration: var(
-  --#{root-defaults.$prefix}navigation-branding-visited-text-decoration,
-  #{$navigation-branding-text-decoration}
-);
-$navigation-branding-focus-text-decoration: var(
-  --#{root-defaults.$prefix}navigation-branding-focus-text-decoration,
-  #{$navigation-branding-text-decoration}
-);
-$navigation-branding-hover-text-decoration: var(
-  --#{root-defaults.$prefix}navigation-branding-hover-text-decoration,
-  #{defaults.$navigation-branding-final-text-decoration}
-);
-$navigation-branding-active-text-decoration: var(
-  --#{root-defaults.$prefix}navigation-branding-active-text-decoration,
-  #{$navigation-branding-hover-text-decoration}
-);
-$navigation-branding-disabled-text-decoration: var(
-  --#{root-defaults.$prefix}navigation-branding-disabled-text-decoration,
-  #{defaults.$navigation-branding-disabled-text-decoration}
-);
-$navigation-branding-text-decoration-style: var(
-  --#{root-defaults.$prefix}navigation-branding-text-decoration-style,
-  #{defaults.$navigation-branding-initial-text-decoration-style}
-);
-$navigation-branding-visited-text-decoration-style: var(
-  --#{root-defaults.$prefix}navigation-branding-visited-text-decoration-style,
-  #{$navigation-branding-text-decoration-style}
-);
-$navigation-branding-focus-text-decoration-style: var(
-  --#{root-defaults.$prefix}navigation-branding-focus-text-decoration-style,
-  #{$navigation-branding-text-decoration-style}
-);
-$navigation-branding-hover-text-decoration-style: var(
-  --#{root-defaults.$prefix}navigation-branding-hover-text-decoration-style,
-  #{defaults.$navigation-branding-final-text-decoration-style}
-);
-$navigation-branding-active-text-decoration-style: var(
-  --#{root-defaults.$prefix}navigation-branding-active-text-decoration-style,
-  #{$navigation-branding-hover-text-decoration-style}
-);
-$navigation-branding-disabled-text-decoration-style: var(
-  --#{root-defaults.$prefix}navigation-branding-disabled-text-decoration-style,
-  #{defaults.$navigation-branding-disabled-text-decoration-style}
-);
-$navigation-branding-text-decoration-thickness: var(
-  --#{root-defaults.$prefix}navigation-branding-text-decoration-thickness,
-  #{root-variables.$border-width}
-);
-$navigation-branding-visited-text-decoration-thickness: var(
-  --#{root-defaults.$prefix}navigation-branding-visited-text-decoration-thickness,
-  #{$navigation-branding-text-decoration-thickness}
-);
-$navigation-branding-focus-text-decoration-thickness: var(
-  --#{root-defaults.$prefix}navigation-branding-focus-text-decoration-thickness,
-  #{$navigation-branding-text-decoration-thickness}
-);
-$navigation-branding-hover-text-decoration-thickness: var(
-  --#{root-defaults.$prefix}navigation-branding-hover-text-decoration-thickness,
-  #{root-variables.$border-width}
-);
-$navigation-branding-active-text-decoration-thickness: var(
-  --#{root-defaults.$prefix}navigation-branding-active-text-decoration-thickness,
-  #{$navigation-branding-hover-text-decoration-thickness}
-);
-$navigation-branding-disabled-text-decoration-thickness: var(
-  --#{root-defaults.$prefix}navigation-branding-disabled-text-decoration-thickness,
-  #{root-variables.$border-width}
-);
-$navigation-branding-text-decoration-color: var(
-  --#{root-defaults.$prefix}navigation-branding-text-decoration-color,
-  #{$navigation-branding-color}
-);
-$navigation-branding-visited-text-decoration-color: var(
-  --#{root-defaults.$prefix}navigation-branding-visited-text-decoration-color,
-  #{$navigation-branding-visited-color}
-);
-$navigation-branding-focus-text-decoration-color: var(
-  --#{root-defaults.$prefix}navigation-branding-focus-text-decoration-color,
-  #{$navigation-branding-focus-color}
-);
-$navigation-branding-hover-text-decoration-color: var(
-  --#{root-defaults.$prefix}navigation-branding-hover-text-decoration-color,
-  #{$navigation-branding-hover-color}
-);
-$navigation-branding-active-text-decoration-color: var(
-  --#{root-defaults.$prefix}navigation-branding-active-text-decoration-color,
-  #{$navigation-branding-active-color}
-);
-$navigation-branding-disabled-text-decoration-color: var(
-  --#{root-defaults.$prefix}navigation-branding-disabled-text-decoration-color,
-  #{$navigation-branding-disabled-color}
-);
-
-// Navigation toggle properties.
-$navigation-toggle-content: var(
-  --#{root-defaults.$prefix}navigation-toggle-content,
-  #{defaults.$navigation-toggle-content}
-);

package/packages/core/src/scss/functions/_container.scss

@@ -1,38 +0,0 @@
-// @graupl/core container functions.
-//
-// A series of functions to determine ranges of container sizes.
-
-@use "../defaults" as root-defaults;
-@use "sass:map";
-@use "sass:list";
-
-@function min($size) {
-  @if not map.has-key(root-defaults.$container-sizes, $size) {
-    @error "The container size \"#{$size}\" does not exist.";
-  }
-
-  $container-size: map.get(root-defaults.$container-sizes, $size);
-
-  @return $container-size;
-}
-
-@function max($size) {
-  @if not map.has-key(root-defaults.$container-sizes, $size) {
-    @error "The container size \"#{$size}\" does not exist.";
-  }
-
-  $keys: map.keys(root-defaults.$container-sizes);
-  $index: list.index($keys, "#{$size}");
-  $key: list.nth($keys, $index + 1);
-  $container-size: map.get(root-defaults.$container-sizes, $key);
-  $container-size: $container-size - 1;
-
-  @return $container-size;
-}
-
-@function range($min, $max) {
-  $min-size: min($min);
-  $max-size: max($max);
-
-  @return (min: $min-size, max: $max-size);
-}

package/packages/core/src/scss/functions/_important.scss

@@ -1,36 +0,0 @@
-// @graupl/core important functions.
-//
-// A function to determine if the !important flag should be added to a property.
-
-@use "../defaults";
-
-/// Determine if an important flag is required and insert it into a property value.
-///
-/// @param {String} $value
-///   The value to insert the important flag into.
-/// @param {Boolean} $use-important
-///   A flag to determine if the important flag should be overridden.
-///
-/// @return {String}
-///   The value with the important flag added.
-@function insert($value, $override: null) {
-  // If override is set, use it.
-  /* stylelint-disable scss/at-if-no-null */
-  @if $override != null {
-    // Convert the override to a string.
-    // We have to do this because true/false values are weird in Sass.
-    // Using the raw boolean value, it will always return true for some reason.
-    @if "#{$override}" == "true" {
-      @return #{$value} !important;
-    } @else {
-      @return #{$value};
-    }
-  }
-  /* stylelint-enable scss/at-if-no-null */
-
-  @if defaults.$use-important {
-    @return #{$value} !important;
-  }
-
-  @return #{$value};
-}

package/packages/core/src/scss/functions/_screen.scss

@@ -1,38 +0,0 @@
-// @graupl/core screen functions.
-//
-// A series of functions to determine ranges of screen sizes.
-
-@use "../defaults" as root-defaults;
-@use "sass:map";
-@use "sass:list";
-
-@function min($size) {
-  @if not map.has-key(root-defaults.$screen-sizes, $size) {
-    @error "The screen size \"#{$size}\" does not exist.";
-  }
-
-  $screen-size: map.get(root-defaults.$screen-sizes, $size);
-
-  @return $screen-size;
-}
-
-@function max($size) {
-  @if not map.has-key(root-defaults.$screen-sizes, $size) {
-    @error "The screen size \"#{$size}\" does not exist.";
-  }
-
-  $keys: map.keys(root-defaults.$screen-sizes);
-  $index: list.index($keys, "#{$size}");
-  $key: list.nth($keys, $index + 1);
-  $screen-size: map.get(root-defaults.$screen-sizes, $key);
-  $screen-size: $screen-size - 1;
-
-  @return $screen-size;
-}
-
-@function range($min, $max) {
-  $min-size: min($min);
-  $max-size: max($max);
-
-  @return (min: $min-size, max: $max-size);
-}

package/packages/core/src/scss/functions/_theme.scss

@@ -1,39 +0,0 @@
-// @graupl/core theme functions.
-//
-// Functions to help with getting information about the theme.
-
-@use "sass:map";
-@use "../theme/color/variables" as color;
-
-// A function to get the specific theme shades.
-@function get($color, $shade: null, $theme: active) {
-  @if $shade == transparent or $color == transparent {
-    @return transparent;
-  }
-
-  @if $shade == none or $color == none {
-    @return none;
-  }
-
-  @if $shade == inherit or $color == inherit {
-    @return inherit;
-  }
-
-  @if $shade == initial or $color == initial {
-    @return initial;
-  }
-
-  @if map.has-key(color.$themes, $theme, $color, $shade) {
-    @return map.get(map.get(map.get(color.$themes, $theme), $color), $shade);
-  }
-
-  @return null;
-}
-
-@function variants($theme: active) {
-  @if map.has-key(color.$themes, $theme) {
-    @return map.keys(map.get(color.$themes, $theme));
-  }
-
-  @return null;
-}

package/packages/core/src/scss/functions/_utility.scss

@@ -1,28 +0,0 @@
-// @graupl/core utility functions.
-//
-// Functions to help generate utility classes.
-
-@use "sass:map";
-
-/// Convert a property and value to a map.
-///
-/// This mixin is used internally.
-///
-/// @param {string|List} $property
-///   The property/properties to convert to keys.
-/// @param {string}      $value
-///   The value to use for keys.
-@function convert-property-values-to-map($property, $value) {
-  $map: ();
-
-  @each $prop in $property {
-    $map: map.merge(
-      $map,
-      (
-        $prop: $value,
-      )
-    );
-  }
-
-  @return $map;
-}

package/packages/core/src/scss/layout/_index.scss

@@ -1,5 +0,0 @@
-// @graupl/core layout styles.
-
-@forward "container";
-@forward "columns";
-@forward "flex-columns";

package/packages/core/src/scss/layout/columns/_defaults.scss

@@ -1,24 +0,0 @@
-// @graupl/core columns layout default values.
-//
-// 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 "../../defaults" as root-defaults;
-
-// Columns selectors.
-$columns-selector-base: root-defaults.$component-selector-base !default;
-$columns-selector: "columns" !default;
-$columns-count-selector-base: $columns-selector-base !default;
-$columns-count-selector-prefix: "count-" !default;
-$columns-span-selector-base: $columns-selector-base !default;
-$columns-span-selector-prefix: "span-" !default;
-
-// Columns properties.
-$columns-max-width: 1fr !default;
-$columns-count: 3 !default;
-$columns-min-count: 1 !default;
-$columns-max-count: 6 !default;
-$columns-span: 1 !default;