ui Architecture Docs
Home / File/ display-settings.tsx — ui Source File

display-settings.tsx — ui Source File

Architecture documentation for display-settings.tsx, a tsx file in the ui codebase. 6 imports, 0 dependents.

File tsx DocumentationAtlas Changelog 6 imports 1 functions

Entity Profile

Dependency Diagram

graph LR
  2c0a3033_6a88_3002_3f51_5473fa7f97b8["display-settings.tsx"]
  d39cd1e4_1b2d_9aa2_1d29_fd0b4bfb61c3["lucide-react"]
  2c0a3033_6a88_3002_3f51_5473fa7f97b8 --> d39cd1e4_1b2d_9aa2_1d29_fd0b4bfb61c3
  4f6bcac7_12b3_b724_9762_64ace071aa20["checkbox"]
  2c0a3033_6a88_3002_3f51_5473fa7f97b8 --> 4f6bcac7_12b3_b724_9762_64ace071aa20
  169af77a_46c3_8fec_4801_f34a0f1a3471["field"]
  2c0a3033_6a88_3002_3f51_5473fa7f97b8 --> 169af77a_46c3_8fec_4801_f34a0f1a3471
  c2fa7225_1ddd_1cbc_8810_ee5e42af14d6["select"]
  2c0a3033_6a88_3002_3f51_5473fa7f97b8 --> c2fa7225_1ddd_1cbc_8810_ee5e42af14d6
  a726b95d_789e_b9ec_d440_20ff0f30482e["slider"]
  2c0a3033_6a88_3002_3f51_5473fa7f97b8 --> a726b95d_789e_b9ec_d440_20ff0f30482e
  38ebb3c2_9638_6c9d_8ced_a16ec1ff06c9["switch"]
  2c0a3033_6a88_3002_3f51_5473fa7f97b8 --> 38ebb3c2_9638_6c9d_8ced_a16ec1ff06c9
  style 2c0a3033_6a88_3002_3f51_5473fa7f97b8 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import { SunDimIcon, SunIcon } from "lucide-react"

import { Checkbox } from "@/registry/new-york-v4/ui/checkbox"
import {
  Field,
  FieldContent,
  FieldDescription,
  FieldGroup,
  FieldLabel,
  FieldLegend,
  FieldSeparator,
  FieldSet,
  FieldTitle,
} from "@/registry/new-york-v4/ui/field"
import {
  Select,
  SelectContent,
  SelectItem,
  SelectTrigger,
  SelectValue,
} from "@/registry/new-york-v4/ui/select"
import { Slider } from "@/registry/new-york-v4/ui/slider"
import { Switch } from "@/registry/new-york-v4/ui/switch"

export function DisplaySettings() {
  return (
    <FieldSet>
      <FieldLegend>Display</FieldLegend>
      <FieldDescription>
        Configure display settings, brightness, refresh rate, and more.
      </FieldDescription>
      <FieldGroup>
        <Field orientation="responsive">
          <FieldContent>
            <FieldLabel htmlFor="resolution">Resolution</FieldLabel>
            <FieldDescription>Select the display resolution.</FieldDescription>
          </FieldContent>
          <Select>
            <SelectTrigger id="resolution" className="ml-auto">
              <SelectValue placeholder="Select" />
            </SelectTrigger>
            <SelectContent align="end">
              <SelectItem value="1920x1080">1920 x 1080</SelectItem>
              <SelectItem value="2560x1440">2560 x 1440</SelectItem>
              <SelectItem value="3840x2160">3840 x 2160</SelectItem>
              <SelectItem value="auto">Auto</SelectItem>
            </SelectContent>
          </Select>
        </Field>
        <FieldSeparator />
        <Field orientation="responsive">
          <FieldContent>
            <FieldTitle>Brightness</FieldTitle>
            <FieldDescription>
              Adjust the display brightness level.
            </FieldDescription>
          </FieldContent>
          <div className="flex min-w-[150px] items-center gap-2">
            <SunDimIcon className="size-4 shrink-0" />
            <Slider
// ... (78 more lines)

Domain

Subdomains

Functions

Dependencies

  • checkbox
  • field
  • lucide-react
  • select
  • slider
  • switch

Source

Frequently Asked Questions

What does display-settings.tsx do?
display-settings.tsx is a source file in the ui codebase, written in tsx. It belongs to the DocumentationAtlas domain, Changelog subdomain.
What functions are defined in display-settings.tsx?
display-settings.tsx defines 1 function(s): DisplaySettings.
What does display-settings.tsx depend on?
display-settings.tsx imports 6 module(s): checkbox, field, lucide-react, select, slider, switch.
Where is display-settings.tsx in the architecture?
display-settings.tsx is located at apps/v4/app/(internal)/sink/(pages)/forms/display-settings.tsx (domain: DocumentationAtlas, subdomain: Changelog, directory: apps/v4/app/(internal)/sink/(pages)/forms).

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free