@elliemae/ds-basic 3.51.0-next.0 → 3.51.0-next.11

package/dist/styles/components/packages/ds-basic/static-build/styles/base/depth.scss

@@ -0,0 +1,71 @@
+$shadows-data: (
+  500: (
+    0 27px 24px 0 rgba(0, 0, 0, 0.24),
+    0 40px 77px 0 rgba(0, 0, 0, 0.19),
+  ),
+  400: (
+    0 16px 28px 0 rgba(0, 0, 0, 0.24),
+    0 25px 55px 0 rgba(0, 0, 0, 0.19),
+  ),
+  300: (
+    0 12px 15px 0 rgba(0, 0, 0, 0.24),
+    0 17px 50px 0 rgba(0, 0, 0, 0.19),
+  ),
+  200: (
+    0 6px 20px 0 rgba(0, 0, 0, 0.24),
+    0 8px 17px 0 rgba(0, 0, 0, 0.19),
+  ),
+  100: (
+    0 1px 5px 0 rgba(0, 0, 0, 0.13),
+    0 2px 4px 0 rgba(0, 0, 0, 0.2),
+  ),
+  000: 0 0 0 0 transparent,
+) !default;
+
+$shadows-data-alt: (
+  500: (
+    0 0 0 1px rgba(16, 22, 26, 0.1),
+    0 27px 24px rgba(16, 22, 26, 0.2),
+    0 40px 77px rgba(16, 22, 26, 0.2),
+  ),
+  400: (
+    0 0 0 1px rgba(16, 22, 26, 0.1),
+    0 16px 28px rgba(16, 22, 26, 0.2),
+    0 25px 55 rgba(16, 22, 26, 0.2),
+  ),
+  300: (
+    0 0 0 1px rgba(16, 22, 26, 0.1),
+    0 12px 15px rgba(16, 22, 26, 0.2),
+    0 17px 50 rgba(16, 22, 26, 0.2),
+  ),
+  200: (
+    0 0 0 1px rgba(16, 22, 26, 0.1),
+    0 2px 4px rgba(16, 22, 26, 0.2),
+    0 8px 24px rgba(16, 22, 26, 0.2),
+  ),
+  100: (
+    0 0 0 1px rgba(16, 22, 26, 0.1),
+    0 0px 0px rgba(16, 22, 26, 0.2),
+    0 0px 0px rgba(16, 22, 26, 0.2),
+  ),
+  000: 0 0 0 0 transparent,
+) !default;
+
+$drop-shadow-data: (
+  500: (
+    0 27px 24px rgba(0, 0, 0, 0.3),
+  ),
+  400: (
+    0 16px 28px rgba(0, 0, 0, 0.3),
+  ),
+  300: (
+    0 12px 15px rgba(0, 0, 0, 0.3),
+  ),
+  200: (
+    0 6px 20px rgba(0, 0, 0, 0.3),
+  ),
+  100: (
+    0 0px 2px rgba(0, 0, 0, 0.3),
+  ),
+  000: 0 0 0 0 transparent,
+) !default;

package/dist/styles/components/packages/ds-basic/static-build/styles/base/fonts/font-base.scss

