@mlut/core 1.0.0

package/dist/sass/tools/settings/common/_at-rules.scss

@@ -0,0 +1,213 @@
+@use 'sass:map';
+@use 'sass:list';
+@use 'sass:string';
+@use 'sass:math';
+@use '../base' as ml;
+@use 'utils' as ud;
+
+// At-rules
+//
+// Settings for media queries and other CSS at-rules. There is a small database and several configs.
+//
+// Styleguide: settings.at_rules
+
+// Data
+//
+// `$at-rules-db` \- map, the keys in which are the names of the at-rules, and the values are map with options. In the options of each at-rule there is a custom map, to which you can add alias for custom expressions. See example [here](section-how_to.html#kssref-how_to-config-media).
+//
+// Below are the at-rule options
+//
+// alias - `string` <div>the abbreviation that will be used in the utils components. It will be converted into at-crule name. For example: `@s` => `@supports`</div>
+// default = false - <div class="Mt3u"> `boolean` </div> It can be `true`, only in one at-rule. Sets at-rule by default. This means that this at-rule will be used, without an indication of alias after the `@` symbol. By default, `media` is default at-rule
+// custom - <div class="Mt3u"> `map` </div> Here you can set alias for custom expressions. See the example above
+//
+// Styleguide: settings.at_rules.data
+
+// Breakpoints
+//
+// Breakpoints are stored in the config `$at-rules-cfg`, in the `breakpoints` section. For convenience, they are configured in a separate map `$breakpoints`. You can see an example of simple use [here](section-how_to.html#kssref-how_to-config-bp).
+//
+// Name | Value
+// :---:  | :---:
+// <sm | 0px
+// sm | 520px
+// md | 768px
+// lg | 992px
+// xl | 1200px
+// xxl | 1400px
+//
+// To fully rewrite breakpoints, use `$breakpoints-ext` map:
+// ```scss
+//	@use 'mlut/tools' as ml with (
+//		$breakpoints: null,
+//		$breakpoints-ext: (
+//			'sm': 768px,
+//			'md': 1200px,
+//			'lg': 1440px,
+//		),
+//	);
+//
+//	@debug map.get(ml.$at-rules-cfg, 'breakpoints');
+//	// (
+//	//   'sm': 768px,
+//	//   'md': 1200px,
+//	//   'lg': 1440px,
+//	// )
+// ```
+//
+// Styleguide: settings.at_rules.breakpoints
+
+$at-rules-db: (
+	'media': (
+		'alias': 'm',
+		'default': true,
+		'types': (
+			'pr': print,
+			's': screen,
+		),
+	),
+	'supports': (
+		'alias': 's',
+	),
+	'container': (
+		'alias': 'c',
+	),
+	'layer': (
+		'alias': 'l',
+	),
+) !default;
+
+$at-rules-cfg: (
+	'tokens': (
+		'syntax': (
+			'or': ml.$tSOr,
+			'and': ml.$tSAnd,
+			'custom': ml.$tSCs,
+			'not': ml.$tSNot,
+			'ar': '@',
+			'greater-equal': '>=',
+			'less-equal': '<=',
+			'greater': '>',
+			'less': '<',
+		),
+		'generation': (
+			'all-breakpoints': 'BpAll',
+			'at-rules-only': 'ArOl',
+			'at-rules-states': 'ArSt',
+			'at-rules-states-only': 'ArSO',
+		),
+	),
+	'breakpoints': (
+		'sm': 520px,
+		'md': 768px,
+		'lg': 992px,
+		'xl': 1200px,
+		'xxl': 1400px,
+	),
+) !default;
+
+$at-rules-data: () !default;
+$at-rules-data-ext: () !default;
+$at-rules-config: () !default;
+$at-rules-config-ext: () !default;
+$breakpoints: () !default;
+$breakpoints-ext: () !default;
+
+$at-rules-db: map.deep-merge($at-rules-db, $at-rules-data);
+$at-rules-db: map.deep-merge($at-rules-db, $at-rules-data-ext);
+$at-rules-cfg: map.deep-merge($at-rules-cfg, $at-rules-config);
+$at-rules-cfg: map.deep-merge($at-rules-cfg, $at-rules-config-ext);
+$at-rules-cfg: map.merge($at-rules-cfg, 'breakpoints', $breakpoints);
+$at-rules-cfg: map.merge($at-rules-cfg, 'breakpoints', $breakpoints-ext);
+
+$bp-map: map.get($at-rules-cfg, 'breakpoints');
+$-bp-values: map.values($bp-map);
+$bp-keys: map.keys($bp-map);
+$bp-map: ();
+
+@for $i from 1 through list.length($-bp-values) {
+	$min-bp: math.min($-bp-values...);
+	$min-index: list.index($-bp-values, $min-bp);
+	$-bp-values: list.set-nth($-bp-values, $min-index, ml.$number-max);
+	$bp-map: map.set($bp-map, list.nth($bp-keys, $min-index), $min-bp);
+}
+
+$at-rules-cfg: map.set($at-rules-cfg, 'breakpoints', $bp-map);
+$-custom-global-kw: map.get(ud.$utils-db, 'common', 'keywords', 'global');
+$-bp-kw-map: ();
+
+@each $key, $value in $bp-map {
+	$-bp-kw-map: map.set(
+		$-bp-kw-map,
+		(
+			ml.$tUGkw +
+			string.to-upper-case(string.slice($key, 1, 1)) +
+			string.slice($key, 2)
+		),
+		$value
+	);
+}
+
+$global-kw-bp: map.keys($-bp-kw-map);
+
+@if $-custom-global-kw {
+	$-bp-kw-map: map.merge($-bp-kw-map, $-custom-global-kw);
+}
+
+ud.$utils-db: map.set(
+	ud.$utils-db, 'common', 'keywords', 'global', $-bp-kw-map
+);
+
+$tAOr: map.get($at-rules-cfg, 'tokens', 'syntax', 'or');
+$tAAnd: map.get($at-rules-cfg, 'tokens', 'syntax', 'and');
+$tANot: map.get($at-rules-cfg, 'tokens', 'syntax', 'not');
+$tACs: map.get($at-rules-cfg, 'tokens', 'syntax', 'custom');
+$tAAr: map.get($at-rules-cfg, 'tokens', 'syntax', 'ar');
+$tAGte: map.get($at-rules-cfg, 'tokens', 'syntax', 'greater-equal');
+$tALse: map.get($at-rules-cfg, 'tokens', 'syntax', 'less-equal');
+$tAGt: map.get($at-rules-cfg, 'tokens', 'syntax', 'greater');
+$tALs: map.get($at-rules-cfg, 'tokens', 'syntax', 'less');
+
+$kBpAll: map.get($at-rules-cfg, 'tokens', 'generation', 'all-breakpoints');
+$kArOl: map.get($at-rules-cfg, 'tokens', 'generation', 'at-rules-only');
+$kArSt: map.get($at-rules-cfg, 'tokens', 'generation', 'at-rules-states');
+$kArSO: map.get($at-rules-cfg, 'tokens', 'generation', 'at-rules-states-only');
+
+$cBpAllCp: $kBpAll + ' _';
+$cArOlBp: '#{$kBpAll} #{$kArOl} _';
+$cArStBp: '#{$kBpAll} #{$kArSt} _';
+
+$at-rules-cfg: map.merge(
+	$at-rules-cfg,
+	(
+		'keywords': map.merge(
+			(
+				$kBpAll: 'breakpoints',
+				$kArOl: null,
+				$kArSO: null,
+				$kArSt: null,
+			),
+			map.get($at-rules-cfg, 'keywords') or ()
+		),
+		'abbr-separators': list.join(
+			(
+				$tAGte,
+				$tALse,
+				$tAGt,
+				$tALs,
+			),
+			map.get($at-rules-cfg, 'abbr-separators') or ()
+		)
+	)
+);
+
+$abbr-separators: ();
+
+@each $item in list.join(
+	map.get($at-rules-cfg, 'abbr-separators'),
+	map.get(ml.$utils-cfg, 'abbr-separators'),
+) {
+	@if $item != '' {
+		$abbr-separators: list.append($abbr-separators, $item);
+	}
+}

package/dist/sass/tools/settings/common/_index.scss

@@ -0,0 +1,2 @@
+@forward 'utils';
+@forward 'at-rules';