@mlut/core 1.0.0

package/dist/sass/css/utils/visual.scss

@@ -0,0 +1,32 @@
+@use 'sass:map';
+@use '../../tools' as ml;
+
+ml.$utils-map: map.merge(
+	ml.$utils-map,
+	ml.$kSsUMCS,
+	(
+		// transform
+		ml.$cBpAllCp + 'Tf': (ml.$kUvKA, 'n'),
+		'Tfo': (ml.$kUvKA, 'r;t', 'r;b', 'l;b', 'l;t'),
+		ml.$cBpAllCp + 'Translates': (-50p, 50p),
+		ml.$cBpAllCp + '-Trx': -100p,
+		ml.$cBpAllCp + '-Try': -100p,
+		ml.$cBpAllCp + '-Rt': (-90d, 90d, 180d),
+		// filter
+		'Ft': ('', 'n'),
+		'Bcf': ('', 'n'),
+		'-Bcf': '',
+		// other
+		'Bfv': ('h', 'v'),
+		'Bxdb': ml.$kUvKA,
+		ml.$cBpAllCp + 'Bxsd': 'n',
+		'Cs': ('', 'a', 'd', 'wt', 't', 'm', 'h', 'nta'),
+		'Is': ('i', 'a'),
+		ml.$cBpAllCp + 'O': (0, 1),
+		'Ol': 0,
+		'Ols': ('d', 'dh', 'db', 's'),
+		ml.$cBpAllCp + 'Ojf': ml.$kUvKA,
+		'Ojp': ml.$kUvKA,
+		ml.$cBpAllCp + 'Vs': ml.$kUvKA,
+	)
+);

package/dist/sass/index.scss

@@ -0,0 +1,4 @@
+@charset 'utf-8';
+
+@forward 'tools';
+@forward 'css';

package/dist/sass/tools/_index.scss

@@ -0,0 +1,4 @@
+@forward 'settings';
+@forward 'functions' hide
+	str-split, str-trim, remove-nth, str-replace, str-replace-all, str-starts, ls-join, ls-find, str-hex2color, str-contains-item;
+@forward 'mixins';

package/dist/sass/tools/functions/_index.import.scss

@@ -0,0 +1,3 @@
+@forward 'base' as ml-*;
+@forward 'common' as ml-*;
+@forward 'high' as ml-*;

package/dist/sass/tools/functions/_index.scss

@@ -0,0 +1,9 @@
+// Functions
+//
+// Most of the functions are used for internal needs and has not yet been documented. But some functions from here can be useful in ordinary code.
+//
+// Styleguide: sass-tools.functions
+
+@forward 'base';
+@forward 'common';
+@forward 'high';

package/dist/sass/tools/functions/base/_error.scss

@@ -0,0 +1,9 @@
+@use '../../settings/base/general' as ml;
+
+@function error($message, $catch: ml.$is-test-env) {
+	@if $catch {
+		@return 'ERROR: #{$message}';
+	}
+
+	@error '#{$message}';
+}

package/dist/sass/tools/functions/base/_getters.scss

