chore: fix all lint issues

mu29 · mu29 · commit 5c844a1bc8d5 · 2025-11-08T22:55:53.000+09:00
diff --git a/biome.json b/biome.json
@@ -39,6 +39,11 @@
       "quoteStyle": "single"
     }
   },
+  "css": {
+    "parser": {
+      "tailwindDirectives": true
+    }
+  },
   "assist": {
     "actions": {
       "source": {
diff --git a/examples/expo/components/Button/Button.tsx b/examples/expo/components/Button/Button.tsx
@@ -14,9 +14,7 @@ export const Button = ({ variant, children }: Props) => {
         variant === 'primary' ? styles.primary : styles.outline,
       ]}
     >
-      <Text
-        style={[styles.buttonText, variant === 'primary' ? styles.primaryText : styles.outlineText]}
-      >
+      <Text style={[styles.buttonText, variant === 'primary' ? styles.primaryText : styles.outlineText]}>
         {children}
       </Text>
     </Pressable>
diff --git a/examples/expo/components/HStack/HStack.tsx b/examples/expo/components/HStack/HStack.tsx
@@ -2,13 +2,7 @@ import type { FC, PropsWithChildren } from 'react';
 import { View } from 'react-native';
 
 type Props = PropsWithChildren<{
-  alignHorizontal?:
-    | 'flex-start'
-    | 'flex-end'
-    | 'center'
-    | 'space-between'
-    | 'space-around'
-    | 'space-evenly';
+  alignHorizontal?: 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'space-evenly';
   alignVertical?: 'flex-start' | 'flex-end' | 'center' | 'stretch';
   size?: {
     width?: number;
diff --git a/examples/expo/components/VStack/VStack.tsx b/examples/expo/components/VStack/VStack.tsx
@@ -3,13 +3,7 @@ import { View } from 'react-native';
 
 type Props = PropsWithChildren<{
   flex?: number;
-  alignVertical?:
-    | 'flex-start'
-    | 'flex-end'
-    | 'center'
-    | 'space-between'
-    | 'space-around'
-    | 'space-evenly';
+  alignVertical?: 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'space-evenly';
   alignHorizontal?: 'flex-start' | 'flex-end' | 'center' | 'stretch';
   size?: {
     width?: number;
diff --git a/examples/nextjs/components/HStack/HStack.tsx b/examples/nextjs/components/HStack/HStack.tsx
@@ -1,13 +1,7 @@
 import type { FC, PropsWithChildren } from 'react';
 
 export type Props = PropsWithChildren<{
-  alignHorizontal?:
-    | 'flex-start'
-    | 'flex-end'
-    | 'center'
-    | 'space-between'
-    | 'space-around'
-    | 'space-evenly';
+  alignHorizontal?: 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'space-evenly';
   alignVertical?: 'flex-start' | 'flex-end' | 'center' | 'stretch';
   size?: {
     width?: number | string;
diff --git a/examples/nextjs/components/VStack/VStack.tsx b/examples/nextjs/components/VStack/VStack.tsx
@@ -1,13 +1,7 @@
 import type { FC, PropsWithChildren } from 'react';
 
 export type Props = PropsWithChildren<{
-  alignVertical?:
-    | 'flex-start'
-    | 'flex-end'
-    | 'center'
-    | 'space-between'
-    | 'space-around'
-    | 'space-evenly';
+  alignVertical?: 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'space-evenly';
   alignHorizontal?: 'flex-start' | 'flex-end' | 'center' | 'stretch';
   size?: {
     width?: number | string;
diff --git a/examples/react-router/app/app.css b/examples/react-router/app/app.css
@@ -2,8 +2,7 @@
 
 @theme {
   --font-sans:
-    system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Noto Sans, Ubuntu, Cantarell,
-    Helvetica Neue;
+    system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Noto Sans, Ubuntu, Cantarell, Helvetica Neue;
 }
 
 html,
diff --git a/examples/react-router/app/components/HStack/HStack.tsx b/examples/react-router/app/components/HStack/HStack.tsx
@@ -1,13 +1,7 @@
 import type { FC, PropsWithChildren } from 'react';
 
 export type Props = PropsWithChildren<{
-  alignHorizontal?:
-    | 'flex-start'
-    | 'flex-end'
-    | 'center'
-    | 'space-between'
-    | 'space-around'
-    | 'space-evenly';
+  alignHorizontal?: 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'space-evenly';
   alignVertical?: 'flex-start' | 'flex-end' | 'center' | 'stretch';
   size?: {
     width?: number | string;
diff --git a/examples/react-router/app/components/VStack/VStack.tsx b/examples/react-router/app/components/VStack/VStack.tsx
@@ -1,13 +1,7 @@
 import type { FC, PropsWithChildren } from 'react';
 
 export type Props = PropsWithChildren<{
-  alignVertical?:
-    | 'flex-start'
-    | 'flex-end'
-    | 'center'
-    | 'space-between'
-    | 'space-around'
-    | 'space-evenly';
+  alignVertical?: 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'space-evenly';
   alignHorizontal?: 'flex-start' | 'flex-end' | 'center' | 'stretch';
   size?: {
     width?: number | string;
diff --git a/examples/react-router/app/root.tsx b/examples/react-router/app/root.tsx
@@ -1,11 +1,4 @@
-import {
-  isRouteErrorResponse,
-  Links,
-  Meta,
-  Outlet,
-  Scripts,
-  ScrollRestoration,
-} from 'react-router';
+import { isRouteErrorResponse, Links, Meta, Outlet, Scripts, ScrollRestoration } from 'react-router';
 
 import type { Route } from './+types/root';
 import './app.css';
@@ -52,8 +45,7 @@ export function ErrorBoundary({ error }: Route.ErrorBoundaryProps) {
 
   if (isRouteErrorResponse(error)) {
     message = error.status === 404 ? '404' : 'Error';
-    details =
-      error.status === 404 ? 'The requested page could not be found.' : error.statusText || details;
+    details = error.status === 404 ? 'The requested page could not be found.' : error.statusText || details;
   } else if (import.meta.env.DEV && error && error instanceof Error) {
     details = error.message;
     stack = error.stack;
diff --git a/packages/docs/src/Backdrop/Backdrop.tsx b/packages/docs/src/Backdrop/Backdrop.tsx
@@ -7,13 +7,7 @@ export const Backdrop = () => {
   return visible ? (
     <div className={styles.container} role="button" onClick={() => setVisible(false)}>
       <span className={styles.iconBackground}>
-        <svg
-          xmlns="http://www.w3.org/2000/svg"
-          className={styles.icon}
-          width={96}
-          height={96}
-          viewBox="0 0 640 640"
-        >
+        <svg xmlns="http://www.w3.org/2000/svg" className={styles.icon} width={96} height={96} viewBox="0 0 640 640">
           <path d="M64 320C64 178.6 178.6 64 320 64C461.4 64 576 178.6 576 320C576 461.4 461.4 576 320 576C178.6 576 64 461.4 64 320zM252.3 211.1C244.7 215.3 240 223.4 240 232L240 408C240 416.7 244.7 424.7 252.3 428.9C259.9 433.1 269.1 433 276.6 428.4L420.6 340.4C427.7 336 432.1 328.3 432.1 319.9C432.1 311.5 427.7 303.8 420.6 299.4L276.6 211.4C269.2 206.9 259.9 206.7 252.3 210.9z" />
         </svg>
       </span>
diff --git a/packages/docs/src/Footer/Footer.tsx b/packages/docs/src/Footer/Footer.tsx
@@ -1,11 +1,13 @@
-import clsx from 'clsx';
 import styles from './Footer.module.css';
 
 export const Footer = () => (
   <section className={styles.container}>
     <div className={styles.column}>
-      <img src="/brand/logo-light.svg" alt="Logo" className={clsx(styles.logo, styles.light)} />
-      <img src="/brand/logo-dark.svg" alt="Logo" className={clsx(styles.logo, styles.dark)} />
+      <picture>
+        <source media="(prefers-color-scheme: dark)" srcSet="/brand/logo-dark.svg" />
+        <source media="(prefers-color-scheme: light)" srcSet="/brand/logo-light.svg" />
+        <img src="/brand/logo-light.svg" alt="Logo" />
+      </picture>
       <p className={styles.copyright}>
         © {new Date().getFullYear()} Hills Inc.
         <br />
diff --git a/packages/docs/src/HStack/HStack.tsx b/packages/docs/src/HStack/HStack.tsx
@@ -1,13 +1,7 @@
 import type { FC, PropsWithChildren } from 'react';
 
 export type Props = PropsWithChildren<{
-  alignHorizontal?:
-    | 'flex-start'
-    | 'flex-end'
-    | 'center'
-    | 'space-between'
-    | 'space-around'
-    | 'space-evenly';
+  alignHorizontal?: 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'space-evenly';
   alignVertical?: 'flex-start' | 'flex-end' | 'center' | 'stretch';
   size?: {
     width?: number | string;
diff --git a/packages/docs/src/PlanGroup/PlanGroup.tsx b/packages/docs/src/PlanGroup/PlanGroup.tsx
@@ -48,8 +48,6 @@ export const PlanGroup: FC = () => (
         ]}
       />
     </div>
-    <small className={styles.caption}>
-      * Features shown in gray are planned for upcoming releases.
-    </small>
+    <small className={styles.caption}>* Features shown in gray are planned for upcoming releases.</small>
   </section>
 );
diff --git a/packages/docs/src/PlanItem/PlanItem.tsx b/packages/docs/src/PlanItem/PlanItem.tsx
@@ -15,14 +15,7 @@ type Props = {
   recommended?: boolean;
 };
 
-export const PlanItem: FC<Props> = ({
-  title,
-  description,
-  price,
-  interval,
-  features,
-  recommended,
-}) => (
+export const PlanItem: FC<Props> = ({ title, description, price, interval, features, recommended }) => (
   <div className={clsx(styles.container, { [styles.recommended]: recommended })}>
     <h3 className={styles.title}>{title}</h3>
     <p className={styles.description}>{description}</p>
diff --git a/packages/docs/src/Playground/Playground.tsx b/packages/docs/src/Playground/Playground.tsx
@@ -89,9 +89,7 @@ export const Playground: FC<Props> = ({ mode, viewports }) => {
         </div>
         {mode === 'landing' && !isLibrary && !isVisualEditor && <Backdrop />}
       </div>
-      {mode === 'landing' && (
-        <p className={styles.description}>Make a change, hit save, and... tada! 🎉</p>
-      )}
+      {mode === 'landing' && <p className={styles.description}>Make a change, hit save, and... tada! 🎉</p>}
     </section>
   );
 };
diff --git a/packages/docs/src/PriceCalculator/PriceCalculator.tsx b/packages/docs/src/PriceCalculator/PriceCalculator.tsx
@@ -39,9 +39,7 @@ export const PriceCalculator: FC = () => {
   const effectiveSeats = parseInt(MEMBERS[members].replace(/\D/g, ''), 10);
 
   const proPrice =
-    29 +
-    Math.max((effectivePages - 30) * PAGES_PRICE, 0) +
-    Math.max((effectiveSeats - 3) * MEMBERS_PRICE, 0);
+    29 + Math.max((effectivePages - 30) * PAGES_PRICE, 0) + Math.max((effectiveSeats - 3) * MEMBERS_PRICE, 0);
   const businessPrice = 99 + Math.max((effectivePages - 100) * PAGES_PRICE, 0);
 
   const price = effectivePages <= 1 && effectiveSeats <= 1 ? 0 : Math.min(proPrice, businessPrice);
diff --git a/packages/docs/src/SourceContext/SourceContext.tsx b/packages/docs/src/SourceContext/SourceContext.tsx
@@ -1,11 +1,4 @@
-import {
-  createContext,
-  type FC,
-  type PropsWithChildren,
-  useContext,
-  useMemo,
-  useState,
-} from 'react';
+import { createContext, type FC, type PropsWithChildren, useContext, useMemo, useState } from 'react';
 
 type SourceContextValues = {
   source: string;
@@ -21,10 +14,7 @@ type Props = {
   source: string;
 };
 
-export const SourceProvider: FC<PropsWithChildren<Props>> = ({
-  source: initialSource,
-  children,
-}) => {
+export const SourceProvider: FC<PropsWithChildren<Props>> = ({ source: initialSource, children }) => {
   const [source, setSource] = useState<string>(initialSource);
 
   const contextValues = useMemo(
diff --git a/packages/docs/src/VStack/VStack.tsx b/packages/docs/src/VStack/VStack.tsx
@@ -1,13 +1,7 @@
 import type { FC, PropsWithChildren } from 'react';
 
 export type Props = PropsWithChildren<{
-  alignVertical?:
-    | 'flex-start'
-    | 'flex-end'
-    | 'center'
-    | 'space-between'
-    | 'space-around'
-    | 'space-evenly';
+  alignVertical?: 'flex-start' | 'flex-end' | 'center' | 'space-between' | 'space-around' | 'space-evenly';
   alignHorizontal?: 'flex-start' | 'flex-end' | 'center' | 'stretch';
   size?: {
     width?: number | string;
diff --git a/packages/docs/styles.css b/packages/docs/styles.css
@@ -109,6 +109,16 @@ html.dark {
   }
 }
 
+/* Footer */
+.vocs_Footer {
+  max-width: unset;
+  padding: 1.5rem;
+}
+
+.vocs_Footer:not([data-layout="docs"]) {
+  align-items: stretch;
+}
+
 /* Landing layout */
 .vocs_DocsLayout[data-layout="landing"] .vocs_DocsLayout_content {
   max-width: unset;
@@ -155,16 +165,6 @@ html.dark {
   display: none;
 }
 
-/* Footer */
-.vocs_Footer {
-  max-width: unset;
-  padding: 1.5rem;
-}
-
-.vocs_Footer:not([data-layout="docs"]) {
-  align-items: stretch;
-}
-
 /* Preview */
 .vocs_Tabs_content[id*="content-Preview"] {
   background: var(--vocs-color_background);
diff --git a/packages/react/src/editor/PropertyControlNumber/PropertyControlNumber.tsx b/packages/react/src/editor/PropertyControlNumber/PropertyControlNumber.tsx
@@ -16,12 +16,7 @@ export const PropertyControlNumber = ({ spec, ...props }: Props) => (
     spec={spec}
     defaultValue={spec.default ?? 0}
     renderInput={(value, onChange) => (
-      <Input
-        type="number"
-        size={undefined}
-        value={value}
-        onChange={(event) => onChange(Number(event.target.value))}
-      />
+      <Input type="number" size={undefined} value={value} onChange={(event) => onChange(Number(event.target.value))} />
     )}
   />
 );
diff --git a/packages/react/src/editor/PropertyControlRadio/PropertyControlRadio.stories.tsx b/packages/react/src/editor/PropertyControlRadio/PropertyControlRadio.stories.tsx
@@ -43,32 +43,17 @@ export const WithCustomRender = () => {
           render: (value, onChange) => (
             <div style={{ display: 'flex', gap: '0.5rem' }}>
               <IconButton selected={value === 'left'} onChange={() => onChange('left')}>
-                <svg
-                  xmlns="http://www.w3.org/2000/svg"
-                  width={16}
-                  height={16}
-                  viewBox="0 0 640 640"
-                >
+                <svg xmlns="http://www.w3.org/2000/svg" width={16} height={16} viewBox="0 0 640 640">
                   <path d="M384 128C384 145.7 369.7 160 352 160L128 160C110.3 160 96 145.7 96 128C96 110.3 110.3 96 128 96L352 96C369.7 96 384 110.3 384 128zM384 384C384 401.7 369.7 416 352 416L128 416C110.3 416 96 401.7 96 384C96 366.3 110.3 352 128 352L352 352C369.7 352 384 366.3 384 384zM96 256C96 238.3 110.3 224 128 224L512 224C529.7 224 544 238.3 544 256C544 273.7 529.7 288 512 288L128 288C110.3 288 96 273.7 96 256zM544 512C544 529.7 529.7 544 512 544L128 544C110.3 544 96 529.7 96 512C96 494.3 110.3 480 128 480L512 480C529.7 480 544 494.3 544 512z" />
                 </svg>
               </IconButton>
               <IconButton selected={value === 'center'} onChange={() => onChange('center')}>
-                <svg
-                  xmlns="http://www.w3.org/2000/svg"
-                  width={16}
-                  height={16}
-                  viewBox="0 0 640 640"
-                >
+                <svg xmlns="http://www.w3.org/2000/svg" width={16} height={16} viewBox="0 0 640 640">
                   <path d="M448 128C448 110.3 433.7 96 416 96L224 96C206.3 96 192 110.3 192 128C192 145.7 206.3 160 224 160L416 160C433.7 160 448 145.7 448 128zM544 256C544 238.3 529.7 224 512 224L128 224C110.3 224 96 238.3 96 256C96 273.7 110.3 288 128 288L512 288C529.7 288 544 273.7 544 256zM96 512C96 529.7 110.3 544 128 544L512 544C529.7 544 544 529.7 544 512C544 494.3 529.7 480 512 480L128 480C110.3 480 96 494.3 96 512zM448 384C448 366.3 433.7 352 416 352L224 352C206.3 352 192 366.3 192 384C192 401.7 206.3 416 224 416L416 416C433.7 416 448 401.7 448 384z" />
                 </svg>
               </IconButton>
               <IconButton selected={value === 'right'} onChange={() => onChange('right')}>
-                <svg
-                  xmlns="http://www.w3.org/2000/svg"
-                  width={16}
-                  height={16}
-                  viewBox="0 0 640 640"
-                >
+                <svg xmlns="http://www.w3.org/2000/svg" width={16} height={16} viewBox="0 0 640 640">
                   <path d="M544 128C544 145.7 529.7 160 512 160L288 160C270.3 160 256 145.7 256 128C256 110.3 270.3 96 288 96L512 96C529.7 96 544 110.3 544 128zM544 384C544 401.7 529.7 416 512 416L288 416C270.3 416 256 401.7 256 384C256 366.3 270.3 352 288 352L512 352C529.7 352 544 366.3 544 384zM96 256C96 238.3 110.3 224 128 224L512 224C529.7 224 544 238.3 544 256C544 273.7 529.7 288 512 288L128 288C110.3 288 96 273.7 96 256zM544 512C544 529.7 529.7 544 512 544L128 544C110.3 544 96 529.7 96 512C96 494.3 110.3 480 128 480L512 480C529.7 480 544 494.3 544 512z" />
                 </svg>
               </IconButton>
diff --git a/packages/react/src/editor/WindowContext/WindowContext.tsx b/packages/react/src/editor/WindowContext/WindowContext.tsx
@@ -1,12 +1,4 @@
-import {
-  createContext,
-  type FC,
-  type PropsWithChildren,
-  useCallback,
-  useContext,
-  useMemo,
-  useState,
-} from 'react';
+import { createContext, type FC, type PropsWithChildren, useCallback, useContext, useMemo, useState } from 'react';
 
 type WindowContextValues = {
   windows: Window[];
diff --git a/packages/react/src/preset/Segment/Segment.tsx b/packages/react/src/preset/Segment/Segment.tsx
@@ -15,14 +15,7 @@ type Props<Value> = {
   onChange: (value: Value) => void;
 };
 
-export const Segment = <Value,>({
-  className,
-  size,
-  options,
-  value,
-  onChange,
-  ...props
-}: Props<Value>) => (
+export const Segment = <Value,>({ className, size, options, value, onChange, ...props }: Props<Value>) => (
   <div className={variants('segment', { className })} {...props}>
     {options.map((option) => (
       <button
diff --git a/packages/react/src/preset/Text/Text.tsx b/packages/react/src/preset/Text/Text.tsx
diff --git a/packages/react/src/renderer/Block/Block.ts b/packages/react/src/renderer/Block/Block.ts
diff --git a/packages/react/src/renderer/Catalog/Catalog.ts b/packages/react/src/renderer/Catalog/Catalog.ts
diff --git a/packages/react/src/renderer/NodeManager/NodeManager.spec.ts b/packages/react/src/renderer/NodeManager/NodeManager.spec.ts
diff --git a/packages/react/src/renderer/NodeManager/NodeManager.ts b/packages/react/src/renderer/NodeManager/NodeManager.ts
diff --git a/packages/react/src/renderer/Parser/Parser.spec.ts b/packages/react/src/renderer/Parser/Parser.spec.ts
diff --git a/packages/react/src/renderer/Parser/Parser.ts b/packages/react/src/renderer/Parser/Parser.ts
diff --git a/packages/react/src/renderer/Renderer/Renderer.tsx b/packages/react/src/renderer/Renderer/Renderer.tsx

Original file line number	Diff line number	Diff line change
`@@ -2,8 +2,7 @@`
`2`	`2`
`3`	`3`	`@theme {`
`4`	`4`	`--font-sans:`
`5`		`- system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Noto Sans, Ubuntu, Cantarell,`
`6`		`- Helvetica Neue;`
	`5`	`+ system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Noto Sans, Ubuntu, Cantarell, Helvetica Neue;`
`7`	`6`	`}`
`8`	`7`
`9`	`8`	`html,`