@matteusan/himig 1.4.1 → 1.5.1

package/pintig/color/_index.scss

@@ -0,0 +1,25 @@
+//---------------------------------------------------
+//  Copyright (c) 2024 MatteuSan
+//
+//  Permission is hereby granted, free of charge, to any person obtaining a copy
+//  of this software and associated documentation files (the "Software"), to deal
+//  in the Software without restriction, including without limitation the rights
+//  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+//  copies of the Software, and to permit persons to whom the Software is
+//  furnished to do so, subject to the following conditions:
+//
+//  The above copyright notice and this permission notice shall be included in all
+//  copies or substantial portions of the Software.
+//
+//  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+//  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+//  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+//  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+//  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+//  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+//  SOFTWARE.
+//---------------------------------------------------
+
+@forward 'color-constants';
+@forward 'color-setters';
+@forward 'color-utils';

package/pintig/component/_component-extend.scss

@@ -0,0 +1,56 @@
+//---------------------------------------------------
+//  Copyright (c) 2024 MatteuSan
+//
+//  Permission is hereby granted, free of charge, to any person obtaining a copy
+//  of this software and associated documentation files (the "Software"), to deal
+//  in the Software without restriction, including without limitation the rights
+//  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+//  copies of the Software, and to permit persons to whom the Software is
+//  furnished to do so, subject to the following conditions:
+//
+//  The above copyright notice and this permission notice shall be included in all
+//  copies or substantial portions of the Software.
+//
+//  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+//  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+//  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+//  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+//  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+//  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+//  SOFTWARE.
+//---------------------------------------------------
+
+@use 'sass:list';
+@use 'sass:string';
+@use '../tools';
+
+@mixin extend($component-name, $extension) {
+  $_extensions: tools.str-split($extension, '.');
+  $_sanitized-extension: '';
+
+  @each $ext in $_extensions {
+    @if list.index($_extensions, $ext) == 1 {
+      @if string.slice($ext, 1, 3) == 'is-' {
+        $_sanitized-extension: $_sanitized-extension + string.slice($ext, 4);
+      } @else {
+        $_sanitized-extension: $_sanitized-extension + $ext;
+      }
+    } @else if list.index($_extensions, $ext) == list.length($_extensions) {
+      @if string.slice($ext, 1, 3) == 'is-' {
+        $_sanitized-extension: $_sanitized-extension + '.#{$ext}';
+      } @else {
+        $_sanitized-extension: $_sanitized-extension + '.is-#{$ext}';
+      }
+    } @else {
+      @if string.slice($ext, 1, 3) == 'is-' {
+        $_sanitized-extension: $_sanitized-extension + '.#{$ext}';
+      } @else {
+        $_sanitized-extension: $_sanitized-extension + '.is-#{$ext}';
+      }
+    }
+  }
+
+  .ms-#{$component-name}.is-#{$_sanitized-extension} {
+    @content;
+  }
+}

package/pintig/component/_index.scss

@@ -0,0 +1,23 @@
+//---------------------------------------------------
+//  Copyright (c) 2024 MatteuSan
+//
+//  Permission is hereby granted, free of charge, to any person obtaining a copy
+//  of this software and associated documentation files (the "Software"), to deal
+//  in the Software without restriction, including without limitation the rights
+//  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+//  copies of the Software, and to permit persons to whom the Software is
+//  furnished to do so, subject to the following conditions:
+//
+//  The above copyright notice and this permission notice shall be included in all
+//  copies or substantial portions of the Software.
+//
+//  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+//  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+//  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+//  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+//  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+//  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+//  SOFTWARE.
+//---------------------------------------------------
+
+@forward 'component-extend';

package/pintig/component/component-base.ts