@@ -0,0 +1,100 @@
+// Note: The URLs here don't match with filesystem due to a defect in node-sass and webpack sass loader.
+
+// Regular font style
+@font-face {
+  font-family: 'proxima-nova';
+  src: url('~@elliemae/ds-basic/styles/base/fonts/ProximaNovaThin.otf') format('opentype');
+  font-weight: 100;
+  font-style: normal;
+}
+@font-face {
+  font-family: 'proxima-nova';
+  src: url('~@elliemae/ds-basic/styles/base/fonts/ProximaLight.otf') format('opentype');
+  font-weight: 300;
+  font-style: normal;
+}
+@font-face {
+  font-family: 'proxima-nova';
+  src: url('~@elliemae/ds-basic/styles/base/fonts/ProximaNovaRegular.otf') format('opentype');
+  font-weight: normal;
+  font-style: normal;
+}
+@font-face {
+  font-family: 'proxima-nova';
+  src: url('~@elliemae/ds-basic/styles/base/fonts/ProximaMedium.otf') format('opentype');
+  font-weight: 500;
+  font-style: normal;
+}
+@font-face {
+  font-family: 'proxima-nova';
+  src: url('~@elliemae/ds-basic/styles/base/fonts/ProximaNovaSemibold.otf') format('opentype');
+  font-weight: 600;
+  font-style: normal;
+}
+@font-face {
+  font-family: 'proxima-nova';
+  src: url('~@elliemae/ds-basic/styles/base/fonts/ProximaNovaBold.otf') format('opentype');
+  font-weight: bold;
+  font-style: normal;
+}
+@font-face {
+  font-family: 'proxima-nova';
+  src: url('~@elliemae/ds-basic/styles/base/fonts/ProximaNovaExtrabold.otf') format('opentype');
+  font-weight: 800;
+  font-style: normal;
+}
+@font-face {
+  font-family: 'proxima-nova';
+  src: url('~@elliemae/ds-basic/styles/base/fonts/ProximaNovaBlack.otf') format('opentype');
+  font-weight: 900;
+  font-style: normal;
+}
+// Italic font style
+@font-face {
+  font-family: 'proxima-nova';
+  src: url('~@elliemae/ds-basic/styles/base/fonts/ProximaNovaThinItalic.otf') format('opentype');
+  font-weight: 100;
+  font-style: italic;
+}
+@font-face {
+  font-family: 'proxima-nova';
+  src: url('~@elliemae/ds-basic/styles/base/fonts/ProximaLightItalic.otf') format('opentype');
+  font-weight: 300;
+  font-style: italic;
+}
+@font-face {
+  font-family: 'proxima-nova';
+  src: url('~@elliemae/ds-basic/styles/base/fonts/ProximaNovaRegularItalic.otf') format('opentype');
+  font-weight: normal;
+  font-style: italic;
+}
+@font-face {
+  font-family: 'proxima-nova';
+  src: url('~@elliemae/ds-basic/styles/base/fonts/ProximaMediumItalic.otf') format('opentype');
+  font-weight: 500;
+  font-style: italic;
+}
+@font-face {
+  font-family: 'proxima-nova';
+  src: url('~@elliemae/ds-basic/styles/base/fonts/ProximaNovaSemiboldItalic.otf') format('opentype');
+  font-weight: 600;
+  font-style: italic;
+}
+@font-face {
+  font-family: 'proxima-nova';
+  src: url('~@elliemae/ds-basic/styles/base/fonts/ProximaNovaBoldItalic.otf') format('opentype');
+  font-weight: bold;
+  font-style: italic;
+}
+@font-face {
+  font-family: 'proxima-nova';
+  src: url('~@elliemae/ds-basic/styles/base/fonts/ProximaNovaExtraboldItalic.otf') format('opentype');
+  font-weight: 800;
+  font-style: italic;
+}
+@font-face {
+  font-family: 'proxima-nova';
+  src: url('~@elliemae/ds-basic/styles/base/fonts/ProximaNovaBlackItalic.otf') format('opentype');
+  font-weight: 900;
+  font-style: italic;
+}

package/dist/styles/components/packages/ds-basic/static-build/styles/base/grid/_grid-var-styles.scss

@@ -0,0 +1,55 @@
+// Foundation for Sites by ZURB
+// foundation.zurb.com
+// Licensed under MIT Open Source
+
+// sass-lint:disable force-attribute-nesting, force-pseudo-nesting, no-color-literals, no-qualifying-elements
+
+////
+/// @group global
+////
+
+@import 'util/util';
+
+/// Global width of your site. Used by the grid to determine row width.
+/// @type Number
+$global-width: rem-calc(1200) !default;
+
+/// Global value used for positioning on components.
+/// @type Number
+// $global-position: 1rem !default;
+
+/// Sets the text direction of the CSS. Can be either `ltr` or `rtl`.
+/// @type Keyword
+$global-text-direction: ltr !default;
+
+/// Enables flexbox for components that support it.
+/// @type Boolean
+$global-flexbox: true !default;
+
+/// Enabled responsive breakpoints for prototypes if applicable
+/// @type Boolean
+$global-prototype-breakpoints: false !default;
+
+// Internal variables used for text direction
+$global-left: if($global-text-direction == rtl, right, left);
+$global-right: if($global-text-direction == rtl, left, right);
+
+// Internal variable that contains the flex justifying options
+$-zf-flex-justify: -zf-flex-justify($global-text-direction);
+
+/// Global tolerance for color pick contrast.
+/// @type Number
+$global-color-pick-contrast-tolerance: 0 !default;
+
+@mixin foundation-global-styles {
+  @include -zf-normalize;
+
+  // Internal classes to show/hide elements in JavaScript
+  .is-visible {
+    display: block !important;
+  }
+
+  .is-hidden {
+    display: none !important;
+  }
+}

package/dist/styles/components/packages/ds-basic/static-build/styles/base/grid/functions/_contain.scss

