@nxgt/material-vue 0.42.0 → 0.43.1

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 (162) hide show
  1. package/CHANGELOG.md +117 -0
  2. package/README.md +18 -5
  3. package/dist/{Button-CWmzvv9p.js → Button-CEvi_i4g.js} +4 -4
  4. package/dist/{HoverCardTrigger-C5AbAyHE.js → HoverCardTrigger-B7m5Zvj1.js} +69 -62
  5. package/dist/backgrounds/backgrounds.css +8 -0
  6. package/dist/backgrounds/css/base.css +169 -0
  7. package/dist/backgrounds/css/gradient.css +53 -0
  8. package/dist/backgrounds/css/grain.css +19 -0
  9. package/dist/backgrounds/css/motion.css +30 -0
  10. package/dist/backgrounds.js +111 -0
  11. package/dist/{camera-C-9slBUV.js → camera-DP3Qfhhc.js} +4 -4
  12. package/dist/{chunk-7M6MHVWA-wgE1MsQ9.js → chunk-7M6MHVWA-DzYWbKT9.js} +1 -1
  13. package/dist/{chunk-GNY47TPC-BByCj-tp.js → chunk-GNY47TPC-D4sl5ZSh.js} +1 -1
  14. package/dist/{classDiagram-v2-NBCMYWYE-LDc3yyTu.js → classDiagram-v2-NBCMYWYE-BtmPeDVI.js} +1 -1
  15. package/dist/components/base.css +5 -2
  16. package/dist/components/components.css +5 -0
  17. package/dist/components/theme-tokens.css +21 -0
  18. package/dist/{components-DX4EycMi.js → components-zm5JC2dA.js} +14077 -13577
  19. package/dist/components.js +8 -8
  20. package/dist/composables.js +3 -3
  21. package/dist/{dagre-6A5THRUB-CCigPI-W.js → dagre-6A5THRUB-CmmqjQ01.js} +1 -1
  22. package/dist/{diagram-22UHCM2B-vav-BOss.js → diagram-22UHCM2B-BYL1soMk.js} +1 -1
  23. package/dist/dnd.js +1 -1
  24. package/dist/{erDiagram-OPXOYQCR-BV3UGLoQ.js → erDiagram-OPXOYQCR-DhNOupcl.js} +1 -1
  25. package/dist/{flowDiagram-KWPJA3E3-B3AfwLQk.js → flowDiagram-KWPJA3E3-_S6NO9vf.js} +2 -2
  26. package/dist/{form-scope-CN68PTXc.js → form-scope-XQGlh8m3.js} +1 -1
  27. package/dist/{i18n-provider-DmZSTBnp.js → i18n-provider-tL27-a8y.js} +1 -1
  28. package/dist/i18n.js +26 -9
  29. package/dist/{icon-button-DErh1aJS.js → icon-button-BNA3fXM2.js} +4 -4
  30. package/dist/lib/backgrounds/background/background.vue.d.ts +22 -0
  31. package/dist/lib/backgrounds/background/index.d.ts +2 -0
  32. package/dist/lib/backgrounds/background/partials/background-layers.vue.d.ts +9 -0
  33. package/dist/lib/backgrounds/background/partials/scene-svg.d.ts +10 -0
  34. package/dist/lib/backgrounds/background/types.d.ts +24 -0
  35. package/dist/lib/backgrounds/index.d.ts +13 -0
  36. package/dist/lib/components/ui/actions/button/button-tones.d.ts +3 -3
  37. package/dist/lib/components/ui/actions/responsive-button/responsive-button.vue.d.ts +3 -3
  38. package/dist/lib/components/ui/collections/data-table/data-table-context.d.ts +4 -0
  39. package/dist/lib/components/ui/collections/data-table/data-table.vue.d.ts +8 -0
  40. package/dist/lib/components/ui/collections/data-table/partials/data-table-body.vue.d.ts +8 -0
  41. package/dist/lib/components/ui/collections/data-table/partials/data-table-empty.vue.d.ts +5 -1
  42. package/dist/lib/components/ui/collections/data-table/partials/data-table-toolbar.d.ts +16 -3
  43. package/dist/lib/components/ui/collections/data-table/select-checkbox.d.ts +36 -0
  44. package/dist/lib/components/ui/collections/data-table/types.d.ts +15 -0
  45. package/dist/lib/components/ui/collections/data-table/use-data-table.d.ts +2 -0
  46. package/dist/lib/components/ui/feedback/circular-progress/circular-progress.vue.d.ts +1 -1
  47. package/dist/lib/components/ui/feedback/empty-state/empty-state.vue.d.ts +21 -8
  48. package/dist/lib/components/ui/feedback/empty-state/index.d.ts +1 -1
  49. package/dist/lib/components/ui/feedback/error-state/error-state.vue.d.ts +54 -0
  50. package/dist/lib/components/ui/feedback/error-state/index.d.ts +3 -0
  51. package/dist/lib/components/ui/feedback/error-state/partials/error-state-details.vue.d.ts +7 -0
  52. package/dist/lib/components/ui/feedback/index.d.ts +1 -0
  53. package/dist/lib/components/ui/feedback/state-frame/state-frame.vue.d.ts +36 -0
  54. package/dist/lib/components/ui/feedback/state-frame/state-icon.vue.d.ts +7 -0
  55. package/dist/lib/components/ui/feedback/state-frame/state-illustration.vue.d.ts +8 -0
  56. package/dist/lib/components/ui/feedback/state-frame/state-tones.d.ts +11 -0
  57. package/dist/lib/components/ui/fields/contacts/consts.d.ts +1 -1
  58. package/dist/lib/components/ui/layout/app-shell/use-truncated-title.d.ts +10 -0
  59. package/dist/lib/components/ui/layout/background/background.vue.d.ts +18 -3
  60. package/dist/lib/components/ui/layout/doc/partials/doc-empty.vue.d.ts +7 -4
  61. package/dist/lib/components/ui/media/stx-player/stx-player-viewport.vue.d.ts +2 -2
  62. package/dist/lib/components/ui/overlays/command/CommandSeparator.vue.d.ts +3 -1
  63. package/dist/lib/components/ui/overlays/dialog/in-dialog.d.ts +1 -1
  64. package/dist/lib/components/ui/overlays/dialog/use-escape-forward.d.ts +13 -0
  65. package/dist/lib/components/ui/overlays/dialog/use-modal-content.d.ts +2 -0
  66. package/dist/lib/components/ui/primitives/nonce-provider/nonce-provider.vue.d.ts +4 -1
  67. package/dist/lib/components/ui/selection/autocomplete/autocomplete-keyboard.d.ts +22 -4
  68. package/dist/lib/components/ui/selection/autocomplete/partials/autocomplete-box.vue.d.ts +6 -2
  69. package/dist/lib/components/ui/selection/autocomplete/partials/autocomplete-list.vue.d.ts +7 -0
  70. package/dist/lib/components/ui/selection/autocomplete/use-autocomplete-active.d.ts +17 -0
  71. package/dist/lib/components/ui/selection/autocomplete/use-autocomplete-keydown.d.ts +21 -0
  72. package/dist/lib/components/ui/selection/autocomplete/use-autocomplete-open.d.ts +3 -3
  73. package/dist/lib/components/ui/selection/autocomplete/use-autocomplete.d.ts +2 -1
  74. package/dist/lib/components/ui/selection/autocomplete/use-drawer-room.d.ts +11 -0
  75. package/dist/lib/components/ui/selection/autocomplete/use-query-change.d.ts +8 -0
  76. package/dist/lib/components/ui/widgets/charts/chart-container.vue.d.ts +2 -2
  77. package/dist/lib/components/ui/widgets/kanban/partials/kanban-empty.vue.d.ts +1 -0
  78. package/dist/lib/composables/use-background-activity.d.ts +8 -0
  79. package/dist/lib/i18n/resources/en/en.d.ts +24 -0
  80. package/dist/lib/i18n/resources/en/material.json.d.ts +25 -1
  81. package/dist/lib/i18n/resources/fr/fr.d.ts +24 -0
  82. package/dist/lib/i18n/resources/fr/material.json.d.ts +25 -1
  83. package/dist/lib/i18n/resources/resources.d.ts +48 -0
  84. package/dist/lib/i18n/translator.d.ts +1 -1
  85. package/dist/lib/lib/index.d.ts +1 -0
  86. package/dist/lib/lib/is-production.d.ts +11 -0
  87. package/dist/lib/nuxt/component-names.d.ts +1 -1
  88. package/dist/lib/nuxt/module.d.ts +2 -11
  89. package/dist/lib/nuxt/pdf-fonts.d.ts +1 -1
  90. package/dist/lib/nuxt/plugin-options.d.ts +58 -0
  91. package/dist/lib/vite/index.d.ts +4 -8
  92. package/dist/lib.js +52 -51
  93. package/dist/main.js +17 -17
  94. package/dist/map.js +4 -4
  95. package/dist/material-vue.css +1 -1
  96. package/dist/{merge-BzRhCAF6.js → merge-CUkhQBjf.js} +1 -1
  97. package/dist/{mermaid.core-B2ydTQ4X.js → mermaid.core-B70hvAGW.js} +11 -11
  98. package/dist/{mindmap-definition-NLK3R4M7-DCb99I7s.js → mindmap-definition-NLK3R4M7-B59LL3gV.js} +1 -1
  99. package/dist/{pdf-outline-sidebar-BU4o_hBI.js → pdf-outline-sidebar-ChDcGkbS.js} +2 -2
  100. package/dist/{pdf-page-anNe78Lc.js → pdf-page-DFvf3lsq.js} +1 -1
  101. package/dist/{pdf-page-list-CSY76HH6.js → pdf-page-list-K-ncOHkY.js} +2 -2
  102. package/dist/{pdf-reader-BhZNrW7R.js → pdf-reader-BPq6yCdy.js} +15 -15
  103. package/dist/{pdf-sidebar-DcIpG7eh.js → pdf-sidebar-divDHLe7.js} +3 -3
  104. package/dist/{pdf-thumbnail-sidebar-CUC0V4if.js → pdf-thumbnail-sidebar-C8XMXCq0.js} +4 -4
  105. package/dist/{pdf-toolbar-C373S-ul.js → pdf-toolbar-DQdedyLO.js} +4 -4
  106. package/dist/pdf.js +2 -2
  107. package/dist/{print-format.utils-C81c0weJ.js → print-format.utils-DutRk52h.js} +2 -2
  108. package/dist/{requirementDiagram-PLB6GJNP-DnkvMOW6.js → requirementDiagram-PLB6GJNP-BvzdTtRf.js} +1 -1
  109. package/dist/{sortable-provider-CL2UGGn8.js → sortable-provider-CwnKfRFb.js} +2 -2
  110. package/dist/{stateDiagram-v2-GCMORJYK-BCh7NZQn.js → stateDiagram-v2-GCMORJYK-VPagBr-W.js} +1 -1
  111. package/dist/{stored-language-Wtcj2HsU.js → stored-language-DVP9KzRu.js} +50 -2
  112. package/dist/{stx-player-CMmM3F5Z.js → stx-player-NiBlUGm4.js} +12 -12
  113. package/dist/styles.css +4 -0
  114. package/dist/{swimlanesDiagram-TC7HE7FX-D4-k5-iq.js → swimlanesDiagram-TC7HE7FX-BA-757S-.js} +2 -2
  115. package/dist/{translator-D5Dp-dob.js → translator-Dpfm1mAC.js} +171 -159
  116. package/dist/use-background-activity-DdTBbNpX.js +17 -0
  117. package/dist/{use-heading-spy-BIBHtUXN.js → use-heading-spy-jn8f2ioE.js} +13 -13
  118. package/dist/{use-material-translation-COoBTGpB.js → use-material-translation-CHacJbhU.js} +3 -3
  119. package/dist/{usecaseDiagram-POWQR4AR-Bi5we59l.js → usecaseDiagram-POWQR4AR-1f4iixDN.js} +1 -1
  120. package/dist/vite.js +7 -2
  121. package/docs/README.md +3 -0
  122. package/docs/components/buttons-and-actions.md +2 -0
  123. package/docs/components/data-table-filter-and-lists.md +59 -8
  124. package/docs/components/feedback-and-status.md +79 -8
  125. package/docs/components/media-and-files.md +2 -0
  126. package/docs/components/navigation-and-layout.md +13 -5
  127. package/docs/components/overlays-and-menus.md +20 -3
  128. package/docs/components/primitives.md +5 -3
  129. package/docs/components/rich-widgets.md +1 -1
  130. package/docs/components/selection-and-choice.md +14 -4
  131. package/docs/getting-started.md +22 -3
  132. package/docs/guides/app-shell.md +1 -1
  133. package/docs/guides/backgrounds.md +143 -0
  134. package/docs/guides/csp.md +48 -6
  135. package/docs/guides/helpers.md +1 -0
  136. package/docs/guides/i18n.md +51 -1
  137. package/docs/guides/migrate-to-vite-plugin.md +259 -0
  138. package/docs/guides/pdf.md +11 -4
  139. package/docs/guides/ssr.md +1 -1
  140. package/docs/guides/theming.md +52 -4
  141. package/docs/guides/vite-plugin.md +194 -0
  142. package/docs/previews/backgrounds-matrix.webp +0 -0
  143. package/docs/previews/feedback-status-emptystate.webp +0 -0
  144. package/docs/previews/feedback-status-errorstate.webp +0 -0
  145. package/docs/roadmap.md +60 -32
  146. package/docs/troubleshooting.md +251 -7
  147. package/lib/backgrounds/backgrounds.css +8 -0
  148. package/lib/backgrounds/css/base.css +169 -0
  149. package/lib/backgrounds/css/gradient.css +53 -0
  150. package/lib/backgrounds/css/grain.css +19 -0
  151. package/lib/backgrounds/css/motion.css +30 -0
  152. package/lib/components/base.css +5 -2
  153. package/lib/components/components.css +5 -0
  154. package/lib/components/theme-tokens.css +21 -0
  155. package/lib/nuxt/component-names.ts +1 -0
  156. package/lib/nuxt/module.ts +29 -15
  157. package/lib/nuxt/pdf-fonts.ts +1 -1
  158. package/lib/nuxt/plugin-options.ts +92 -0
  159. package/lib/nuxt/runtime/inter.css +6 -0
  160. package/lib/styles.css +4 -0
  161. package/lib/vite/index.ts +19 -2
  162. package/package.json +24 -2
