@omnisass/library 0.4.1 → 0.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.en.md +99 -0
- package/README.md +2 -0
- package/_configs.scss +1 -1
- package/index.scss +11 -5
- package/modules/utilities/getters/map/_get-map-item.scss +159 -0
- package/modules/utilities/helpers/map/_map-remove-keys.scss +153 -0
- package/modules/utilities/helpers/string/_string-lorips.config.scss +0 -2
- package/modules/utilities/loggers/_log.scss +219 -0
- package/modules/utilities/setters/map/_set-map-item.scss +243 -0
- package/modules/utilities/validators/type-of/_is-color.scss +0 -4
- package/package.json +25 -16
- package/package.scss +11 -1
- package/CHANGELOG.md +0 -122
package/README.en.md
ADDED
|
@@ -0,0 +1,99 @@
|
|
|
1
|
+
[🇷🇺 Русский](./README.md )
|
|
2
|
+
|
|
3
|
+
<p align="left">
|
|
4
|
+
<img src="https://sourcecraft.dev/file?owner=omnisass&repo=library&rev=anvil&path=.omnisass%2Fimages%2Fomnisass_logo_rounded.png" width="150" height="150" alt="Project logo">
|
|
5
|
+
</p>
|
|
6
|
+
|
|
7
|
+
# OmniSass
|
|
8
|
+
> IMPORTANT: The library is currently undergoing testing. It is possible that API changes will be made or some functions will be removed before the final version 1.0.0. It is recommended to use it exclusively for informational purposes.
|
|
9
|
+
|
|
10
|
+
A library of functions and mixins written in the CSS preprocessor language Sass. It is designed to simplify, speed up and improve the process of creating styles for websites.
|
|
11
|
+
|
|
12
|
+
     