@@ -0,0 +1,31 @@
+///
+/// Returns whether `$list` contains `$value`.
+///
+/// @ignore Documentation: http://at-import.github.io/SassyLists/documentation/#function-sl-contain
+///
+/// @param {List}    $list  - list to check
+/// @param {*}       $value - value to look for
+///
+/// @example
+/// sl-contain(a b c, a)
+/// // true
+///
+/// @example
+/// sl-contain(a b c, z)
+/// // false
+///
+/// @return {Bool}
+///
+
+@function sl-contain($list, $value) {
+  @return not not index($list, $value);
+}
+
+///
+/// @requires sl-contain
+/// @alias sl-contain
+///
+
+@function sl-include($list, $value) {
+  @return sl-contain($list, $value);
+}

package/dist/styles/components/packages/ds-basic/static-build/styles/base/grid/functions/_purge.scss

@@ -0,0 +1,38 @@
+/// Removes all false and null values from `$list`.
+///
+/// @ignore Documentation: http://at-import.github.io/SassyLists/documentation/#function-sl-purge
+///
+/// @requires sl-is-true
+/// @requires sl-to-list
+///
+/// @param {List} $list - list to purge
+///
+/// @example
+/// sl-purge(null a false b)
+/// // a b
+///
+/// @return {List}
+///
+
+@function sl-purge($list) {
+  $_: sl-missing-dependencies('sl-is-true', 'sl-to-list');
+
+  $result: ();
+
+  @each $item in $list {
+    @if sl-is-true($item) {
+      $result: append($result, $item, list-separator($list));
+    }
+  }
+
+  @return sl-to-list($result);
+}
+
+///
+/// @requires sl-purge
+/// @alias sl-purge
+///
+
+@function sl-clean($list) {
+  @return sl-purge($list);
+}

package/dist/styles/components/packages/ds-basic/static-build/styles/base/grid/functions/_remove.scss

@@ -0,0 +1,31 @@
+///
+/// Removes value(s) `$value` from `$list`.
+///
+/// @ignore Documentation: http://at-import.github.io/SassyLists/documentation/#function-sl-remove
+///
+/// @requires sl-replace
+///
+/// @param {List}    $list      - list to update
+/// @param {*}       $value     - value to remove
+///
+/// @example
+/// sl-remove(a b c, a)
+/// // b c
+///
+/// @return {List}
+///
+
+@function sl-remove($list, $value) {
+  $_: sl-missing-dependencies('sl-replace');
+
+  @return sl-replace($list, $value, null);
+}
+
+///
+/// @requires sl-remove
+/// @alias sl-remove
+///
+
+@function sl-without($list, $value) {
+  @return sl-remove($list, $value);
+}

package/dist/styles/components/packages/ds-basic/static-build/styles/base/grid/functions/_replace.scss

@@ -0,0 +1,38 @@
+/// Replaces `$old` by `$new` in `$list`.
+///
+/// @ignore Documentation: http://at-import.github.io/SassyLists/documentation/#function-sl-replace
+
+/// @requires sl-is-true
+/// @requires sl-purge
+/// @requires sl-to-list
+
+/// @param {List}    $list  - list to update
+/// @param {*}       $old   - value to replace
+/// @param {*}       $value - new value for $old
+
+/// @example
+/// sl-replace(a b c, b, z)
+/// // a z c
+/// @example
+/// sl-replace(a b c, y, z)
+/// // a b c
+
+/// @return {List}
+
+@function sl-replace($list, $old, $value) {
+  $running: true;
+
+  @while $running {
+    $index: index($list, $old);
+
+    @if not $index {
+      $running: false;
+    } @else {
+      $list: set-nth($list, $index, $value);
+    }
+  }
+
+  $list: if(sl-is-true($value), $list, sl-purge($list));
+
+  @return sl-to-list($list);
+}

package/dist/styles/components/packages/ds-basic/static-build/styles/base/grid/functions/_to-list.scss

@@ -0,0 +1,27 @@
+///
+/// Casts `$value` into a list.
+///
+/// @ignore Documentation: http://at-import.github.io/SassyLists/documentation/#function-sl-to-list
+///
+/// @param {*} $value - value to cast to list
+/// @param {String} $separator [space] - separator to use
+///
+/// @example
+/// sl-to-list(a b c, comma)
+/// // a, b, c
+///
+/// @return {List}
+///
+
+@function sl-to-list($value, $separator: list-separator($value)) {
+  @return join((), $value, $separator);
+}
+
+///
+/// @requires sl-to-list
+/// @alias sl-to-list
+///
+
+@function sl-listify($value) {
+  @return sl-to-list($value);
+}