@@ -0,0 +1,111 @@
1
+ import { t as e } from "./use-background-activity-DdTBbNpX.js";
2
+ import { Fragment as t, computed as n, createCommentVNode as r, createElementBlock as i, createElementVNode as a, createVNode as o, defineComponent as s, h as c, mergeProps as l, openBlock as u, renderSlot as d, unref as f, useId as p, useTemplateRef as m } from "vue";
3
+ import { BACKGROUND_INTENSITIES as h, BACKGROUND_PRESETS as g, BACKGROUND_TONES as _, MOTIF_SHAPES as v, SHIPPED_BACKGROUND_PRESETS as y, buildBackgroundScene as b, resolveShippedPreset as x, svgIdPrefix as S } from "@nxgt/material-core/backgrounds";
4
+ //#region lib/backgrounds/background/partials/scene-svg.ts
5
+ var C = ({ node: e }) => c(e.tag, { ...e.attrs }, (e.children ?? []).map((e) => c(C, { node: e })));
6
+ C.props = ["node"];
7
+ //#endregion
8
+ //#region lib/backgrounds/background/partials/background-layers.vue?vue&type=script&setup=true&lang.ts
9
+ var w = {
10
+ key: 1,
11
+ "data-scene": "",
12
+ "aria-hidden": "true"
13
+ }, T = {
14
+ key: 2,
15
+ "data-overlay": "grain",
16
+ "aria-hidden": "true"
17
+ }, E = /* @__PURE__ */ s({
18
+ __name: "background-layers",
19
+ props: {
20
+ preset: {},
21
+ scene: {},
22
+ grain: {}
23
+ },
24
+ setup(e) {
25
+ let n = ["gradient", "grain"];
26
+ return (s, c) => (u(), i(t, null, [
27
+ n.includes(e.preset) ? (u(), i(t, { key: 0 }, [
28
+ c[0] ||= a("div", {
29
+ "data-layer": "blob-1",
30
+ "aria-hidden": "true"
31
+ }, null, -1),
32
+ c[1] ||= a("div", {
33
+ "data-layer": "blob-2",
34
+ "aria-hidden": "true"
35
+ }, null, -1),
36
+ c[2] ||= a("div", {
37
+ "data-layer": "blob-3",
38
+ "aria-hidden": "true"
39
+ }, null, -1)
40
+ ], 64)) : r("", !0),
41
+ e.scene ? (u(), i("div", w, [o(f(C), { node: e.scene }, null, 8, ["node"])])) : r("", !0),
42
+ e.grain ? (u(), i("div", T, [o(f(C), { node: e.grain }, null, 8, ["node"])])) : r("", !0)
43
+ ], 64));
44
+ }
45
+ }), D = [
46
+ "data-background",
47
+ "data-preset",
48
+ "data-tone",
49
+ "data-intensity",
50
+ "data-fill",
51
+ "data-animated",
52
+ "data-grain",
53
+ "data-paused"
54
+ ], O = { "data-slot": "background-content" }, k = /* @__PURE__ */ s({
55
+ inheritAttrs: !1,
56
+ __name: "background",
57
+ props: {
58
+ preset: { default: "gradient" },
59
+ tone: { default: "primary" },
60
+ intensity: { default: "default" },
61
+ animated: {
62
+ type: Boolean,
63
+ default: !1
64
+ },
65
+ grain: {
66
+ type: Boolean,
67
+ default: !1
68
+ },
69
+ seed: { default: 0 },
70
+ fill: { default: "viewport" }
71
+ },
72
+ setup(t) {
73
+ let r = t, s = m("root"), c = e(s, () => r.animated), h = S(p()), g = n(() => x(r.preset)), _ = n(() => r.grain || g.value === "grain"), v = n(() => {
74
+ let e = {
75
+ idPrefix: h,
76
+ seed: r.seed
77
+ };
78
+ return {
79
+ scene: g.value === "grain" ? null : b(g.value, e),
80
+ grain: _.value ? b("grain", {
81
+ ...e,
82
+ idPrefix: `${h}-grain`
83
+ }) : null
84
+ };
85
+ });
86
+ return (e, n) => (u(), i("div", l({
87
+ ref_key: "root",
88
+ ref: s,
89
+ "data-slot": "background"
90
+ }, e.$attrs, {
91
+ "data-background": g.value === "grain" ? "gradient" : g.value,
92
+ "data-preset": g.value,
93
+ "data-tone": t.tone,
94
+ "data-intensity": t.intensity,
95
+ "data-fill": t.fill === "container" ? t.fill : void 0,
96
+ "data-animated": t.animated ? "" : void 0,
97
+ "data-grain": _.value ? "" : void 0,
98
+ "data-paused": t.animated && f(c) ? "" : void 0
99
+ }), [o(E, {
100
+ preset: g.value,
101
+ scene: v.value.scene,
102
+ grain: v.value.grain
103
+ }, null, 8, [
104
+ "preset",
105
+ "scene",
106
+ "grain"
107
+ ]), a("div", O, [d(e.$slots, "default")])], 16, D));
108
+ }
109
+ });
110
+ //#endregion
111
+ export { h as BACKGROUND_INTENSITIES, g as BACKGROUND_PRESETS, _ as BACKGROUND_TONES, k as Background, v as MOTIF_SHAPES, y as SHIPPED_BACKGROUND_PRESETS };
@@ -1,8 +1,8 @@
1
1
  import { t as e } from "./utils-CykWQ0iJ.js";
