Skip to content

Commit

Permalink
Allow mapping to multiple class names
Browse files Browse the repository at this point in the history
  • Loading branch information
Ti-tanium authored Jun 5, 2024
1 parent bf0c5a4 commit b96b113
Showing 1 changed file with 4 additions and 4 deletions.
8 changes: 4 additions & 4 deletions next-themes/src/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -48,17 +48,17 @@ const Theme = ({
resolved = getSystemTheme()
}

const name = value ? value[resolved] : resolved
const names = value ? Array.isArray(value[resolved]) ? value[resolved] : [value[resolved]] : resolved
const enable = disableTransitionOnChange ? disableAnimation() : null
const d = document.documentElement

const handleAttribute = (attr: Attribute) => {
if (attr === 'class') {
d.classList.remove(...attrs)
if (name) d.classList.add(name)
if (names) d.classList.add(...names)
} else if (attr.startsWith('data-')) {
if (name) {
d.setAttribute(attr, name)
if (names) {
d.setAttribute(attr, names.join(' '))

Check failure on line 61 in next-themes/src/index.tsx

View workflow job for this annotation

GitHub Actions / Run Unit Tests

__tests__/index.test.tsx > defaultTheme > should return system-theme when no default-theme is set

TypeError: names.join is not a function ❯ handleAttribute src/index.tsx:61:38 ❯ src/index.tsx:69:10 ❯ src/index.tsx:102:9 ❯ src/index.tsx:114:5 ❯ commitHookEffectListMount ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:23150:26 ❯ commitPassiveMountOnFiber ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24931:11 ❯ commitPassiveMountEffects_complete ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24891:9 ❯ commitPassiveMountEffects_begin ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24878:7 ❯ commitPassiveMountEffects ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24866:3 ❯ flushPassiveEffectsImpl ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:27039:3

Check failure on line 61 in next-themes/src/index.tsx

View workflow job for this annotation

GitHub Actions / Run Unit Tests

__tests__/index.test.tsx > defaultTheme > should return light when no default-theme is set and enableSystem=false

TypeError: names.join is not a function ❯ handleAttribute src/index.tsx:61:38 ❯ src/index.tsx:69:10 ❯ src/index.tsx:137:5 ❯ commitHookEffectListMount ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:23150:26 ❯ commitPassiveMountOnFiber ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24931:11 ❯ commitPassiveMountEffects_complete ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24891:9 ❯ commitPassiveMountEffects_begin ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24878:7 ❯ commitPassiveMountEffects ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24866:3 ❯ flushPassiveEffectsImpl ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:27039:3 ❯ flushPassiveEffects ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:26984:14

Check failure on line 61 in next-themes/src/index.tsx

View workflow job for this annotation

GitHub Actions / Run Unit Tests

__tests__/index.test.tsx > defaultTheme > should return light when light is set as default-theme

TypeError: names.join is not a function ❯ handleAttribute src/index.tsx:61:38 ❯ src/index.tsx:69:10 ❯ src/index.tsx:137:5 ❯ commitHookEffectListMount ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:23150:26 ❯ commitPassiveMountOnFiber ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24931:11 ❯ commitPassiveMountEffects_complete ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24891:9 ❯ commitPassiveMountEffects_begin ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24878:7 ❯ commitPassiveMountEffects ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24866:3 ❯ flushPassiveEffectsImpl ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:27039:3 ❯ flushPassiveEffects ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:26984:14

Check failure on line 61 in next-themes/src/index.tsx

View workflow job for this annotation

GitHub Actions / Run Unit Tests

__tests__/index.test.tsx > defaultTheme > should return dark when dark is set as default-theme

TypeError: names.join is not a function ❯ handleAttribute src/index.tsx:61:38 ❯ src/index.tsx:69:10 ❯ src/index.tsx:137:5 ❯ commitHookEffectListMount ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:23150:26 ❯ commitPassiveMountOnFiber ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24931:11 ❯ commitPassiveMountEffects_complete ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24891:9 ❯ commitPassiveMountEffects_begin ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24878:7 ❯ commitPassiveMountEffects ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24866:3 ❯ flushPassiveEffectsImpl ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:27039:3 ❯ flushPassiveEffects ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:26984:14

Check failure on line 61 in next-themes/src/index.tsx

View workflow job for this annotation

GitHub Actions / Run Unit Tests

__tests__/index.test.tsx > provider > ignores nested ThemeProviders

TypeError: names.join is not a function ❯ handleAttribute src/index.tsx:61:38 ❯ src/index.tsx:69:10 ❯ src/index.tsx:137:5 ❯ commitHookEffectListMount ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:23150:26 ❯ commitPassiveMountOnFiber ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24931:11 ❯ commitPassiveMountEffects_complete ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24891:9 ❯ commitPassiveMountEffects_begin ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24878:7 ❯ commitPassiveMountEffects ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24866:3 ❯ flushPassiveEffectsImpl ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:27039:3 ❯ flushPassiveEffects ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:26984:14

Check failure on line 61 in next-themes/src/index.tsx

View workflow job for this annotation

GitHub Actions / Run Unit Tests

__tests__/index.test.tsx > storage > should not set localStorage with default value

TypeError: names.join is not a function ❯ handleAttribute src/index.tsx:61:38 ❯ src/index.tsx:69:10 ❯ src/index.tsx:137:5 ❯ commitHookEffectListMount ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:23150:26 ❯ commitPassiveMountOnFiber ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24931:11 ❯ commitPassiveMountEffects_complete ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24891:9 ❯ commitPassiveMountEffects_begin ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24878:7 ❯ commitPassiveMountEffects ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24866:3 ❯ flushPassiveEffectsImpl ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:27039:3 ❯ flushPassiveEffects ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:26984:14

Check failure on line 61 in next-themes/src/index.tsx

View workflow job for this annotation

GitHub Actions / Run Unit Tests

__tests__/index.test.tsx > storage > should set localStorage when switching themes

TypeError: names.join is not a function ❯ handleAttribute src/index.tsx:61:38 ❯ src/index.tsx:69:10 ❯ src/index.tsx:102:9 ❯ src/index.tsx:114:5 ❯ commitHookEffectListMount ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:23150:26 ❯ commitPassiveMountOnFiber ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24931:11 ❯ commitPassiveMountEffects_complete ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24891:9 ❯ commitPassiveMountEffects_begin ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24878:7 ❯ commitPassiveMountEffects ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24866:3 ❯ flushPassiveEffectsImpl ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:27039:3

Check failure on line 61 in next-themes/src/index.tsx

View workflow job for this annotation

GitHub Actions / Run Unit Tests

__tests__/index.test.tsx > custom storageKey > should save to localStorage with 'theme' key when using default settings

TypeError: names.join is not a function ❯ handleAttribute src/index.tsx:61:38 ❯ src/index.tsx:69:10 ❯ src/index.tsx:102:9 ❯ src/index.tsx:114:5 ❯ commitHookEffectListMount ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:23150:26 ❯ commitPassiveMountOnFiber ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24931:11 ❯ commitPassiveMountEffects_complete ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24891:9 ❯ commitPassiveMountEffects_begin ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24878:7 ❯ commitPassiveMountEffects ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24866:3 ❯ flushPassiveEffectsImpl ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:27039:3

Check failure on line 61 in next-themes/src/index.tsx

View workflow job for this annotation

GitHub Actions / Run Unit Tests

__tests__/index.test.tsx > custom storageKey > should save to localStorage with 'custom' when setting prop 'storageKey' to 'customKey'

TypeError: names.join is not a function ❯ handleAttribute src/index.tsx:61:38 ❯ src/index.tsx:69:10 ❯ src/index.tsx:102:9 ❯ src/index.tsx:114:5 ❯ commitHookEffectListMount ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:23150:26 ❯ commitPassiveMountOnFiber ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24931:11 ❯ commitPassiveMountEffects_complete ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24891:9 ❯ commitPassiveMountEffects_begin ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24878:7 ❯ commitPassiveMountEffects ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:24866:3 ❯ flushPassiveEffectsImpl ../node_modules/.pnpm/[email protected][email protected]/node_modules/react-dom/cjs/react-dom.development.js:27039:3
} else {
d.removeAttribute(attr)
}
Expand Down

0 comments on commit b96b113

Please sign in to comment.