@omnisass/library 0.2.1 → 0.3.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/CHANGELOG.md +101 -3
- package/README.md +94 -0
- package/modules/utilities/converters/_convert-camel2kebab.scss +5 -4
- package/modules/utilities/converters/_convert-em2px.scss +5 -3
- package/modules/utilities/converters/_convert-hex2rgb.scss +4 -0
- package/modules/utilities/converters/_convert-hex2rgba.scss +5 -0
- package/modules/utilities/converters/_convert-kebab2camel.scss +5 -4
- package/modules/utilities/converters/_convert-kebab2snake.scss +4 -4
- package/modules/utilities/converters/_convert-px2em.scss +5 -4
- package/modules/utilities/converters/_convert-px2rem.scss +5 -4
- package/modules/utilities/converters/_convert-rem2px.scss +5 -3
- package/modules/utilities/converters/_convert-snake2kebab.scss +4 -4
- package/modules/utilities/getters/color/_get-color-brightness.scss +4 -0
- package/modules/utilities/getters/color/_get-color-darkest.scss +5 -1
- package/modules/utilities/getters/list/_get-list-item-end.scss +4 -2
- package/modules/utilities/getters/list/_get-list-item-start.scss +4 -2
- package/modules/utilities/getters/list/_get-list-item.scss +6 -4
- package/modules/utilities/getters/number/_get-number-from-percent.scss +6 -2
- package/modules/utilities/getters/number/_get-number-height-by-ratio.scss +5 -0
- package/modules/utilities/getters/number/_get-number-max.scss +4 -0
- package/modules/utilities/getters/number/_get-number-min.scss +4 -0
- package/modules/utilities/getters/number/_get-number-percentage-of.scss +6 -1
- package/modules/utilities/getters/number/_get-number-unit.scss +4 -2
- package/modules/utilities/getters/number/_get-number-width-by-ratio.scss +5 -0
- package/modules/utilities/helpers/color/_color-blend-steps.scss +6 -0
- package/modules/utilities/helpers/color/_color-blend.scss +6 -0
- package/modules/utilities/helpers/color/_color-hue-shift.scss +5 -0
- package/modules/utilities/helpers/color/_color-scale.scss +5 -0
- package/modules/utilities/helpers/color/_color-shade.scss +5 -0
- package/modules/utilities/helpers/color/_color-tint.scss +5 -0
- package/modules/utilities/helpers/color/_color-triad.scss +4 -1
- package/modules/utilities/helpers/list/_list-dedupe.scss +4 -0
- package/modules/utilities/helpers/list/_list-insert-at.scss +5 -0
- package/modules/utilities/helpers/list/_list-merge.scss +54 -8
- package/modules/utilities/helpers/list/_list-remove-at.scss +5 -0
- package/modules/utilities/helpers/list/_list-sum-numbers-safe.scss +3 -0
- package/modules/utilities/helpers/list/_list-sum-numbers.scss +3 -0
- package/modules/utilities/helpers/misc/_url-encode.scss +5 -6
- package/modules/utilities/helpers/number/_number-ceil-to.scss +56 -4
- package/modules/utilities/helpers/number/_number-clamp-max.scss +65 -10
- package/modules/utilities/helpers/number/_number-clamp-min.scss +65 -10
- package/modules/utilities/helpers/number/_number-clamp.scss +88 -12
- package/modules/utilities/helpers/number/_number-denormalize.scss +87 -9
- package/modules/utilities/helpers/number/_number-fibonacci.scss +62 -9
- package/modules/utilities/helpers/number/_number-floor-to.scss +57 -3
- package/modules/utilities/helpers/number/_number-format-with-separator.scss +99 -16
- package/modules/utilities/helpers/number/_number-normalize.scss +88 -10
- package/modules/utilities/helpers/number/_number-random-between-int.scss +74 -13
- package/modules/utilities/helpers/number/_number-random-between.scss +76 -15
- package/modules/utilities/helpers/number/_number-range.scss +105 -12
- package/modules/utilities/helpers/number/_number-round-to-nearest.scss +58 -1
- package/modules/utilities/helpers/number/_number-round-to.scss +65 -2
- package/modules/utilities/helpers/number/_number-strip-unit.scss +43 -9
- package/modules/utilities/helpers/string/_string-capitalize.scss +46 -5
- package/modules/utilities/helpers/string/_string-replace.scss +82 -4
- package/modules/utilities/helpers/string/_string-trim-end.scss +49 -6
- package/modules/utilities/helpers/string/_string-trim-start.scss +49 -6
- package/modules/utilities/helpers/string/_string-trim.scss +56 -11
- package/modules/utilities/loggers/_log-invalid-type.scss +1 -1
- package/modules/utilities/loggers/_log-invalid-value.scss +1 -1
- package/modules/utilities/validators/color/_is-color-light.scss +61 -4
- package/modules/utilities/validators/color/_is-color-list.scss +41 -9
- package/modules/utilities/validators/list/_is-list-contained.scss +42 -3
- package/modules/utilities/validators/misc/_is-time.scss +29 -0
- package/modules/utilities/validators/number/_is-int-even.scss +50 -8
- package/modules/utilities/validators/number/_is-int-odd.scss +51 -9
- package/modules/utilities/validators/number/_is-int.scss +71 -12
- package/modules/utilities/validators/number/_is-number-has-unit.scss +55 -13
- package/modules/utilities/validators/number/_is-number-negative.scss +53 -11
- package/modules/utilities/validators/number/_is-number-positive.scss +52 -10
- package/modules/utilities/validators/number/_is-number-unitless.scss +53 -12
- package/modules/utilities/validators/number/_is-number-zero.scss +54 -10
- package/modules/utilities/validators/string/_is-string-contained.scss +59 -4
- package/modules/utilities/validators/string/_is-string-empty.scss +48 -8
- package/modules/utilities/validators/string/_is-string-ending-with.scss +64 -5
- package/modules/utilities/validators/string/_is-string-starting-with.scss +60 -8
- package/package.json +1 -1
- package/package.scss +9 -8
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,103 @@
|
|
|
1
1
|
# История изменений OmniSass
|
|
2
|
-
Обратите внимание, что данный текст представляет собой краткое изложение истории разработки проекта по версиям. Для более детального ознакомления с изменениями рекомендуется обратиться к соответствующему [разделу](https://sourcecraft.dev/
|
|
2
|
+
Обратите внимание, что данный текст представляет собой краткое изложение истории разработки проекта по версиям. Для более детального ознакомления с изменениями рекомендуется обратиться к соответствующему [разделу](https://sourcecraft.dev/omnisass/library/commits/?rev=master) в SourceCraft.
|
|
3
3
|
|
|
4
|
-
##
|
|
5
|
-
|
|
4
|
+
## v0.3.0 - Public Alpha Release
|
|
5
|
+
{% note warning "Примечание" %}
|
|
6
|
+
|
|
7
|
+
В списке изменений к версии 0.3.0 будут указаны все изменения, внесённые в предыдущих версиях, поскольку ранее они не фиксировались в документации.
|
|
8
|
+
|
|
9
|
+
{% endnote %}
|
|
10
|
+
|
|
11
|
+
### Добавленные новые Sass-функции
|
|
12
|
+
#### Конверторы значений
|
|
13
|
+
- **convert-camel2kebab** - Конвертирует строку из `camelCase` (верблюжья нотация) в `kebab-case` (кебаб-нотация или дефисная нотация).
|
|
14
|
+
- **convert-em2px** - Конвертирует значения из относительных единиц (`em`) в пиксели (`px`).
|
|
15
|
+
- **convert-hex2rgba** - Преобразует цвет в строку формата RGBA с поддержкой прозрачности.
|
|
16
|
+
- **convert-hex2rgb** - Преобразует цвет из HEX формата в строку формата RGB.
|
|
17
|
+
- **convert-kebab2camel** - Конвертирует строку из `kebab-case` (кебаб-нотация) в `camelCase` (верблюжья нотация).
|
|
18
|
+
- **convert-kebab2snake** - Преобразует строку из `kebab-case` (кебаб-нотация) в `snake_case` (змеиная нотация).
|
|
19
|
+
- **convert-px2em** - Конвертирует значения из пикселей (`px`) в относительные единицы (`em`).
|
|
20
|
+
- **convert-px2rem** - Конвертирует значения из пикселей (`px`) в относительные единицы (`rem`).
|
|
21
|
+
- **convert-rem2px** - Конвертирует значения из относительных единиц (`rem`) в пиксели (`px`).
|
|
22
|
+
- **convert-snake2kebab** - Преобразует строку из `snake_case` (змеиная нотация) в `kebab-case` (кебаб-нотация).
|
|
23
|
+
|
|
24
|
+
#### Функции для получения значений
|
|
25
|
+
- **get-color-brightness** - Рассчитывает яркость (светлоту) цвета.
|
|
26
|
+
- **get-color-darkest** - Находит самый темный цвет в списке по значению lightness в HSL-пространстве.
|
|
27
|
+
- **get-list-item-end** - Возвращает последний элемент списка.
|
|
28
|
+
- **get-list-item-start** - Возвращает первый элемент списка.
|
|
29
|
+
- **get-list-item** - Возвращает первый или последний элемент списка.
|
|
30
|
+
- **get-number-from-percent** - Вычисляет абсолютное значение по проценту от целого.
|
|
31
|
+
- **get-number-height-by-ratio** - Вычисляет высоту на основе ширины и соотношения сторон.
|
|
32
|
+
- **get-number-max** - Находит максимальное числовое значение в списке.
|
|
33
|
+
- **get-number-min** - Находит минимальное числовое значение в списке.
|
|
34
|
+
- **get-number-percentage-of** - Вычисляет процентное отношение части к целому.
|
|
35
|
+
- **get-number-unit** - Возвращает единицы измерения числа в виде строки.
|
|
36
|
+
- **get-number-width-by-ratio** - Вычисляет ширину на основе высоты и соотношения сторон.
|
|
37
|
+
|
|
38
|
+
#### Вспомогательные функции
|
|
39
|
+
- **color-blend** - Линейная интерполяция (смешивание) между двумя цветами.
|
|
40
|
+
- **color-blend-steps** - Создает последовательность равномерно распределенных цветов между двумя точками.
|
|
41
|
+
- **color-hue-shift** - Поворачивает цветовой тон (hue) цвета на заданное количество градусов.
|
|
42
|
+
- **color-scale** - Генерирует монохромную шкалу оттенков путем затемнения базового цвета.
|
|
43
|
+
- **color-shade** - Создает затемненную версию цвета, добавляя к нему черный цвет.
|
|
44
|
+
- **color-tint** - Осветляет исходный цвет, смешивая его с белым.
|
|
45
|
+
- **color-triad** - Генерирует триадную цветовую схему из трех равноудаленных цветов.
|
|
46
|
+
- **list-dedupe** - Удаляет дублирующиеся значения из списка.
|
|
47
|
+
- **list-insert-at** - Вставляет значение в список по указанному индексу.
|
|
48
|
+
- **list-merge** - Объединяет несколько списков в один плоский список.
|
|
49
|
+
- **list-remove-at** - Удаляет элемент из списка по указанному индексу.
|
|
50
|
+
- **list-sum-numbers-safe** - Безопасно суммирует числовые значения в списке с проверкой единиц измерения.
|
|
51
|
+
- **list-sum-numbers** - Суммирует все числовые значения в списке.
|
|
52
|
+
- **url-encode** - Кодирует строку для безопасного использования в URL.
|
|
53
|
+
- **number-ceil-to** - Округляет число вверх до ближайшего кратного значения.
|
|
54
|
+
- **number-clamp-max** - Ограничивает число сверху, обеспечивая максимальное значение.
|
|
55
|
+
- **number-clamp-min** - Ограничивает число снизу, обеспечивая минимальное значение.
|
|
56
|
+
- **number-clamp** - Ограничивает число заданным диапазоном значений.
|
|
57
|
+
- **number-denormalize** - Денормализует число из единичного интервала [0, 1] в исходный диапазон.
|
|
58
|
+
- **number-fibonacci** - Генерирует последовательность чисел Фибоначчи.
|
|
59
|
+
- **number-floor-to** - Округляет число вниз до ближайшего кратного значения.
|
|
60
|
+
- **number-format-with-separator** - Форматирует число, добавляя разделители тысяч для улучшения читаемости больших чисел.
|
|
61
|
+
- **number-normalize** - Нормализует число к единичному интервалу [0, 1].
|
|
62
|
+
- **number-random-between-int** - Генерирует случайное целое число в заданном диапазоне.
|
|
63
|
+
- **number-random-between** - Генерирует случайное число в заданном диапазоне.
|
|
64
|
+
- **number-range** - Генерирует последовательность чисел в заданном диапазоне с определенным шагом.
|
|
65
|
+
- **number-round-to-nearest** - Округляет число до ближайшего кратного значения с использованием стандартного математического округления (половинки в сторону от нуля).
|
|
66
|
+
- **number-round-to** - Округляет число до указанного количества знаков после запятой.
|
|
67
|
+
- **number-strip-unit** - Удаляет единицы измерения из числа, возвращая безразмерное значение.
|
|
68
|
+
- **string-capitalize** - Преобразует первый символ строки в верхний регистр, остальные оставляет без изменений.
|
|
69
|
+
- **string-replace** - Заменяет все вхождения подстроки в строке на другую подстроку.
|
|
70
|
+
- **string-trim-end** - Удаляет пробелы с конца строки (справа).
|
|
71
|
+
- **string-trim-start** - Удаляет пробелы с начала строки (слева).
|
|
72
|
+
- **string-trim** - Удаляет пробелы с начала и конца строки.
|
|
73
|
+
|
|
74
|
+
#### Функции для логгирования
|
|
75
|
+
- **log-invalid-type** - Логирует ошибку или предупреждение о несоответствии типа параметра ожидаемым типам.
|
|
76
|
+
- **log-invalid-value** - Логирует ошибку или предупреждение о недопустимом значении параметра, когда передано значение, не входящее в список разрешенных.
|
|
77
|
+
|
|
78
|
+
#### Функции для валидации значений
|
|
79
|
+
- **is-color-light** - Определяет, является ли цвет светлым (по пороговому значению светлоты).
|
|
80
|
+
- **is-color-list** - Проверяет, что все элементы в списке являются цветами.
|
|
81
|
+
- **is-list-contained** - Проверяет, содержится ли значение в указанном списке.
|
|
82
|
+
- **is-time** - Проверяет, является ли значение корректным временным значением.
|
|
83
|
+
- **is-int-even** - Проверяет, является ли целое число четным.
|
|
84
|
+
- **is-int-odd** - Проверяет, является ли целое число нечетным.
|
|
85
|
+
- **is-int** - Проверяет, является ли число целым (integer).
|
|
86
|
+
- **is-number-has-unit** - Проверяет, имеет ли число единицы измерения.
|
|
87
|
+
- **is-number-negative** - Проверяет, является ли значение отрицательным числом.
|
|
88
|
+
- **is-number-positive** - Проверяет, является ли значение положительным числом.
|
|
89
|
+
- **is-number-unitless** - Проверяет, является ли число безразмерным.
|
|
90
|
+
- **is-number-zero** - Проверяет, является ли значение нулем (числовым нулем).
|
|
91
|
+
- **is-string-contained** - Проверяет, содержится ли подстрока в указанной строке.
|
|
92
|
+
- **is-string-empty** - Проверяет, является ли строка пустой.
|
|
93
|
+
- **is-string-ending-with** - Проверяет, заканчивается ли строка указанной подстрокой.
|
|
94
|
+
- **is-string-starting-with** - Проверяет, начинается ли строка с указанной подстроки.
|
|
95
|
+
- **is-boolean** - Проверяет, является ли переданное значение логическим типом (boolean).
|
|
96
|
+
- **is-color** - Проверяет, является ли значение допустимым цветом.
|
|
97
|
+
- **is-list** - Проверяет, является ли значение списком (list) или списком аргументов (arglist).
|
|
98
|
+
- **is-map** - Проверяет, является ли значение ассоциативным массивом (map).
|
|
99
|
+
- **is-number** - Проверяет, является ли значение числом
|
|
100
|
+
- **is-string** - Проверяет, является ли значение строкой (string)
|
|
101
|
+
- **is-type** - Возвращает тип данных переданного значения.
|
|
102
|
+
|
|
103
|
+
> Чтобы получить подробные сведения об API новых функций, посетите веб-сайт по адресу [https://omnisass.sourcecraft.site/sassdocs/](https://omnisass.sourcecraft.site/sassdocs/).
|
package/README.md
CHANGED
|
@@ -1,2 +1,96 @@
|
|
|
1
|
+
<p align="left">
|
|
2
|
+
<img src="https://sourcecraft.dev/file?owner=omnisass&repo=library&rev=anvil&path=.omnisass%2Fimages%2Fomnisass_logo_rounded.png" width="150" height="150" alt="Логотип проекта">
|
|
3
|
+
</p>
|
|
4
|
+
|
|
1
5
|
# OmniSass
|
|
6
|
+
> ВАЖНО: Библиотека сейчас проходит стадию тестирования. Вполне возможно, что до финальной версии 1.0.0 будут внесены изменения в API или удалены некоторые функции. Рекомендуется использовать её исключительно для ознакомительных целей.
|
|
7
|
+
|
|
2
8
|
Библиотека функций и миксинов, написанная на языке CSS-препроцессора Sass. Она предназначена для того, чтобы упростить, ускорить и улучшить процесс создания стилей для веб-сайтов.
|
|
9
|
+
|
|
10
|
+
     
|
|
11
|
+
|
|
12
|
+
OmniSass представляет собой обширный, стандартизированный и тщательно задокументированный пакет, включающий решения, годами собранные сообществом.
|
|
13
|
+
|
|
14
|
+
Большинство функций и миксинов — результат работы множества людей, которые в разное время занимались разработкой на языке Sass. Разработчик OmniSass ([@therteenten](https://t.me/therteenten)) сосредоточился на качественной стандартизации, документировании и создании единого инструмента на базе разрозненных элементов.
|
|
15
|
+
|
|
16
|
+
## Установка библиотеки
|
|
17
|
+
1. Для работы OmniSass необходимо, чтобы была установлена библиотека [`sass`](https://www.npmjs.com/package/sass):
|
|
18
|
+
|
|
19
|
+
```shell
|
|
20
|
+
npm install sass
|
|
21
|
+
```
|
|
22
|
+
|
|
23
|
+
2. После завершения установки вы можете добавить библиотеку [`@omnisass/library`](https://www.npmjs.com/package/@omnisass/library):
|
|
24
|
+
|
|
25
|
+
```shell
|
|
26
|
+
npm install @omnisass/library
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
3. Готово! OmniSass готов к использованию.
|
|
30
|
+
|
|
31
|
+
## Использование
|
|
32
|
+
Вы можете внедрить модуль в ваш файл стилей после установки необходимых библиотек:
|
|
33
|
+
|
|
34
|
+
```scss
|
|
35
|
+
@use '@omnisass/library' as omnisass;
|
|
36
|
+
```
|
|
37
|
+
|
|
38
|
+
1. Мы испортируем модуль `@omnisass/library`
|
|
39
|
+
2. Вся "начинка" модуля доступна в пространстве `omnisass`
|
|
40
|
+
|
|
41
|
+
Затем мы применяем одну из функций из библиотеки. Например, `is-boolean`:
|
|
42
|
+
|
|
43
|
+
```scss
|
|
44
|
+
@debug omnisass.is-boolean(true);
|
|
45
|
+
```
|
|
46
|
+
|
|
47
|
+
В консоли мы получаем:
|
|
48
|
+
|
|
49
|
+
```shell
|
|
50
|
+
src/styles/main.scss:3 Debug: true
|
|
51
|
+
```
|
|
52
|
+
|
|
53
|
+
Готово. Мы успешно установили, импортировали и использовали библиотеку в проект.
|
|
54
|
+
|
|
55
|
+
> При компиляции Sass без ключа `--load-path=node_modules` для импорта модуля нужно указать полный путь к папке библиотеки. В нашем случае, если файл styles.scss находится в директории ./src/styles/, следует использовать следующую конструкцию: `@use '../../node_modules/@omnisass/library' as omnisass;`.
|
|
56
|
+
|
|
57
|
+
## Полезные ссылки
|
|
58
|
+
- [Документация API (SassDoc)](https://omnisass.sourcecraft.site/sassdocs/)
|
|
59
|
+
- [Организация на SourceCraft](https://sourcecraft.dev/omnisass/overview)
|
|
60
|
+
- [Канал в Telegram](https://t.me/omnisass)
|
|
61
|
+
- [Список изменений](https://sourcecraft.dev/omnisass/library/browse/CHANGELOG.md?rev=develop)
|
|
62
|
+
|
|
63
|
+
## Благодарности
|
|
64
|
+
- [github@takamoso](https://github.com/takamoso) - за функции `is-boolean`, `is-list` и др.
|
|
65
|
+
- [github@KittyGiraudel](https://github.com/KittyGiraudel) - за функции `color-shade`, `color-tint` и др.
|
|
66
|
+
- [github@sindresorhus](https://github.com/sindresorhus) - за функции `get-list-item-end`, `get-list-item-start` и др.
|
|
67
|
+
- [github@selfishprimate](https://github.com/selfishprimate) - за функцию [`is-time`](https://github.com/selfishprimate/gerillass/blob/master/scss/utilities/_is-time.scss) и др.
|
|
68
|
+
- [github@pentzzsolt](https://github.com/pentzzsolt) - за функцию `is-int` и др.
|
|
69
|
+
|
|
70
|
+
> Если я забыл вас упомянуть в этом списке, то прошу написать мне на [Telegram](https://t.me/therteenten).
|
|
71
|
+
|
|
72
|
+
## Лицензия
|
|
73
|
+
Этот проект лицензирован под лицензией MIT - подробности см. в файле [LICENSE](LICENSE).
|
|
74
|
+
```
|
|
75
|
+
MIT License
|
|
76
|
+
|
|
77
|
+
Copyright (c) 2025, Murad Rustamov (therteenten) <therteenten@ya.ru>
|
|
78
|
+
|
|
79
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
80
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
81
|
+
in the Software without restriction, including without limitation the rights
|
|
82
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
83
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
84
|
+
furnished to do so, subject to the following conditions:
|
|
85
|
+
|
|
86
|
+
The above copyright notice and this permission notice shall be included in all
|
|
87
|
+
copies or substantial portions of the Software.
|
|
88
|
+
|
|
89
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
90
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
91
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
92
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
93
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
94
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
95
|
+
SOFTWARE.
|
|
96
|
+
```
|
|
@@ -101,14 +101,15 @@
|
|
|
101
101
|
/// заглавными буквами (кроме первой) добавлены дефисы.
|
|
102
102
|
/// Результат готов к использованию как CSS-класс или
|
|
103
103
|
/// часть селектора.
|
|
104
|
-
/// @throws {Error} -
|
|
105
|
-
///
|
|
106
|
-
///
|
|
104
|
+
/// @throws {Error} - Выбрасывает ошибку, если в параметр передано
|
|
105
|
+
/// значение, не соответствующее необходимому типу:
|
|
106
|
+
///
|
|
107
|
+
/// - `$value` → `string`
|
|
107
108
|
@function convert-camel2kebab($value) {
|
|
108
109
|
|
|
109
110
|
// Переменная для накопления результата преобразования.
|
|
110
111
|
// Инициализируется пустой строкой.
|
|
111
|
-
$-result:
|
|
112
|
+
$-result: null;
|
|
112
113
|
|
|
113
114
|
// Проверка типа входного параметра: ожидается строковое значение.
|
|
114
115
|
// Функция is-string() проверяет, является ли $value строкой
|
|
@@ -187,9 +187,11 @@
|
|
|
187
187
|
/// @return {Number} - Значение в единицах `px`, рассчитанное
|
|
188
188
|
/// по формуле: `($em * $base) * 1px`. Возвращает дробное
|
|
189
189
|
/// или целое число с единицами измерения `px`.
|
|
190
|
-
/// @throws {Error} -
|
|
191
|
-
///
|
|
192
|
-
///
|
|
190
|
+
/// @throws {Error} - Выбрасывает ошибку, если в параметр передано
|
|
191
|
+
/// значение, не соответствующее необходимому типу:
|
|
192
|
+
///
|
|
193
|
+
/// - `$em` → `number`
|
|
194
|
+
/// - `$base` → `number`
|
|
193
195
|
@function convert-em2px($em, $base: 16px) {
|
|
194
196
|
|
|
195
197
|
// Проверка типа первого параметра: ожидается числовое
|
|
@@ -52,6 +52,10 @@
|
|
|
52
52
|
/// где `r`, `g`, `b` - числовые значения от 0 до 255.
|
|
53
53
|
/// Если передан некорректный цвет, может вызвать ошибку
|
|
54
54
|
/// Sass.
|
|
55
|
+
/// @throws {Error} - Выбрасывает ошибку, если в параметр передано
|
|
56
|
+
/// значение, не соответствующее необходимому типу:
|
|
57
|
+
///
|
|
58
|
+
/// - `$color` → `color`
|
|
55
59
|
@function convert-hex2rgb($color) {
|
|
56
60
|
|
|
57
61
|
// Проверка типа входного параметра: ожидается
|
|
@@ -67,6 +67,11 @@
|
|
|
67
67
|
/// @return {String} - Строка в формате `"rgba(r, g, b, a)"`,
|
|
68
68
|
/// где `r`, `g`, `b` - числовые значения от 0 до 255,
|
|
69
69
|
/// `a` - значение прозрачности.
|
|
70
|
+
/// @throws {Error} - Выбрасывает ошибку, если в параметр передано
|
|
71
|
+
/// значение, не соответствующее необходимому типу:
|
|
72
|
+
///
|
|
73
|
+
/// - `$color` → `color`
|
|
74
|
+
/// - `$alpha` → `number`
|
|
70
75
|
@function convert-hex2rgba($color, $alpha: 1) {
|
|
71
76
|
|
|
72
77
|
// Проверка типа первого параметра: ожидается
|
|
@@ -146,13 +146,14 @@
|
|
|
146
146
|
/// дефисы удалены, а символы, которые следовали за
|
|
147
147
|
/// дефисами, преобразованы в верхний регистр. Первый
|
|
148
148
|
/// символ остается в исходном регистре.
|
|
149
|
-
/// @throws {Error} -
|
|
150
|
-
///
|
|
151
|
-
///
|
|
149
|
+
/// @throws {Error} - Выбрасывает ошибку, если в параметр передано
|
|
150
|
+
/// значение, не соответствующее необходимому типу:
|
|
151
|
+
///
|
|
152
|
+
/// - `$value` → `string`
|
|
152
153
|
@function convert-kebab2camel($value) {
|
|
153
154
|
|
|
154
155
|
// Переменная для накопления результата преобразования.
|
|
155
|
-
$-result:
|
|
156
|
+
$-result: null;
|
|
156
157
|
|
|
157
158
|
// Проверка типа входного параметра: ожидается строковое значение.
|
|
158
159
|
// Функция is-string() проверяет, является ли $value строкой
|
|
@@ -78,10 +78,10 @@
|
|
|
78
78
|
/// дефисы заменены на символы нижнего подчеркивания.
|
|
79
79
|
/// Результат подходит для использования в backend-языках
|
|
80
80
|
/// программирования, конфигурационных файлах и API-запросах.
|
|
81
|
-
/// @throws {Error} -
|
|
82
|
-
///
|
|
83
|
-
///
|
|
84
|
-
///
|
|
81
|
+
/// @throws {Error} - Выбрасывает ошибку, если в параметр передано
|
|
82
|
+
/// значение, не соответствующее необходимому типу:
|
|
83
|
+
///
|
|
84
|
+
/// - `$value` → `string`
|
|
85
85
|
/// @requires {function} string-replace - Вспомогательная
|
|
86
86
|
/// функция замены подстрок в строке.
|
|
87
87
|
/// Должна быть определена и доступна для корректной работы
|
|
@@ -170,10 +170,11 @@
|
|
|
170
170
|
/// @return {Number} - Значение в единицах `em`, рассчитанное
|
|
171
171
|
/// по формуле: `($px / $base) * 1em`. Возвращает дробное
|
|
172
172
|
/// или целое число с единицами измерения `em`.
|
|
173
|
-
/// @throws {Error} -
|
|
174
|
-
///
|
|
175
|
-
///
|
|
176
|
-
///
|
|
173
|
+
/// @throws {Error} - Выбрасывает ошибку, если в параметр передано
|
|
174
|
+
/// значение, не соответствующее необходимому типу:
|
|
175
|
+
///
|
|
176
|
+
/// - `$px` → `number`
|
|
177
|
+
/// - `$base` → `number`
|
|
177
178
|
@function convert-px2em($px, $base: 16px) {
|
|
178
179
|
|
|
179
180
|
// Проверка типа первого параметра: ожидается числовое
|
|
@@ -114,10 +114,11 @@
|
|
|
114
114
|
/// @return {Number} - Значение в единицах `rem`, рассчитанное
|
|
115
115
|
/// по формуле: `($px / $base) * 1rem`. Возвращает дробное
|
|
116
116
|
/// или целое число с единицами измерения `rem`.
|
|
117
|
-
/// @throws {Error} -
|
|
118
|
-
///
|
|
119
|
-
///
|
|
120
|
-
///
|
|
117
|
+
/// @throws {Error} - Выбрасывает ошибку, если в параметр передано
|
|
118
|
+
/// значение, не соответствующее необходимому типу:
|
|
119
|
+
///
|
|
120
|
+
/// - `$px` → `number`
|
|
121
|
+
/// - `$base` → `number`
|
|
121
122
|
@function convert-px2rem($px, $base: 16px) {
|
|
122
123
|
|
|
123
124
|
// Проверка типа первого параметра: ожидается числовое
|
|
@@ -142,9 +142,11 @@
|
|
|
142
142
|
/// @return {Number} - Значение в единицах `px`, рассчитанное
|
|
143
143
|
/// по формуле: `($rem * $base) * 1px`. Возвращает дробное
|
|
144
144
|
/// или целое число с единицами измерения `px`.
|
|
145
|
-
/// @throws {Error} -
|
|
146
|
-
///
|
|
147
|
-
///
|
|
145
|
+
/// @throws {Error} - Выбрасывает ошибку, если в параметр передано
|
|
146
|
+
/// значение, не соответствующее необходимому типу:
|
|
147
|
+
///
|
|
148
|
+
/// - `$rem` → `number`
|
|
149
|
+
/// - `$base` → `number`
|
|
148
150
|
@function convert-rem2px($rem, $base: 16px) {
|
|
149
151
|
|
|
150
152
|
// Проверка типа первого параметра: ожидается числовое
|
|
@@ -124,10 +124,10 @@
|
|
|
124
124
|
/// символы нижнего подчеркивания заменены на дефисы.
|
|
125
125
|
/// Результат готов к использованию как CSS-класс, часть
|
|
126
126
|
/// селектора или имя CSS-переменной.
|
|
127
|
-
/// @throws {Error} -
|
|
128
|
-
///
|
|
129
|
-
///
|
|
130
|
-
///
|
|
127
|
+
/// @throws {Error} - Выбрасывает ошибку, если в параметр передано
|
|
128
|
+
/// значение, не соответствующее необходимому типу:
|
|
129
|
+
///
|
|
130
|
+
/// - `$value` → `string`
|
|
131
131
|
/// @require {function} string-replace - Вспомогательная
|
|
132
132
|
/// функция замены подстрок в строке из модуля `helpers`.
|
|
133
133
|
/// Должна быть определена и доступна для корректной работы
|
|
@@ -89,6 +89,10 @@
|
|
|
89
89
|
/// Черный цвет вернет значение около 0%, белый - 100%,
|
|
90
90
|
/// серые тона - промежуточные значения в зависимости от
|
|
91
91
|
/// их светлоты.
|
|
92
|
+
/// @throws {Error} - Выбрасывает ошибку, если в параметр передано
|
|
93
|
+
/// значение, не соответствующее необходимому типу:
|
|
94
|
+
///
|
|
95
|
+
/// - `$color` → `color`
|
|
92
96
|
@function get-color-brightness($color) {
|
|
93
97
|
|
|
94
98
|
// Проверка типа входного параметра: ожидается
|
|
@@ -104,13 +104,17 @@
|
|
|
104
104
|
/// @throws {Error} - Может выбросить ошибку, если в списке
|
|
105
105
|
/// встречаются элементы, не являющиеся цветами, при
|
|
106
106
|
/// попытке вызова `color.channel()`.
|
|
107
|
+
/// @throws {Error} - Выбрасывает ошибку, если в параметр передано
|
|
108
|
+
/// значение, не соответствующее необходимому типу:
|
|
109
|
+
///
|
|
110
|
+
/// - `$color-list` → `list`
|
|
107
111
|
@function get-color-darkest($color-list) {
|
|
108
112
|
|
|
109
113
|
// Инициализация переменных для хранения результата поиска.
|
|
110
114
|
// - $-result: будет содержать самый темный цвет из списка
|
|
111
115
|
// - $-min-lightness: будет содержать минимальное значение
|
|
112
116
|
// яркости (наименьшая яркость = самый темный)
|
|
113
|
-
$-result:
|
|
117
|
+
$-result: null;
|
|
114
118
|
$-min-lightness: null;
|
|
115
119
|
|
|
116
120
|
// Проверка типа входного параметра: ожидается список
|
|
@@ -82,8 +82,10 @@
|
|
|
82
82
|
/// извлечь последний элемент
|
|
83
83
|
/// @return {*} - Последний элемент списка. Возвращает
|
|
84
84
|
/// `null`, если список пустой.
|
|
85
|
-
/// @throws
|
|
86
|
-
///
|
|
85
|
+
/// @throws {Error} - Выбрасывает ошибку, если в параметр передано
|
|
86
|
+
/// значение, не соответствующее необходимому типу:
|
|
87
|
+
///
|
|
88
|
+
/// - `$list` → `list`
|
|
87
89
|
@function get-list-item-end($list) {
|
|
88
90
|
|
|
89
91
|
@if not is-list($list) {
|
|
@@ -77,8 +77,10 @@
|
|
|
77
77
|
/// первый элемент.
|
|
78
78
|
/// @return {*} - Первый элемент списка. Возвращает `null`,
|
|
79
79
|
/// если список пустой.
|
|
80
|
-
/// @throws
|
|
81
|
-
///
|
|
80
|
+
/// @throws {Error} - Выбрасывает ошибку, если в параметр передано
|
|
81
|
+
/// значение, не соответствующее необходимому типу:
|
|
82
|
+
///
|
|
83
|
+
/// - `$list` → `list`
|
|
82
84
|
@function get-list-item-start($list) {
|
|
83
85
|
|
|
84
86
|
@if not is-list($list) {
|
|
@@ -90,15 +90,17 @@
|
|
|
90
90
|
/// `null` для пустых списков, некорректных значений
|
|
91
91
|
/// `$direction` или если список не содержит элементов
|
|
92
92
|
/// в указанной позиции.
|
|
93
|
-
/// @throws
|
|
94
|
-
///
|
|
95
|
-
///
|
|
93
|
+
/// @throws {Error} - Выбрасывает ошибку, если в параметр передано
|
|
94
|
+
/// значение, не соответствующее необходимому типу:
|
|
95
|
+
///
|
|
96
|
+
/// - `$list` → `list`
|
|
97
|
+
/// - `$direction` → `string`
|
|
96
98
|
@function get-list-item($list, $direction: 'start') {
|
|
97
99
|
|
|
98
100
|
// Переменная для хранения результата функции
|
|
99
101
|
// Инициализируем пустой строкой, но тип может
|
|
100
102
|
// измениться в зависимости от функций get-list-item-start/end
|
|
101
|
-
$-result:
|
|
103
|
+
$-result: null;
|
|
102
104
|
|
|
103
105
|
// ВАЛИДАЦИЯ ПАРАМЕТРА $direction
|
|
104
106
|
|
|
@@ -96,8 +96,12 @@
|
|
|
96
96
|
/// указанный процент от целого. Возвращает значение в тех же
|
|
97
97
|
/// единицах измерения, что и параметр `$whole`.
|
|
98
98
|
/// @throws {Error} - Может выбросить ошибку если `$percentage`
|
|
99
|
-
/// не содержит единицы измерения '%'
|
|
100
|
-
///
|
|
99
|
+
/// не содержит единицы измерения '%'.
|
|
100
|
+
/// @throws {Error} - Выбрасывает ошибку, если в параметр передано
|
|
101
|
+
/// значение, не соответствующее необходимому типу:
|
|
102
|
+
///
|
|
103
|
+
/// - `$percentage` → `number`
|
|
104
|
+
/// - `$whole` → `number`
|
|
101
105
|
@function get-number-from-percent($percentage, $whole) {
|
|
102
106
|
|
|
103
107
|
// ВАЛИДАЦИЯ ВХОДНЫХ ПАРАМЕТРОВ
|
|
@@ -152,6 +152,11 @@
|
|
|
152
152
|
/// @throws {Error} - Выбрасывает ошибку деления на ноль, если
|
|
153
153
|
/// `$ratio = 0`. Это соответствует математически невозможной
|
|
154
154
|
/// ситуации, когда высота была бы бесконечной.
|
|
155
|
+
/// @throws {Error} - Выбрасывает ошибку, если в параметр передано
|
|
156
|
+
/// значение, не соответствующее необходимому типу:
|
|
157
|
+
///
|
|
158
|
+
/// - `$width` → `number`
|
|
159
|
+
/// - `$ratio` → `number`
|
|
155
160
|
@function get-number-height-by-ratio($width, $ratio) {
|
|
156
161
|
|
|
157
162
|
@if not is-number($width) {
|
|
@@ -73,6 +73,10 @@
|
|
|
73
73
|
/// значения.
|
|
74
74
|
/// @throws {Error} - Может выбросить ошибку при попытке
|
|
75
75
|
/// сравнить числа с несовместимыми единицами измерения.
|
|
76
|
+
/// @throws {Error} - Выбрасывает ошибку, если в параметр передано
|
|
77
|
+
/// значение, не соответствующее необходимому типу:
|
|
78
|
+
///
|
|
79
|
+
/// - `$list` → `list`
|
|
76
80
|
@function get-number-max($list) {
|
|
77
81
|
|
|
78
82
|
// Переменная для хранения текущего максимального значения.
|
|
@@ -72,6 +72,10 @@
|
|
|
72
72
|
/// значения.
|
|
73
73
|
/// @throws {Error} - Может выбросить ошибку при попытке
|
|
74
74
|
/// сравнить числа с несовместимыми единицами измерения.
|
|
75
|
+
/// @throws {Error} - Выбрасывает ошибку, если в параметр передано
|
|
76
|
+
/// значение, не соответствующее необходимому типу:
|
|
77
|
+
///
|
|
78
|
+
/// - `$list` → `list`
|
|
75
79
|
@function get-number-min($list) {
|
|
76
80
|
|
|
77
81
|
// Инициализация переменной для хранения результата.
|
|
@@ -89,7 +89,12 @@
|
|
|
89
89
|
/// представляющее отношение части к целому. Возвращаемое значение
|
|
90
90
|
/// можно использовать напрямую в CSS-свойствах.
|
|
91
91
|
/// @throws {Error} - Может выбросить ошибку деления на ноль,
|
|
92
|
-
/// если `$whole` равно 0
|
|
92
|
+
/// если `$whole` равно 0.
|
|
93
|
+
/// @throws {Error} - Выбрасывает ошибку, если в параметр передано
|
|
94
|
+
/// значение, не соответствующее необходимому типу:
|
|
95
|
+
///
|
|
96
|
+
/// - `$part` → `number`
|
|
97
|
+
/// - `$whole` → `number`
|
|
93
98
|
@function get-number-percentage-of($part, $whole) {
|
|
94
99
|
|
|
95
100
|
@if not is-number($part) {
|
|
@@ -64,8 +64,10 @@
|
|
|
64
64
|
/// возвращается строка с этими единицами. Для
|
|
65
65
|
/// безразмерных чисел и нечисловых значений
|
|
66
66
|
/// возвращается пустая строка (`''`).
|
|
67
|
-
/// @throws {Error} -
|
|
68
|
-
///
|
|
67
|
+
/// @throws {Error} - Выбрасывает ошибку, если в параметр передано
|
|
68
|
+
/// значение, не соответствующее необходимому типу:
|
|
69
|
+
///
|
|
70
|
+
/// - `$value` → `number`
|
|
69
71
|
@function get-number-unit($value) {
|
|
70
72
|
|
|
71
73
|
@if not is-number($value) {
|
|
@@ -155,6 +155,11 @@
|
|
|
155
155
|
/// @return {Number} - Ширина элемента, рассчитанная по формуле
|
|
156
156
|
/// `width = height × ratio`. Сохраняет единицы измерения
|
|
157
157
|
/// параметра `$height`.
|
|
158
|
+
/// @throws {Error} - Выбрасывает ошибку, если в параметр передано
|
|
159
|
+
/// значение, не соответствующее необходимому типу:
|
|
160
|
+
///
|
|
161
|
+
/// - `$height` → `number`
|
|
162
|
+
/// - `$ratio` → `number`
|
|
158
163
|
@function get-number-width-by-ratio($height, $ratio) {
|
|
159
164
|
|
|
160
165
|
@if not is-number($height) {
|
|
@@ -117,6 +117,12 @@
|
|
|
117
117
|
/// - Последний элемент: чистый `$color-end` (100% смешивания)
|
|
118
118
|
/// - Промежуточные элементы: равномерно распределенные смеси
|
|
119
119
|
/// - Всего элементов: `$steps + 2`
|
|
120
|
+
/// @throws {Error} - Выбрасывает ошибку, если в параметр передано
|
|
121
|
+
/// значение, не соответствующее необходимому типу:
|
|
122
|
+
///
|
|
123
|
+
/// - `$color-start` → `color`
|
|
124
|
+
/// - `$color-start` → `color`
|
|
125
|
+
/// - `$steps` → `number`
|
|
120
126
|
@function color-blend-steps($color-start, $color-end, $steps: 5) {
|
|
121
127
|
|
|
122
128
|
// Инициализация списка для хранения промежуточных цветов.
|
|
@@ -107,6 +107,12 @@
|
|
|
107
107
|
/// интерполяцией между `$color-from` и `$color-to` в указанной пропорции.
|
|
108
108
|
/// Использует цветовое пространство по умолчанию для
|
|
109
109
|
/// смешивания (обычно sRGB).
|
|
110
|
+
/// @throws {Error} - Выбрасывает ошибку, если в параметр передано
|
|
111
|
+
/// значение, не соответствующее необходимому типу:
|
|
112
|
+
///
|
|
113
|
+
/// - `$color-from` → `color`
|
|
114
|
+
/// - `$color-to` → `color`
|
|
115
|
+
/// - `$percentage` → `number`
|
|
110
116
|
@function color-blend($color-from, $color-to, $percentage) {
|
|
111
117
|
|
|
112
118
|
// Проверка типа первого параметра: ожидается начальный цвет.
|
|
@@ -84,6 +84,11 @@
|
|
|
84
84
|
/// @return {Color} - Новый цвет в формате HSL с измененным
|
|
85
85
|
/// цветовым тоном, но с сохранением исходных значений
|
|
86
86
|
/// насыщенности и светлоты.
|
|
87
|
+
/// @throws {Error} - Выбрасывает ошибку, если в параметр передано
|
|
88
|
+
/// значение, не соответствующее необходимому типу:
|
|
89
|
+
///
|
|
90
|
+
/// - `$color` → `color`
|
|
91
|
+
/// - `$degrees` → `number`
|
|
87
92
|
@function color-hue-shift($color, $degrees) {
|
|
88
93
|
|
|
89
94
|
// Проверка типа первого параметра: ожидается цветовое значение.
|