2
- import { _r as t, hr as n, mr as r } from "./components-DX4EycMi.js";
3
- import { t as i } from "./use-material-translation-COoBTGpB.js";
4
- import { t as a } from "./Button-CWmzvv9p.js";
5
- import { t as o } from "./icon-button-DErh1aJS.js";
2
+ import { _r as t, hr as n, mr as r } from "./components-zm5JC2dA.js";
3
+ import { t as i } from "./use-material-translation-CHacJbhU.js";
4
+ import { t as a } from "./Button-CEvi_i4g.js";
5
+ import { t as o } from "./icon-button-BNA3fXM2.js";
6
6
  import { createBlock as s, createCommentVNode as c, createElementBlock as l, createElementVNode as u, createTextVNode as d, createVNode as f, defineComponent as p, normalizeClass as m, openBlock as h, ref as g, renderSlot as _, shallowRef as v, toDisplayString as y, unref as b, withCtx as x } from "vue";
7
7
  import { Pause as S, Play as C } from "@lucide/vue";
8
8
  //#region lib/components/ui/media/camera/camera-content.vue?vue&type=script&setup=true&lang.ts
@@ -9,7 +9,7 @@ import { a as x } from "./chunk-7INBJB4K-OheKRjIZ.js";
9
9
  import { t as S } from "./chunk-GWA4HPMP-hjyItnXu.js";
