timvir 0.2.38 → 0.2.42

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 (113) hide show
  1. package/CHANGELOG.md +29 -0
  2. package/blocks/Arbitrary/Arbitrary.d.ts +1 -1
  3. package/blocks/Arbitrary/index.js +232 -78
  4. package/blocks/Arbitrary/samples/basic.d.ts +1 -1
  5. package/blocks/Arbitrary/styles.css +166 -6
  6. package/blocks/Code/Code.d.ts +0 -6
  7. package/blocks/Code/docs/index.mdx +0 -11
  8. package/blocks/Code/index.js +213 -112
  9. package/blocks/Code/samples/basic.d.ts +1 -1
  10. package/blocks/Code/samples/toggle.d.ts +1 -2
  11. package/blocks/Code/styles.css +100 -15
  12. package/blocks/ColorBar/docs/index.mdx +8 -2
  13. package/blocks/ColorBar/index.js +223 -68
  14. package/blocks/ColorBar/samples/basic.d.ts +1 -2
  15. package/blocks/ColorBar/styles.css +103 -4
  16. package/blocks/ColorBook/docs/index.mdx +1 -1
  17. package/blocks/ColorBook/index.js +222 -60
  18. package/blocks/ColorBook/samples/basic.d.ts +1 -2
  19. package/blocks/ColorBook/styles.css +166 -6
  20. package/blocks/Cover/index.js +177 -48
  21. package/blocks/Cover/samples/basic.d.ts +1 -2
  22. package/blocks/Cover/styles.css +18 -0
  23. package/blocks/Exhibit/index.js +205 -50
  24. package/blocks/Exhibit/samples/basic.d.ts +1 -2
  25. package/blocks/Exhibit/samples/bleed.d.ts +1 -1
  26. package/blocks/Exhibit/samples/usage.d.ts +1 -2
  27. package/blocks/Exhibit/styles.css +66 -3
  28. package/blocks/Font/index.js +239 -98
  29. package/blocks/Font/samples/basic.d.ts +1 -1
  30. package/blocks/Font/samples/timvir/body1.d.ts +1 -1
  31. package/blocks/Font/samples/timvir/caption.d.ts +1 -1
  32. package/blocks/Font/samples/timvir/h1.d.ts +1 -1
  33. package/blocks/Font/samples/timvir/h2.d.ts +1 -1
  34. package/blocks/Font/samples/timvir/h3.d.ts +1 -1
  35. package/blocks/Font/samples/timvir/h4.d.ts +1 -1
  36. package/blocks/Font/styles.css +82 -8
  37. package/blocks/Grid/docs/index.mdx +4 -4
  38. package/blocks/Grid/index.js +181 -36
  39. package/blocks/Grid/samples/basic.d.ts +1 -2
  40. package/blocks/Grid/styles.css +20 -1
  41. package/blocks/Icon/docs/index.mdx +13 -13
  42. package/blocks/Icon/index.js +93 -100
  43. package/blocks/Icon/internal/Canvas.d.ts +1 -1
  44. package/blocks/Icon/samples/basic.d.ts +1 -2
  45. package/blocks/Icon/styles.css +117 -5
  46. package/blocks/Icon/types.d.ts +3 -2
  47. package/blocks/Message/docs/index.mdx +5 -8
  48. package/blocks/Message/index.js +238 -55
  49. package/blocks/Message/samples/basic.d.ts +1 -1
  50. package/blocks/Message/styles.css +94 -6
  51. package/blocks/Swatch/docs/index.mdx +16 -16
  52. package/blocks/Swatch/index.js +199 -45
  53. package/blocks/Swatch/samples/basic.d.ts +1 -2
  54. package/blocks/Swatch/styles.css +82 -4
  55. package/blocks/Viewport/index.js +360 -237
  56. package/blocks/Viewport/internal/Caption.d.ts +1 -1
  57. package/blocks/Viewport/internal/Handle.d.ts +1 -1
  58. package/blocks/Viewport/internal/Ruler.d.ts +1 -2
  59. package/blocks/Viewport/samples/basic.d.ts +1 -2
  60. package/blocks/Viewport/styles.css +259 -14
  61. package/blocks/WebLink/index.js +217 -62
  62. package/blocks/WebLink/samples/basic.d.ts +1 -1
  63. package/blocks/WebLink/styles.css +170 -8
  64. package/blocks/styles.css +1460 -97
  65. package/builtins/components.d.ts +2 -2
  66. package/builtins/index.js +306 -239
  67. package/builtins/styles.css +267 -14
  68. package/context/index.d.ts +6 -1
  69. package/core/components/Commands/Commands.d.ts +2 -0
  70. package/core/components/Commands/internal/Action.d.ts +1 -1
  71. package/core/components/Commands/internal/Dialog.d.ts +1 -2
  72. package/core/components/Commands/internal/index.d.ts +0 -1
  73. package/core/components/Footer/samples/basic.d.ts +1 -1
  74. package/core/components/NavigationFooter/NavigationFooter.d.ts +4 -2
  75. package/core/components/NavigationFooter/samples/basic.d.ts +1 -1
  76. package/core/components/Page/Page.d.ts +12 -3
  77. package/core/components/Page/docs/index.mdx +44 -11
  78. package/core/components/Page/internal/Section.d.ts +1 -2
  79. package/core/components/Page/internal/Sidebar.d.ts +1 -1
  80. package/core/components/Page/internal/SidebarItem.d.ts +1 -2
  81. package/core/components/Page/internal/index.d.ts +0 -1
  82. package/core/components/Page/samples/basic.d.ts +1 -2
  83. package/core/components/Page/samples/layout.d.ts +1 -2
  84. package/core/index.d.ts +191 -2
  85. package/core/index.js +674 -449
  86. package/core/layout.d.ts +40 -0
  87. package/core/styles.css +857 -88
  88. package/core/theme/detector.js +1 -1
  89. package/global.css +79 -0
  90. package/internal/cx.d.ts +1 -0
  91. package/knip.config.d.ts +5 -0
  92. package/package.json +1 -2
  93. package/search/Search/samples/basic.d.ts +1 -2
  94. package/search/index.js +2 -208
  95. package/styles.css +2670 -222
  96. package/blocks/Code/theme.d.ts +0 -2
  97. package/bus/styles.css +0 -1
  98. package/context/styles.css +0 -1
  99. package/core/theme/index.d.ts +0 -1
  100. package/hooks/styles.css +0 -1
  101. package/search/Search/internal/Dialog.d.ts +0 -20
  102. package/search/Search/internal/index.d.ts +0 -1
  103. package/search/SearchBoxInput/SearchBoxInput.d.ts +0 -11
  104. package/search/SearchBoxInput/docs/api.mdx +0 -76
  105. package/search/SearchBoxInput/docs/index.mdx +0 -6
  106. package/search/SearchBoxInput/index.d.ts +0 -1
  107. package/search/SearchBoxInput/samples/basic.d.ts +0 -2
  108. package/search/SearchBoxListItem/SearchBoxListItem.d.ts +0 -13
  109. package/search/SearchBoxListItem/docs/api.mdx +0 -76
  110. package/search/SearchBoxListItem/docs/index.mdx +0 -30
  111. package/search/SearchBoxListItem/index.d.ts +0 -1
  112. package/search/SearchBoxListItem/samples/basic.d.ts +0 -2
  113. package/search/styles.css +0 -16
