@tuwaio/docs-ui 0.0.38 → 0.0.39

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 (53) hide show
  1. package/README.md +83 -7
  2. package/dist/components/Footer.d.cts +10 -5
  3. package/dist/components/Footer.d.ts +10 -5
  4. package/dist/components/Logo.d.cts +17 -5
  5. package/dist/components/Logo.d.ts +17 -5
  6. package/dist/components/NavBar.d.cts +21 -2
  7. package/dist/components/NavBar.d.ts +21 -2
  8. package/dist/components/NoSSR.d.cts +6 -6
  9. package/dist/components/NoSSR.d.ts +6 -6
  10. package/dist/components/Orb.cjs +2 -2
  11. package/dist/components/Orb.d.cts +19 -8
  12. package/dist/components/Orb.d.ts +19 -8
  13. package/dist/components/Orb.js +2 -2
  14. package/dist/components/StarryBackground.d.cts +11 -2
  15. package/dist/components/StarryBackground.d.ts +11 -2
  16. package/dist/components/ThemeSwitcher.d.cts +15 -2
  17. package/dist/components/ThemeSwitcher.d.ts +15 -2
  18. package/dist/index.cjs +1 -17
  19. package/dist/index.css +0 -162
  20. package/dist/index.d.cts +0 -8
  21. package/dist/index.d.ts +0 -8
  22. package/dist/index.js +0 -8
  23. package/dist/utils.d.cts +11 -13
  24. package/dist/utils.d.ts +11 -13
  25. package/package.json +6 -9
  26. package/dist/components/CodeBlock.cjs +0 -61
  27. package/dist/components/CodeBlock.d.cts +0 -20
  28. package/dist/components/CodeBlock.d.ts +0 -20
  29. package/dist/components/CodeBlock.js +0 -37
  30. package/dist/components/CodeHighlighter.cjs +0 -52
  31. package/dist/components/CodeHighlighter.d.cts +0 -10
  32. package/dist/components/CodeHighlighter.d.ts +0 -10
  33. package/dist/components/CodeHighlighter.js +0 -18
  34. package/dist/components/CopyIconButton.cjs +0 -44
  35. package/dist/components/CopyIconButton.d.cts +0 -9
  36. package/dist/components/CopyIconButton.d.ts +0 -9
  37. package/dist/components/CopyIconButton.js +0 -20
  38. package/dist/components/Features.cjs +0 -42
  39. package/dist/components/Features.d.cts +0 -11
  40. package/dist/components/Features.d.ts +0 -11
  41. package/dist/components/Features.js +0 -18
  42. package/dist/components/PackageInstallationTabs.cjs +0 -64
  43. package/dist/components/PackageInstallationTabs.d.cts +0 -8
  44. package/dist/components/PackageInstallationTabs.d.ts +0 -8
  45. package/dist/components/PackageInstallationTabs.js +0 -40
  46. package/dist/components/StyledLink.cjs +0 -44
  47. package/dist/components/StyledLink.d.cts +0 -9
  48. package/dist/components/StyledLink.d.ts +0 -9
  49. package/dist/components/StyledLink.js +0 -20
  50. package/dist/components/VideoPlayer.cjs +0 -103
  51. package/dist/components/VideoPlayer.d.cts +0 -34
  52. package/dist/components/VideoPlayer.d.ts +0 -34
  53. package/dist/components/VideoPlayer.js +0 -79
