@docusaurus/theme-classic 0.0.0-4282 → 0.0.0-4288

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 (7) hide show
  1. package/lib/theme-classic.d.ts +6 -1
  2. package/lib-next/theme/CodeBlock/styles.module.css +0 -1
  3. package/lib-next/theme/Tabs/index.js +14 -7
  4. package/package.json +12 -12
  5. package/src/theme/CodeBlock/styles.module.css +0 -1
  6. package/src/theme/Tabs/index.tsx +18 -6
  7. package/src/theme-classic.d.ts +6 -1
package/lib/theme-classic.d.ts CHANGED
@@ -516,6 +516,7 @@ declare module '@theme/TabItem' {
516
516
  readonly label?: string;
517
517
  readonly hidden?: boolean;
518
518
  readonly className?: string;
519
+ readonly attributes?: Record<string, unknown>;
519
520
  }
520
521
 
521
522
  const TabItem: (props: Props) => JSX.Element;
@@ -531,7 +532,11 @@ declare module '@theme/Tabs' {
531
532
  readonly block?: boolean;
532
533
  readonly children: readonly ReactElement<TabItemProps>[];
533
534
  readonly defaultValue?: string | null;
534
- readonly values?: readonly {value: string; label?: string}[];
535
+ readonly values?: readonly {
536
+ value: string;
537
+ label?: string;
538
+ attributes?: Record<string, unknown>;
539
+ }[];
535
540
  readonly groupId?: string;
536
541
  readonly className?: string;
537
542
  }
package/lib-next/theme/CodeBlock/styles.module.css CHANGED
@@ -9,7 +9,6 @@
9
9
  margin-bottom: var(--ifm-leading);
10
10
  border-radius: var(--ifm-global-radius);
11
11
  box-shadow: var(--ifm-global-shadow-lw);
12
- overflow: hidden;
13
12
  }
14
13
 
15
14
  .codeBlockContent {
package/lib-next/theme/Tabs/index.js CHANGED
@@ -39,10 +39,11 @@ function TabsComponent(props) {
39
39
  );
40
40
  });
41
41
  const values =