@@ -1 +1 @@
1
- const t=Object.fromEntries(["light","dark"].map((t=>[t,(()=>{const n=window.matchMedia(`(prefers-color-scheme: ${t})`);return n.addEventListener("change",e),n})()])));function e(){const e=function(){try{const t=localStorage.getItem("timvir-theme");if(t)return t}catch{}for(const[e,n]of Object.entries(t))if(n.matches)return e}();e&&function(t){document.documentElement.setAttribute("data-timvir-theme",t)}(e)}e();
1
+ const t=Object.fromEntries(["light","dark"].map(t=>[t,(()=>{const n=window.matchMedia(`(prefers-color-scheme: ${t})`);return n.addEventListener("change",e),n})()]));function e(){const e=function(){try{const t=localStorage.getItem("timvir-theme");if(t)return t}catch{}for(const[e,n]of Object.entries(t))if(n.matches)return e}();e&&function(t){document.documentElement.setAttribute("data-timvir-theme",t)}(e)}e();
package/global.css ADDED
@@ -0,0 +1,79 @@
1
+ :root {
2
+ box-sizing: border-box;
3
+ scroll-padding-top: 20px;
4
+ }
5
+
6
+ *,
7
+ *:before,
8
+ *:after {
9
+ box-sizing: inherit;
10
+ }
11
+
12
+ :root {
13
+ --timvir-background-color: #ffffff;
14
+ --timvir-text-color: #000000c9;
15
+ --timvir-secondary-text-color: #00000066;
16
+ --timvir-secondary-background-color: #f9f8f9;
17
+
18
+ --timvir-border-color: #e9e8ea;
19
+
20
+ --timvir-sidebar-highlight-color: rgb(237, 237, 237);
21
+
22
+ --timvir-accent-color: #38a585;
23
+
24
+ --timvir-background-pattern: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAIAAAACUFjqAAAAHElEQVR4AWP4/u07Mvr75y8yGlBpND6a6oGUBgAxMSSkDKa/pQAAAABJRU5ErkJggg==);
25
+ --timvir-highlight-background-color: #ffe10044;
26
+ }
27
+
28
+ :root[data-timvir-theme="dark"] {
29
+ --timvir-background-color: #1f2023;
30
+ --timvir-text-color: rgba(255 255 255 / 0.86);
31
+ --timvir-secondary-text-color: rgba(255 255 255 / 0.56);
32
+ --timvir-secondary-background-color: #161618;
33
+
34
+ --timvir-border-color: #27292f;
35
+
36
+ --timvir-sidebar-highlight-color: rgb(41, 43, 47);
37
+
38
+ --timvir-accent-color: #38a585;
39
+
40
+ --timvir-background-pattern: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAAAAACoWZBhAAAAFklEQVQI12NQBQF2EGAghQkmwXxSmADZJQiZ2ZZ46gAAAABJRU5ErkJggg==);
41
+ --timvir-highlight-background-color: rgba(174, 124, 20, 0.15);
42
+ }
43
+
44
+ /*
45
+ * Temporary kludge to enable light/dark support in Code blocks. To be
46
+ * removed once theming is implemented properly.
47
+ */
48
+ .timvir-b-Code .shiki span {
49
+ color: var(--timvir-b-Code-shiki-light);
50
+ font-style: var(--timvir-b-Code-shiki-light-font-style);
51
+ font-weight: var(--timvir-b-Code-shiki-light-font-weight);
52
+ text-decoration: var(--timvir-b-Code-shiki-light-text-decoration);
53
+ }
54
+
55
+ :root[data-timvir-theme="dark"] .timvir-b-Code .shiki span {
56
+ color: var(--timvir-b-Code-shiki-dark);
57
+ font-style: var(--timvir-b-Code-shiki-dark-font-style);
58
+ font-weight: var(--timvir-b-Code-shiki-dark-font-weight);
59
+ text-decoration: var(--timvir-b-Code-shiki-dark-text-decoration);
60
+ }
61
+
62
+ body {
63
+ font-family: system-ui, sans-serif;
64
+ font-feature-settings: "liga", "kern";
65
+ text-rendering: optimizelegibility;
66
+
67
+ font-size: 0.9375rem;
68
+ line-height: 1.7333;
69
+
70
+ background-color: var(--timvir-background-color);
71
+ color: var(--timvir-text-color);
72
+
73
+ --c-p-0: #f0fcf6;
74
+ --c-p-1: #d1f6e4;
75
+ --c-p-2: #a0dbc1;
76
+ --c-p-3: #61c19f;
77
+ --c-p-4: #38a585;
78
+ --c-p-5: #1b896b;
79
+ }
@@ -0,0 +1 @@
1
+ export declare function cx(...args: Array<null | undefined | boolean | string>): string;
@@ -0,0 +1,5 @@
1
+ declare const _default: {
2
+ entry: string[];
3
+ ignoreDependencies: string[];
4
+ };
5
+ export default _default;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "type": "module",
3
3
  "name": "timvir",
