duck-dev-lib 0.0.29 → 0.0.32

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.
Files changed (8) hide show
  1. package/fesm2022/{duck-dev-lib-en-BfbNUZFJ.mjs → duck-dev-lib-en-FJT2H4DI.mjs} +78 -3
  2. package/fesm2022/{duck-dev-lib-ru-06o10qCz.mjs.map → duck-dev-lib-en-FJT2H4DI.mjs.map} +1 -1
  3. package/fesm2022/{duck-dev-lib-ru-06o10qCz.mjs → duck-dev-lib-ru-D0c8A9Pk.mjs} +78 -3
  4. package/fesm2022/{duck-dev-lib-en-BfbNUZFJ.mjs.map → duck-dev-lib-ru-D0c8A9Pk.mjs.map} +1 -1
  5. package/fesm2022/duck-dev-lib.mjs +195 -145
  6. package/fesm2022/duck-dev-lib.mjs.map +1 -1
  7. package/package.json +1 -1
  8. package/types/duck-dev-lib.d.ts +15 -1
package/fesm2022/{duck-dev-lib-en-BfbNUZFJ.mjs → duck-dev-lib-en-FJT2H4DI.mjs} RENAMED
@@ -1,4 +1,5 @@
1
1
  var tabs = {
2
+ "quick-start": "Quick start",
2
3
  accordion: "Accordion",
3
4
  buttons: "Buttons",
4
5
  loaders: "Loaders",
@@ -8,10 +9,54 @@ var tabs = {
8
9
  input: "Input",
9
10
  notifications: "Notifications",
10
11
  badge: "Badges",
12
+ modal: "Modal",
11
13
  slider: "Slider",
12
14
  tooltip: "Tooltip",
13
15
  directives: "Directives"
14
16
  };
17
+ var quickStart = {
18
+ title: "Duck Dev UI Library — Colors & Themes",
19
+ intro: "This guide explains how to install the library styles and work with colors and themes. Duck Dev provides a small set of CSS variables (the dd-base palette) and theme switching via an attribute.",
20
+ principles: "Important: always use dd-base variables (var(--dd-base-...)) inside your styles. Raw color values are allowed only in rare edge cases.",
21
+ sections: {
22
+ install: "Install & connect styles",
23
+ palette: "Palette overview",
24
+ themeSwitch: "Theme switching (light/dark)",
25
+ custom: "Override or create a custom theme",
26
+ use: "Use colors in components"
27
+ },
28
+ install: {
29
+ text: "Add the variables stylesheet to your global styles so components pick up the palette.",
30
+ snippet: "/* angular.json */\n\"styles\": [\n \"projects/duck-dev-lib/src/styles/variables.scss\",\n \"src/styles.scss\"\n]"
31
+ },
32
+ palette: {
33
+ text: "The base palette is exposed as CSS variables. Use --dd-base-* in your custom CSS. Examples: --dd-base-0/100/200/300/400/500/600 and accents like --dd-base-secondary, --dd-base-accent-orange, --dd-base-accent-blue.",
34
+ list: [
35
+ "--dd-base-0..600 — neutrals (background/text/border)",
36
+ "--dd-base-secondary — violet accent",
37
+ "--dd-base-accent-orange — orange accent",
38
+ "--dd-base-accent-blue — blue accent"
39
+ ]
40
+ },
41
+ themeSwitch: {
42
+ text: "Theme is controlled by the ddTheme attribute on any wrapper (commonly on html or body). Supported built-in: light (default) and dark.",
43
+ snippet: "<!-- index.html -->\n<html ddTheme=\"dark\">\n <body>\n <app-root></app-root>\n </body>\n</html>",
44
+ indexLabel: "index.html",
45
+ indexHtmlTitle: "Add ddTheme on the html tag",
46
+ toggleLabel: "Component toggle",
47
+ toggleTitle: "Toggle theme via component code",
48
+ toggleSnippet: "// In a component\nsetTheme(theme: 'dark' | 'light') {\n document.documentElement.setAttribute('ddTheme', theme);\n}"
49
+ },
50
+ custom: {
51
+ text: "You can override any dd-base variable under a custom theme. Components will automatically use your values.",
52
+ snippet: "/* styles.scss */\n[ddTheme='brand'] {\n --dd-base-0: #ffffff;\n --dd-base-100: #f4f6ff;\n --dd-base-300: #dbe0ff;\n --dd-base-600: #0e1028;\n --dd-base-secondary: #6829ff;\n --dd-base-accent-orange: #fe7b20;\n --dd-base-accent-blue: #3254f3;\n}"
53
+ },
54
+ use: {
55
+ text: "Library components accept AccentEnumColor to pick semantic colors from the palette. Below are examples with buttons and info cards.",
56
+ buttonsTitle: "Accent buttons",
57
+ cardsTitle: "Info cards"
58
+ }
59
+ };
15
60
  var tooltipDoc = {
16
61
  title: "Duck Dev UI Library - Tooltip",
17
62
  basic: {
@@ -463,8 +508,37 @@ var cardDoc = {
463
508
  dark: "Dark"
464
509
  }
465
510
  };
511
+ var modalDoc = {
512
+ title: "Duck Dev UI Library - Modal",
513
+ quickDemo: "Open modal",
514
+ basic: {
515
+ title: "Modal window",
516
+ description: "Simple overlay modal with CSS-only backdrop and enter/leave animations. Content is fully customizable. Colors use the library palette.",
517
+ usage: "Usage:",
518
+ inputs: "Inputs:",
519
+ examples: "Examples:"
520
+ },
521
+ inputs: {
522
+ isOpen: "boolean signal that controls visibility (true — open, false — closed)"
523
+ },
524
+ examples: {
525
+ open: "Open demo modal"
526
+ },
527
+ actions: {
528
+ close: "Close"
529
+ },
530
+ demo: {
531
+ title: "Sample modal",
532
+ text: "This is a simple example of the Duck Dev modal component."
533
+ },
534
+ snippets: {
535
+ sampleTitle: "Sample modal",
536
+ sampleText: "You can put any content here."
537
+ }
538
+ };
466
539
  var en = {
467
540
  tabs: tabs,
541
+ quickStart: quickStart,
468
542
  tooltipDoc: tooltipDoc,
469
543
  notifications: notifications,
470
544
  slider: slider,
@@ -476,8 +550,9 @@ var en = {
476
550
  badgeDoc: badgeDoc,
477
551
  directivesDoc: directivesDoc,
478
552
  accordionDoc: accordionDoc,
479
- cardDoc: cardDoc
553
+ cardDoc: cardDoc,
554
+ modalDoc: modalDoc
480
555
  };
481
556
 
482
- export { accordionDoc, badgeDoc, buttons, cardDoc, en as default, directivesDoc, inputComponent, loaders, notifications, slider, svgComponent, tabs, tabsComponent, tooltipDoc };
483
- //# sourceMappingURL=duck-dev-lib-en-BfbNUZFJ.mjs.map
557
+ export { accordionDoc, badgeDoc, buttons, cardDoc, en as default, directivesDoc, inputComponent, loaders, modalDoc, notifications, quickStart, slider, svgComponent, tabs, tabsComponent, tooltipDoc };
558
+ //# sourceMappingURL=duck-dev-lib-en-FJT2H4DI.mjs.map
package/fesm2022/{duck-dev-lib-ru-06o10qCz.mjs.map → duck-dev-lib-en-FJT2H4DI.mjs.map} RENAMED
@@ -1 +1 @@
1
- {"version":3,"file":"duck-dev-lib-ru-06o10qCz.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"duck-dev-lib-en-FJT2H4DI.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/fesm2022/{duck-dev-lib-ru-06o10qCz.mjs → duck-dev-lib-ru-D0c8A9Pk.mjs} RENAMED
@@ -1,4 +1,5 @@
1
1
  var tabs = {
2
+ "quick-start": "Быстрый старт",
2
3
  accordion: "Аккордеон",
3
4
  buttons: "Кнопки",
4
5
  loaders: "Загрузчики",
@@ -8,10 +9,54 @@ var tabs = {
8
9
  input: "Вввод",
9
10
  notifications: "Уведомления",
10
11
  badge: "Бейджи",
12
+ modal: "Модальное окно",
11
13
  slider: "Слайдер",
12
14
  tooltip: "Подсказка",
13
15
  directives: "Директивы"
14
16
  };
17
+ var quickStart = {
18
+ title: "Duck Dev UI Library — Цвета и темы",
19
+ intro: "Это руководство объясняет, как подключить стили библиотеки и работать с цветами и темами. Duck Dev предоставляет набор CSS‑переменных (палитра dd-base) и переключение тем через атрибут.",
20
+ principles: "Важно: внутри своих стилей используйте только переменные dd-base (var(--dd-base-...)). Жёсткие цвета используйте лишь в редких случаях.",
21
+ sections: {
22
+ install: "Установка и подключение стилей",
23
+ palette: "Обзор палитры",
24
+ themeSwitch: "Переключение темы (светлая/тёмная)",
25
+ custom: "Переопределение или создание своей темы",
26
+ use: "Использование цветов в компонентах"
27
+ },
28
+ install: {
29
+ text: "Добавьте файл с переменными в глобальные стили, чтобы компоненты получили палитру.",
30
+ snippet: "/* angular.json */\n\"styles\": [\n \"projects/duck-dev-lib/src/styles/variables.scss\",\n \"src/styles.scss\"\n]"
31
+ },
32
+ palette: {
33
+ text: "Базовая палитра доступна как CSS‑переменные. В своих стилях используйте --dd-base-*. Примеры: --dd-base-0/100/200/300/400/500/600 и акценты: --dd-base-secondary, --dd-base-accent-orange, --dd-base-accent-blue.",
34
+ list: [
35
+ "--dd-base-0..600 — нейтральные (фон/текст/границы)",
36
+ "--dd-base-secondary — фиолетовый акцент",
37
+ "--dd-base-accent-orange — оранжевый акцент",
38
+ "--dd-base-accent-blue — синий акцент"
39
+ ]
40
+ },
41
+ themeSwitch: {
42
+ text: "Тема управляется атрибутом ddTheme на любом контейнере (обычно html или body). Встроенные темы: светлая (по умолчанию) и тёмная.",
43
+ snippet: "<!-- index.html -->\n<html ddTheme=\"dark\">\n <body>\n <app-root></app-root>\n </body>\n</html>",
44
+ indexLabel: "index.html",
45
+ indexHtmlTitle: "Добавьте ddTheme на тег html",
46
+ toggleLabel: "Переключение в компоненте",
47
+ toggleTitle: "Переключение темы из кода компонента",
48
+ toggleSnippet: "// В компоненте\nsetTheme(theme: 'dark' | 'light') {\n document.documentElement.setAttribute('ddTheme', theme);\n}"
49
+ },
50
+ custom: {
51
+ text: "Вы можете переопределить любые переменные dd-base внутри своей темы. Компоненты автоматически начнут использовать ваши значения.",
52
+ snippet: "/* styles.scss */\n[ddTheme='brand'] {\n --dd-base-0: #ffffff;\n --dd-base-100: #f4f6ff;\n --dd-base-300: #dbe0ff;\n --dd-base-600: #0e1028;\n --dd-base-secondary: #6829ff;\n --dd-base-accent-orange: #fe7b20;\n --dd-base-accent-blue: #3254f3;\n}"
53
+ },
54
+ use: {
55
+ text: "Компоненты библиотеки принимают AccentEnumColor для выбора семантических цветов из палитры. Ниже примеры с кнопками и информационными карточками.",
56
+ buttonsTitle: "Акцентные кнопки",
57
+ cardsTitle: "Информационные карточки"
58
+ }
59
+ };
15
60
  var notifications = {
16
61
  title: "Duck Dev UI Library - Уведомления",
17
62
  quickDemo: "Показать уведомление",
@@ -429,8 +474,37 @@ var cardDoc = {
429
474
  dark: "Dark"
430
475
  }
431
476
  };
477
+ var modalDoc = {
478
+ title: "Duck Dev UI Library - Модальное окно",
479
+ quickDemo: "Открыть модальное окно",
480
+ basic: {
481
+ title: "Модальное окно",
482
+ description: "Простое модальное окно с полупрозрачным фоном и анимациями появления/исчезновения на CSS. Содержимое полностью произвольно. Цвета берутся из палитры библиотеки.",
483
+ usage: "Использование:",
484
+ inputs: "Входные параметры:",
485
+ examples: "Примеры:"
486
+ },
487
+ inputs: {
488
+ isOpen: "булево значение, управляющее видимостью (true — открыто, false — закрыто)"
489
+ },
490
+ examples: {
491
+ open: "Открыть демо-окно"
492
+ },
493
+ actions: {
494
+ close: "Закрыть"
495
+ },
496
+ demo: {
497
+ title: "Пример модального окна",
498
+ text: "Это простой пример модального компонента Duck Dev."
499
+ },
500
+ snippets: {
501
+ sampleTitle: "Пример модального окна",
502
+ sampleText: "Здесь можно разместить любое содержимое."
503
+ }
504
+ };
432
505
  var ru = {
433
506
  tabs: tabs,
507
+ quickStart: quickStart,
434
508
  notifications: notifications,
435
509
  slider: slider,
436
510
  buttons: buttons,
@@ -441,8 +515,9 @@ var ru = {
441
515
  badgeDoc: badgeDoc,
442
516
  directivesDoc: directivesDoc,
443
517
  accordionDoc: accordionDoc,
444
- cardDoc: cardDoc
518
+ cardDoc: cardDoc,
519
+ modalDoc: modalDoc
445
520
  };
446
521
 
447
- export { accordionDoc, badgeDoc, buttons, cardDoc, ru as default, directivesDoc, inputComponent, loaders, notifications, slider, svgComponent, tabs, tabsComponent };
448
- //# sourceMappingURL=duck-dev-lib-ru-06o10qCz.mjs.map
522
+ export { accordionDoc, badgeDoc, buttons, cardDoc, ru as default, directivesDoc, inputComponent, loaders, modalDoc, notifications, quickStart, slider, svgComponent, tabs, tabsComponent };
523
+ //# sourceMappingURL=duck-dev-lib-ru-D0c8A9Pk.mjs.map
package/fesm2022/{duck-dev-lib-en-BfbNUZFJ.mjs.map → duck-dev-lib-ru-D0c8A9Pk.mjs.map} RENAMED
@@ -1 +1 @@
1
- {"version":3,"file":"duck-dev-lib-en-BfbNUZFJ.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"duck-dev-lib-ru-D0c8A9Pk.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}