@genexus/mercury 0.1.0 → 0.1.1

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@genexus/mercury",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "description": "Mercury is the design system designed for GeneXus IDE Web and GeneXus Next",
-  "main": "src/mercury.scss",
+  "main": "dist/mercury.scss",
   "files": [
     "dist/"
   ],

package/src/mercury.scss

@@ -1,294 +0,0 @@
-// Resets
-@import "../../common/resets";
-
-// Tokens > Primitive
-@import "./tokens/primitive/border";
-@import "./tokens/primitive/color";
-@import "./tokens/primitive/elevation";
-@import "./tokens/primitive/font";
-@import "./tokens/primitive/spacing";
-@import "./tokens/primitive/timing";
-
-// Tokens > Semantic
-@import "./tokens/semantic/tokens";
-
-// Other
-@import "./mixins";
-@import "./base/icons/sass/icons-selectors.scss";
-
-// Base
-@import "./base/button/styles";
-
-// Components
-@import "./components/checkbox/styles";
-@import "./components/shortcuts/styles";
-@import "./components/tree-view/styles";
-
-@mixin mercury(
-  // Resets
-  $resets: true,
-  $box-sizing-reset: true,
-  $button-reset: true,
-  $input-reset: true,
-  $other-reset: true,
-  $typography-reset: true,
-
-  // Theme
-  $light-theme: true,
-  $dark-theme: true,
-  $prefers-color-scheme-light: false,
-  $prefers-color-scheme-dark: false,
-
-  // Tokens
-  $tokens: true,
-  $border: true,
-  $color: true,
-  $elevation: true,
-  $font: true,
-  $spacing: true,
-  $timing: true,
-
-  // Icons
-  $icons: true,
-  $icons-path: "./assets/icons",
-
-  // Font face
-  $font-face: true,
-
-  // Base
-  $base-classes: true,
-  $button-classes: true,
-  $buttons-classes-with-icons: true,
-
-  // Components
-  $components: true,
-  $checkbox: true,
-  $tree-view: true
-) {
-  // - - - - - - - - - - - - - - - - - - - -
-  //                 Resets
-  // - - - - - - - - - - - - - - - - - - - -
-  @if $resets {
-    // box-sizing
-    @if $box-sizing-reset {
-      @include box-sizing();
-    }
-
-    // <button> and <a> reset
-    @if $button-reset {
-      @include button-reset();
-    }
-
-    @if $input-reset {
-      @include input-reset();
-    }
-
-    // <hr> reset
-    @if $other-reset {
-      @include other-reset();
-    }
-
-    // Typography reset
-    @if $typography-reset {
-      @include typography-reset();
-    }
-  }
-
-  // - - - - - - - - - - - - - - - - - - - -
-  //                  Body
-  // - - - - - - - - - - - - - - - - - - - -
-  body {
-    @if $tokens and $color {
-      background-color: var(--mer-body__bg-color);
-      color: var(--mer-body__color);
-    }
-    @if $tokens and $font {
-      font-size: var(--mer-body__font-size);
-      line-height: var(--mer-body__line-height);
-    }
-    @if $font-face {
-      font-family: var(--mer-font-family--primary);
-    }
-    margin: 0;
-  }
-
-  // - - - - - - - - - - - - - - - - - - - -
-  //                 Base
-  // - - - - - - - - - - - - - - - - - - - -
-  @if $base-classes {
-    @if $button-classes {
-      @include button($buttons-classes-with-icons);
-    }
-  }
-
-  // - - - - - - - - - - - - - - - - - - - -
-  //                 Icons
-  // - - - - - - - - - - - - - - - - - - - -
-  @if $icons and $icons-path {
-    @include icons-lists($icons-path: $icons-path);
-  }
-
-  // - - - - - - - - - - - - - - - - - - - -
-  //               Typography
-  // - - - - - - - - - - - - - - - - - - - -
-  @if $font-face {
-    //light
-    @font-face {
-      font-family: "Inter";
-      font-style: normal;
-      font-weight: 300;
-      src: url("../src/assets/fonts/Inter_Light.woff2") format("woff2");
-      font-display: swap;
-    }
-
-    //regular
-    @font-face {
-      font-family: "Inter";
-      font-style: normal;
-      font-weight: 400;
-      src: url("../src/assets/fonts/Inter_Regular.woff2") format("woff2");
-      font-display: swap;
-    }
-
-    //semi-bold
-    @font-face {
-      font-family: "Inter";
-      font-style: normal;
-      font-weight: 600;
-      src: url("../src/assets/fonts/Inter_SemiBold.woff2") format("woff2");
-      font-display: swap;
-    }
-
-    //bold
-    @font-face {
-      font-family: "Inter";
-      font-style: normal;
-      font-weight: 700;
-      src: url("../src/assets/fonts/Inter_Bold.woff2") format("woff2");
-      font-display: swap;
-    }
-
-    //extra-bold
-    @font-face {
-      font-family: "Inter";
-      font-style: normal;
-      font-weight: 800;
-      src: url("../src/assets/fonts/Inter_ExtraBold.woff2") format("woff2");
-      font-display: swap;
-    }
-  }
-
-  // - - - - - - - - - - - - - - - - - - - -
-  //        Primitive Color Tokens
-  // - - - - - - - - - - - - - - - - - - - -
-  // Light
-  @if $color and $light-theme and $tokens {
-    :root {
-      @include foundation-colors--light();
-    }
-  }
-  @if $color and $tokens and $prefers-color-scheme-light {
-    @media (prefers-color-scheme: light) {
-      :root {
-        @include foundation-colors--light();
-      }
-    }
-  }
-  // Dark
-  @if $color and $dark-theme and $tokens {
-    :root.dark {
-      @include foundation-colors--dark();
-    }
-  }
-  @if $color and $tokens and $prefers-color-scheme-dark {
-    @media (prefers-color-scheme: dark) {
-      :root {
-        @include foundation-colors--dark();
-      }
-    }
-  }
-
-  // - - - - - - - - - - - - - - - - - - - -
-  //              Other Tokens
-  // - - - - - - - - - - - - - - - - - - - -
-  @if $tokens and
-    (
-      $border or
-        $color or
-        ($elevation and $light-theme) or
-        ($elevation and $prefers-color-scheme-light) or
-        ($elevation and $dark-theme) or
-        ($elevation and $prefers-color-scheme-dark) or
-        $font or
-        $spacing or
-        $timing
-    )
-  {
-    :root {
-      // border
-      @if $border {
-        @include border();
-      }
-
-      // color
-      @if $color {
-        @include semantic-accent();
-        @include semantic-border();
-        @include semantic-heading();
-        @include semantic-icon();
-        @include semantic-item();
-        @include semantic-other();
-        @include semantic-text();
-      }
-
-      // elevation (light)
-      @if $elevation and $light-theme {
-        @include elevation--light();
-      }
-      @if $elevation and $prefers-color-scheme-light {
-        @media (prefers-color-scheme: light) {
-          @include elevation--light();
-        }
-      }
-
-      // elevation (dark)
-      @if $elevation and $dark-theme {
-        &.dark {
-          @include elevation--dark();
-        }
-      }
-      @if $elevation and $prefers-color-scheme-dark {
-        @media (prefers-color-scheme: dark) {
-          @include elevation--dark();
-        }
-      }
-
-      // font
-      @if $font {
-        @include font();
-      }
-
-      // spacing
-      @if $spacing {
-        @include spacing();
-      }
-
-      // timing
-      @if $timing {
-        @include timing();
-      }
-    }
-  }
-
-  // - - - - - - - - - - - - - - - - - - - -
-  //               Components
-  // - - - - - - - - - - - - - - - - - - - -
-  @if $components {
-    @if $checkbox {
-      @include checkbox();
-    }
-    @if $tree-view {
-      @include tree-view();
-    }
-  }
-}