42
- valuesProp ??
43
- children.map(({props: {value, label}}) => ({
42
+ valuesProp ?? // We only pick keys that we recognize. MDX would inject some keys by default
43
+ children.map(({props: {value, label, attributes}}) => ({
44
44
  value,
45
45
  label,
46
+ attributes,
46
47
  }));
47
48
  const dup = duplicates(values, (a, b) => a.value === b.value);
48
49
 
@@ -139,19 +140,25 @@ function TabsComponent(props) {
139
140
  },
140
141
  className,
141
142
  )}>
142
- {values.map(({value, label}) => (
143
+ {values.map(({value, label, attributes}) => (
143
144
  <li
144
145
  role="tab"
145
146
  tabIndex={selectedValue === value ? 0 : -1}
146
147
  aria-selected={selectedValue === value}
147
- className={clsx('tabs__item', styles.tabItem, {
148
- 'tabs__item--active': selectedValue === value,
149
- })}
150
148
  key={value}
151
149
  ref={(tabControl) => tabRefs.push(tabControl)}
152
150
  onKeyDown={handleKeydown}
153
151
  onFocus={handleTabChange}
154
- onClick={handleTabChange}>
152
+ onClick={handleTabChange}
153
+ {...attributes}
154
+ className={clsx(
155
+ 'tabs__item',
156
+ styles.tabItem,
157
+ attributes?.className,
158
+ {
159
+ 'tabs__item--active': selectedValue === value,
160
+ },
161
+ )}>
155
162
  {label ?? value}
156
163
  </li>
157
164
  ))}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@docusaurus/theme-classic",
3
- "version": "0.0.0-4282",
3
+ "version": "0.0.0-4288",
4
4
  "description": "Classic theme for Docusaurus",
5
5
  "main": "lib/index.js",
6
6
  "types": "src/theme-classic.d.ts",
@@ -23,14 +23,14 @@
23
23
  "update-code-translations": "node -e 'require(\"./update-code-translations.js\").run()'"
24
24
  },
25
25
  "dependencies": {
26
- "@docusaurus/core": "0.0.0-4282",
27
- "@docusaurus/plugin-content-blog": "0.0.0-4282",
28
- "@docusaurus/plugin-content-docs": "0.0.0-4282",
29
- "@docusaurus/plugin-content-pages": "0.0.0-4282",
30
- "@docusaurus/theme-common": "0.0.0-4282",
31
- "@docusaurus/theme-translations": "0.0.0-4282",
32
- "@docusaurus/utils": "0.0.0-4282",
33
- "@docusaurus/utils-validation": "0.0.0-4282",
26
+ "@docusaurus/core": "0.0.0-4288",
27
+ "@docusaurus/plugin-content-blog": "0.0.0-4288",
28
+ "@docusaurus/plugin-content-docs": "0.0.0-4288",
29
+ "@docusaurus/plugin-content-pages": "0.0.0-4288",
30
+ "@docusaurus/theme-common": "0.0.0-4288",
31
+ "@docusaurus/theme-translations": "0.0.0-4288",
32
+ "@docusaurus/utils": "0.0.0-4288",
33
+ "@docusaurus/utils-validation": "0.0.0-4288",
34
34
  "@mdx-js/mdx": "^1.6.21",
35
35
  "@mdx-js/react": "^1.6.21",
36
36
  "chalk": "^4.1.2",
@@ -46,8 +46,8 @@
46
46
  "rtlcss": "^3.3.0"
47
47
  },
48
48
  "devDependencies": {
49
- "@docusaurus/module-type-aliases": "0.0.0-4282",
50
- "@docusaurus/types": "0.0.0-4282",
49
+ "@docusaurus/module-type-aliases": "0.0.0-4288",
50
+ "@docusaurus/types": "0.0.0-4288",
51
51
  "@types/mdx-js__react": "^1.5.4",
52
52
  "@types/parse-numeric-range": "^0.0.1",
53
53
  "@types/rtlcss": "^3.1.1",
@@ -62,5 +62,5 @@
62
62
  "engines": {
63
63
  "node": ">=14"
64
64
  },
65
- "gitHead": "68b81527266ab2384915b60f4f58640d76f759cb"
65
+ "gitHead": "7c22eff7031a837b8ed4810c896508e3a1756f2e"
66
66
  }
package/src/theme/CodeBlock/styles.module.css CHANGED
@@ -9,7 +9,6 @@
9
9
  margin-bottom: var(--ifm-leading);
10
10
  border-radius: var(--ifm-global-radius);
11
11
  box-shadow: var(--ifm-global-shadow-lw);
12
- overflow: hidden;
13
12
  }
14
13
 
15
14
  .codeBlockContent {
package/src/theme/Tabs/index.tsx CHANGED
@@ -51,7 +51,13 @@ function TabsComponent(props: Props): JSX.Element {
51
51
  );
52
52
  });
53
53
  const values =
54
- valuesProp ?? children.map(({props: {value, label}}) => ({value, label}));
54
+ valuesProp ??
55
+ // We only pick keys that we recognize. MDX would inject some keys by default
56
+ children.map(({props: {value, label, attributes}}) => ({
57
+ value,
58
+ label,
59
+ attributes,
60
+ }));
55
61
  const dup = duplicates(values, (a, b) => a.value === b.value);
56
62
  if (dup.length > 0) {
57
63
  throw new Error(
@@ -144,19 +150,25 @@ function TabsComponent(props: Props): JSX.Element {
144
150
  },
145
151
  className,
146
152
  )}>
147
- {values.map(({value, label}) => (
153
+ {values.map(({value, label, attributes}) => (
148
154
  <li
149
155
  role="tab"
150
156
  tabIndex={selectedValue === value ? 0 : -1}
151
157
  aria-selected={selectedValue === value}
152
- className={clsx('tabs__item', styles.tabItem, {
153
- 'tabs__item--active': selectedValue === value,
154
- })}
155
158
  key={value}
156
159
  ref={(tabControl) => tabRefs.push(tabControl)}
157
160
  onKeyDown={handleKeydown}
158
161
  onFocus={handleTabChange}
159
- onClick={handleTabChange}>
162
+ onClick={handleTabChange}
163
+ {...attributes}
164
+ className={clsx(
165
+ 'tabs__item',
166
+ styles.tabItem,
167
+ attributes?.className as string,
168
+ {
169
+ 'tabs__item--active': selectedValue === value,
170
+ },
171
+ )}>
160
172
  {label ?? value}
161
173
  </li>
162
174
  ))}
package/src/theme-classic.d.ts CHANGED
@@ -516,6 +516,7 @@ declare module '@theme/TabItem' {
516
516
  readonly label?: string;
517
517
  readonly hidden?: boolean;
518
518
  readonly className?: string;
519
+ readonly attributes?: Record<string, unknown>;
519
520
  }
520
521
 
521
522
  const TabItem: (props: Props) => JSX.Element;
@@ -531,7 +532,11 @@ declare module '@theme/Tabs' {
531
532
  readonly block?: boolean;
532
533
  readonly children: readonly ReactElement<TabItemProps>[];
533
534
  readonly defaultValue?: string | null;
534
- readonly values?: readonly {value: string; label?: string}[];
535
+ readonly values?: readonly {
536
+ value: string;
537
+ label?: string;
538
+ attributes?: Record<string, unknown>;
539
+ }[];
535
540
  readonly groupId?: string;
536
541
  readonly className?: string;
537
542
  }