4
- "version": "0.2.38",
4
+ "version": "0.2.42",
5
5
  "license": "MIT",
6
6
  "sideEffects": false,
7
7
  "exports": {
@@ -23,7 +23,6 @@
23
23
  "wonka": "^6"
24
24
  },
25
25
  "peerDependencies": {
26
- "@mdx-js/react": "^2 || ^3",
27
26
  "react": "^17 || ^18 || ^19",
28
27
  "react-dom": "^17 || ^18 || ^19",
29
28
  "react-hotkeys-hook": "^4 || ^5"
@@ -1,2 +1 @@
1
- import * as React from "react";
2
- export default function Sample(): React.JSX.Element;
1
+ export default function Sample(): import("react/jsx-runtime").JSX.Element;
package/search/index.js CHANGED
@@ -1,213 +1,7 @@
1
1
  import * as React from 'react';
2
- import { useContext } from 'timvir/core';
3
- import { useCombobox } from 'downshift';
4
2
 
5
- // src/css.ts
6
-
7
- // src/cx.ts
8
- var cx = function cx2() {
9
- const presentClassNames = Array.prototype.slice.call(arguments).filter(Boolean);
10
- const atomicClasses = {};
11
- const nonAtomicClasses = [];
12
- presentClassNames.forEach((arg) => {
13
- const individualClassNames = arg ? arg.split(" ") : [];
14
- individualClassNames.forEach((className) => {
15
- if (className.startsWith("atm_")) {
16
- const [, keyHash] = className.split("_");
17
- atomicClasses[keyHash] = className;
18
- } else {
19
- nonAtomicClasses.push(className);
20
- }
21
- });
22
- });
23
- const result = [];
24
- for (const keyHash in atomicClasses) {
25
- if (Object.prototype.hasOwnProperty.call(atomicClasses, keyHash)) {
26
- result.push(atomicClasses[keyHash]);
27
- }
28
- }
29
- result.push(...nonAtomicClasses);
30
- return result.join(" ");
31
- };
32
- var cx_default = cx;
33
-
34
- /**
35
- * The underlying DOM element which is rendered by this component.
36
- */
37
- const Root$2 = "div";
38
- function SearchBoxInput(props, ref) {
39
- const {
40
- value,
41
- onChange,
42
- ...rest
43
- } = props;
44
- return /*#__PURE__*/React.createElement(Root$2, {
45
- ref: ref,
46
- className: "r710k81",
47
- ...rest
48
- }, /*#__PURE__*/React.createElement("svg", {
49
- viewBox: "0 0 17 17",
50
- className: "s1sjvm51"
51
- }, /*#__PURE__*/React.createElement("path", {
52
- d: "M6.78027 13.6729C8.24805 13.6729 9.60156 13.1982 10.709 12.4072L14.875 16.5732C15.0684 16.7666 15.3232 16.8633 15.5957 16.8633C16.167 16.8633 16.5713 16.4238 16.5713 15.8613C16.5713 15.5977 16.4834 15.3516 16.29 15.1582L12.1504 11.0098C13.0205 9.86719 13.5391 8.45215 13.5391 6.91406C13.5391 3.19629 10.498 0.155273 6.78027 0.155273C3.0625 0.155273 0.0214844 3.19629 0.0214844 6.91406C0.0214844 10.6318 3.0625 13.6729 6.78027 13.6729ZM6.78027 12.2139C3.87988 12.2139 1.48047 9.81445 1.48047 6.91406C1.48047 4.01367 3.87988 1.61426 6.78027 1.61426C9.68066 1.61426 12.0801 4.01367 12.0801 6.91406C12.0801 9.81445 9.68066 12.2139 6.78027 12.2139Z"
53
- })), /*#__PURE__*/React.createElement("input", {
54
- autoFocus: true,
55
- value: value,
56
- onChange: onChange,
57
- className: "i1f3edco"
58
- }));
59
- }
60
- var SearchBoxInput$1 = /*#__PURE__*/React.forwardRef(SearchBoxInput);
61
-
62
- /**
63
- * The underlying DOM element which is rendered by this component.
64
- */
65
- const Root$1 = "a";
66
- function SearchBoxListItem(props, ref) {
67
- const {
68
- as,
69
- icon,
70
- label,
71
- context,
72
- ...rest
73
- } = props;
74
- const Component = as ?? Root$1;
75
- return /*#__PURE__*/React.createElement(Component, {
76
- role: "button",
77
- ref: ref,
78
- className: "c8yc6y",
79
- ...rest
80
- }, /*#__PURE__*/React.createElement("div", {
81
- className: "dqzmx2q"
82
- }, icon), /*#__PURE__*/React.createElement("div", {
83
- className: "dp5wq1v"
84
- }, /*#__PURE__*/React.createElement("div", null, label), context && /*#__PURE__*/React.createElement("div", {
85
- className: "du5k8uq"
86
- }, context)));
87
- }
88
- var SearchBoxListItem$1 = /*#__PURE__*/React.forwardRef(SearchBoxListItem);
89
-
90
- /**
91
- * The underlying DOM element which is rendered by this component.
92
- */
93
- const Root = "div";
94
- function Dialog(props, ref) {
95
- const {
96
- onClose,
97
- q,
98
- className,
99
- ...rest
100
- } = props;
101
- const {
102
- location,
103
- Link
104
- } = useContext();
105
- const [value, setValue] = React.useState("");
106
- const [result, setResult] = React.useState(undefined);
107
- React.useEffect(() => {
108
- q(value).then(result => {
109
- setResult(result);
110
- });
111
- }, [value, q, setResult]);
112
- const items = result?.edges ?? [];
113
- const {
114
- getMenuProps,
115
- getInputProps,
116
- /* highlightedIndex, */getItemProps,
117
- closeMenu
118
- } = useCombobox({
119
- defaultHighlightedIndex: 0,
120
- items,
121
- itemToString: item => item ? item.node.label : "",
122
- onInputValueChange: ({
123
- inputValue
124
- }) => {
125
- setValue(inputValue ?? "");
126
- },
127
- onSelectedItemChange: ({
128
- selectedItem
129
- }) => {
130
- if (selectedItem) {
131
- location.push(selectedItem.node.path);
132
- }
133
- closeMenu();
134
- }
135
- });
136
- return /*#__PURE__*/React.createElement(Root, {
137
- ref: ref,
138
- ...rest,
139
- className: cx_default(className, "r5ea8qd")
140
- }, /*#__PURE__*/React.createElement("div", {
141
- className: "dp0smwa"
142
- }, /*#__PURE__*/React.createElement("div", {
143
- className: "d1a28btb"
144
- }, /*#__PURE__*/React.createElement("div", {
145
- className: "d1c5pom9",
146
- onClick: onClose
147
- }), /*#__PURE__*/React.createElement("div", {
148
- className: "djje8s3"
149
- }, /*#__PURE__*/React.createElement(SearchBoxInput$1, {
150
- ...getInputProps()
151
- }), /*#__PURE__*/React.createElement("main", {
152
- ...getMenuProps(),
153
- className: "m1mgb53c"
154
- }, items.map((item, index) => /*#__PURE__*/React.createElement(SearchBoxListItem$1, {
155
- key: index,
156
- as: Link,
157
- href: item.node.path,
158
- ...getItemProps({
159
- item,
160
- index,
161
- onClick: onClose
162
- }),
163
- icon: /*#__PURE__*/React.createElement("svg", {
164
- x: "0px",
165
- y: "0px",
166
- width: "16px",
167
- height: "16px",
168
- viewBox: "0 0 16 16"
169
- }, /*#__PURE__*/React.createElement("g", {
170
- fill: "none",
171
- stroke: "#444",
172
- strokeLinecap: "round",
173
- strokeLinejoin: "round",
174
- strokeMiterlimit: 10
175
- }, /*#__PURE__*/React.createElement("path", {
176
- "data-color": "color-2",
177
- d: "M4.5 11.5L11.5 11.5"
178
- }), /*#__PURE__*/React.createElement("path", {
179
- "data-color": "color-2",
180
- d: "M4.5 8.5L11.5 8.5"
181
- }), /*#__PURE__*/React.createElement("path", {
182
- "data-color": "color-2",
183
- d: "M4.5 5.5L6.5 5.5"
184
- }), /*#__PURE__*/React.createElement("path", {
185
- d: "M9.5 0.5L1.5 0.5 1.5 15.5 14.5 15.5 14.5 5.5z"
186
- }), /*#__PURE__*/React.createElement("path", {
187
- d: "M9.5 0.5L9.5 5.5 14.5 5.5"
188
- }))),
189
- label: item.node.path,
190
- context: item.node.context,
191
- style: {
192
- // background: highlightedIndex === index ? "rgba(0, 0, 0, 0.05)" : undefined,
193
- }
194
- })))))));
195
- }
196
- var Dialog$1 = /*#__PURE__*/React.forwardRef(Dialog);
197
-
198
- function Search(props, ref) {
199
- const {
200
- open,
201
- ...rest
202
- } = props;
203
- if (!open) {
204
- return null;
205
- } else {
206
- return /*#__PURE__*/React.createElement(Dialog$1, {
207
- ref: ref,
208
- ...rest
209
- });
210
- }
3
+ function Search(_props, _ref) {
4
+ return null;
211
5
  }
212
6
  var Search$1 = /*#__PURE__*/React.forwardRef(Search);
213
7
  function defaultSearch(toc) {