package/dist/styles/components/packages/ds-basic/static-build/styles/base/grid/grid.scss

@@ -0,0 +1,13 @@
+@import './helpers/missing-dependencies';
+@import './helpers/true';
+@import './functions/contain';
+@import './functions/purge';
+@import './functions/remove';
+@import './functions/replace';
+@import './functions/to-list';
+
+// variables and styles
+@import '_grid-var-styles';
+
+// Components
+@import 'xy-grid/xy-grid';

package/dist/styles/components/packages/ds-basic/static-build/styles/base/grid/helpers/_missing-dependencies.scss

@@ -0,0 +1,25 @@
+///
+/// Checks whether `$functions` exist in global scope.
+///
+/// @access private
+///
+/// @param {ArgList} $functions - list of functions to check for
+///
+/// @return {Bool} Whether or not there are missing dependencies
+///
+
+@function sl-missing-dependencies($functions...) {
+  $missing-dependencies: ();
+
+  @each $function in $functions {
+    @if not function-exists($function) {
+      $missing-dependencies: append($missing-dependencies, $function, comma);
+    }
+  }
+
+  @if length($missing-dependencies) > 0 {
+    @error 'Unmet dependencies! The following functions are required: #{$missing-dependencies}.';
+  }
+
+  @return length($missing-dependencies) > 0;
+}

package/dist/styles/components/packages/ds-basic/static-build/styles/base/grid/helpers/_true.scss

@@ -0,0 +1,13 @@
+///
+/// Returns truthiness of `$value`.
+///
+/// @access private
+///
+/// @param {*} $value - value to check
+///
+/// @return {Bool}
+///
+
+@function sl-is-true($value) {
+  @return if($value == null, false, $value and $value != null and $value != '' and $value != ());
+}

package/dist/styles/components/packages/ds-basic/static-build/styles/base/grid/util/_color.scss

@@ -0,0 +1,5 @@
+// Foundation for Sites by ZURB
+// foundation.zurb.com
+// Licensed under MIT Open Source
+
+@import 'math';

package/dist/styles/components/packages/ds-basic/static-build/styles/base/grid/util/_direction.scss

@@ -0,0 +1,28 @@
+// Foundation for Sites by ZURB
+// foundation.zurb.com
+// Licensed under MIT Open Source
+
+////
+/// @group functions
+////
+
+/// Returns the opposite direction of $dir
+///
+/// @param {Keyword} $dir - Used direction between "top", "right", "bottom" and "left".
+/// @return {Keyword} Opposite direction of $dir
+@function direction-opposite($dir) {
+  $dirs: (top, right, bottom, left);
+  $place: index($dirs, $dir);
+
+  @if $place == null {
+    @error 'direction-opposite: Invalid $dir parameter, expected a value from "#{$dirs}", found "#{$dir}".';
+    @return null;
+  }
+
+  // Calcul the opposite place in a circle, with a starting index of 1
+  $length: length($dirs);
+  $demi: $length / 2;
+  $opposite-place: (($place + $demi - 1) % $length) + 1;
+
+  @return nth($dirs, $opposite-place);
+}

package/dist/styles/components/packages/ds-basic/static-build/styles/base/grid/util/_flex.scss