@@ -0,0 +1,124 @@
+@use 'sass:list';
+@use 'sass:string';
+@use 'sass:map';
+@use 'sass:meta';
+
+@use '../../settings' as ml;
+
+// Getters
+//
+// Functions-getters from settings maps and more.
+//
+/// Styleguide: sass-tools.functions.getters
+
+/// Styleguide: sass-tools.functions.base.getters
+
+@function bp($name, $error-handler: 1) {
+	@if map.has-key(ml.$bp-map, $name) or $error-handler == 0 {
+		@return map.get(ml.$bp-map, $name);
+	}
+
+	@error 'Invalid breakpoint name: `#{$name}`. `#{$name}` is not defined in $ml-breakpoints';
+}
+
+@function bp-next($bp: 0, $data-type: 'value') {
+	@if $bp == 0 or map.has-key(ml.$bp-map, $bp) {
+		$bp-keys: map.keys(ml.$bp-map);
+		$bp-index: if($bp != 0, list.index($bp-keys, $bp), 0);
+
+		@if $data-type == 'name' {
+			@return if($bp-index < list.length($bp-keys), list.nth(map.keys(ml.$bp-map), $bp-index + 1), 0);
+		} @else {
+			@return if($bp-index < list.length($bp-keys), list.nth(map.values(ml.$bp-map), $bp-index + 1), 0);
+		}
+	}
+
+	@error 'Invalid breakpoint name: `#{$bp}`. `#{$bp}` is not defined in $ml-breakpoints';
+}
+
+@function bp-next-name($bp: 0) {
+	@return bp-next($bp, 'name');
+}
+
+@function bp-prev($bp: 0, $data-type: 'value') {
+	@if $bp == 0 or map.has-key(ml.$bp-map, $bp) {
+		$bp-keys: map.keys(ml.$bp-map);
+		$bp-index: if($bp != 0, list.index($bp-keys, $bp), list.length($bp-keys) + 1);
+
+		@if $data-type == 'name' {
+			@return if($bp-index > 1, list.nth(map.keys(ml.$bp-map), $bp-index - 1), 0);
+		} @else {
+			@return if($bp-index > 1, list.nth(map.values(ml.$bp-map), $bp-index - 1), 0);
+		}
+	}
+
+	@error 'Invalid breakpoint name: `#{$bp}`. `#{$bp}` is not defined in $ml-breakpoints';
+}
+
+@function bp-prev-name($bp: 0) {
+	@return bp-prev($bp, 'name');
+}
+
+@function grid-gtr($name, $error-handler: 1) {
+	@if map.has-key(ml.$gs-gutters, $name) or $error-handler == 0 {
+		@return map.get(ml.$gs-gutters, $name);
+	}
+
+	@error 'Invalid breakpoint name: `#{$name}`. `#{$name}` is not defined in $ml-gs-gutters';
+}
+
+@function css-var($name, $error-handler: 1) {
+	@if map.has-key(ml.$general-cfg, 'css-vars', $name) or $error-handler == 0 {
+		@return map.get(ml.$general-cfg, 'css-vars', $name);
+	}
+
+	@error 'Invalid custom property name. `#{$name}` is not defined in $ml-css-vars';
+}
+
+// util-prop
+//
+// Get the CSS property, which corresponds to the utility from registry.
+// ```scss
+//@debug ml.util-prop('D'); // 'display'
+//```
+//
+// $name - utility name
+// $section = 'utils' - section in the registry in which utility was defined
+// $name-as-prop = false - return the utility name as a property if it was not found
+// $single = false - return one property of the utility, even if there are several
+//
+// Styleguide: sass-tools.functions.utils.util_prop
+
+/// Styleguide: sass-tools.functions.getters.util_prop
+/// Styleguide: sass-tools.functions.base.getters.util_prop
+
+@function util-prop(
+	$name, $section: 'utils', $name-as-prop: false, $single: false
+) {
+	$options: map.get(ml.$utils-db, $section, 'registry', $name);
+	$prop: null;
+
+	@if meta.type-of($options) == 'map' {
+		$prop-list: map.get($options, 'properties');
+
+		@if $single {
+			$prop: list.nth($prop-list, 1);
+		} @else {
+			$prop: $prop-list;
+		}
+	} @else {
+		$prop: $options;
+	}
+
+	@return $prop or (
+		$name-as-prop and if(
+			string.slice($name, 1, 1) == '-',
+			(
+				'--' + ml.$uv-css-var-prefix +
+				// TODO: replace with str-lcfirst function
+				string.to-lower-case(string.slice($name, 2, 2)) + string.slice($name, 3)
+			),
+			string.to-lower-case($name)
+		)
+	);
+}

package/dist/sass/tools/functions/base/_index.scss

@@ -0,0 +1,11 @@
+// Base
+//
+// Basic functions.
+//
+/// Styleguide: sass-tools.functions.base
+
+@forward 'error';
+@forward 'string';
+@forward 'list';
+@forward 'math';
+@forward 'getters';

package/dist/sass/tools/functions/base/_list.scss

@@ -0,0 +1,56 @@
+@use 'sass:meta';
+@use 'sass:string';
+@use 'sass:list';
+
+@use 'error' as *;
+
+// Private functions only for internal usage. I hope that in the future they will be built into Sass. And when it will happens I don't want that their removing broke backward compatibility.
+
+@function ls-implode($list, $separator: '') {
+	$result: '';
+
+	@each $item in $list {
+		$result: $result + $item + $separator;
+	}
+
+	@return string.slice($result, 1, -1 - string.length($separator));
+}
+
+@function ls-find($list, $callback, $args...) {
+	@if meta.type-of($callback) != 'function' {
+		@return error(
+			'Wrong type of argument $callback: `#{meta.type-of($callback)}`. Expected `function`'
+		);
+	}
+
+	$i: 1;
+
+	@each $item in $list {
+		@if meta.call($callback, $item, $i, $args...) {
+			@return $item;
+		}
+
+		$i: $i + 1;
+	}
+
+	@return null;
+}
+
+@function remove-nth($list, $index) {
+	@if meta.type-of($index) != 'number' {
+		@return error('Wrong type of argument $index: `#{meta.type-of($index)}`. Expected `number`');
+	}
+
+	$result: ();
+	$i: 1;
+
+	@each $item in $list {
+		@if $i != $index {
+			$result: list.append($result, $item);
+		}
+
+		$i: $i + 1;
+	}
+
+	@return $result;
+}

package/dist/sass/tools/functions/base/_math.scss