10
10
  import { t as C } from "./chunk-XXDRQBXY-B9ckANit.js";
11
11
  import { t as w } from "./chunk-WEXAMYUT-DufdZ2tS.js";
12
- import { r as T, t as E } from "./chunk-GNY47TPC-BByCj-tp.js";
12
+ import { r as T, t as E } from "./chunk-GNY47TPC-D4sl5ZSh.js";
13
13
  import { n as D, t as O } from "./chunk-LNGE3PJU-DJjGTS7O.js";
14
14
  //#region ../../node_modules/mermaid/dist/chunks/mermaid.core/chunk-7M6MHVWA.mjs
15
15
  var re = "flowchart-", ie = class {
@@ -45,7 +45,7 @@ var p = {
45
45
  g([
46
46
  {
47
47
  name: "dagre",
48
- loader: /* @__PURE__ */ e(async () => await import("./dagre-6A5THRUB-CCigPI-W.js"), "loader")
48
+ loader: /* @__PURE__ */ e(async () => await import("./dagre-6A5THRUB-CmmqjQ01.js"), "loader")
49
49
  },
50
50
  {
51
51
  name: "swimlane",
@@ -14,7 +14,7 @@ import { t as S } from "./chunk-GWA4HPMP-hjyItnXu.js";
14
14
  import { t as C } from "./chunk-XXDRQBXY-B9ckANit.js";
15
15
  import { t as w } from "./chunk-WEXAMYUT-DufdZ2tS.js";
16
16
  import "./chunk-UA2S7LBM-DN55-gzN.js";
17
- import { r as T, t as E } from "./chunk-GNY47TPC-BByCj-tp.js";
17
+ import { r as T, t as E } from "./chunk-GNY47TPC-D4sl5ZSh.js";
18
18
  //#region ../../node_modules/mermaid/dist/chunks/mermaid.core/classDiagram-v2-NBCMYWYE.mjs
19
19
  var D = (function() {
20
20
  var t = /* @__PURE__ */ e(function(e, t, n, r) {
@@ -56,8 +56,11 @@
56
56
  font-weight: var(--font-weight-medium);
57
57
  }
58
58
  /* A sidebar entry is a link styled as a menu entry: the prose link style
59
- (underline, info tint on hover and focus) must not reach it (#566). */
60
- a:not(:has(> button)):not([data-slot="sidebar-menu-item"]) {
59
+ (underline, info tint on hover and focus) must not reach it (#566). A component
60
+ link that has its own look opts out with the `nxgt-plain-link` class (#575). */
61
+ a:not(:has(> button)):not([data-slot="sidebar-menu-item"]):not(
62
+ .nxgt-plain-link
63
+ ) {
61
64
  @apply focus:underline underline-offset-4 hover:underline cursor-pointer;
62
65
  @apply text-info [&_svg]:data-[slot=icon]:text-info hover:bg-info/10 active:bg-info/5 focus:bg-info/15;
63
66
  }
@@ -26,3 +26,8 @@
26
26
  @import "./ui/fields/opening-hours/opening-hours-item.css";
27
27
  @import "./ui/fields/attributes/partials/attribute-form.css";
28
28
  @import "./ui/fields/attributes/partials/attribute-values-form.css";
29
+ /* Background (from /components): the gradient preset's CSS, plain and shared
30
+ * (lib/backgrounds/css). The other presets are opt-in: backgrounds.css. */
31
+ @import "../backgrounds/css/base.css";
32
+ @import "../backgrounds/css/gradient.css";
33
+ @import "../backgrounds/css/motion.css";
@@ -12,6 +12,9 @@
12
12
  --popover-foreground: oklch(0.129 0.042 264.695);
13
13
  --primary: oklch(46% 0.1135 276.35);
14
14
  --primary-foreground: oklch(0.984 0.003 247.858);
15
+ /* Primary drawn as text or an icon on a normal surface (`text-primary-text`):
16
+ the colour itself in light; the dark theme lifts it. */
17
+ --primary-text: var(--primary);
15
18
  --secondary: oklch(50% 0.1135 245.65);
16
19
  --secondary-foreground: oklch(0.984 0.003 247.858);
17
20
  --muted: oklch(0.968 0.007 247.896);
@@ -71,6 +74,9 @@
71
74
  --popover-foreground: oklch(0.984 0.003 247.858);
72
75
  --primary: oklch(46% 0.1135 276.35);
73
76
  --primary-foreground: oklch(0.984 0.003 247.858);
77
+ /* Mixed 60 % toward white (the tonal Button labels' recipe): readable as text
78
+ on --background and --card. */
79
+ --primary-text: color-mix(in oklab, var(--primary) 40%, white);
74
80
  /* Brighter than the light one: it is read as text on the dark surfaces (6.5:1
75
81
  on --background, 5.8:1 on --card); a filled secondary surface mixes it toward --background
76
82
  (the opaque 70 % mix) to keep 5.2:1 under its near-white text. */
@@ -119,3 +125,18 @@
119
125
  --sidebar-border: oklch(1 0 0 / 10%);
120
126
  --sidebar-ring: oklch(0.551 0.027 264.364);
121
127
  }
128
+
129
+ /* The tertiary colour (the strix violet), for accents and backgrounds beside
130
+ primary and secondary. Light: 7.6:1 under its near-white foreground. */
131
+ :root {
132
+ --tertiary: var(--strix);
133
+ --tertiary-foreground: oklch(0.984 0.003 247.858);
134
+ }
135
+
136
+ /* Dark: lifted like --secondary, as it is read as text (7.0:1 on --background,
137
+ 6.3:1 on --card); its foreground is the dark surface, 7.0:1 on the fill. */
138
+ .dark,
139
+ [data-theme="dark"] {
140
+ --tertiary: oklch(0.7 0.15 310.75);
141
+ --tertiary-foreground: oklch(0.14 0.036 258.53);
142
+ }