@@ -0,0 +1,81 @@
+/*
+ *  Copyright (c) 2024 MatteuSan
+ *
+ *  Permission is hereby granted, free of charge, to any person obtaining a copy
+ *  of this software and associated documentation files (the "Software"), to deal
+ *  in the Software without restriction, including without limitation the rights
+ *  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ *  copies of the Software, and to permit persons to whom the Software is
+ *  furnished to do so, subject to the following conditions:
+ *
+ *  The above copyright notice and this permission notice shall be included in all
+ *  copies or substantial portions of the Software.
+ *
+ *  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ *  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ *  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ *  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ *  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ *  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ *  SOFTWARE.
+ */
+
+import { MSComponent } from './types/ms-component';
+import { accessProperty } from './component-properties';
+
+export class MSComponentBase {
+
+  protected GS_TARGET_COMPONENT: Element | HTMLElement | null;
+  protected GS_REFERENCE_COMPONENT: MSComponent;
+  protected GS_CUSTOM_PROPERTIES: string[];
+  private readonly GS_COMPONENT_NAME: string;
+
+  constructor(
+    targetComponent: Element | HTMLElement | null,
+    referenceComponent: MSComponent,
+    customProperties: string[],
+  ) {
+    this.GS_TARGET_COMPONENT = targetComponent;
+    this.GS_REFERENCE_COMPONENT = referenceComponent;
+    this.GS_CUSTOM_PROPERTIES = customProperties;
+    this.GS_COMPONENT_NAME = this.GS_REFERENCE_COMPONENT.substring(3);
+  }
+
+  addClass(className: string): void {
+    this.GS_TARGET_COMPONENT?.classList.add(className);
+  }
+
+  removeClass(className: string): void {
+    this.GS_TARGET_COMPONENT?.classList.remove(className);
+  }
+
+  hasClass(className: string): boolean {
+    return this.GS_TARGET_COMPONENT?.classList.contains(className) ?? false;
+  }
+
+  getClasses(): DOMTokenList|undefined {
+    return this.GS_TARGET_COMPONENT?.classList;
+  }
+
+  getComponent(): Element|HTMLElement|null {
+    return this.GS_TARGET_COMPONENT;
+  }
+
+  getReference(): MSComponent {
+    return this.GS_REFERENCE_COMPONENT;
+  }
+
+  getCustomProperty(query: string): string {
+    const prop: string = this.GS_CUSTOM_PROPERTIES[this.GS_CUSTOM_PROPERTIES.indexOf(query)];
+    return accessProperty(`${this.GS_COMPONENT_NAME}-${prop}`);
+  }
+
+  getCustomProperties(): string[] {
+    return this.GS_CUSTOM_PROPERTIES;
+  }
+
+  getId(): string|undefined {
+    return this.GS_TARGET_COMPONENT?.id;
+  }
+
+}

package/pintig/component/component-properties.ts

@@ -0,0 +1,25 @@
+/*
+ *  Copyright (c) 2024 MatteuSan
+ *
+ *  Permission is hereby granted, free of charge, to any person obtaining a copy
+ *  of this software and associated documentation files (the "Software"), to deal
+ *  in the Software without restriction, including without limitation the rights
+ *  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ *  copies of the Software, and to permit persons to whom the Software is
+ *  furnished to do so, subject to the following conditions:
+ *
+ *  The above copyright notice and this permission notice shall be included in all
+ *  copies or substantial portions of the Software.
+ *
+ *  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ *  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ *  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ *  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ *  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ *  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ *  SOFTWARE.
+ */
+
+export function accessProperty(customProperty: string): string {
+  return `--ms-${customProperty}`;
+}

package/pintig/component/index.ts

@@ -0,0 +1,29 @@
+/*
+ *  Copyright (c) 2024 MatteuSan
+ *
+ *  Permission is hereby granted, free of charge, to any person obtaining a copy
+ *  of this software and associated documentation files (the "Software"), to deal
+ *  in the Software without restriction, including without limitation the rights
+ *  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ *  copies of the Software, and to permit persons to whom the Software is
+ *  furnished to do so, subject to the following conditions:
+ *
+ *  The above copyright notice and this permission notice shall be included in all
+ *  copies or substantial portions of the Software.
+ *
+ *  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ *  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ *  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ *  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ *  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ *  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ *  SOFTWARE.
+ */
+
+import { MSComponentBase } from './component-base';
+import { accessProperty } from './component-properties';
+
+export {
+  MSComponentBase,
+  accessProperty
+};