|
|
13
|
+
|
|
14
|
+
OmniSass is an extensive, standardized, and carefully documented package that includes solutions built over the years by the community.
|
|
15
|
+
|
|
16
|
+
Most of the features and mixins are the result of the work of many people who have been developing in the Sass language at various times. OmniSass Developer ([@therteenten](https://t.me/therteenten )) He focused on qualitative standardization, documentation, and the creation of a single tool based on disparate elements.
|
|
17
|
+
|
|
18
|
+
## Installing the library
|
|
19
|
+
1. For OmniSass to work, the [`sass`](https://www.npmjs.com/package/sass ) library must be installed:
|
|
20
|
+
|
|
21
|
+
```shell
|
|
22
|
+
npm install sass
|
|
23
|
+
```
|
|
24
|
+
|
|
25
|
+
2. After the installation is complete, you can add the library [`@omnisass/library`](https://www.npmjs.com/package/@omnisass/library ):
|
|
26
|
+
|
|
27
|
+
```shell
|
|
28
|
+
npm install @omnisass/library
|
|
29
|
+
```
|
|
30
|
+
|
|
31
|
+
3. It's done! OmniSass is ready to use.
|
|
32
|
+
|
|
33
|
+
## Usage
|
|
34
|
+
You can embed the module in your style file after installing the necessary libraries.:
|
|
35
|
+
|
|
36
|
+
```scss
|
|
37
|
+
@use '@omnisass/library' as omnisass;
|
|
38
|
+
```
|
|
39
|
+
|
|
40
|
+
1. We're messing up the `@omnisass/library` module
|
|
41
|
+
2. The entire "stuffing" of the module is available in the omnisass space
|
|
42
|
+
|
|
43
|
+
Then we apply one of the functions from the library. For example, `is-boolean`:
|
|
44
|
+
|
|
45
|
+
```scss
|
|
46
|
+
@debug omnisass.is-boolean(true);
|
|
47
|
+
```
|
|
48
|
+
|
|
49
|
+
In the console, we get:
|
|
50
|
+
|
|
51
|
+
```shell
|
|
52
|
+
src/styles/main.scss:3 Debug: true
|
|
53
|
+
```
|
|
54
|
+
|
|
55
|
+
Done. We have successfully installed, imported, and used the library in the project.
|
|
56
|
+
|
|
57
|
+
> When compiling Sass without the `--load-path=node_modules` key, you must specify the full path to the library folder to import the module. In our case, if the styles.scss file is located in the ./src/styles/ directory, the following construction should be used: `@use'../../node_modules/@omnisass/library'as omnisass;`.
|
|
58
|
+
|
|
59
|
+
## Useful links
|
|
60
|
+
- [API Documentation (SassDoc)](https://omnisass.sourcecraft.site/sassdocs/)
|
|
61
|
+
- [Organization on SourceCraft](https://sourcecraft.dev/omnisass/overview )
|
|
62
|
+
- [Telegram Channel](https://t.me/omnisass )
|
|
63
|
+
- [List of changes](https://sourcecraft.dev/omnisass/library/browse/CHANGELOG.md?rev=develop )
|
|
64
|
+
|
|
65
|
+
## Thanks
|
|
66
|
+
- [github@takamoso](https://github.com/takamoso ) - for the functions `is-boolean`, `is-list`, etc.
|
|
67
|
+
- [github@KittyGiraudel](https://github.com/KittyGiraudel ) - for the functions `color-shade`, `color-tint`, etc.
|
|
68
|
+
- [github@sindresorhus](https://github.com/sindresorhus ) - for the functions `get-list-item-end`, `get-list-item-start`, etc.
|
|
69
|
+
- [github@selfishprimate](https://github.com/selfishprimate ) - for the [`is-time`] function(https://github.com/selfishprimate/gerillass/blob/master/scss/utilities/_is-time.scss ) and others.
|
|
70
|
+
- [github@pentzzsolt](https://github.com/pentzzsolt ) - for the `is-int` function, etc.
|
|
71
|
+
|
|
72
|
+
> If I forgot to mention you in this list, please write to me on [Telegram](https://t.me/therteenten ).
|
|
73
|
+
|
|
74
|
+
## License
|
|
75
|
+
This project is licensed under the MIT license - for details, see the [LICENSE](LICENSE) file.
|
|
76
|
+
|
|
77
|
+
```
|
|
78
|
+
MIT License
|
|
79
|
+
|
|
80
|
+
Copyright (c) 2025, Murad Rustamov (therteenten) <therteenten@ya.ru>
|
|
81
|
+
|
|
82
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
83
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
84
|
+
in the Software without restriction, including without limitation the rights
|
|
85
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
86
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
87
|
+
furnished to do so, subject to the following conditions:
|
|
88
|
+
|
|
89
|
+
The above copyright notice and this permission notice shall be included in all
|
|
90
|
+
copies or substantial portions of the Software.
|
|
91
|
+
|
|
92
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
93
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
94
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
95
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
96
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
97
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
98
|
+
SOFTWARE.
|
|
99
|
+
```
|
package/README.md
CHANGED
package/_configs.scss
CHANGED
package/index.scss
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
@forward 'configs';
|
|
4
4
|
@forward 'package';
|
|
5
5
|
|
|
6
|
-
|
|
6
|
+
// Utilities: Converters
|
|
7
7
|
@forward 'modules/utilities/converters/convert-camel2kebab';
|
|
8
8
|
@forward 'modules/utilities/converters/convert-em2px';
|
|
9
9
|
@forward 'modules/utilities/converters/convert-hex2rgb';
|
|
@@ -15,12 +15,13 @@
|
|
|
15
15
|
@forward 'modules/utilities/converters/convert-rem2px';
|
|
16
16
|
@forward 'modules/utilities/converters/convert-snake2kebab';
|
|
17
17
|
|
|
18
|
-
// Getters
|
|
18
|
+
// Utilities: Getters
|
|
19
19
|
@forward 'modules/utilities/getters/color/get-color-brightness';
|
|
20
20
|
@forward 'modules/utilities/getters/color/get-color-darkest';
|
|
21
21
|
@forward 'modules/utilities/getters/list/get-list-item';
|
|
22
22
|
@forward 'modules/utilities/getters/list/get-list-item-end';
|
|
23
23
|
@forward 'modules/utilities/getters/list/get-list-item-start';
|
|
24
|
+
@forward 'modules/utilities/getters/map/get-map-item';
|
|
24
25
|
@forward 'modules/utilities/getters/misc/get-uid';
|
|
25
26
|
@forward 'modules/utilities/getters/number/get-number-from-percent';
|
|
26
27
|
@forward 'modules/utilities/getters/number/get-number-height-by-ratio';
|
|
@@ -31,7 +32,7 @@
|
|
|
31
32
|
@forward 'modules/utilities/getters/number/get-number-width-by-ratio';
|
|
32
33
|
@forward 'modules/utilities/getters/string/get-string-hash';
|
|
33
34
|
|
|
34
|
-
// Helpers
|
|
35
|
+
// Utilities: Helpers
|
|
35
36
|
@forward 'modules/utilities/helpers/color/color-blend';
|
|
36
37
|
@forward 'modules/utilities/helpers/color/color-blend-steps';
|
|
37
38
|
@forward 'modules/utilities/helpers/color/color-hue-shift';
|
|
@@ -45,6 +46,7 @@
|
|
|
45
46
|
@forward 'modules/utilities/helpers/list/list-remove-at';
|
|
46
47
|
@forward 'modules/utilities/helpers/list/list-sum-numbers';
|
|
47
48
|
@forward 'modules/utilities/helpers/list/list-sum-numbers-safe';
|
|
49
|
+
@forward 'modules/utilities/helpers/map/map-remove-keys';
|
|
48
50
|
@forward 'modules/utilities/helpers/misc/url-encode';
|
|
49
51
|
@forward 'modules/utilities/helpers/number/number-ceil-to';
|
|
50
52
|
@forward 'modules/utilities/helpers/number/number-clamp';
|
|
@@ -71,11 +73,15 @@
|
|
|
71
73
|
@forward 'modules/utilities/helpers/string/string-trim-end';
|
|
72
74
|
@forward 'modules/utilities/helpers/string/string-trim-start';
|
|
73
75
|
|
|
74
|
-
// Loggers
|
|
76
|
+
// Utilities: Loggers
|
|
75
77
|
@forward 'modules/utilities/loggers/log-invalid-type';
|
|
76
78
|
@forward 'modules/utilities/loggers/log-invalid-value';
|
|
79
|
+
@forward 'modules/utilities/loggers/log';
|
|
77
80
|
|
|
78
|
-
//
|
|
81
|
+
// Utilities: Setters
|
|
82
|
+
@forward 'modules/utilities/setters/map/set-map-item';
|
|
83
|
+
|
|
84
|
+
// Utilities: Validators
|
|
79
85
|
@forward 'modules/utilities/validators/color/is-color-light';
|
|
80
86
|
@forward 'modules/utilities/validators/color/is-color-list';
|
|
81
87
|
@forward 'modules/utilities/validators/list/is-list-contained';
|
|
@@ -0,0 +1,159 @@
|
|
|
1
|
+
@use 'sass:map';
|
|
2
|
+
@use '../../loggers/log-invalid-type' as *;
|
|
3
|
+
@use '../../validators/type-of/is-map' as *;
|
|
4
|
+
|
|
5
|
+
/// Безопасно извлекает значение из карты по цепочке ключей.
|
|
6
|
+
///
|
|
7
|
+
/// Функция последовательно проходит по переданным ключам,
|
|
8
|
+
/// углубляясь во вложенные карты, и возвращает значение,
|
|
9
|
+
/// соответствующее последнему ключу. Если на любом уровне
|
|
10
|
+
/// ключ отсутствует, функция возвращает `null`. Это позволяет
|
|
11
|
+
/// избежать ошибок при работе со сложными структурами данных
|
|
12
|
+
/// и избавляет от необходимости писать громоздкие проверки.
|
|
13
|
+
///
|
|
14
|
+
/// Для проверки типа входного параметра используется служебная
|
|
15
|
+
/// функция `log-invalid-type`, которая при несоответствии типа
|
|
16
|
+
/// генерирует предупреждение (или ошибку) и возвращает `null`.
|
|
17
|
+
/// ---
|
|
18
|
+
/// @name get-map-item
|
|
19
|
+
/// @group utilities-getters
|
|
20
|
+
/// @since 2026.03.18
|
|
21
|
+
/// @access public
|
|
22
|
+
/// @author Murad Rustamov (therteenten)
|
|
23
|
+
/// @link https://sourcecraft.dev/users/therteenten/overview SourceCraft - therteenten
|
|
24
|
+
/// @link https://sourcecraft.dev/omnisass/library SourceCraft - OmniSass
|
|
25
|
+
/// @link https://sass-lang.com/documentation/values/maps См. также: Официальная документация Sass - Тип данных "Карты" (`maps`)
|
|
26
|
+
/// @link https://sass-lang.com/documentation/modules/map См. также: Официальная документация Sass - Модуль `sass:map`
|
|
27
|
+
/// @link https://sass-lang.com/documentation/modules/map#get См. также: Официальная документация Sass - Функция `map.get()`
|
|
28
|
+
/// @link https://sass-lang.com/documentation/modules/map#has-key См. также: Официальная документация Sass - Функция `map.has-key()`
|
|
29
|
+
/// @link https://sass-lang.com/documentation/at-rules/function См. также: Официальная документация Sass - Правило `@function`
|
|
30
|
+
/// @link https://sass-guidelin.es/ru/#maps См. также: Sass Guidelines (рус.) - Работа с картами
|
|
31
|
+
/// @link https://www.sitepoint.com/using-sass-maps/ См. также: SitePoint - Using Sass Maps
|
|
32
|
+
/// @link https://css-tricks.com/snippets/sass/deep-getset-maps/ См. также: CSS-Tricks - Deep Get/Set for Sass Maps
|
|
33
|
+
/// @link https://www.smashingmagazine.com/2015/07/real-work-sass-maps/ См. также: Smashing Magazine - Real Work with Sass Maps
|
|
34
|
+
/// @link https://dev.to/sarah_chima/working-with-sass-maps-5cm5 См. также: Dev.to - Working with Sass Maps
|
|
35
|
+
/// @link https://code.tutsplus.com/tutorials/an-introduction-to-sass-maps--cms-22138 См. также: Envato Tuts+ - An Introduction to Sass Maps
|
|
36
|
+
/// @link https://habr.com/ru/post/309656/ См. также: Habr - Карты данных (maps) в Sass
|
|
37
|
+
/// @link https://htmlacademy.ru/blog/boost/tools/sass-maps См. также: HTML Academy - Sass-карты: когда и как применять
|
|
38
|
+
/// @link https://ru.hexlet.io/courses/sass-basics/lessons/maps/theory_unit См. также: Hexlet - Карты (maps) в Sass
|
|
39
|
+
/// @link https://www.youtube.com/watch?v=6kUo6lBF0Cc См. также: YouTube - Уроки Sass #5: Карты данных (Maps)
|
|
40
|
+
/// @link https://www.youtube.com/watch?v=dN_rpAoy8I0 См. также: YouTube - Sass Maps Tutorial (LevelUp Tuts)
|
|
41
|
+
/// @link https://stackoverflow.com/questions/28548587/sass-check-if-key-exists-in-multi-level-map См. также: Stack Overflow - Проверка существования ключа во вложенной карте
|
|
42
|
+
/// @link https://stackoverflow.com/questions/37705095/sass-get-value-from-nested-map См. также: Stack Overflow - Получение значения из вложенной карты
|
|
43
|
+
/// @link https://www.npmjs.com/package/sass См. также: npm - Документация пакета Dart Sass
|
|
44
|
+
/// @link https://github.com/sass/sass/tree/main/spec См. также: GitHub - Спецификация языка Sass
|
|
45
|
+
/// @example scss - Извлечение значения из плоской карты
|
|
46
|
+
/// $breakpoints: (
|
|
47
|
+
/// mobile: 480px,
|
|
48
|
+
/// tablet: 768px,
|
|
49
|
+
/// desktop: 1024px
|
|
50
|
+
/// );
|
|
51
|
+
///
|
|
52
|
+
/// @debug get-map-item($breakpoints, desktop); // 1024px
|
|
53
|
+
///
|
|
54
|
+
/// @example scss - Доступ к вложенным данным конфигурации
|
|
55
|
+
/// $theme: (
|
|
56
|
+
/// colors: (
|
|
57
|
+
/// primary: #3498db,
|
|
58
|
+
/// secondary: #2ecc71
|
|
59
|
+
/// ),
|
|
60
|
+
/// fonts: (
|
|
61
|
+
/// base: 16px,
|
|
62
|
+
/// headings: (
|
|
63
|
+
/// h1: 2rem,
|
|
64
|
+
/// h2: 1.5rem
|
|
65
|
+
/// )
|
|
66
|
+
/// )
|
|
67
|
+
/// );
|
|
68
|
+
///
|
|
69
|
+
/// @debug get-map-item($theme, colors, primary); // #3498db
|
|
70
|
+
/// @debug get-map-item($theme, fonts, headings, h2); // 1.5rem
|
|
71
|
+
///
|
|
72
|
+
/// @example scss - Возврат `null` при отсутствии ключа
|
|
73
|
+
/// @debug get-map-item($theme, colors, accent); // null
|
|
74
|
+
/// @debug get-map-item($theme, missing, key); // null
|
|
75
|
+
///
|
|
76
|
+
/// @example scss - Использование с переменным числом ключей
|
|
77
|
+
/// $keys: ('fonts', 'headings', 'h1');
|
|
78
|
+
/// @debug get-map-item($theme, $keys...); // 2rem
|
|
79
|
+
///
|
|
80
|
+
/// @example scss - Применение для получения параметров темы
|
|
81
|
+
/// @mixin button($color-key) {
|
|
82
|
+
/// $bg: get-map-item($theme, colors, $color-key);
|
|
83
|
+
/// background: $bg;
|
|
84
|
+
/// }
|
|
85
|
+
///
|
|
86
|
+
/// .button-primary { @include button(primary); }
|
|
87
|
+
///
|
|
88
|
+
/// @example css - Результат выполнения
|
|
89
|
+
/// .button-primary {
|
|
90
|
+
/// background: #3498db;
|
|
91
|
+
/// }
|
|
92
|
+
/// @example scss - Защита от ошибок при отсутствии карты
|
|
93
|
+
/// $not-a-map: 'string';
|
|
94
|
+
/// @debug get-map-item($not-a-map, any); // вызывает log-invalid-type и возвращает null
|
|
95
|
+
///
|
|
96
|
+
/// @param {Map} $map - Карта, из которой извлекается значение.
|
|
97
|
+
/// Должна быть типа `map`. В случае передачи другого типа
|
|
98
|
+
/// вызывается `log-invalid-type` и возвращается его результат.
|
|
99
|
+
/// @param {String...} $keys - Один или несколько ключей,
|
|
100
|
+
/// образующих путь к искомому значению. Ключи могут быть
|
|
101
|
+
/// любого типа, поддерживаемого картами Sass (обычно строки).
|
|
102
|
+
/// @return {*} - Значение, находящееся по указанному пути,
|
|
103
|
+
/// или `null`, если хотя бы один из ключей отсутствует,
|
|
104
|
+
/// либо если входная карта имеет неверный тип.
|
|
105
|
+
/// @throws {Error} - Выбрасывает ошибку (или предупреждение)
|
|
106
|
+
/// через функцию `log-invalid-type`, если параметр `$map`
|
|
107
|
+
/// не является картой. Текст ошибки зависит от реализации
|
|
108
|
+
/// `log-invalid-type`, но в стандартном случае возвращается
|
|
109
|
+
/// `null`.
|
|
110
|
+
@function get-map-item($map, $keys...) {
|
|
111
|
+
|
|
112
|
+
// Проверяем, что первый аргумент действительно
|
|
113
|
+
// является картой.
|
|
114
|
+
@if not is-map($map) {
|
|
115
|
+
|
|
116
|
+
// Если это не так, вызываем функцию логирования ошибки
|
|
117
|
+
// и возвращаем её результат.
|
|
118
|
+
// Функция log-invalid-type должна обработать некорректный
|
|
119
|
+
// тип и вернуть null (или выбросить ошибку в зависимости
|
|
120
|
+
// от настроек).
|
|
121
|
+
@return log-invalid-type(
|
|
122
|
+
'get-map-item',
|
|
123
|
+
$map,
|
|
124
|
+
'$map',
|
|
125
|
+
'map'
|
|
126
|
+
);
|
|
127
|
+
|
|
128
|
+
} @else {
|
|
129
|
+
|
|
130
|
+
// Проходим по всем переданным ключам последовательно.
|
|
131
|
+
// На каждом шаге проверяем, существует ли текущий ключ
|
|
132
|
+
// в текущей карте.
|
|
133
|
+
@each $-key in $keys {
|
|
134
|
+
|
|
135
|
+
@if map.has-key($map, $-key) {
|
|
136
|
+
|
|
137
|
+
// Если ключ существует — переходим на уровень глубже,
|
|
138
|
+
// заменяя $map на полученное значение (которое может
|
|
139
|
+
// быть как картой, так и любым другим типом).
|
|
140
|
+
$map: map.get($map, $-key);
|
|
141
|
+
|
|
142
|
+
} @else {
|
|
143
|
+
|
|
144
|
+
// Если на любом уровне ключ не найден — прерываем
|
|
145
|
+
// выполнение и возвращаем null.
|
|
146
|
+
@return null;
|
|
147
|
+
|
|
148
|
+
}
|
|
149
|
+
|
|
150
|
+
}
|
|
151
|
+
|
|
152
|
+
// После успешного прохождения всех ключей возвращаем
|
|
153
|
+
// итоговое значение. Оно может быть чем угодно: картой,
|
|
154
|
+
// строкой, числом, списком и т.д.
|
|
155
|
+
@return $map;
|
|
156
|
+
|
|
157
|
+
}
|
|
158
|
+
|
|
159
|
+
}
|
|
@@ -0,0 +1,153 @@
|
|
|
1
|
+
@use 'sass:map';
|
|
2
|
+
@use '../../loggers/log-invalid-type' as *;
|
|
3
|
+
@use '../../validators/type-of/is-map' as *;
|
|
4
|
+
|
|
5
|
+
/// Удаляет указанные ключи из карты.
|
|
6
|
+
///
|
|
7
|
+
/// Функция позволяет удалить один или несколько ключей
|
|
8
|
+
/// из карты за один вызов. В отличие от стандартной
|
|
9
|
+
/// функции `map.remove()`, которая принимает только один
|
|
10
|
+
/// ключ для удаления, эта функция принимает список ключей
|
|
11
|
+
/// и последовательно удаляет их все. Это значительно
|
|
12
|
+
/// упрощает код при необходимости удалить несколько
|
|
13
|
+
/// ключей из одной карты, избавляя от необходимости
|
|
14
|
+
/// писать цепочку вызовов `map.remove()`.
|
|
15
|
+
///
|
|
16
|
+
/// Функция работает путём итеративного обхода списка
|
|
17
|
+
/// удаляемых ключей и применения встроенной функции
|
|
18
|
+
/// `map.remove()` к каждому из них. Исходная карта
|
|
19
|
+
/// остаётся неизменной — функция возвращает новую карту,
|
|
20
|
+
/// из которой удалены указанные ключи. Если переданный
|
|
21
|
+
/// ключ отсутствует в карте, он просто игнорируется,
|
|
22
|
+
/// что делает функцию безопасной в использовании.
|
|
23
|
+
///
|
|
24
|
+
/// Важные особенности функции:
|
|
25
|
+
/// - Удаляет несколько ключей за один вызов
|
|
26
|
+
/// - Возвращает новую карту, не мутируя исходную
|
|
27
|
+
/// - Безопасно игнорирует отсутствующие ключи
|
|
28
|
+
/// - Поддерживает удаление любого количества ключей
|
|
29
|
+
/// - Интегрируется с системой валидации типов
|
|
30
|
+
/// - Позволяет создавать чистые конфигурации
|
|
31
|
+
/// - Упрощает фильтрацию данных
|
|
32
|
+
/// ---
|
|
33
|
+
/// @name map-remove-keys
|
|
34
|
+
/// @group utilities-helpers
|
|
35
|
+
/// @since 2026.03.28
|
|
36
|
+
/// @access public
|
|
37
|
+
/// @author Murad Rustamov (therteenten)
|
|
38
|
+
/// @link https://sourcecraft.dev/users/therteenten/overview SourceCraft - therteenten
|
|
39
|
+
/// @link https://sourcecraft.dev/omnisass/library SourceCraft - OmniSass
|
|
40
|
+
/// @link https://sass-lang.com/documentation/values/maps См. также: Официальная документация Sass - Тип данных "Карты" (`maps`)
|
|
41
|
+
/// @link https://sass-lang.com/documentation/modules/map См. также: Официальная документация Sass - Модуль `sass:map`
|
|
42
|
+
/// @link https://sass-lang.com/documentation/modules/map#remove См. также: Официальная документация Sass - Функция `map.remove()`
|
|
43
|
+
/// @link https://sass-lang.com/documentation/modules/map#merge См. также: Официальная документация Sass - Функция `map.merge()`
|
|
44
|
+
/// @link https://sass-lang.com/documentation/at-rules/function См. также: Официальная документация Sass - Правило `@function`
|
|
45
|
+
/// @link https://sass-guidelin.es/ru/#maps-1 См. также: Sass Guidelines - Работа с картами
|
|
46
|
+
/// @link https://css-tricks.com/snippets/sass/ См. также: CSS-Tricks - Коллекция сниппетов Sass
|
|
47
|
+
/// @link https://www.sitepoint.com/using-sass-maps/ См. также: SitePoint - Использование карт Sass
|
|
48
|
+
/// @link https://www.smashingmagazine.com/2015/07/real-work-sass-maps/ См. также: Smashing Magazine - Реальная работа с картами Sass
|
|
49
|
+
/// @link https://dev.to/sarah_chima/working-with-sass-maps-5cm5 См. также: Dev.to - Работа с картами Sass
|
|
50
|
+
/// @link https://code.tutsplus.com/tutorials/an-introduction-to-sass-maps--cms-22138 См. также: Envato Tuts+ - Введение в карты Sass
|
|
51
|
+
/// @link https://habr.com/ru/post/309656/ См. также: Habr - Карты данных (maps) в Sass
|
|
52
|
+
/// @link https://htmlacademy.ru/blog/boost/tools/sass-maps См. также: HTML Academy - Sass-карты: практическое руководство
|
|
53
|
+
/// @link https://ru.hexlet.io/courses/sass-basics/lessons/maps/theory_unit См. также: Hexlet - Карты в Sass
|
|
54
|
+
/// @link https://www.youtube.com/watch?v=6kUo6lBF0Cc См. также: YouTube - Уроки Sass #5: Карты данных (Maps)
|
|
55
|
+
/// @link https://stackoverflow.com/questions/42841580/remove-multiple-keys-from-sass-map См. также: Stack Overflow - Удаление нескольких ключей из карты Sass
|
|
56
|
+
/// @link https://stackoverflow.com/questions/36586774/sass-remove-map-value См. также: Stack Overflow - Удаление значения из карты Sass
|
|
57
|
+
/// @link https://github.com/sass/sass/tree/main/spec См. также: GitHub - Спецификация языка Sass
|
|
58
|
+
/// @link https://www.npmjs.com/package/sass См. также: npm - Документация пакета Dart Sass
|
|
59
|
+
/// @link https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map/delete См. также: MDN Web Docs - JavaScript метод Map.delete()
|
|
60
|
+
/// @link https://en.wikipedia.org/wiki/Associative_array См. также: Wikipedia - Ассоциативный массив
|
|
61
|
+
/// @link https://ru.wikipedia.org/wiki/Ассоциативный_массив См. также: Wikipedia - Ассоциативный массив (рус.)
|
|
62
|
+
/// @link https://www.php.net/manual/en/function.unset.php См. также: PHP Manual - Функция unset()
|
|
63
|
+
/// @example scss - Удаление одного ключа из карты
|
|
64
|
+
/// $config: (
|
|
65
|
+
/// debug: true,
|
|
66
|
+
/// theme: 'dark',
|
|
67
|
+
/// language: 'ru'
|
|
68
|
+
/// );
|
|
69
|
+
///
|
|
70
|
+
/// $clean-config: map-remove-keys($config, debug); // Результат: (theme: 'dark', language: 'ru')
|
|
71
|
+
///
|
|
72
|
+
/// @example scss - Безопасное удаление (игнорирование отсутствующих ключей)
|
|
73
|
+
/// $colors: (
|
|
74
|
+
/// primary: #3498db,
|
|
75
|
+
/// secondary: #2ecc71
|
|
76
|
+
/// );
|
|
77
|
+
///
|
|
78
|
+
/// // Ключ 'tertiary' отсутствует, но ошибки не будет
|
|
79
|
+
/// $filtered: map-remove-keys($colors, (secondary, tertiary)); // Результат: (primary: #3498db)
|
|
80
|
+
///
|
|
81
|
+
/// @example scss - Динамическое удаление на основе списка
|
|
82
|
+
/// $theme: (
|
|
83
|
+
/// colors: (
|
|
84
|
+
/// primary: #3498db,
|
|
85
|
+
/// secondary: #2ecc71
|
|
86
|
+
/// ),
|
|
87
|
+
/// spacing: (sm: 8px, md: 16px),
|
|
88
|
+
/// typography: (base: 16px, h1: 2rem)
|
|
89
|
+
/// );
|
|
90
|
+
///
|
|
91
|
+
/// $keys-to-remove: (spacing, typography);
|
|
92
|
+
/// $simplified-theme: map-remove-keys($theme, $keys-to-remove); // Результат: (colors: (primary: #3498db, secondary: #2ecc71))
|
|
93
|
+
///
|
|
94
|
+
/// @example scss - Использование в цикле для удаления из нескольких карт
|
|
95
|
+
/// @function prepare-for-output($data) {
|
|
96
|
+
/// $sensitive-keys: (password, token, credit_card);
|
|
97
|
+
/// @return map-remove-keys($data, $sensitive-keys);
|
|
98
|
+
/// }
|
|
99
|
+
///
|
|
100
|
+
/// $user-data: (
|
|
101
|
+
/// name: 'Alice',
|
|
102
|
+
/// email: 'alice@example.com',
|
|
103
|
+
/// password: 'secret123',
|
|
104
|
+
/// token: 'jwt_token_xyz'
|
|
105
|
+
/// );
|
|
106
|
+
///
|
|
107
|
+
/// $public-data: prepare-for-output($user-data); // Результат: (name: 'Alice', email: 'alice@example.com')
|
|
108
|
+
///
|
|
109
|
+
/// @param {Map} $map - Исходная карта, из которой
|
|
110
|
+
/// удаляются ключи. Остаётся неизменной, функция
|
|
111
|
+
/// возвращает новую карту. Должна быть типа `map`.
|
|
112
|
+
/// @param {List} $remove-keys - Список ключей, которые
|
|
113
|
+
/// нужно удалить из карты. Может быть как одиночным
|
|
114
|
+
/// значением, так и списком. Отсутствующие в карте
|
|
115
|
+
/// ключи безопасно игнорируются.
|
|
116
|
+
/// @return {Map} - Новая карта, из которой удалены
|
|
117
|
+
/// указанные ключи. Если удалены все ключи, возвращает
|
|
118
|
+
/// пустую карту `()`.
|
|
119
|
+
/// @throws {Error} - Выбрасывает ошибку через функцию
|
|
120
|
+
/// `log-invalid-type`, если параметр `$map` не является
|
|
121
|
+
/// картой. Сообщение об ошибке локализовано и содержит
|
|
122
|
+
/// информацию об ожидаемом типе данных.
|
|
123
|
+
@function map-remove-keys($map, $remove-keys) {
|
|
124
|
+
|
|
125
|
+
// Проверяем, что первый аргумент действительно является картой.
|
|
126
|
+
// Если это не так, вызываем функцию логирования ошибки
|
|
127
|
+
// и возвращаем её результат.
|
|
128
|
+
@if not is-map($map) {
|
|
129
|
+
|
|
130
|
+
@return log-invalid-type(
|
|
131
|
+
'map-remove-keys',
|
|
132
|
+
$map,
|
|
133
|
+
'$map',
|
|
134
|
+
'map'
|
|
135
|
+
);
|
|
136
|
+
|
|
137
|
+
} @else {
|
|
138
|
+
|
|
139
|
+
// Проходим по всем ключам из списка удаляемых ключей.
|
|
140
|
+
// Для каждого ключа применяем встроенную функцию map.remove().
|
|
141
|
+
// Если ключ отсутствует в карте, map.remove() просто
|
|
142
|
+
// возвращает карту без изменений — это безопасное поведение.
|
|
143
|
+
@each $key in $remove-keys {
|
|
144
|
+
$map: map.remove($map, $key);
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
// Возвращаем новую карту без удалённых ключей.
|
|
148
|
+
// Исходная карта остаётся неизменной.
|
|
149
|
+
@return $map;
|
|
150
|
+
|
|
151
|
+
}
|
|
152
|
+
|
|
153
|
+
}
|
|
@@ -39,8 +39,6 @@
|
|
|
39
39
|
/// @link https://loremipsum.io/generator/ См. также: Lorem Ipsum - Генератор с настройками
|
|
40
40
|
/// @link https://www.lipsum.com/feed/html См. также: Lipsum.com - Генератор HTML Lorem Ipsum
|
|
41
41
|
/// @link https://github.com/sass/sass/issues/2871 См. также: GitHub - Обсуждение текстовых утилит в Sass
|
|
42
|
-
/// @see string-lorips - Функция для генерации текста-
|
|
43
|
-
/// заполнителя на основе этого набора слов.
|
|
44
42
|
/// @type List
|
|
45
43
|
$set-lorem-ipsum-words: "lorem"
|
|
46
44
|
"ipsum"
|
|
@@ -0,0 +1,219 @@
|
|
|
1
|
+
@use 'sass:map';
|
|
2
|
+
@use '../../../package' as package;
|
|
3
|
+
@use '../../../configs' as libconfigs;
|
|
4
|
+
@use './log-invalid-value' as *;
|
|
5
|
+
|
|
6
|
+
/// Универсальная функция логирования с поддержкой
|
|
7
|
+
/// локализации и трёх уровней важности.
|
|
8
|
+
///
|
|
9
|
+
/// Функция предоставляет единый интерфейс для вывода
|
|
10
|
+
/// отладочной информации, предупреждений и ошибок в
|
|
11
|
+
/// процессе компиляции Sass-кода.
|
|
12
|
+
///
|
|
13
|
+
/// Поддерживает два языка (русский и английский), что
|
|
14
|
+
/// делает её неплохим решением для многоязычных
|
|
15
|
+
/// проектов и библиотек, распространяемых среди
|
|
16
|
+
/// разработчиков из разных стран (если они у проекта
|
|
17
|
+
/// будут вообще).
|
|
18
|
+
///
|
|
19
|
+
/// Сообщения для логирования передаются в виде карты
|
|
20
|
+
/// с ключами 'ru' и 'en', что позволяет гибко
|
|
21
|
+
/// управлять контентом без изменения кода функции.
|
|
22
|
+
///
|
|
23
|
+
/// Функция автоматически определяет язык сообщения на 4
|
|
24
|
+
/// основе глобальной конфигурации проекта
|
|
25
|
+
/// (`$set-loglang`). Если язык установлен как
|
|
26
|
+
/// 'en' — используется англоязычное сообщение, во
|
|
27
|
+
/// всех остальных случаях — русскоязычное. Это
|
|
28
|
+
/// обеспечивает обратную совместимость и
|
|
29
|
+
/// предсказуемое поведение.
|
|
30
|
+
///
|
|
31
|
+
/// В зависимости от переданного типа логирования (`$type`)
|
|
32
|
+
/// функция использует разные директивы Sass:
|
|
33
|
+
/// - `debug` — выводит сообщение синим цветом через `@debug`
|
|
34
|
+
/// - `warn` — выводит предупреждение жёлтым цветом через `@warn`
|
|
35
|
+
/// - `error` — выбрасывает критическую ошибку красным цветом
|
|
36
|
+
/// через `@error`, которая останавливает компиляцию
|
|
37
|
+
///
|
|
38
|
+
/// Если передан неподдерживаемый тип логирования, функция
|
|
39
|
+
/// делегирует обработку ошибки вспомогательной функции
|
|
40
|
+
/// `log-invalid-value`, которая сгенерирует соответствующее
|
|
41
|
+
/// сообщение о недопустимом значении параметра.
|
|
42
|
+
///
|
|
43
|
+
/// Функция всегда возвращает `null`, что позволяет использовать
|
|
44
|
+
/// её в выражениях, не влияя на возвращаемые значения других
|
|
45
|
+
/// функций, но при этом гарантируя выполнение побочного эффекта
|
|
46
|
+
/// (вывод сообщения в консоль).
|
|
47
|
+
/// ---
|
|
48
|
+
/// @name log
|
|
49
|
+
/// @group utilities-loggers
|
|
50
|
+
/// @since 2026.03.18
|
|
51
|
+
/// @access public
|
|
52
|
+
/// @author Murad Rustamov (therteenten)
|
|
53
|
+
/// @link https://sourcecraft.dev/users/therteenten/overview SourceCraft - therteenten
|
|
54
|
+
/// @link https://sourcecraft.dev/omnisass/library SourceCraft - OmniSass
|
|
55
|
+
/// @link https://sass-lang.com/documentation/at-rules/debug См. также: Официальная документация Sass - Директива @debug
|
|
56
|
+
/// @link https://sass-lang.com/documentation/at-rules/warn См. также: Официальная документация Sass - Директива @warn
|
|
57
|
+
/// @link https://sass-lang.com/documentation/at-rules/error См. также: Официальная документация Sass - Директива @error
|
|
58
|
+
/// @link https://sass-lang.com/documentation/values/maps См. также: Официальная документация Sass - Тип данных "Карты" (`maps`)
|
|
59
|
+
/// @link https://sass-lang.com/documentation/modules/map#get См. также: Официальная документация Sass - Функция `map.get()`
|
|
60
|
+
/// @link https://developer.mozilla.org/en-US/docs/Web/API/console См. также: MDN Web Docs - Консоль браузера (console)
|
|
61
|
+
/// @link https://developer.mozilla.org/en-US/docs/Web/API/console/debug См. также: MDN Web Docs - console.debug()
|
|
62
|
+
/// @link https://developer.mozilla.org/en-US/docs/Web/API/console/warn См. также: MDN Web Docs - console.warn()
|
|
63
|
+
/// @link https://developer.mozilla.org/en-US/docs/Web/API/console/error См. также: MDN Web Docs - console.error()
|
|
64
|
+
/// @link https://sass-guidelin.es/ru/#debugging См. также: Sass Guidelines - Отладка и логирование
|
|
65
|
+
/// @link https://css-tricks.com/debugging-sass/ См. также: CSS-Tricks - Отладка Sass
|
|
66
|
+
/// @link https://www.sitepoint.com/sass-basics-debug-warn-error/ См. также: SitePoint - Основы Sass: @debug, @warn и @error
|
|
67
|
+
/// @link https://dev.to/kennethlum/using-sass-s-map-for-logging-2c1d См. также: Dev.to - Использование карт Sass для логирования
|
|
68
|
+
/// @link https://stackoverflow.com/questions/20333659/sass-debug-warnings-and-errors См. также: Stack Overflow - Отладка, предупреждения и ошибки в Sass
|
|
69
|
+
/// @link https://habr.com/ru/post/449342/ См. также: Habr - Sass: @debug, @warn, @error для отладки
|
|
70
|
+
/// @link https://www.youtube.com/watch?v=9G2TlF1j6sM См. также: YouTube - Отладка Sass с помощью @debug и @warn
|
|
71
|
+
/// @link https://www.npmjs.com/package/sass См. также: npm - Документация пакета Dart Sass
|
|
72
|
+
/// @link https://github.com/sass/sass/tree/main/spec См. также: GitHub - Спецификация языка Sass
|
|
73
|
+
/// @link https://en.wikipedia.org/wiki/Log_level См. также: Wikipedia - Уровни логирования
|
|
74
|
+
/// @link https://www.atatus.com/blog/log-levels-explained/ См. также: Atatus Blog - Объяснение уровней логирования
|
|
75
|
+
/// @link https://www.marshall.edu/at/wp-content/uploads/AT-Logging-Levels-Explained.pdf См. также: Marshall University - Уровни логирования (PDF)
|
|
76
|
+
/// @link https://www.w3.org/TR/css3-color/ См. также: W3C - Спецификация CSS Color Module
|
|
77
|
+
/// @link https://developer.mozilla.org/en-US/docs/Web/CSS/color См. также: MDN Web Docs - CSS свойство color
|
|
78
|
+
/// @example scss - Базовая отладка на разных языках
|
|
79
|
+
/// // Конфигурация: libconfigs.$set-loglang: 'ru'
|
|
80
|
+
/// $message-ru: (
|
|
81
|
+
/// ru: 'Начало компиляции темы',
|
|
82
|
+
/// en: 'Theme compilation started'
|
|
83
|
+
/// );
|
|
84
|
+
/// @debug log($message-ru); // 🟦 Начало компиляции темы
|
|
85
|
+
///
|
|
86
|
+
/// // Конфигурация: libconfigs.$set-loglang: 'en'
|
|
87
|
+
/// @debug log($message-ru); // 🟦 Theme compilation started
|
|
88
|
+
///
|
|
89
|
+
/// @example scss - Использование в миксине с предупреждением
|
|
90
|
+
/// @mixin deprecated($old-name, $new-name) {
|
|
91
|
+
/// $warning: (
|
|
92
|
+
/// ru: 'Миксин #{$old-name} устарел. Используйте #{$new-name}',
|
|
93
|
+
/// en: 'Mixin #{$old-name} is deprecated. Use #{$new-name} instead'
|
|
94
|
+
/// );
|
|
95
|
+
/// @debug log($warning, 'warn');
|
|
96
|
+
/// @content;
|
|
97
|
+
/// }
|
|
98
|
+
///
|
|
99
|
+
/// @include deprecated('border-radius-old', 'border-radius') {
|
|
100
|
+
/// border-radius: 4px;
|
|
101
|
+
/// }
|
|
102
|
+
///
|
|
103
|
+
/// @example scss - Сложное сообщение с динамическими данными
|
|
104
|
+
/// @function validate-color($color, $context) {
|
|
105
|
+
/// @if type-of($color) != 'color' {
|
|
106
|
+
/// $message: (
|
|
107
|
+
/// ru: 'В контексте "#{$context}" передано невалидное значение цвета: #{$color}',
|
|
108
|
+
/// en: 'Invalid color value "#{$color}" passed in context: #{$context}'
|
|
109
|
+
/// );
|
|
110
|
+
/// @return log($message, 'error');
|
|
111
|
+
/// }
|
|
112
|
+
/// @return $color;
|
|
113
|
+
/// }
|
|
114
|
+
///
|
|
115
|
+
/// $primary: validate-color(#ff0000, 'theme'); // нормально
|
|
116
|
+
/// $primary: validate-color('red', 'theme'); // 🟥 Invalid color value...
|
|
117
|
+
///
|
|
118
|
+
/// @example scss - Неподдерживаемый тип логирования
|
|
119
|
+
/// $message: (
|
|
120
|
+
/// ru: 'Тестовое сообщение',
|
|
121
|
+
/// en: 'Test message'
|
|
122
|
+
/// );
|
|
123
|
+
/// @debug log($message, 'invalid-type'); // вызовет log-invalid-value
|
|
124
|
+
///
|
|
125
|
+
/// @param {Map} $message-map - Карта с сообщениями для разных языков.
|
|
126
|
+
/// Должна содержать ключи 'ru' и 'en' со строковыми значениями.
|
|
127
|
+
/// Пример: `(ru: 'Привет', en: 'Hello')`.
|
|
128
|
+
/// @param {String} $type ['debug'] - Тип логирования.
|
|
129
|
+
/// Поддерживаемые значения: 'debug', 'warn', 'error'.
|
|
130
|
+
/// По умолчанию используется 'debug'.
|
|
131
|
+
/// @return {Null} - Всегда возвращает `null`. Это позволяет
|
|
132
|
+
/// использовать функцию в выражениях, где ожидается возврат
|
|
133
|
+
/// значения, но при этом необходим побочный эффект в виде
|
|
134
|
+
/// вывода сообщения в консоль.
|
|
135
|
+
/// @throws {Error} - Выбрасывает ошибку через директиву `@error`,
|
|
136
|
+
/// если передан тип `'error'`. Ошибка содержит локализованное
|
|
137
|
+
/// сообщение из карты с префиксом в виде красного квадрата.
|
|
138
|
+
/// @throws {Warning} - Выводит предупреждение через директиву
|
|
139
|
+
/// `@warn`, если передан тип `'warn'`. Предупреждение содержит
|
|
140
|
+
/// локализованное сообщение с префиксом в виде жёлтого квадрата.
|
|
141
|
+
/// @require {variable} $set-loglang - Глобальная переменная,
|
|
142
|
+
/// определяющая язык сообщений. Поддерживает значения `'ru'`
|
|
143
|
+
/// (русский) и другие (английский).
|
|
144
|
+
@function log(
|
|
145
|
+
$message-map,
|
|
146
|
+
$type: 'debug') {
|
|
147
|
+
|
|
148
|
+
// Получаем язык сообщений из глобальной конфигурации.
|
|
149
|
+
// Поддерживаются два режима: 'ru' (русский) и
|
|
150
|
+
// 'en' — английский.
|
|
151
|
+
$-loglang: libconfigs.$set-loglang;
|
|
152
|
+
|
|
153
|
+
// Переменная для хранения финального сообщения
|
|
154
|
+
// после выбора языка.
|
|
155
|
+
$-log-message: null;
|
|
156
|
+
|
|
157
|
+
// Выбираем сообщение в зависимости от языка.
|
|
158
|
+
// Если язык 'en' — используем английский текст из карты,
|
|
159
|
+
// для всех остальных случаев — русский.
|
|
160
|
+
@if $-loglang == 'en' {
|
|
161
|
+
|
|
162
|
+
// Извлекаем английскую версию сообщения из карты.
|
|
163
|
+
// Ключ 'en' должен присутствовать в карте обязательно.
|
|
164
|
+
$-log-message: map.get($message-map, en);
|
|
165
|
+
|
|
166
|
+
} @else {
|
|
167
|
+
|
|
168
|
+
// Извлекаем русскую версию сообщения из карты.
|
|
169
|
+
// Ключ 'ru' должен присутствовать в карте обязательно.
|
|
170
|
+
$-log-message: map.get($message-map, ru);
|
|
171
|
+
|
|
172
|
+
}
|
|
173
|
+
|
|
174
|
+
// Отображаем в консоли название и версию библиотеки.
|
|
175
|
+
@debug '⬛ #{package.$title} v#{package.$version} (#{package.$package})';
|
|
176
|
+
|
|
177
|
+
// Обрабатываем тип логирования и выводим сообщение
|
|
178
|
+
// соответствующим способом.
|
|
179
|
+
@if $type == 'debug' {
|
|
180
|
+
|
|
181
|
+
// Отладочное сообщение — не останавливает компиляцию,
|
|
182
|
+
// выводится только при включённом режиме отладки.
|
|
183
|
+
// Синий квадрат используется для визуального отличия.
|
|
184
|
+
@debug '🟦 #{$-log-message}';
|
|
185
|
+
|
|
186
|
+
} @else if $type == 'warn' {
|
|
187
|
+
|
|
188
|
+
// Предупреждение — не останавливает компиляцию,
|
|
189
|
+
// но выводится всегда, показывая потенциальные проблемы.
|
|
190
|
+
// Жёлтый квадрат привлекает внимание к предупреждению.
|
|
191
|
+
@warn '🟨 #{$-log-message}';
|
|
192
|
+
|
|
193
|
+
} @else if $type == 'error' {
|
|
194
|
+
|
|
195
|
+
// Критическая ошибка — ПОЛНОСТЬЮ ОСТАНАВЛИВАЕТ компиляцию.
|
|
196
|
+
// Красный квадрат сигнализирует о серьёзной проблеме.
|
|
197
|
+
@error '🟥 #{$-log-message}';
|
|
198
|
+
|
|
199
|
+
} @else {
|
|
200
|
+
|
|
201
|
+
// Если передан неподдерживаемый тип логирования,
|
|
202
|
+
// делегируем обработку ошибки вспомогательной функции.
|
|
203
|
+
// log-invalid-value сгенерирует сообщение о том,
|
|
204
|
+
// какие типы логирования допустимы.
|
|
205
|
+
@return log-invalid-value(
|
|
206
|
+
'log',
|
|
207
|
+
$type,
|
|
208
|
+
'$type',
|
|
209
|
+
('debug', 'warn', 'error')
|
|
210
|
+
);
|
|
211
|
+
|
|
212
|
+
}
|
|
213
|
+
|
|
214
|
+
// Функция всегда возвращает null, чтобы не влиять
|
|
215
|
+
// на возвращаемые значения вызывающих функций,
|
|
216
|
+
// но при этом гарантировать выполнение побочного эффекта.
|
|
217
|
+
@return null;
|
|
218
|
+
|
|
219
|
+
}
|
|
@@ -0,0 +1,243 @@
|
|
|
1
|
+
@use 'sass:map';
|
|
2
|
+
@use 'sass:list';
|
|
3
|
+
@use '../../loggers/log-invalid-type' as *;
|
|
4
|
+
@use '../../loggers/log' as *;
|
|
5
|
+
@use '../../validators/type-of/is-map' as *;
|
|
6
|
+
|
|
7
|
+
/// Устанавливает значение во вложенную карту по цепочке ключей.
|
|
8
|
+
///
|
|
9
|
+
/// Функция позволяет безопасно обновить значение в глубоко
|
|
10
|
+
/// вложенной структуре карт, создавая недостающие уровни
|
|
11
|
+
/// автоматически. В отличие от стандартного `map.merge()`,
|
|
12
|
+
/// эта функция работает с произвольной вложенностью и
|
|
13
|
+
/// сохраняет неизменёнными все остальные части структуры.
|
|
14
|
+
/// Это особенно полезно при работе с темами, конфигурациями
|
|
15
|
+
/// и другими сложными древовидными данными.
|
|
16
|
+
///
|
|
17
|
+
/// Функция использует двухпроходной алгоритм:
|
|
18
|
+
/// 1. Сначала собирает все уровни карты по пути следования
|
|
19
|
+
/// 2. Затем рекурсивно собирает новую карту, подставляя
|
|
20
|
+
/// обновлённое значение на нужном уровне
|
|
21
|
+
///
|
|
22
|
+
/// Важные особенности функции:
|
|
23
|
+
/// - Сохраняет неизменными все не затронутые обновлением части
|
|
24
|
+
/// - Автоматически создаёт недостающие уровни карты
|
|
25
|
+
/// - Предупреждает о переопределении карты значением
|
|
26
|
+
/// - Останавливается с ошибкой при отсутствии ключа
|
|
27
|
+
/// - Работает с любым уровнем вложенности
|
|
28
|
+
/// - Возвращает полностью новую карту, не мутируя исходную
|
|
29
|
+
/// - Поддерживает любые типы значений (строки, числа, списки)
|
|
30
|
+
/// - Интегрируется с системой логирования для отладки
|
|
31
|
+
/// - Позволяет безопасно обновлять конфигурации тем
|
|
32
|
+
/// - Упрощает работу с глубокими структурами данных
|
|
33
|
+
/// ---
|
|
34
|
+
/// @name set-map-item
|
|
35
|
+
/// @group utilities-setters
|
|
36
|
+
/// @since 2026.01.14
|
|
37
|
+
/// @access public
|
|
38
|
+
/// @author Murad Rustamov (therteenten) [адаптация]
|
|
39
|
+
/// @author Kitty Giraudel
|
|
40
|
+
/// @link https://sourcecraft.dev/users/therteenten/overview SourceCraft - therteenten
|
|
41
|
+
/// @link https://sourcecraft.dev/omnisass/library SourceCraft - OmniSass
|
|
42
|
+
/// @link https://github.com/KittyGiraudel GitHub - Kitty Giraudel
|
|
43
|
+
/// @link https://sass-lang.com/documentation/values/maps См. также: Официальная документация Sass - Тип данных "Карты" (`maps`)
|
|
44
|
+
/// @link https://sass-lang.com/documentation/modules/map См. также: Официальная документация Sass - Модуль `sass:map`
|
|
45
|
+
/// @link https://sass-lang.com/documentation/modules/map#merge См. также: Официальная документация Sass - Функция `map.merge()`
|
|
46
|
+
/// @link https://sass-lang.com/documentation/modules/map#get См. также: Официальная документация Sass - Функция `map.get()`
|
|
47
|
+
/// @link https://sass-lang.com/documentation/modules/list См. также: Официальная документация Sass - Модуль `sass:list`
|
|
48
|
+
/// @link https://sass-lang.com/documentation/at-rules/function См. также: Официальная документация Sass - Правило `@function`
|
|
49
|
+
/// @link https://sass-guidelin.es/ru/#maps-1 См. также: Sass Guidelines - Манипуляции с картами
|
|
50
|
+
/// @link https://css-tricks.com/snippets/sass/deep-getset-maps/ См. также: CSS-Tricks - Deep Get/Set для Sass Maps
|
|
51
|
+
/// @link https://www.sitepoint.com/using-sass-maps/ См. также: SitePoint - Использование карт Sass
|
|
52
|
+
/// @link https://www.smashingmagazine.com/2015/07/real-work-sass-maps/ См. также: Smashing Magazine - Реальная работа с картами Sass
|
|
53
|
+
/// @link https://dev.to/marcelle/understanding-sass-maps-3fhj См. также: Dev.to - Понимание карт Sass
|
|
54
|
+
/// @link https://code.tutsplus.com/tutorials/an-introduction-to-sass-maps--cms-22138 См. также: Envato Tuts+ - Введение в карты Sass
|
|
55
|
+
/// @link https://habr.com/ru/post/309656/ См. также: Habr - Карты данных (maps) в Sass
|
|
56
|
+
/// @link https://htmlacademy.ru/blog/boost/tools/sass-maps См. также: HTML Academy - Sass-карты: практическое руководство
|
|
57
|
+
/// @link https://ru.hexlet.io/courses/sass-basics/lessons/maps/theory_unit См. также: Hexlet - Карты в Sass
|
|
58
|
+
/// @link https://www.youtube.com/watch?v=6kUo6lBF0Cc См. также: YouTube - Работа с картами в Sass
|
|
59
|
+
/// @link https://www.youtube.com/watch?v=WSfRZjyUTgg См. также: YouTube - Продвинутая работа с картами Sass
|
|
60
|
+
/// @link https://stackoverflow.com/questions/37705095/sass-get-value-from-nested-map См. также: Stack Overflow - Получение значения из вложенной карты
|
|
61
|
+
/// @link https://stackoverflow.com/questions/40774889/sass-update-nested-map-value См. также: Stack Overflow - Обновление значения во вложенной карте
|
|
62
|
+
/// @link https://stackoverflow.com/questions/47802171/sass-merge-nested-maps См. также: Stack Overflow - Слияние вложенных карт
|
|
63
|
+
/// @link https://github.com/sass/sass/tree/main/spec См. также: GitHub - Спецификация языка Sass
|
|
64
|
+
/// @link https://www.npmjs.com/package/sass См. также: npm - Пакет Dart Sass
|
|
65
|
+
/// @link https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Map См. также: MDN Web Docs - JavaScript объект Map
|
|
66
|
+
/// @link https://en.wikipedia.org/wiki/Associative_array См. также: Wikipedia - Ассоциативный массив
|
|
67
|
+
/// @link https://en.wikipedia.org/wiki/Tree_(data_structure) См. также: Wikipedia - Древовидные структуры данных
|
|
68
|
+
/// @link https://ru.wikipedia.org/wiki/%D0%90%D1%81%D1%81%D0%BE%D1%86%D0%B8%D0%B0%D1%82%D0%B8%D0%B2%D0%BD%D1%8B%D0%B9_%D0%BC%D0%B0%D1%81%D1%81%D0%B8%D0%B2 См. также: Wikipedia - Ассоциативный массив (рус.)
|
|
69
|
+
/// @example scss - Базовое использование с плоской картой
|
|
70
|
+
/// $breakpoints: (
|
|
71
|
+
/// mobile: 480px,
|
|
72
|
+
/// tablet: 768px
|
|
73
|
+
/// );
|
|
74
|
+
///
|
|
75
|
+
/// @debug set-map-item($breakpoints, (desktop), 1024px); // Результат: (mobile: 480px, tablet: 768px, desktop: 1024px)
|
|
76
|
+
///
|
|
77
|
+
/// @example scss - Обновление значения во вложенной карте
|
|
78
|
+
/// $theme: (
|
|
79
|
+
/// colors: (
|
|
80
|
+
/// primary: #3498db,
|
|
81
|
+
/// secondary: #2ecc71
|
|
82
|
+
/// ),
|
|
83
|
+
/// fonts: (
|
|
84
|
+
/// base: 16px,
|
|
85
|
+
/// headings: (
|
|
86
|
+
/// h1: 2rem,
|
|
87
|
+
/// h2: 1.5rem
|
|
88
|
+
/// )
|
|
89
|
+
/// )
|
|
90
|
+
/// );
|
|
91
|
+
///
|
|
92
|
+
/// @debug set-map-item($theme, (colors, primary), #e74c3c); // Debug: (colors: (primary: #e74c3c, secondary: #2ecc71), fonts: (base: 16px, headings: (h1: 2rem, h2: 1.5rem)))
|
|
93
|
+
///
|
|
94
|
+
/// @example scss - Создание новых уровней вложенности
|
|
95
|
+
/// $config: (
|
|
96
|
+
/// api: (
|
|
97
|
+
/// version: 'v1'
|
|
98
|
+
/// )
|
|
99
|
+
/// );
|
|
100
|
+
///
|
|
101
|
+
/// @debug set-map-item(
|
|
102
|
+
/// $config,
|
|
103
|
+
/// (api, endpoints, users),
|
|
104
|
+
/// '/api/v1/users'
|
|
105
|
+
/// ); // Error: "🟥 Ключ «endpoints» не существует на текущем уровне карты."
|
|
106
|
+
///
|
|
107
|
+
/// @param {Map} $map - Исходная карта, в которую
|
|
108
|
+
/// устанавливается значение. Остаётся неизменной,
|
|
109
|
+
/// функция возвращает новую карту.
|
|
110
|
+
/// @param {List} $keys - Список ключей, образующих путь
|
|
111
|
+
/// к месту установки значения. Ключи перечисляются
|
|
112
|
+
/// последовательно, от внешнего уровня к внутреннему.
|
|
113
|
+
/// @param {*} $value - Значение, которое нужно установить
|
|
114
|
+
/// по указанному пути. Может быть любого типа: строка,
|
|
115
|
+
/// число, список, карта и т.д.
|
|
116
|
+
/// @return {Map} - Новая карта с установленным значением.
|
|
117
|
+
/// Исходная карта остаётся неизменной.
|
|
118
|
+
/// @throws {Error} - Выбрасывает ошибку через функцию
|
|
119
|
+
/// `log()`, если промежуточный ключ не существует
|
|
120
|
+
/// на своём уровне карты.
|
|
121
|
+
/// @throws {Warning} - Выводит предупреждение через
|
|
122
|
+
/// функцию `log()`, если последний ключ является картой.
|
|
123
|
+
/// Предупреждение информирует о том, что карта будет
|
|
124
|
+
/// переопределена новым значением.
|
|
125
|
+
@function set-map-item($map, $keys, $value) {
|
|
126
|
+
|
|
127
|
+
// Создаём список для хранения всех уровней карты,
|
|
128
|
+
// которые мы встретим при прохождении по ключам.
|
|
129
|
+
// Начинаем с исходной карты.
|
|
130
|
+
$-maps: ($map,);
|
|
131
|
+
|
|
132
|
+
$key: null;
|
|
133
|
+
|
|
134
|
+
// Переменная для хранения результата сборки.
|
|
135
|
+
// Будет заполнена на втором проходе.
|
|
136
|
+
$-result: null;
|
|
137
|
+
|
|
138
|
+
// Проверяем, не пытается ли пользователь переопределить
|
|
139
|
+
// карту значением. Если последний ключ — это карта,
|
|
140
|
+
// предупреждаем об этом, потому что карта будет заменена
|
|
141
|
+
// на новое значение, что может привести к потере данных.
|
|
142
|
+
@if is-map(list.nth($keys, -1)) {
|
|
143
|
+
|
|
144
|
+
// Сообщение предупреждения о переопределении карты.
|
|
145
|
+
// Содержит значение, которым будет заменена карта.
|
|
146
|
+
$-log-map-key-override: (
|
|
147
|
+
en: 'The last key you specified is a map; it will be redefined using «#{$value}».',
|
|
148
|
+
ru: 'Последний указанный вами ключ — это карта; он будет переопределен с помощью «#{$value}».'
|
|
149
|
+
);
|
|
150
|
+
|
|
151
|
+
// Выводим предупреждение через систему логирования
|
|
152
|
+
// и возвращаем null (логирование само вернёт null).
|
|
153
|
+
@return log($-log-map-key-override, 'warn');
|
|
154
|
+
|
|
155
|
+
}
|
|
156
|
+
|
|
157
|
+
// Проверяем, что первый аргумент действительно
|
|
158
|
+
// является картой.
|
|
159
|
+
@if not is-map($map) {
|
|
160
|
+
|
|
161
|
+
// Если это не так, вызываем функцию логирования ошибки
|
|
162
|
+
// и возвращаем её результат.
|
|
163
|
+
// Функция log-invalid-type должна обработать некорректный
|
|
164
|
+
// тип и вернуть null (или выбросить ошибку в зависимости
|
|
165
|
+
// от настроек).
|
|
166
|
+
@return log-invalid-type(
|
|
167
|
+
'set-map-item',
|
|
168
|
+
$map,
|
|
169
|
+
'$map',
|
|
170
|
+
'map'
|
|
171
|
+
);
|
|
172
|
+
|
|
173
|
+
}
|
|
174
|
+
|
|
175
|
+
// Если передан только один ключ, используем простой map.merge().
|
|
176
|
+
// Это оптимизация для частного случая плоской карты.
|
|
177
|
+
@if list.length($keys) == 1 {
|
|
178
|
+
@return map.merge($map, ($keys: $value));
|
|
179
|
+
}
|
|
180
|
+
|
|
181
|
+
// ПЕРВЫЙ ПРОХОД: Собираем все уровни карты
|
|
182
|
+
// Проходим по всем ключам, кроме последнего (последний
|
|
183
|
+
// будет заменён новым значением).
|
|
184
|
+
@for $-i from 1 through list.length($keys) - 1 {
|
|
185
|
+
|
|
186
|
+
// Текущий ключ из списка ключей
|
|
187
|
+
$-current-key: list.nth($keys, $-i);
|
|
188
|
+
|
|
189
|
+
// Текущая карта (последняя добавленная в $-maps)
|
|
190
|
+
$-current-map: list.nth($-maps, -1);
|
|
191
|
+
|
|
192
|
+
// Пытаемся получить значение по текущему ключу
|
|
193
|
+
$-current-get: map.get($-current-map, $-current-key);
|
|
194
|
+
|
|
195
|
+
// Если ключ не существует на текущем уровне,
|
|
196
|
+
// это критическая ошибка — мы не можем продолжить.
|
|
197
|
+
@if $-current-get == null {
|
|
198
|
+
|
|
199
|
+
// Сообщение об ошибке отсутствия ключа.
|
|
200
|
+
// Указывает, какой именно ключ не найден.
|
|
201
|
+
$-log-map-key-missing: (
|
|
202
|
+
en: 'The key «#{$-current-key}» does not exist at the current map level.',
|
|
203
|
+
ru: 'Ключ «#{$-current-key}» не существует на текущем уровне карты.'
|
|
204
|
+
);
|
|
205
|
+
|
|
206
|
+
// Выбрасываем ошибку через систему логирования.
|
|
207
|
+
// Ошибка остановит компиляцию.
|
|
208
|
+
@return log($-log-map-key-missing, 'error');
|
|
209
|
+
|
|
210
|
+
}
|
|
211
|
+
|
|
212
|
+
// Добавляем найденное значение в список карт.
|
|
213
|
+
// Оно станет текущей картой для следующей итерации.
|
|
214
|
+
$-maps: list.append($-maps, $-current-get);
|
|
215
|
+
|
|
216
|
+
}
|
|
217
|
+
|
|
218
|
+
// ВТОРОЙ ПРОХОД: Собираем новую карту снизу вверх
|
|
219
|
+
// Идём от последнего уровня к первому, встраивая
|
|
220
|
+
// обновлённые значения.
|
|
221
|
+
@for $-i from list.length($-maps) through 1 {
|
|
222
|
+
|
|
223
|
+
// Текущая карта для этого уровня
|
|
224
|
+
$-current-map: list.nth($-maps, $-i);
|
|
225
|
+
|
|
226
|
+
// Ключ для этого уровня
|
|
227
|
+
$-current-key: list.nth($keys, $-i);
|
|
228
|
+
|
|
229
|
+
// Определяем значение, которое нужно установить:
|
|
230
|
+
// - Если это последний уровень, используем переданное $value
|
|
231
|
+
// - Иначе используем результат предыдущей сборки ($-result)
|
|
232
|
+
$-current-val: if(sass($-i == list.length($-maps)): $value; else: $-result);
|
|
233
|
+
|
|
234
|
+
// Объединяем текущую карту с новым значением по ключу
|
|
235
|
+
// Результат сохраняем в $-result для следующего уровня
|
|
236
|
+
$-result: map.merge($-current-map, ($-current-key: $-current-val));
|
|
237
|
+
|
|
238
|
+
}
|
|
239
|
+
|
|
240
|
+
// Возвращаем полностью собранную новую карту
|
|
241
|
+
@return $-result;
|
|
242
|
+
|
|
243
|
+
}
|
package/package.json
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@omnisass/library",
|
|
3
|
-
"version": "0.4.1",
|
|
4
3
|
"description": "Библиотека функций и миксинов, написанная на языке CSS-препроцессора Sass. Она предназначена для того, чтобы упростить, ускорить и улучшить процесс создания стилей для веб-сайтов.",
|
|
4
|
+
"version": "0.5.0",
|
|
5
5
|
"main": "index.scss",
|
|
6
6
|
"scripts": {
|
|
7
|
-
"test": "sass playground/:playground/",
|
|
8
|
-
"test-
|
|
9
|
-
"
|
|
10
|
-
"
|
|
11
|
-
"
|
|
7
|
+
"test:sass": "sass playground/:playground/",
|
|
8
|
+
"test:sass-watch": "sass playground/:playground/ --watch",
|
|
9
|
+
"test:sassdoc": "npx sassdoc ./ --config ./.sassdoc.yaml",
|
|
10
|
+
"test": "npm run test:sass && npm run test:sassdoc",
|
|
11
|
+
"script:bump-version": "sh .omnisass/scripts/bump-version.sh"
|
|
12
12
|
},
|
|
13
13
|
"exports": {
|
|
14
14
|
".": {
|
|
@@ -17,18 +17,27 @@
|
|
|
17
17
|
},
|
|
18
18
|
"keywords": [
|
|
19
19
|
"sass",
|
|
20
|
-
"scss",
|
|
21
|
-
"omnisass",
|
|
22
|
-
"therteenten",
|
|
23
|
-
"css",
|
|
24
|
-
"mixin",
|
|
25
|
-
"function",
|
|
26
20
|
"sass-mixin",
|
|
27
21
|
"sass-function",
|
|
28
|
-
"
|
|
22
|
+
"sass-utilities",
|
|
23
|
+
"sass-framework",
|
|
24
|
+
"scss",
|
|
25
|
+
"scss-mixin",
|
|
29
26
|
"scss-function",
|
|
27
|
+
"scss-utilities",
|
|
28
|
+
"scss-framework",
|
|
29
|
+
"css",
|
|
30
|
+
"web",
|
|
30
31
|
"web-development",
|
|
31
|
-
"
|
|
32
|
+
"web-design",
|
|
33
|
+
"web-frontend",
|
|
34
|
+
"colors",
|
|
35
|
+
"mixin",
|
|
36
|
+
"function",
|
|
37
|
+
"omnisass",
|
|
38
|
+
"sassify",
|
|
39
|
+
"kalium19",
|
|
40
|
+
"therteenten"
|
|
32
41
|
],
|
|
33
42
|
"repository": {
|
|
34
43
|
"type": "git",
|
|
@@ -40,15 +49,15 @@
|
|
|
40
49
|
"url": "https://sourcecraft.dev/users/therteenten/overview"
|
|
41
50
|
},
|
|
42
51
|
"license": "MIT",
|
|
52
|
+
"homepage": "https://sourcecraft.dev/therteenten",
|
|
43
53
|
"bugs": {
|
|
44
54
|
"url": "https://sourcecraft.dev/omnisass/library/issues",
|
|
45
55
|
"email": "therteenten@ya.ru"
|
|
46
56
|
},
|
|
47
|
-
"homepage": "https://sourcecraft.dev/therteenten",
|
|
48
57
|
"devDependencies": {
|
|
49
58
|
"sassdoc": "^2.7.4"
|
|
50
59
|
},
|
|
51
60
|
"dependencies": {
|
|
52
|
-
"sass": "^1.
|
|
61
|
+
"sass": "^1.98.0"
|
|
53
62
|
}
|
|
54
63
|
}
|
package/package.scss
CHANGED
|
@@ -6,6 +6,9 @@
|
|
|
6
6
|
/// библиотеку, и, как правило, не требуют модификации
|
|
7
7
|
/// (за исключением переменной `$version`, которая подлежит
|
|
8
8
|
/// обновлению посредством скрипта bump-version.sh).
|
|
9
|
+
///
|
|
10
|
+
/// При использовании этого модуля пространство имён для этих
|
|
11
|
+
/// конфигов рекомендуется указывать как `package`.
|
|
9
12
|
/// ---
|
|
10
13
|
/// @group package
|
|
11
14
|
////
|
|
@@ -53,7 +56,14 @@ $description: "Набор утилит, миксинов, расширений
|
|
|
53
56
|
/// @name version
|
|
54
57
|
/// @access private
|
|
55
58
|
/// @type String | Number
|
|
56
|
-
$version: "0.
|
|
59
|
+
$version: "0.5.0";
|
|
60
|
+
|
|
61
|
+
/// Цвет бренда проекта. Может быть использована открыто.
|
|
62
|
+
/// ---
|
|
63
|
+
/// @name color
|
|
64
|
+
/// @access private
|
|
65
|
+
/// @type Color
|
|
66
|
+
$color: #e91e63;
|
|
57
67
|
|
|
58
68
|
/// Тип лицензии библиотеки - используется для указания
|
|
59
69
|
/// условий использования и распространения.
|
package/CHANGELOG.md
DELETED
|
@@ -1,122 +0,0 @@
|
|
|
1
|
-
# История изменений OmniSass
|
|
2
|
-
Обратите внимание, что данный текст представляет собой краткое изложение истории разработки проекта по версиям. Для более детального ознакомления с изменениями рекомендуется обратиться к соответствующему [разделу](https://sourcecraft.dev/omnisass/library/commits/?rev=master) в SourceCraft.
|
|
3
|
-
|
|
4
|
-
## v0.4.0 - Public Alpha Release
|
|
5
|
-
{% note info %}
|
|
6
|
-
|
|
7
|
-
Данная версия библиотеки включает завершённую реализацию функций, построенных на основе встроенного модуля `sass:string`. В фокусе следующего релиза — разработка функциональности с использованием модуля `sass:map`.
|
|
8
|
-
|
|
9
|
-
{% endnote %}
|
|
10
|
-
|
|
11
|
-
### Добавленные новые Sass-функции
|
|
12
|
-
#### Вспомогательные функции
|
|
13
|
-
- **string-count** - Подсчитывает количество вхождений подстроки в строку.
|
|
14
|
-
- **string-reverse** - Переворачивает строку (меняет порядок символов на обратный).
|
|
15
|
-
- **string-lorips** - Генерирует текст-заполнитель на основе указанного списка слов.
|
|
16
|
-
- **string-repeat** - Повторяет строку указанное количество раз.
|
|
17
|
-
|
|
18
|
-
#### Функции для получения значений
|
|
19
|
-
- **get-string-hash** - Вычисляет числовой хеш-код для строки по алгоритму DJB2.
|
|
20
|
-
- **get-uid** - Генерирует уникальный строковый идентификатор с префиксом.
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
## v0.3.0 - Public Alpha Release
|
|
24
|
-
{% note warning "Примечание" %}
|
|
25
|
-
|
|
26
|
-
В списке изменений к версии 0.3.0 будут указаны все изменения, внесённые в предыдущих версиях, поскольку ранее они не фиксировались в документации.
|
|
27
|
-
|
|
28
|
-
{% endnote %}
|
|
29
|
-
|
|
30
|
-
### Добавленные новые Sass-функции
|
|
31
|
-
#### Конверторы значений
|
|
32
|
-
- **convert-camel2kebab** - Конвертирует строку из `camelCase` (верблюжья нотация) в `kebab-case` (кебаб-нотация или дефисная нотация).
|
|
33
|
-
- **convert-em2px** - Конвертирует значения из относительных единиц (`em`) в пиксели (`px`).
|
|
34
|
-
- **convert-hex2rgba** - Преобразует цвет в строку формата RGBA с поддержкой прозрачности.
|
|
35
|
-
- **convert-hex2rgb** - Преобразует цвет из HEX формата в строку формата RGB.
|
|
36
|
-
- **convert-kebab2camel** - Конвертирует строку из `kebab-case` (кебаб-нотация) в `camelCase` (верблюжья нотация).
|
|
37
|
-
- **convert-kebab2snake** - Преобразует строку из `kebab-case` (кебаб-нотация) в `snake_case` (змеиная нотация).
|
|
38
|
-
- **convert-px2em** - Конвертирует значения из пикселей (`px`) в относительные единицы (`em`).
|
|
39
|
-
- **convert-px2rem** - Конвертирует значения из пикселей (`px`) в относительные единицы (`rem`).
|
|
40
|
-
- **convert-rem2px** - Конвертирует значения из относительных единиц (`rem`) в пиксели (`px`).
|
|
41
|
-
- **convert-snake2kebab** - Преобразует строку из `snake_case` (змеиная нотация) в `kebab-case` (кебаб-нотация).
|
|
42
|
-
|
|
43
|
-
#### Функции для получения значений
|
|
44
|
-
- **get-color-brightness** - Рассчитывает яркость (светлоту) цвета.
|
|
45
|
-
- **get-color-darkest** - Находит самый темный цвет в списке по значению lightness в HSL-пространстве.
|
|
46
|
-
- **get-list-item-end** - Возвращает последний элемент списка.
|
|
47
|
-
- **get-list-item-start** - Возвращает первый элемент списка.
|
|
48
|
-
- **get-list-item** - Возвращает первый или последний элемент списка.
|
|
49
|
-
- **get-number-from-percent** - Вычисляет абсолютное значение по проценту от целого.
|
|
50
|
-
- **get-number-height-by-ratio** - Вычисляет высоту на основе ширины и соотношения сторон.
|
|
51
|
-
- **get-number-max** - Находит максимальное числовое значение в списке.
|
|
52
|
-
- **get-number-min** - Находит минимальное числовое значение в списке.
|
|
53
|
-
- **get-number-percentage-of** - Вычисляет процентное отношение части к целому.
|
|
54
|
-
- **get-number-unit** - Возвращает единицы измерения числа в виде строки.
|
|
55
|
-
- **get-number-width-by-ratio** - Вычисляет ширину на основе высоты и соотношения сторон.
|
|
56
|
-
|
|
57
|
-
#### Вспомогательные функции
|
|
58
|
-
- **color-blend** - Линейная интерполяция (смешивание) между двумя цветами.
|
|
59
|
-
- **color-blend-steps** - Создает последовательность равномерно распределенных цветов между двумя точками.
|
|
60
|
-
- **color-hue-shift** - Поворачивает цветовой тон (hue) цвета на заданное количество градусов.
|
|
61
|
-
- **color-scale** - Генерирует монохромную шкалу оттенков путем затемнения базового цвета.
|
|
62
|
-
- **color-shade** - Создает затемненную версию цвета, добавляя к нему черный цвет.
|
|
63
|
-
- **color-tint** - Осветляет исходный цвет, смешивая его с белым.
|
|
64
|
-
- **color-triad** - Генерирует триадную цветовую схему из трех равноудаленных цветов.
|
|
65
|
-
- **list-dedupe** - Удаляет дублирующиеся значения из списка.
|
|
66
|
-
- **list-insert-at** - Вставляет значение в список по указанному индексу.
|
|
67
|
-
- **list-merge** - Объединяет несколько списков в один плоский список.
|
|
68
|
-
- **list-remove-at** - Удаляет элемент из списка по указанному индексу.
|
|
69
|
-
- **list-sum-numbers-safe** - Безопасно суммирует числовые значения в списке с проверкой единиц измерения.
|
|
70
|
-
- **list-sum-numbers** - Суммирует все числовые значения в списке.
|
|
71
|
-
- **url-encode** - Кодирует строку для безопасного использования в URL.
|
|
72
|
-
- **number-ceil-to** - Округляет число вверх до ближайшего кратного значения.
|
|
73
|
-
- **number-clamp-max** - Ограничивает число сверху, обеспечивая максимальное значение.
|
|
74
|
-
- **number-clamp-min** - Ограничивает число снизу, обеспечивая минимальное значение.
|
|
75
|
-
- **number-clamp** - Ограничивает число заданным диапазоном значений.
|
|
76
|
-
- **number-denormalize** - Денормализует число из единичного интервала [0, 1] в исходный диапазон.
|
|
77
|
-
- **number-fibonacci** - Генерирует последовательность чисел Фибоначчи.
|
|
78
|
-
- **number-floor-to** - Округляет число вниз до ближайшего кратного значения.
|
|
79
|
-
- **number-format-with-separator** - Форматирует число, добавляя разделители тысяч для улучшения читаемости больших чисел.
|
|
80
|
-
- **number-normalize** - Нормализует число к единичному интервалу [0, 1].
|
|
81
|
-
- **number-random-between-int** - Генерирует случайное целое число в заданном диапазоне.
|
|
82
|
-
- **number-random-between** - Генерирует случайное число в заданном диапазоне.
|
|
83
|
-
- **number-range** - Генерирует последовательность чисел в заданном диапазоне с определенным шагом.
|
|
84
|
-
- **number-round-to-nearest** - Округляет число до ближайшего кратного значения с использованием стандартного математического округления (половинки в сторону от нуля).
|
|
85
|
-
- **number-round-to** - Округляет число до указанного количества знаков после запятой.
|
|
86
|
-
- **number-strip-unit** - Удаляет единицы измерения из числа, возвращая безразмерное значение.
|
|
87
|
-
- **string-capitalize** - Преобразует первый символ строки в верхний регистр, остальные оставляет без изменений.
|
|
88
|
-
- **string-replace** - Заменяет все вхождения подстроки в строке на другую подстроку.
|
|
89
|
-
- **string-trim-end** - Удаляет пробелы с конца строки (справа).
|
|
90
|
-
- **string-trim-start** - Удаляет пробелы с начала строки (слева).
|
|
91
|
-
- **string-trim** - Удаляет пробелы с начала и конца строки.
|
|
92
|
-
|
|
93
|
-
#### Функции для логгирования
|
|
94
|
-
- **log-invalid-type** - Логирует ошибку или предупреждение о несоответствии типа параметра ожидаемым типам.
|
|
95
|
-
- **log-invalid-value** - Логирует ошибку или предупреждение о недопустимом значении параметра, когда передано значение, не входящее в список разрешенных.
|
|
96
|
-
|
|
97
|
-
#### Функции для валидации значений
|
|
98
|
-
- **is-color-light** - Определяет, является ли цвет светлым (по пороговому значению светлоты).
|
|
99
|
-
- **is-color-list** - Проверяет, что все элементы в списке являются цветами.
|
|
100
|
-
- **is-list-contained** - Проверяет, содержится ли значение в указанном списке.
|
|
101
|
-
- **is-time** - Проверяет, является ли значение корректным временным значением.
|
|
102
|
-
- **is-int-even** - Проверяет, является ли целое число четным.
|
|
103
|
-
- **is-int-odd** - Проверяет, является ли целое число нечетным.
|
|
104
|
-
- **is-int** - Проверяет, является ли число целым (integer).
|
|
105
|
-
- **is-number-has-unit** - Проверяет, имеет ли число единицы измерения.
|
|
106
|
-
- **is-number-negative** - Проверяет, является ли значение отрицательным числом.
|
|
107
|
-
- **is-number-positive** - Проверяет, является ли значение положительным числом.
|
|
108
|
-
- **is-number-unitless** - Проверяет, является ли число безразмерным.
|
|
109
|
-
- **is-number-zero** - Проверяет, является ли значение нулем (числовым нулем).
|
|
110
|
-
- **is-string-contained** - Проверяет, содержится ли подстрока в указанной строке.
|
|
111
|
-
- **is-string-empty** - Проверяет, является ли строка пустой.
|
|
112
|
-
- **is-string-ending-with** - Проверяет, заканчивается ли строка указанной подстрокой.
|
|
113
|
-
- **is-string-starting-with** - Проверяет, начинается ли строка с указанной подстроки.
|
|
114
|
-
- **is-boolean** - Проверяет, является ли переданное значение логическим типом (boolean).
|
|
115
|
-
- **is-color** - Проверяет, является ли значение допустимым цветом.
|
|
116
|
-
- **is-list** - Проверяет, является ли значение списком (list) или списком аргументов (arglist).
|
|
117
|
-
- **is-map** - Проверяет, является ли значение ассоциативным массивом (map).
|
|
118
|
-
- **is-number** - Проверяет, является ли значение числом
|
|
119
|
-
- **is-string** - Проверяет, является ли значение строкой (string)
|
|
120
|
-
- **is-type** - Возвращает тип данных переданного значения.
|
|
121
|
-
|
|
122
|
-
> Чтобы получить подробные сведения об API новых функций, посетите веб-сайт по адресу [https://omnisass.sourcecraft.site/sassdocs/](https://omnisass.sourcecraft.site/sassdocs/).
|