@@ -1,10 +0,0 @@
1
- import * as react from 'react';
2
-
3
- interface CodeHighlighterProps {
4
- children: string | string[];
5
- language?: string;
6
- resolvedTheme: string;
7
- }
8
- declare function CodeHighlighter({ children, language, resolvedTheme }: CodeHighlighterProps): react.JSX.Element;
9
-
10
- export { CodeHighlighter, type CodeHighlighterProps };
@@ -1,18 +0,0 @@
1
- import { jsx } from "react/jsx-runtime";
2
- import { Prism } from "react-syntax-highlighter";
3
- import { materialLight, materialOceanic } from "react-syntax-highlighter/dist/esm/styles/prism";
4
- import NoSSR from "./NoSSR";
5
- function CodeHighlighter({ children, language, resolvedTheme }) {
6
- return /* @__PURE__ */ jsx("div", { className: "tuwadocs:border-t tuwadocs:border-[var(--tuwa-border-secondary)]", children: /* @__PURE__ */ jsx(NoSSR, { children: /* @__PURE__ */ jsx(
7
- Prism,
8
- {
9
- language: language ?? "bash",
10
- customStyle: { margin: 0, background: "transparent" },
11
- style: resolvedTheme === "dark" ? materialOceanic : materialLight,
12
- children: String(children).replace(/\n$/, "")
13
- }
14
- ) }) });
15
- }
16
- export {
17
- CodeHighlighter
18
- };
@@ -1,44 +0,0 @@
1
- "use strict";
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __export = (target, all) => {
7
- for (var name in all)
8
- __defProp(target, name, { get: all[name], enumerable: true });
9
- };
10
- var __copyProps = (to, from, except, desc) => {
11
- if (from && typeof from === "object" || typeof from === "function") {
12
- for (let key of __getOwnPropNames(from))
13
- if (!__hasOwnProp.call(to, key) && key !== except)
14
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
- }
16
- return to;
17
- };
18
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
- var CopyIconButton_exports = {};
20
- __export(CopyIconButton_exports, {
21
- CopyIconButton: () => CopyIconButton
22
- });
23
- module.exports = __toCommonJS(CopyIconButton_exports);
24
- var import_jsx_runtime = require("react/jsx-runtime");
25
- var import_outline = require("@heroicons/react/24/outline");
26
- var import_nova_core = require("@tuwaio/nova-core");
27
- function CopyIconButton({ isCopied, onCopy }) {
28
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
29
- "button",
30
- {
31
- onClick: onCopy,
32
- type: "button",
33
- className: (0, import_nova_core.cn)(
34
- "tuwadocs:h-6 tuwadocs:w-6 tuwadocs:cursor-pointer tuwadocs:transition-colors",
35
- isCopied ? "tuwadocs:text-[var(--tuwa-success-icon)]" : "tuwadocs:text-[var(--tuwa-text-secondary)] tuwadocs:hover:text-[var(--tuwa-text-primary)]"
36
- ),
37
- children: isCopied ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_outline.CheckCircleIcon, {}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_outline.Square2StackIcon, {})
38
- }
39
- );
40
- }
41
- // Annotate the CommonJS export names for ESM import in node:
42
- 0 && (module.exports = {
43
- CopyIconButton
44
- });
@@ -1,9 +0,0 @@
1
- import * as react from 'react';
2
-
3
- interface CopyIconButtonProps {
4
- isCopied: boolean;
5
- onCopy: () => void;
6
- }
7
- declare function CopyIconButton({ isCopied, onCopy }: CopyIconButtonProps): react.JSX.Element;
8
-
9
- export { CopyIconButton };
@@ -1,9 +0,0 @@
1
- import * as react from 'react';
2
-
3
- interface CopyIconButtonProps {
4
- isCopied: boolean;
5
- onCopy: () => void;
6
- }
7
- declare function CopyIconButton({ isCopied, onCopy }: CopyIconButtonProps): react.JSX.Element;
8
-
9
- export { CopyIconButton };
@@ -1,20 +0,0 @@
1
- import { jsx } from "react/jsx-runtime";
2
- import { CheckCircleIcon, Square2StackIcon } from "@heroicons/react/24/outline";
3
- import { cn } from "@tuwaio/nova-core";
4
- function CopyIconButton({ isCopied, onCopy }) {
5
- return /* @__PURE__ */ jsx(
6
- "button",
7
- {
8
- onClick: onCopy,
9
- type: "button",
10
- className: cn(
11
- "tuwadocs:h-6 tuwadocs:w-6 tuwadocs:cursor-pointer tuwadocs:transition-colors",
12
- isCopied ? "tuwadocs:text-[var(--tuwa-success-icon)]" : "tuwadocs:text-[var(--tuwa-text-secondary)] tuwadocs:hover:text-[var(--tuwa-text-primary)]"
13
- ),
14
- children: isCopied ? /* @__PURE__ */ jsx(CheckCircleIcon, {}) : /* @__PURE__ */ jsx(Square2StackIcon, {})
15
- }
16
- );
17
- }
18
- export {
19
- CopyIconButton
20
- };
@@ -1,42 +0,0 @@
1
- "use strict";
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __export = (target, all) => {
7
- for (var name in all)
8
- __defProp(target, name, { get: all[name], enumerable: true });
9
- };
10
- var __copyProps = (to, from, except, desc) => {
11
- if (from && typeof from === "object" || typeof from === "function") {
12
- for (let key of __getOwnPropNames(from))
13
- if (!__hasOwnProp.call(to, key) && key !== except)
14
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
- }
16
- return to;
17
- };
18
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
- var Features_exports = {};
20
- __export(Features_exports, {
21
- Features: () => Features
22
- });
23
- module.exports = __toCommonJS(Features_exports);
24
- var import_jsx_runtime = require("react/jsx-runtime");
25
- function Features({ features }) {
26
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "tuwadocs:grid tuwadocs:grid-cols-1 tuwadocs:md:grid-cols-3 tuwadocs:gap-6 tuwadocs:mt-12", children: features.map((feature) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
27
- "div",
28
- {
29
- className: "tuwadocs:p-6 tuwadocs:border tuwadocs:rounded-[var(--tuwa-rounded-corners)] tuwadocs:hover:shadow-lg tuwadocs:transition-shadow",
30
- children: [
31
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "tuwadocs:text-2xl tuwadocs:mb-3", children: feature.icon }),
32
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h3", { className: "tuwadocs:text-lg tuwadocs:font-semibold tuwadocs:mb-2", children: feature.title }),
33
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: "tuwadocs:text-[var(--tuwa-text-secondary)]", children: feature.description })
34
- ]
35
- },
36
- feature.title
37
- )) });
38
- }
39
- // Annotate the CommonJS export names for ESM import in node:
40
- 0 && (module.exports = {
41
- Features
42
- });
@@ -1,11 +0,0 @@
1
- import * as react from 'react';
2
-
3
- declare function Features({ features }: {
4
- features: {
5
- title: string;
6
- icon: string;
7
- description: string;
8
- }[];
9
- }): react.JSX.Element;
10
-
11
- export { Features };
@@ -1,11 +0,0 @@
1
- import * as react from 'react';
2
-
3
- declare function Features({ features }: {
4
- features: {
5
- title: string;
6
- icon: string;
7
- description: string;
8
- }[];
9
- }): react.JSX.Element;
10
-
11
- export { Features };
@@ -1,18 +0,0 @@
1
- import { jsx, jsxs } from "react/jsx-runtime";
2
- function Features({ features }) {
3
- return /* @__PURE__ */ jsx("div", { className: "tuwadocs:grid tuwadocs:grid-cols-1 tuwadocs:md:grid-cols-3 tuwadocs:gap-6 tuwadocs:mt-12", children: features.map((feature) => /* @__PURE__ */ jsxs(
4
- "div",
5
- {
6
- className: "tuwadocs:p-6 tuwadocs:border tuwadocs:rounded-[var(--tuwa-rounded-corners)] tuwadocs:hover:shadow-lg tuwadocs:transition-shadow",
7
- children: [
8
- /* @__PURE__ */ jsx("div", { className: "tuwadocs:text-2xl tuwadocs:mb-3", children: feature.icon }),
9
- /* @__PURE__ */ jsx("h3", { className: "tuwadocs:text-lg tuwadocs:font-semibold tuwadocs:mb-2", children: feature.title }),
10
- /* @__PURE__ */ jsx("p", { className: "tuwadocs:text-[var(--tuwa-text-secondary)]", children: feature.description })
11
- ]
12
- },
13
- feature.title
14
- )) });
15
- }
16
- export {
17
- Features
18
- };
@@ -1,64 +0,0 @@
1
- "use strict";
2
- "use client";
3
- var __defProp = Object.defineProperty;
4
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
- var __getOwnPropNames = Object.getOwnPropertyNames;
6
- var __hasOwnProp = Object.prototype.hasOwnProperty;
7
- var __export = (target, all) => {
8
- for (var name in all)
9
- __defProp(target, name, { get: all[name], enumerable: true });
10
- };
11
- var __copyProps = (to, from, except, desc) => {
12
- if (from && typeof from === "object" || typeof from === "function") {
13
- for (let key of __getOwnPropNames(from))
14
- if (!__hasOwnProp.call(to, key) && key !== except)
15
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
16
- }
17
- return to;
18
- };
19
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
20
- var PackageInstallationTabs_exports = {};
21
- __export(PackageInstallationTabs_exports, {
22
- PackageInstallationTabs: () => PackageInstallationTabs
23
- });
24
- module.exports = __toCommonJS(PackageInstallationTabs_exports);
25
- var import_jsx_runtime = require("react/jsx-runtime");
26
- var import_outline = require("@heroicons/react/24/outline");
27
- var import_components = require("nextra/components");
28
- var import_CodeBlock = require("./CodeBlock");
29
- var import_CodeHighlighter = require("./CodeHighlighter");
30
- const tabsItems = [
31
- {
32
- title: "pnpm",
33
- command: "pnpm add"
34
- },
35
- {
36
- title: "bun",
37
- command: "bun add"
38
- },
39
- {
40
- title: "npm",
41
- command: "npm install"
42
- },
43
- {
44
- title: "yarn",
45
- command: "yarn add"
46
- }
47
- ];
48
- function PackageInstallationTabs({
49
- packagesList,
50
- resolvedTheme
51
- }) {
52
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { className: "tuwadocs:my-4", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.Tabs, { items: tabsItems.map((tab) => tab.title), children: tabsItems.map((tab) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_components.Tabs.Tab, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_CodeBlock.CodeBlock, { title: "Terminal", titleIcons: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_outline.CommandLineIcon, {}), textToCopy: `${tab.command} ${packagesList}`, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
53
- import_CodeHighlighter.CodeHighlighter,
54
- {
55
- resolvedTheme,
56
- language: "bash",
57
- children: `${tab.command} ${packagesList}`
58
- }
59
- ) }) }, tab.title)) }) });
60
- }
61
- // Annotate the CommonJS export names for ESM import in node:
62
- 0 && (module.exports = {
63
- PackageInstallationTabs
64
- });
@@ -1,8 +0,0 @@
1
- import * as react from 'react';
2
- import { CodeHighlighterProps } from './CodeHighlighter.cjs';
3
-
4
- declare function PackageInstallationTabs({ packagesList, resolvedTheme, }: {
5
- packagesList: string;
6
- } & Pick<CodeHighlighterProps, 'resolvedTheme'>): react.JSX.Element;
7
-
8
- export { PackageInstallationTabs };
@@ -1,8 +0,0 @@
1
- import * as react from 'react';
2
- import { CodeHighlighterProps } from './CodeHighlighter.js';
3
-
4
- declare function PackageInstallationTabs({ packagesList, resolvedTheme, }: {
5
- packagesList: string;
6
- } & Pick<CodeHighlighterProps, 'resolvedTheme'>): react.JSX.Element;
7
-
8
- export { PackageInstallationTabs };
@@ -1,40 +0,0 @@
1
- "use client";
2
- import { jsx } from "react/jsx-runtime";
3
- import { CommandLineIcon } from "@heroicons/react/24/outline";
4
- import { Tabs } from "nextra/components";
5
- import { CodeBlock } from "./CodeBlock";
6
- import { CodeHighlighter } from "./CodeHighlighter";
7
- const tabsItems = [
8
- {
9
- title: "pnpm",
10
- command: "pnpm add"
11
- },
12
- {
13
- title: "bun",
14
- command: "bun add"
15
- },
16
- {
17
- title: "npm",
18
- command: "npm install"
19
- },
20
- {
21
- title: "yarn",
22
- command: "yarn add"
23
- }
24
- ];
25
- function PackageInstallationTabs({
26
- packagesList,
27
- resolvedTheme
28
- }) {
29
- return /* @__PURE__ */ jsx("div", { className: "tuwadocs:my-4", children: /* @__PURE__ */ jsx(Tabs, { items: tabsItems.map((tab) => tab.title), children: tabsItems.map((tab) => /* @__PURE__ */ jsx(Tabs.Tab, { children: /* @__PURE__ */ jsx(CodeBlock, { title: "Terminal", titleIcons: /* @__PURE__ */ jsx(CommandLineIcon, {}), textToCopy: `${tab.command} ${packagesList}`, children: /* @__PURE__ */ jsx(
30
- CodeHighlighter,
31
- {
32
- resolvedTheme,
33
- language: "bash",
34
- children: `${tab.command} ${packagesList}`
35
- }
36
- ) }) }, tab.title)) }) });
37
- }
38
- export {
39
- PackageInstallationTabs
40
- };
@@ -1,44 +0,0 @@
1
- "use strict";
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __export = (target, all) => {
7
- for (var name in all)
8
- __defProp(target, name, { get: all[name], enumerable: true });
9
- };
10
- var __copyProps = (to, from, except, desc) => {
11
- if (from && typeof from === "object" || typeof from === "function") {
12
- for (let key of __getOwnPropNames(from))
13
- if (!__hasOwnProp.call(to, key) && key !== except)
14
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
- }
16
- return to;
17
- };
18
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
- var StyledLink_exports = {};
20
- __export(StyledLink_exports, {
21
- StyledLink: () => StyledLink
22
- });
23
- module.exports = __toCommonJS(StyledLink_exports);
24
- var import_jsx_runtime = require("react/jsx-runtime");
25
- var import_nova_core = require("@tuwaio/nova-core");
26
- function StyledLink({ href, children }) {
27
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
28
- "a",
29
- {
30
- className: (0, import_nova_core.cn)(
31
- "tuwadocs:font-medium tuwadocs:text-[var(--tuwa-text-accent)]",
32
- "tuwadocs:transition-all tuwadocs:hover:underline tuwadocs:underline-offset-4"
33
- ),
34
- href,
35
- target: "_blank",
36
- rel: "noopener noreferrer",
37
- children
38
- }
39
- );
40
- }
41
- // Annotate the CommonJS export names for ESM import in node:
42
- 0 && (module.exports = {
43
- StyledLink
44
- });
@@ -1,9 +0,0 @@
1
- import * as react from 'react';
2
- import { ReactNode } from 'react';
3
-
4
- declare function StyledLink({ href, children }: {
5
- href: string;
6
- children: ReactNode;
7
- }): react.JSX.Element;
8
-
9
- export { StyledLink };
@@ -1,9 +0,0 @@
1
- import * as react from 'react';
2
- import { ReactNode } from 'react';
3
-
4
- declare function StyledLink({ href, children }: {
5
- href: string;
6
- children: ReactNode;
7
- }): react.JSX.Element;
8
-
9
- export { StyledLink };
@@ -1,20 +0,0 @@
1
- import { jsx } from "react/jsx-runtime";
2
- import { cn } from "@tuwaio/nova-core";
3
- function StyledLink({ href, children }) {
4
- return /* @__PURE__ */ jsx(
5
- "a",
6
- {
7
- className: cn(
8
- "tuwadocs:font-medium tuwadocs:text-[var(--tuwa-text-accent)]",
9
- "tuwadocs:transition-all tuwadocs:hover:underline tuwadocs:underline-offset-4"
10
- ),
11
- href,
12
- target: "_blank",
13
- rel: "noopener noreferrer",
14
- children
15
- }
16
- );
17
- }
18
- export {
19
- StyledLink
20
- };
@@ -1,103 +0,0 @@
1
- "use strict";
2
- "use client";
3
- var __defProp = Object.defineProperty;
4
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
- var __getOwnPropNames = Object.getOwnPropertyNames;
6
- var __hasOwnProp = Object.prototype.hasOwnProperty;
7
- var __export = (target, all) => {
8
- for (var name in all)
9
- __defProp(target, name, { get: all[name], enumerable: true });
10
- };
11
- var __copyProps = (to, from, except, desc) => {
12
- if (from && typeof from === "object" || typeof from === "function") {
13
- for (let key of __getOwnPropNames(from))
14
- if (!__hasOwnProp.call(to, key) && key !== except)
15
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
16
- }
17
- return to;
18
- };
19
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
20
- var VideoPlayer_exports = {};
21
- __export(VideoPlayer_exports, {
22
- VideoPlayer: () => VideoPlayer
23
- });
24
- module.exports = __toCommonJS(VideoPlayer_exports);
25
- var import_jsx_runtime = require("react/jsx-runtime");
26
- var import_nova_core = require("@tuwaio/nova-core");
27
- const aspectMap = {
28
- "aspect-square": "tuwadocs:aspect-square",
29
- "aspect-video": "tuwadocs:aspect-video",
30
- "aspect-[4/3]": "tuwadocs:aspect-[4/3]",
31
- "aspect-[3/2]": "tuwadocs:aspect-[3/2]",
32
- "aspect-[21/9]": "tuwadocs:aspect-[21/9]"
33
- };
34
- const VideoPlayer = ({
35
- src,
36
- poster,
37
- autoplay = false,
38
- muted = false,
39
- loop = false,
40
- controls = true,
41
- className = "",
42
- aspectRatio = "aspect-video",
43
- onPlay,
44
- onPause,
45
- onEnded,
46
- "aria-label": ariaLabel
47
- }) => {
48
- const mappedAspectRatio = aspectMap[aspectRatio] || "tuwadocs:aspect-video";
49
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
50
- "div",
51
- {
52
- className: (0, import_nova_core.cn)(
53
- // Container with aspect ratio and responsive design
54
- "tuwadocs:relative tuwadocs:w-full tuwadocs:overflow-hidden tuwadocs:rounded-[var(--tuwa-rounded-corners)] tuwadocs:bg-black tuwadocs:my-4",
55
- mappedAspectRatio,
56
- className
57
- ),
58
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
59
- "video",
60
- {
61
- src,
62
- poster,
63
- controls,
64
- autoPlay: autoplay,
65
- muted,
66
- loop,
67
- className: (0, import_nova_core.cn)(
68
- // Video fills container completely
69
- "tuwadocs:absolute tuwadocs:inset-0 tuwadocs:h-full tuwadocs:w-full tuwadocs:object-contain",
70
- // Smooth transitions and focus states
71
- "tuwadocs:transition-opacity tuwadocs:duration-200",
72
- "tuwadocs:focus:outline-none tuwadocs:focus:ring-[length:var(--tuwa-ring-width)] tuwadocs:focus:ring-[var(--tuwa-text-accent)] tuwadocs:focus:ring-offset-[length:var(--tuwa-ring-width)] tuwadocs:focus:ring-offset-[var(--tuwa-bg-primary)]"
73
- ),
74
- onPlay,
75
- onPause,
76
- onEnded,
77
- "aria-label": ariaLabel,
78
- preload: "metadata",
79
- children: [
80
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)("track", { kind: "captions" }),
81
- "Your browser does not support the video tag. Please",
82
- " ",
83
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
84
- "a",
85
- {
86
- href: src,
87
- download: true,
88
- className: "tuwadocs:text-[var(--tuwa-text-accent)] tuwadocs:underline tuwadocs:hover:opacity-80",
89
- children: "download the video"
90
- }
91
- ),
92
- " ",
93
- "to watch it."
94
- ]
95
- }
96
- )
97
- }
98
- );
99
- };
100
- // Annotate the CommonJS export names for ESM import in node:
101
- 0 && (module.exports = {
102
- VideoPlayer
103
- });
@@ -1,34 +0,0 @@
1
- import react__default from 'react';
2
-
3
- /**
4
- * Props for the VideoPlayer component.
5
- */
6
- interface VideoPlayerProps {
7
- /** Path to the video file in the /public directory */
8
- src: string;
9
- /** Optional poster image to display before video plays */
10
- poster?: string;
11
- /** Whether the video should autoplay (Note: most browsers require muted for autoplay) */
12
- autoplay?: boolean;
13
- /** Whether the video should be muted */
14
- muted?: boolean;
15
- /** Whether the video should loop */
16
- loop?: boolean;
17
- /** Whether to show video controls */
18
- controls?: boolean;
19
- /** Optional CSS class name for the container */
20
- className?: string;
21
- /** Custom aspect ratio using Tailwind aspect-ratio classes (default: 'aspect-video' for 16:9) */
22
- aspectRatio?: 'aspect-square' | 'aspect-video' | 'aspect-[4/3]' | 'aspect-[3/2]' | 'aspect-[21/9]';
23
- /** Callback function called when video starts playing */
24
- onPlay?: () => void;
25
- /** Callback function called when video is paused */
26
- onPause?: () => void;
27
- /** Callback function called when video ends */
28
- onEnded?: () => void;
29
- /** ARIA label for accessibility */
30
- 'aria-label'?: string;
31
- }
32
- declare const VideoPlayer: react__default.FC<VideoPlayerProps>;
33
-
34
- export { VideoPlayer, type VideoPlayerProps };
@@ -1,34 +0,0 @@
1
- import react__default from 'react';
2
-
3
- /**
4
- * Props for the VideoPlayer component.
5
- */
6
- interface VideoPlayerProps {
7
- /** Path to the video file in the /public directory */
8
- src: string;
9
- /** Optional poster image to display before video plays */
10
- poster?: string;
11
- /** Whether the video should autoplay (Note: most browsers require muted for autoplay) */
12
- autoplay?: boolean;
13
- /** Whether the video should be muted */
14
- muted?: boolean;
15
- /** Whether the video should loop */
16
- loop?: boolean;
17
- /** Whether to show video controls */
18
- controls?: boolean;
19
- /** Optional CSS class name for the container */
20
- className?: string;
21
- /** Custom aspect ratio using Tailwind aspect-ratio classes (default: 'aspect-video' for 16:9) */
22
- aspectRatio?: 'aspect-square' | 'aspect-video' | 'aspect-[4/3]' | 'aspect-[3/2]' | 'aspect-[21/9]';
23
- /** Callback function called when video starts playing */
24
- onPlay?: () => void;
25
- /** Callback function called when video is paused */
26
- onPause?: () => void;
27
- /** Callback function called when video ends */
28
- onEnded?: () => void;
29
- /** ARIA label for accessibility */
30
- 'aria-label'?: string;
31
- }
32
- declare const VideoPlayer: react__default.FC<VideoPlayerProps>;
33
-
34
- export { VideoPlayer, type VideoPlayerProps };
@@ -1,79 +0,0 @@
1
- "use client";
2
- import { jsx, jsxs } from "react/jsx-runtime";
3
- import { cn } from "@tuwaio/nova-core";
4
- const aspectMap = {
5
- "aspect-square": "tuwadocs:aspect-square",
6
- "aspect-video": "tuwadocs:aspect-video",
7
- "aspect-[4/3]": "tuwadocs:aspect-[4/3]",
8
- "aspect-[3/2]": "tuwadocs:aspect-[3/2]",
9
- "aspect-[21/9]": "tuwadocs:aspect-[21/9]"
10
- };
11
- const VideoPlayer = ({
12
- src,
13
- poster,
14
- autoplay = false,
15
- muted = false,
16
- loop = false,
17
- controls = true,
18
- className = "",
19
- aspectRatio = "aspect-video",
20
- onPlay,
21
- onPause,
22
- onEnded,
23
- "aria-label": ariaLabel
24
- }) => {
25
- const mappedAspectRatio = aspectMap[aspectRatio] || "tuwadocs:aspect-video";
26
- return /* @__PURE__ */ jsx(
27
- "div",
28
- {
29
- className: cn(
30
- // Container with aspect ratio and responsive design
31
- "tuwadocs:relative tuwadocs:w-full tuwadocs:overflow-hidden tuwadocs:rounded-[var(--tuwa-rounded-corners)] tuwadocs:bg-black tuwadocs:my-4",
32
- mappedAspectRatio,
33
- className
34
- ),
35
- children: /* @__PURE__ */ jsxs(
36
- "video",
37
- {
38
- src,
39
- poster,
40
- controls,
41
- autoPlay: autoplay,
42
- muted,
43
- loop,
44
- className: cn(
45
- // Video fills container completely
46
- "tuwadocs:absolute tuwadocs:inset-0 tuwadocs:h-full tuwadocs:w-full tuwadocs:object-contain",
47
- // Smooth transitions and focus states
48
- "tuwadocs:transition-opacity tuwadocs:duration-200",
49
- "tuwadocs:focus:outline-none tuwadocs:focus:ring-[length:var(--tuwa-ring-width)] tuwadocs:focus:ring-[var(--tuwa-text-accent)] tuwadocs:focus:ring-offset-[length:var(--tuwa-ring-width)] tuwadocs:focus:ring-offset-[var(--tuwa-bg-primary)]"
50
- ),
51
- onPlay,
52
- onPause,
53
- onEnded,
54
- "aria-label": ariaLabel,
55
- preload: "metadata",
56
- children: [
57
- /* @__PURE__ */ jsx("track", { kind: "captions" }),
58
- "Your browser does not support the video tag. Please",
59
- " ",
60
- /* @__PURE__ */ jsx(
61
- "a",
62
- {
63
- href: src,
64
- download: true,
65
- className: "tuwadocs:text-[var(--tuwa-text-accent)] tuwadocs:underline tuwadocs:hover:opacity-80",
66
- children: "download the video"
67
- }
68
- ),
69
- " ",
70
- "to watch it."
71
- ]
72
- }
73
- )
74
- }
75
- );
76
- };
77
- export {
78
- VideoPlayer
79
- };