package/pintig/component/types/ms-component.d.ts

@@ -0,0 +1,24 @@
+/*
+ *  Copyright (c) 2024 MatteuSan
+ *
+ *  Permission is hereby granted, free of charge, to any person obtaining a copy
+ *  of this software and associated documentation files (the "Software"), to deal
+ *  in the Software without restriction, including without limitation the rights
+ *  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ *  copies of the Software, and to permit persons to whom the Software is
+ *  furnished to do so, subject to the following conditions:
+ *
+ *  The above copyright notice and this permission notice shall be included in all
+ *  copies or substantial portions of the Software.
+ *
+ *  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ *  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ *  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ *  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ *  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ *  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ *  SOFTWARE.
+ */
+
+type Component = 'button' | 'card' | 'dialog' | 'overview' | 'form-field' | 'select-field' | 'tag' | 'button-group' | 'profile' | 'title-bar';
+export type MSComponent = `ms-${Component}`;

package/pintig/index.ts

@@ -0,0 +1,29 @@
+/*
+ *  Copyright (c) 2024 MatteuSan
+ *
+ *  Permission is hereby granted, free of charge, to any person obtaining a copy
+ *  of this software and associated documentation files (the "Software"), to deal
+ *  in the Software without restriction, including without limitation the rights
+ *  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ *  copies of the Software, and to permit persons to whom the Software is
+ *  furnished to do so, subject to the following conditions:
+ *
+ *  The above copyright notice and this permission notice shall be included in all
+ *  copies or substantial portions of the Software.
+ *
+ *  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ *  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ *  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ *  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ *  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ *  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+ *  SOFTWARE.
+ */
+
+import { MSComponent } from './component/types/ms-component';
+import { MSComponentBase } from './component';
+
+export {
+  MSComponent,
+  MSComponentBase
+}

package/pintig/package.json

@@ -0,0 +1,15 @@
+{
+  "name": "@matteusan/pintig",
+  "version": "1.5.1",
+  "description": "The core library for the Himig Design System. Portable to any design system.",
+  "main": "_index.scss",
+  "repository": "https://github.com/MatteuSan/himig",
+  "author": "Matteu <matteugt@gmail.com>",
+  "license": "MIT",
+  "publishConfig": {
+    "access": "public"
+  },
+  "dependencies": {
+    "@matteusan/sentro": "0.1.25"
+  }
+}

package/pintig/sprite/_index.scss

@@ -0,0 +1,23 @@
+//---------------------------------------------------
+//  Copyright (c) 2024 MatteuSan
+//
+//  Permission is hereby granted, free of charge, to any person obtaining a copy
+//  of this software and associated documentation files (the "Software"), to deal
+//  in the Software without restriction, including without limitation the rights
+//  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+//  copies of the Software, and to permit persons to whom the Software is
+//  furnished to do so, subject to the following conditions:
+//
+//  The above copyright notice and this permission notice shall be included in all
+//  copies or substantial portions of the Software.
+//
+//  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+//  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+//  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+//  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+//  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+//  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+//  SOFTWARE.
+//---------------------------------------------------
+
+@forward 'sprite-mixins';

package/pintig/sprite/_sprite-mixins.scss

@@ -0,0 +1,29 @@
+//---------------------------------------------------
+//  Copyright (c) 2024 MatteuSan
+//
+//  Permission is hereby granted, free of charge, to any person obtaining a copy
+//  of this software and associated documentation files (the "Software"), to deal
+//  in the Software without restriction, including without limitation the rights
+//  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+//  copies of the Software, and to permit persons to whom the Software is
+//  furnished to do so, subject to the following conditions:
+//
+//  The above copyright notice and this permission notice shall be included in all
+//  copies or substantial portions of the Software.
+//
+//  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+//  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+//  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+//  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+//  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+//  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+//  SOFTWARE.
+//---------------------------------------------------
+
+@use '../theme';
+
+@mixin styles() {
+  width: theme.key-create('sprite-width', var(--ms-sprite-size));
+  height: theme.key-create('sprite-height', var(--ms-sprite-size));
+  user-select: none;
+}

