zoriya/react-native-video
1
0
Fork 0
mirror of https://github.com/zoriya/react-native-video.git synced 2026-05-22 23:01:06 +00:00
Code Issues Packages Projects Releases Wiki Activity

docs: add eslint (#4805)

Browse Source 
* docs: add eslint

* chore: remove @eslint/css

* feat(docs): add custom eslint rule for css variables

* ci: check lint on css changes in docs

* ci: update lefthook configuration
This commit is contained in:
Kamil Moskała
2025-12-24 00:07:13 +01:00
committed by GitHub
parent 84d7abb89f
commit 6aaeebce8a
11 changed files with 113 additions and 81 deletions
Download Patch File Download Diff File Expand all files Collapse all files
bun.lock
+6 -2
View File
@@ -34,7 +34,7 @@
"@docusaurus/faster": "^3.8.1",
"@docusaurus/preset-classic": "^3.8.1",
"@mdx-js/react": "^3.0.0",
"@widlarzgroup/docusaurus-ui": "^0.0.2",
"@widlarzgroup/docusaurus-ui": "^0.0.3",
"clsx": "^2.0.0",
"docusaurus-lunr-search": "^3.6.0",
"prism-react-renderer": "^2.3.0",
@@ -45,8 +45,10 @@
"@docusaurus/module-type-aliases": "^3.8.1",
"@docusaurus/tsconfig": "^3.8.1",
"@docusaurus/types": "^3.8.1",
"@widlarzgroup/eslint-plugin-docusaurus": "^0.0.1",
"docusaurus-plugin-llms": "^0.1.5",
"docusaurus-plugin-typedoc": "^1.4.0",
"eslint": "^8.51.0",
"typescript": "^5.2.2",
},
},
@@ -1183,7 +1185,9 @@
"@webassemblyjs/wast-printer": ["@webassemblyjs/wast-printer@1.14.1", "", { "dependencies": { "@webassemblyjs/ast": "1.14.1", "@xtuc/long": "4.2.2" } }, "sha512-kPSSXE6De1XOR820C90RIo2ogvZG+c3KiHzqUoO/F34Y2shGzesfqv7o57xrxovZJH/MetF5UjroJ/R/3isoiw=="],
"@widlarzgroup/docusaurus-ui": ["@widlarzgroup/docusaurus-ui@0.0.2", "", { "peerDependencies": { "@docusaurus/core": "^3.9.2", "@docusaurus/theme-classic": "^3.9.2", "react": "^18.0.0 || ^19.0.0", "react-dom": "^18.0.0 || ^19.0.0" } }, "sha512-ncO/RddO1/WwpRk+xs9GuQWbEWM2sy6Kj7byjwIyMfvcAqeyHJjXIASxLPCGqty+FPoEVqnBu1ASBez12tYABg=="],
"@widlarzgroup/docusaurus-ui": ["@widlarzgroup/docusaurus-ui@0.0.3", "", { "peerDependencies": { "@docusaurus/core": "^3.9.2", "@docusaurus/theme-classic": "^3.9.2", "react": "^18.0.0 || ^19.0.0", "react-dom": "^18.0.0 || ^19.0.0" } }, "sha512-Yf6RAG9phlapVlDQDRp6NvTr67GrSDNC4VpFEtBYGhfC5gR7UKX79+iBkJQlBFCSKQC4KR8kmNpDqxz4UQAnBQ=="],
"@widlarzgroup/eslint-plugin-docusaurus": ["@widlarzgroup/eslint-plugin-docusaurus@0.0.1", "", { "peerDependencies": { "@widlarzgroup/docusaurus-ui": "*", "eslint": ">=8.0.0" } }, "sha512-LKvLrUS5mqenAM3vgMPhcUR1dL2oc20xGJY3/zQX3NJuxWwnQf+qZQb04yE3QHoT1o/yup0M59Xfb0/pm/AnWQ=="],
"@xmldom/xmldom": ["@xmldom/xmldom@0.8.11", "", {}, "sha512-cQzWCtO6C8TQiYl1ruKNn2U6Ao4o4WBBcbL61yJl84x+j5sOWWFU9X7DpND8XZG3daDppSsigMdfAIl2upQBRw=="],
docs/.eslintrc.js
+20
View File
@@ -0,0 +1,20 @@
module.exports = {
root: true,
extends: ["../config/.eslintrc.js"],
parserOptions: {
tsconfigRootDir: __dirname,
project: true,
},
plugins: ['@widlarzgroup/docusaurus'],
settings: {
'@widlarzgroup/docusaurus': {
extend: ['src/css/custom.css'],
},
},
overrides: [
{
files: ['**/*.css'],
processor: '@widlarzgroup/docusaurus/.css',
},
],
};
docs/docusaurus.config.ts
+18 -18
View File
@@ -20,7 +20,7 @@ const config: Config = {
future: {
experimental_faster: true,
v4: true
v4: true,
},
i18n: {
@@ -37,7 +37,7 @@ const config: Config = {
lastVersion: '6.x',
includeCurrentVersion: true,
versions: {
current: {
'current': {
label: 'v7 Beta',
path: 'v7',
banner: 'none',
@@ -105,8 +105,8 @@ const config: Config = {
{
type: 'docsVersionDropdown',
versions: {
current: {label: 'v7 Beta'},
'6.x': {label: 'v6'},
'current': { label: 'v7 Beta' },
'6.x': { label: 'v6' },
},
position: 'right',
},
@@ -154,7 +154,7 @@ const config: Config = {
{
name: 'API Reference',
entryPoints: ['../packages/react-native-video/src'],
exclude: "../packages/react-native-video/src/index.ts",
exclude: '../packages/react-native-video/src/index.ts',
tsconfig: '../packages/react-native-video/tsconfig.json',
out: './docs/api-reference',
watch: process.env.TYPEDOC_WATCH,
@@ -162,12 +162,12 @@ const config: Config = {
excludeProtected: true,
excludeExternals: true,
excludeInternal: true,
readme: "none",
readme: 'none',
sidebar: {
autoConfiguration: false,
},
parametersFormat: "table",
enumMembersFormat: "table",
parametersFormat: 'table',
enumMembersFormat: 'table',
useCodeBlocks: true,
},
],
@@ -178,10 +178,10 @@ const config: Config = {
id: 'llms-v6',
generateLLMsTxt: false,
generateLLMsFullTxt: false,
docsDir: "versioned_docs/version-6.x",
docsDir: 'versioned_docs/version-6.x',
pathTransformation: {
ignorePaths: ['docs'],
addPaths: ['react-native-video/docs/v6']
addPaths: ['react-native-video/docs/v6'],
},
version: '6.x.x',
customLLMFiles: [
@@ -199,8 +199,8 @@ const config: Config = {
includePatterns: ['**/*.md', '**/*.mdx'],
fullContent: true,
},
]
}
],
},
],
// LLMs txt generation for v7
[
@@ -209,10 +209,10 @@ const config: Config = {
id: 'llms-v7',
generateLLMsTxt: false,
generateLLMsFullTxt: false,
docsDir: "docs",
docsDir: 'docs',
pathTransformation: {
ignorePaths: ['docs'],
addPaths: ['react-native-video/docs/v7']
addPaths: ['react-native-video/docs/v7'],
},
version: '7.x.x',
customLLMFiles: [
@@ -229,10 +229,10 @@ const config: Config = {
description: 'Complete documentation for React Native Video v7',
includePatterns: ['docs/**/*.md'],
fullContent: true,
}
]
}
]
},
],
},
],
],
};
docs/package.json
+7 -4
View File
@@ -12,14 +12,15 @@
"serve": "docusaurus serve",
"write-translations": "docusaurus write-translations",
"write-heading-ids": "docusaurus write-heading-ids",
"typecheck": "tsc"
"typecheck": "tsc",
"lint": "eslint ."
},
"dependencies": {
"@docusaurus/core": "^3.8.1",
"@docusaurus/faster": "^3.8.1",
"@docusaurus/preset-classic": "^3.8.1",
"@mdx-js/react": "^3.0.0",
"@widlarzgroup/docusaurus-ui": "^0.0.2",
"@widlarzgroup/docusaurus-ui": "^0.0.3",
"clsx": "^2.0.0",
"docusaurus-lunr-search": "^3.6.0",
"prism-react-renderer": "^2.3.0",
@@ -30,9 +31,11 @@
"@docusaurus/module-type-aliases": "^3.8.1",
"@docusaurus/tsconfig": "^3.8.1",
"@docusaurus/types": "^3.8.1",
"typescript": "^5.2.2",
"@widlarzgroup/eslint-plugin-docusaurus": "^0.0.1",
"docusaurus-plugin-llms": "^0.1.5",
"docusaurus-plugin-typedoc": "^1.4.0",
"docusaurus-plugin-llms": "^0.1.5"
"eslint": "^8.51.0",
"typescript": "^5.2.2"
},
"browserslist": {
"production": [
docs/sidebars.ts
+27 -27
View File
@@ -1,60 +1,60 @@
import type { SidebarsConfig } from "@docusaurus/plugin-content-docs";
import type { SidebarsConfig } from '@docusaurus/plugin-content-docs';
const sidebars: SidebarsConfig = {
docsSidebar: [
{
type: "autogenerated",
dirName: ".",
type: 'autogenerated',
dirName: '.',
},
{
type: "html",
type: 'html',
value:
'<hr style="margin: 1rem 0; border: none; border-top: 1px solid var(--ifm-color-emphasis-300);" />',
},
{
type: "link",
label: "Example Apps",
href: "https://github.com/TheWidlarzGroup/react-native-video/tree/master/example",
type: 'link',
label: 'Example Apps',
href: 'https://github.com/TheWidlarzGroup/react-native-video/tree/master/example',
},
{
type: "doc",
label: "Useful Projects",
id: "projects",
type: 'doc',
label: 'Useful Projects',
id: 'projects',
},
{
type: "html",
type: 'html',
value:
'<hr style="margin: 1rem 0; border: none; border-top: 1px solid var(--ifm-color-emphasis-300);" />',
},
{
type: "link",
label: "Offline Video SDK",
href: "https://www.thewidlarzgroup.com/offline-video-sdk/?utm_source=rnv&utm_medium=docs&utm_campaign=sidebar&utm_id=offline-video-sdk-button",
type: 'link',
label: 'Offline Video SDK',
href: 'https://www.thewidlarzgroup.com/offline-video-sdk/?utm_source=rnv&utm_medium=docs&utm_campaign=sidebar&utm_id=offline-video-sdk-button',
},
{
type: "link",
label: "Enterprise Support",
href: "https://www.thewidlarzgroup.com/?utm_source=rnv&utm_medium=docs&utm_campaign=navbar&utm_id=enterprise#Contact",
type: 'link',
label: 'Enterprise Support',
href: 'https://www.thewidlarzgroup.com/?utm_source=rnv&utm_medium=docs&utm_campaign=navbar&utm_id=enterprise#Contact',
},
{
type: "link",
label: "Boost Your Issue",
href: "https://www.thewidlarzgroup.com/issue-boost/?utm_source=rnv&utm_medium=docs&utm_campaign=sidebar&utm_id=issue-boost-button",
type: 'link',
label: 'Boost Your Issue',
href: 'https://www.thewidlarzgroup.com/issue-boost/?utm_source=rnv&utm_medium=docs&utm_campaign=sidebar&utm_id=issue-boost-button',
},
{
type: "html",
type: 'html',
value:
'<hr style="margin: 1rem 0; border: none; border-top: 1px solid var(--ifm-color-emphasis-300);" />',
},
{
type: "doc",
label: "Updating",
id: "updating",
type: 'doc',
label: 'Updating',
id: 'updating',
},
{
type: "link",
label: "Releases",
href: "https://github.com/TheWidlarzGroup/react-native-video/releases",
type: 'link',
label: 'Releases',
href: 'https://github.com/TheWidlarzGroup/react-native-video/releases',
},
],
};
docs/src/components/HomepageFeatures/index.tsx
+4 -12
View File
@@ -14,32 +14,24 @@ const FeatureList: FeatureItem[] = [
title: 'React Native First',
Svg: require('@site/static/img/reactjs-icon.svg').default,
description: (
<>
React Native Video is a video player created for React Native.
</>
<>React Native Video is a video player created for React Native.</>
),
},
{
title: 'Multi Subtitles & Audio Tracks',
Svg: require('@site/static/img/download-icon.svg').default,
description: (
<>
React Native Video supports multiple subtitles and audio tracks.
</>
<>React Native Video supports multiple subtitles and audio tracks.</>
),
},
{
title: 'DRM Protected Content',
Svg: require('@site/static/img/drm-content-icon.svg').default,
description: (
<>
React Native Video supports DRM protected content.
</>
),
description: <>React Native Video supports DRM protected content.</>,
},
];
function Feature({title, Svg, description}: FeatureItem) {
function Feature({ title, Svg, description }: FeatureItem) {
return (
<div className={clsx('col col--4')}>
<div className="text--center">
docs/src/components/PlatformsList/PlatformsList.module.css
-3
View File
@@ -3,9 +3,6 @@
}
.spanStyle {
/* font-family: var(--font-orbitron);
font-weight: 800; */
font-family: "Orbitron", sans-serif;
font-optical-sizing: auto;
font-weight: 800;
docs/src/components/PlatformsList/PlatformsList.tsx
+1 -1
View File
@@ -14,7 +14,7 @@ interface Platforms {
types: Platform[];
}
function PlatformsList({types}: Platforms) {
function PlatformsList({ types }: Platforms) {
return (
<p className={styles.paragraphStyle}>
{types.length === 1 && !types.includes('All')
docs/src/css/custom.css
+12 -5
View File
@@ -1,7 +1,14 @@
/**
* Custom CSS for this project.
*
* We import base styles from @widlarzgroup/docusaurus-ui which:
* - Overrides default Infima variables with our custom design system
* - Provides new CSS variables for colors (--color-accent-*, --color-secondary-*, etc.)
* - Adds custom component styles and utilities
*
* You can further customize any CSS variables here - they will take
* precedence over both Infima defaults and the imported package styles.
*/
@import '@widlarzgroup/docusaurus-ui/css/custom.css';
/**
* Any CSS included here will be global. The classic template
* bundles Infima by default. Infima is a CSS framework designed to
* work well for content-centric websites.
*/
/* Add your custom overrides below */
docs/src/pages/index.tsx
+11 -8
View File
@@ -9,11 +9,11 @@ import { useMemo, type ReactNode } from 'react';
import styles from './index.module.css';
interface PreferredVersion {
preferredVersion: {label: string, mainDocId: string, path: string} | null;
preferredVersion: { label: string; mainDocId: string; path: string } | null;
}
function HomepageHeader() {
const {siteConfig} = useDocusaurusContext();
const { siteConfig } = useDocusaurusContext();
const version = useDocsPreferredVersion() as PreferredVersion;
@@ -28,15 +28,17 @@ function HomepageHeader() {
return (
<header className={clsx('hero hero--primary', styles.heroBanner)}>
<div className="container">
<img src="./img/twg-logo.png" alt="TheWidlarzGroup Logo" className={styles.logo} />
<img
src="./img/twg-logo.png"
alt="TheWidlarzGroup Logo"
className={styles.logo}
/>
<Heading as="h1" className="hero__title">
{siteConfig.title}
</Heading>
<p className="hero__subtitle">{siteConfig.tagline}</p>
<div className={styles.buttons}>
<Link
className="button button--secondary button--lg"
to={link}>
<Link className="button button--secondary button--lg" to={link}>
Get Started
</Link>
</div>
@@ -46,11 +48,12 @@ function HomepageHeader() {
}
export default function Home(): ReactNode {
const {siteConfig} = useDocusaurusContext();
const { siteConfig } = useDocusaurusContext();
return (
<Layout
title={`${siteConfig.title}`}
description="Video player for React Native.">
description="Video player for React Native."
>
<HomepageHeader />
<main>
<HomepageFeatures />
lefthook.yml
+7 -1
View File
@@ -3,9 +3,15 @@ pre-commit:
commands:
lint:
glob: "*.{js,ts,jsx,tsx}"
exclude: "docs/**/*"
run: bun lint
lint-docs:
# using @widlarzgroup/eslint-plugin-docusaurus for CSS variable validation
root: "docs/"
glob: "**/*.{js,ts,jsx,tsx,css}"
run: bun run lint
types:
glob: "*.{js,ts, jsx, tsx}"
glob: "*.{js,ts,jsx,tsx}"
run: bun typecheck
commit-msg:
parallel: true