@@ -0,0 +1,86 @@
+@function -zf-flex-justify($text-direction) {
+  $-zf-flex-justify: (
+    'left': if($text-direction == rtl, flex-end, flex-start),
+    'right': if($text-direction == rtl, flex-start, flex-end),
+    'center': center,
+    'justify': space-between,
+    'spaced': space-around,
+  );
+
+  @return $-zf-flex-justify;
+}
+
+$-zf-flex-align: (
+  'top': flex-start,
+  'bottom': flex-end,
+  'middle': center,
+  'stretch': stretch,
+);
+
+$-zf-flex-direction: (
+  'row': row,
+  'row-reverse': row-reverse,
+  'column': column,
+  'column-reverse': column-reverse,
+);
+
+/// Enables flexbox by adding `display: flex` to the element.
+@mixin flex {
+  display: flex;
+}
+
+/// Horizontally or vertically aligns the items within a flex container.
+///
+/// @param {Keyword} $x [null] - Horizontal alignment to use. Can be `left`, `right`, `center`, `justify`, or `spaced`. Or, set it to `null` (the default) to not set horizontal alignment.
+/// @param {Keyword} $y [null] - Vertical alignment to use. Can be `top`, `bottom`, `middle`, or `stretch`. Or, set it to `null` (the default) to not set vertical alignment.
+@mixin flex-align($x: null, $y: null) {
+  @if $x {
+    @if map-has-key($-zf-flex-justify, $x) {
+      $x: map-get($-zf-flex-justify, $x);
+    } @else {
+      @warn 'flex-grid-row-align(): #{$x} is not a valid value for horizontal alignment. Use left, right, center, justify, or spaced.';
+    }
+  }
+
+  @if $y {
+    @if map-has-key($-zf-flex-align, $y) {
+      $y: map-get($-zf-flex-align, $y);
+    } @else {
+      @warn 'flex-grid-row-align(): #{$y} is not a valid value for vertical alignment. Use top, bottom, middle, or stretch.';
+    }
+  }
+
+  justify-content: $x;
+  align-items: $y;
+}
+
+/// Vertically align a single column within a flex row. Apply this mixin to a flex column.
+///
+/// @param {Keyword} $y [null] - Vertical alignment to use. Can be `top`, `bottom`, `middle`, or `stretch`. Or, set it to `null` (the default) to not set vertical alignment.
+@mixin flex-align-self($y: null) {
+  @if $y {
+    @if map-has-key($-zf-flex-align, $y) {
+      $y: map-get($-zf-flex-align, $y);
+    } @else {
+      @warn 'flex-grid-column-align(): #{$y} is not a valid value for alignment. Use top, bottom, middle, or stretch.';
+    }
+  }
+
+  align-self: $y;
+}
+
+/// Changes the source order of a flex child. Children with lower numbers appear first in the layout.
+/// @param {Number} $order [0] - Order number to apply.
+@mixin flex-order($order: 0) {
+  order: $order;
+}
+
+/// Change flex-direction
+/// @param {Keyword} $direction [row] - Flex direction to use. Can be
+///   - row (default): same as text direction
+///   - row-reverse: opposite to text direction
+///   - column: same as row but top to bottom
+///   - column-reverse: same as row-reverse top to bottom
+@mixin flex-direction($direction: row) {
+  flex-direction: $direction;
+}

package/dist/styles/components/packages/ds-basic/static-build/styles/base/grid/util/_math.scss

@@ -0,0 +1,70 @@
+// Foundation for Sites by ZURB
+// foundation.zurb.com
+// Licensed under MIT Open Source
+
+////
+/// @group functions
+////
+
+/// Finds the greatest common divisor of two integers.
+///
+/// @param {Number} $a - First number to compare.
+/// @param {Number} $b - Second number to compare.
+///
+/// @returns {Number} The greatest common divisor.
+@function gcd($a, $b) {
+  // From: http://rosettacode.org/wiki/Greatest_common_divisor#JavaScript
+  @if ($b != 0) {
+    @return gcd($b, $a % $b);
+  } @else {
+    @return abs($a);
+  }
+}
+
+/// Handles decimal exponents by trying to convert them into a fraction and then use a nth-root-algorithm for parts of the calculation
+///
+/// @param {Number} $base - The base number.
+/// @param {Number} $exponent - The exponent.
+///
+/// @returns {Number} The product of the exponentiation.
+@function pow($base, $exponent, $prec: 16) {
+  @if (floor($exponent) != $exponent) {
+    $prec2: pow(10, $prec);
+    $exponent: round($exponent * $prec2);
+    $denominator: gcd($exponent, $prec2);
+    @return nth-root(pow($base, $exponent / $denominator), $prec2 / $denominator, $prec);
+  }
+
+  $value: $base;
+  @if $exponent > 1 {
+    @for $i from 2 through $exponent {
+      $value: $value * $base;
+    }
+  } @else if $exponent < 1 {
+    @for $i from 0 through -$exponent {
+      $value: $value / $base;
+    }
+  }
+
+  @return $value;
+}
+
+@function nth-root($num, $n: 2, $prec: 12) {
+  // From: http://rosettacode.org/wiki/Nth_root#JavaScript
+  $x: 1;
+
+  @for $i from 0 through $prec {
+    $x: 1 / $n * (($n - 1) * $x + ($num / pow($x, $n - 1)));
+  }
+
+  @return $x;
+}
+
+/// Calculates the height as a percentage of the width for a given ratio.
+/// @param {List} $ratio - Ratio to use to calculate the height, formatted as `x by y`.
+/// @return {Number} A percentage value for the height relative to the width of a responsive container.
+@function ratio-to-percentage($ratio) {
+  $w: nth($ratio, 1);
+  $h: nth($ratio, 3);
+  @return $h / $w * 100%;
+}