package/pintig/struct/_index.scss

@@ -0,0 +1,24 @@
+//---------------------------------------------------
+//  Copyright (c) 2024 MatteuSan
+//
+//  Permission is hereby granted, free of charge, to any person obtaining a copy
+//  of this software and associated documentation files (the "Software"), to deal
+//  in the Software without restriction, including without limitation the rights
+//  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+//  copies of the Software, and to permit persons to whom the Software is
+//  furnished to do so, subject to the following conditions:
+//
+//  The above copyright notice and this permission notice shall be included in all
+//  copies or substantial portions of the Software.
+//
+//  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+//  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+//  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+//  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+//  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+//  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+//  SOFTWARE.
+//---------------------------------------------------
+
+@forward 'struct-utils';
+@forward 'struct-setters';

package/pintig/struct/_struct-setters.scss

@@ -0,0 +1,98 @@
+//---------------------------------------------------
+//  Copyright (c) 2024 MatteuSan
+//
+//  Permission is hereby granted, free of charge, to any person obtaining a copy
+//  of this software and associated documentation files (the "Software"), to deal
+//  in the Software without restriction, including without limitation the rights
+//  to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+//  copies of the Software, and to permit persons to whom the Software is
+//  furnished to do so, subject to the following conditions:
+//
+//  The above copyright notice and this permission notice shall be included in all
+//  copies or substantial portions of the Software.
+//
+//  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+//  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+//  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+//  AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+//  LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+//  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+//  SOFTWARE.
+//---------------------------------------------------
+
+@use '../theme';
+@use '../tools';
+@use 'sass:map';
+@use 'sass:list';
+@use 'struct-utils' as util;
+@use 'struct-validators' as validator;
+
+/// Base mixin for apply() and bind()
+/// @access private
+@mixin _base($component, $theme, $settings: ()) {
+  $_init-settings: ('intent': create);
+  $_settings: map.merge($_init-settings, $settings);
+
+  /// @type string
+  $intent: map.get($_settings, 'intent');
+
+  $width: map.get($theme, 'width');
+  $height: map.get($theme, 'height');
+  $radius: theme.theme-get($theme, 'radius');
+  $padding: theme.theme-get($theme, 'padding');
+  $margin: theme.theme-get($theme, 'margin');
+  $gap: theme.theme-get($theme, 'gap');
+  $shadow: theme.theme-get($theme, 'shadow');
+  $border-style: theme.theme-get($theme, 'border-style');
+  $border-width: theme.theme-get($theme, 'border-width');
+
+  @if tools.is-type($theme, 'map', $custom-error: '$theme is expecting a map. Map was not given.') {
+    @include validator.validate-struct-props(map.keys($theme)) {
+      @if $width {
+        @include util.width($component, $width, $intent);
+      }
+      @if $height {
+        @include util.height($component, $height, $intent);
+      }
+      @if $radius {
+        @include util.radius($component, $radius, $intent);
+      }
+      @if $padding {
+        @include util.padding($component, $padding, $intent);
+      }
+      @if $margin {
+        @include util.margin($component, $margin, $intent);
+      }
+      @if $gap {
+        @include util.gap($component, $gap, $intent);
+      }
+      @if $border-width {
+        @include util.border-width($component, $border-width, $intent);
+      }
+      @if $border-style {
+        @include util.border-style($component, $border-style, $intent);
+      }
+      @if $shadow {
+        @include util.shadow($component, $shadow, $intent);
+      }
+    }
+  }
+}
+
+/// Mixin that applies struct styles to a component.
+/// @param {string} $component
+/// @param {map<string, string>} $theme
+/// @return {void} void.
+@mixin apply($component, $theme) {
+  @include _base($component, $theme);
+}
+
+/// Mixin that binds struct styles to a component with existing keys.
+/// @param {string} $component
+/// @param {map<string, string>} $theme
+/// @return {void} void.
+@mixin bind($component, $theme) {
+  @include _base($component, $theme, (
+    'intent': bind
+  ));
+}