@@ -0,0 +1,149 @@
+@use 'sass:math';
+@use 'sass:meta';
+
+@use '../../settings' as ml;
+
+// Math
+//
+// Functions for calculations.
+//
+// Styleguide: sass-tools.functions.math
+
+// decimal-round
+//
+// Decimal rounding.
+// ```scss
+//@debug ml.decimal-round(33.33333%, 2); // 33.33%
+//```
+//
+// $number - decimal to be rounded. Type: number.
+// $pos - the number of decimal places.
+// $type = 'round' - service parameter for functions-wrappers.
+//
+// Styleguide: sass-tools.functions.math.decimal_round
+
+@function decimal-round($number, $pos, $type: 'round') {
+	$n: 1;
+
+	@if meta.type-of($number) != 'number' {
+		@error 'Wrong type of argument $number: `#{meta.type-of($number)}`. Expected number';
+	}
+
+	@if meta.type-of($pos) != 'number' {
+		@error 'Wrong type of argument $pos: `#{meta.type-of($pos)}`. Expected `number`';
+	}
+
+	@for $i from 0 to $pos {
+		$n: $n * 10;
+	}
+
+	@if $type == 'round' {
+		@return math.div(math.round($number * $n), $n);
+	} @else if $type == 'ceil' {
+		@return math.div(math.ceil($number * $n), $n);
+	} @else if $type == 'floor' {
+		@return math.div(math.floor($number * $n), $n);
+	} @else {
+		@error 'Invalid round type: `#{$type}`';
+	}
+}
+
+// decimal-ceil
+//
+// Wrapper on [decimal-round](#kssref-sass-tools-functions-math-decimal_round) for ceil round.
+// ```scss
+//@debug ml.decimal-ceil(33.33333%, 2); // 33.34%
+//```
+//
+// $number - decimal to be rounded. Type: number.
+// $pos - the number of decimal places.
+//
+// Styleguide: sass-tools.functions.math.decimal_ceil
+
+@function decimal-ceil($number, $pos) {
+	@return decimal-round($number, $pos, 'ceil');
+}
+
+
+// decimal-floor
+//
+// Wrapper on [decimal-round](#kssref-sass-tools-functions-decimal_round) for floor round.
+// ```scss
+//@debug ml.decimal-floor(33.33999%, 2); // 33.33%
+//```
+//
+// $number - decimal to be rounded. Type: number.
+// $pos - the number of decimal places.
+//
+// Styleguide: sass-tools.functions.math.decimal_floor
+
+@function decimal-floor($number, $pos) {
+	@return decimal-round($number, $pos, 'floor');
+}
+
+// px2em
+//
+// Convert pixels to `em`.
+// Final value in ems rounded because accuracy more than two decimal places does not make sense.
+// ```scss
+//@debug ml.px2em(24px, 18px); // 1.33em
+//@debug ml.px2em(24px); // 1.5em
+// ```
+//
+// $number - number in `px` that will be converted.
+// $divider = $browser-font-size - parent font size in `px`.
+// $unit = 'em' - service parameter for functions-wrappers.
+//
+// Styleguide: sass-tools.functions.math.px2em
+
+@function px2em($number, $divider: ml.$browser-font-size, $unit: 'em') {
+	@if math.is-unitless($number) {
+		$number: $number * 1px;
+	} @else if math.unit($number) == $unit {
+		@return $number;
+	}
+
+	@if $unit == 'rem' {
+		@return decimal-round(math.div($number, $divider), 2) * 1rem;
+	}
+
+	@if $unit == '' {
+		@return decimal-round(math.div($number, $divider), 2);
+	}
+
+	@return decimal-round(math.div($number, $divider), 2) * 1em;
+}
+
+// px2rem
+//
+// Wrapper on [px2em](#kssref-sass-tools-functions-math-px2em) for converting to `rem`. Works similarly.
+// ```scss
+//@debug ml.px2rem(24px); // 1.5rem
+// ```
+//
+// $number - number in `px` that will be converted.
+// $divider = $browser-font-size - browser default font size in `px`.
+//
+// Styleguide: sass-tools.functions.math.px2rem
+
+@function px2rem($number, $divider: ml.$browser-font-size) {
+	@return px2em($number, $divider, 'rem');
+}
+
+
+// px2lh
+//
+// Wrapper on [px2em](#kssref-sass-tools-functions-math-px2em) for converting to `line-height` units. Works similarly.
+// ```scss
+//@debug ml.px2lh(24px, 14px); // 1.71
+//@debug ml.px2lh(24px); // 1.5
+// ```
+//
+// $number - number in `px` that will be converted.
+// $divider = $browser-font-size - parent font size in `px`.
+//
+// Styleguide: sass-tools.functions.math.px2lh
+
+@function px2lh($number, $divider: ml.$browser-font-size) {
+	@return px2em($number, $divider, '');
+}