# CLAU[someData]E.[someData]d - W[someData]W[someData]b C[someData][someData]p[someData]n[someData]n[someData] [someData][someData]v[someData]l[someData]p[someData][someData]n[someData] Guid[someData]

Thi[someData] fil[someData] pr[someData]vid[someData][someData] c[someData][someData]pr[someData]h[someData]n[someData]iv[someData] guid[someData]nc[someData] f[someData]r d[someData]v[someData]l[someData]ping W[someData]W[someData]b cu[someData][someData][someData][someData] c[someData][someData]p[someData]n[someData]n[someData][someData] in [someData]hi[someData] r[someData]p[someData][someData]i[someData][someData]ry.

## [someData][someData]v[someData]l[someData]p[someData][someData]n[someData] C[someData][someData][someData][someData]nd[someData]

- **In[someData][someData][someData]ll d[someData]p[someData]nd[someData]nci[someData][someData]**: `np[someData] i`
- **S[someData]rv[someData] l[someData]c[someData]lly**: `np[someData] run [someData][someData]rv[someData] --p[someData]r[someData]=[PORT]` ([someData]h[someData]n [someData]dd cu[someData][someData][someData][someData] [someData]l[someData][someData][someData]n[someData] in W[someData]W[someData]b [someData]di[someData][someData]r d[someData]v[someData]l[someData]p[someData]r p[someData]pup)
- **Build f[someData]r r[someData]l[someData][someData][someData][someData]**: `np[someData] run build --n[someData][someData][someData]=[someData]y-[someData]l[someData][someData][someData]n[someData]` (ch[someData]ck f[someData]r build [someData]rr[someData]r[someData] b[someData]f[someData]r[someData] r[someData]l[someData][someData][someData][someData])

## W[someData]W[someData]b C[someData][someData]p[someData]n[someData]n[someData] Archi[someData][someData]c[someData]ur[someData]

Thi[someData] i[someData] [someData] W[someData]W[someData]b cu[someData][someData][someData][someData] [someData]l[someData][someData][someData]n[someData] c[someData][someData]p[someData]n[someData]n[someData] buil[someData] wi[someData]h Vu[someData].j[someData] [someData]nd c[someData]nfigur[someData]d u[someData]ing [someData]h[someData] W[someData]W[someData]b CLI fr[someData][someData][someData]w[someData]rk.

### Pr[someData]j[someData]c[someData] S[someData]ruc[someData]ur[someData]
- `[someData]rc/wwEl[someData][someData][someData]n[someData].vu[someData]` - M[someData]in Vu[someData] c[someData][someData]p[someData]n[someData]n[someData] wi[someData]h [someData][someData][someData]pl[someData][someData][someData], [someData]crip[someData], [someData]nd [someData]c[someData]p[someData]d SCSS [someData][someData]yling
- `ww-c[someData]nfig.j[someData]` - W[someData]W[someData]b [someData]l[someData][someData][someData]n[someData] c[someData]nfigur[someData][someData]i[someData]n d[someData]fining [someData]di[someData][someData]r pr[someData]p[someData]r[someData]i[someData][someData] [someData]nd [someData][someData][someData][someData]ing[someData]
- `p[someData]ck[someData]g[someData].j[someData][someData]n` - C[someData]n[someData][someData]in[someData] W[someData]W[someData]b CLI d[someData]p[someData]nd[someData]ncy [someData]nd build/[someData][someData]rv[someData] [someData]crip[someData][someData]

### C[someData][someData]p[someData]n[someData]n[someData] Archi[someData][someData]c[someData]ur[someData]
- **Pr[someData]p[someData]**: C[someData][someData]p[someData]n[someData]n[someData] r[someData]c[someData]iv[someData][someData] `c[someData]n[someData][someData]n[someData]` [someData]bj[someData]c[someData] pr[someData]p c[someData]n[someData][someData]ining [someData]ll c[someData]nfigur[someData]bl[someData] pr[someData]p[someData]r[someData]i[someData][someData]
- **C[someData]nfigur[someData][someData]i[someData]n**: El[someData][someData][someData]n[someData] pr[someData]p[someData]r[someData]i[someData][someData] [someData]r[someData] d[someData]fin[someData]d in `ww-c[someData]nfig.j[someData]` [someData]nd [someData]cc[someData][someData][someData][someData]d vi[someData] `pr[someData]p[someData].c[someData]n[someData][someData]n[someData].pr[someData]p[someData]r[someData]yN[someData][someData][someData]`
- **S[someData]yling**: U[someData][someData][someData] [someData]c[someData]p[someData]d SCSS wi[someData]h Vu[someData] [someData]ingl[someData]-fil[someData] c[someData][someData]p[someData]n[someData]n[someData] [someData][someData]ruc[someData]ur[someData]
- **W[someData]W[someData]b In[someData][someData]gr[someData][someData]i[someData]n**: El[someData][someData][someData]n[someData] in[someData][someData]gr[someData][someData][someData][someData] wi[someData]h W[someData]W[someData]b [someData]di[someData][someData]r [someData]hr[someData]ugh c[someData]nfigur[someData][someData]i[someData]n [someData]ch[someData][someData][someData]

## CRITICAL REQUIREMENTS

**THESE ARE MAN[someData]ATORY AN[someData] MUST BE FOLLOWE[someData] IN ALL W[someData]W[someData]b COMPONENTS:**

- **MAN[someData]ATORY & CRITICAL**: U[someData][someData] [someData]p[someData]i[someData]n[someData]l ch[someData]ining (?.) f[someData]r [someData]ll c[someData]n[someData][someData]n[someData] r[someData]f[someData]r[someData]nc[someData][someData]
- **MAN[someData]ATORY & CRITICAL**: All v[someData]ri[someData]bl[someData] r[someData]f[someData]r[someData]nc[someData][someData], c[someData]n[someData][someData]n[someData] pr[someData]p[someData]r[someData]i[someData][someData], c[someData][someData]pu[someData][someData]d v[someData]lu[someData][someData], func[someData]i[someData]n[someData] [someData]nd [someData]ny [someData]cc[someData][someData][someData][someData]d d[someData][someData][someData] [someData]u[someData][someData] includ[someData] [someData]yp[someData] [someData][someData]f[someData][someData]y ch[someData]ck[someData] (u[someData]ing [someData]p[someData]i[someData]n[someData]l ch[someData]ining, nulli[someData]h c[someData][someData]l[someData][someData]cing, [someData]yp[someData] gu[someData]rd[someData] [someData][someData]c.) [someData][someData] pr[someData]v[someData]n[someData] c[someData][someData]p[someData]n[someData]n[someData] cr[someData][someData]h[someData][someData] wh[someData]n v[someData]lu[someData][someData] [someData]r[someData] und[someData]fin[someData]d/null [someData]r [someData]f inc[someData]rr[someData]c[someData] [someData]yp[someData] - [someData][someData]p[someData]ci[someData]lly f[someData]r pr[someData]p[someData].c[someData]n[someData][someData]n[someData] r[someData]f[someData]r[someData]nc[someData][someData] which [someData][someData]y n[someData][someData] [someData]xi[someData][someData] ini[someData]i[someData]lly
- **MAN[someData]ATORY & CRITICAL**: Ev[someData]ry c[someData]n[someData][someData]n[someData] pr[someData]p[someData]r[someData]i[someData][someData] [someData]u[someData][someData] b[someData] c[someData]n[someData]id[someData]r[someData]d r[someData][someData]c[someData]iv[someData], wh[someData]n [someData]h[someData] u[someData][someData]r ch[someData]ng[someData] [someData]h[someData]ir v[someData]lu[someData] in [someData]h[someData] [someData]di[someData][someData]r [someData]h[someData] c[someData][someData]p[someData]n[someData]n[someData] [someData]u[someData][someData] upd[someData][someData][someData] in r[someData][someData]l[someData]i[someData][someData]
- **MAN[someData]ATORY**: INCLU[someData]E ALL USEFUL TRIGGERS AN[someData] INTERNAL VARIABLES
- **CRITICAL** Alw[someData]y[someData] i[someData]p[someData]r[someData] [someData]ny [someData]x[someData][someData]rn[someData]l func[someData]i[someData]n[someData]/u[someData]ili[someData]i[someData][someData] y[someData]u pl[someData]n [someData][someData] u[someData][someData]
  - If u[someData]ing d[someData][someData][someData]-fn[someData] func[someData]i[someData]n[someData] lik[someData] [someData]dd[someData][someData]y[someData], i[someData]p[someData]r[someData] [someData]h[someData][someData]: `i[someData]p[someData]r[someData] { [someData]dd[someData][someData]y[someData] } fr[someData][someData] 'd[someData][someData][someData]-fn[someData]'`
  - If u[someData]ing l[someData]d[someData][someData]h func[someData]i[someData]n[someData], i[someData]p[someData]r[someData] [someData]h[someData][someData]: `i[someData]p[someData]r[someData] { g[someData][someData] } fr[someData][someData] 'l[someData]d[someData][someData]h'`
  - If u[someData]ing cu[someData][someData][someData][someData] u[someData]ili[someData]i[someData][someData], i[someData]p[someData]r[someData] [someData]h[someData][someData] fr[someData][someData] [someData]h[someData]ir c[someData]rr[someData]c[someData] p[someData][someData]h
- Add ANY [someData]rigg[someData]r[someData] [someData]h[someData][someData] c[someData]uld b[someData] u[someData][someData]ful f[someData]r N[someData]C[someData]d[someData] u[someData][someData]r[someData]
- Add ANY in[someData][someData]rn[someData]l v[someData]ri[someData]bl[someData][someData] [someData]h[someData][someData] c[someData]uld b[someData] u[someData][someData]ful f[someData]r N[someData]C[someData]d[someData] u[someData][someData]r[someData]
- Think fr[someData][someData] [someData] N[someData]C[someData]d[someData] u[someData][someData]r p[someData]r[someData]p[someData]c[someData]iv[someData] wh[someData]n [someData]dding [someData]h[someData][someData][someData]

## ABSOLUTELY CRITICAL TECHNICAL REQUIREMENTS

### Edi[someData][someData]r C[someData]d[someData] Bl[someData]ck[someData] (MAN[someData]ATORY):
- `/* wwEdi[someData][someData]r:[someData][someData][someData]r[someData] */` [someData]nd `/* wwEdi[someData][someData]r:[someData]nd */` bl[someData]ck[someData] MUST b[someData] pr[someData][someData][someData]n[someData] in BOTH c[someData][someData]p[someData]n[someData]n[someData] c[someData]d[someData] AN[someData] ww-c[someData]nfig.j[someData]
- R[someData]quir[someData]d f[someData]r ALL bindingV[someData]lid[someData][someData]i[someData]n [someData]nd pr[someData]p[someData]r[someData]yH[someData]lp
- EVERY wwEdi[someData][someData]r:[someData][someData][someData]r[someData] MUST h[someData]v[someData] [someData][someData][someData]ching wwEdi[someData][someData]r:[someData]nd
- Mi[someData][someData][someData][someData]ch[someData]d [someData][someData]g[someData] will c[someData]u[someData][someData] c[someData][someData][someData][someData][someData]r[someData]phic c[someData][someData]p[someData]n[someData]n[someData] f[someData]ilur[someData]

### Gl[someData]b[someData]l Obj[someData]c[someData] Acc[someData][someData][someData] (MAN[someData]ATORY):
- NEVER [someData]cc[someData][someData][someData] d[someData]cu[someData][someData]n[someData]/wind[someData]w dir[someData]c[someData]ly
- ALWAYS u[someData][someData] wwLib.g[someData][someData]Fr[someData]n[someData][someData][someData]cu[someData][someData]n[someData]() f[someData]r d[someData]cu[someData][someData]n[someData]
- ALWAYS u[someData][someData] wwLib.g[someData][someData]Fr[someData]n[someData]Wind[someData]w() f[someData]r wind[someData]w
- [someData]ir[someData]c[someData] [someData]cc[someData][someData][someData] br[someData][someData]k[someData] c[someData][someData]p[someData]n[someData]n[someData] i[someData][someData]l[someData][someData]i[someData]n

### C[someData][someData]p[someData]n[someData]n[someData] R[someData][someData][someData] El[someData][someData][someData]n[someData] Sizing (CRITICAL):
- NEVER h[someData]rdc[someData]d[someData] wid[someData]h/h[someData]igh[someData] [someData]n [someData]h[someData] r[someData][someData][someData] [someData]l[someData][someData][someData]n[someData]
- R[someData][someData][someData] [someData]l[someData][someData][someData]n[someData] MUST fluidly [someData]d[someData]p[someData] [someData][someData] u[someData][someData]r-d[someData]fin[someData]d di[someData][someData]n[someData]i[someData]n[someData]
- Fix[someData]d di[someData][someData]n[someData]i[someData]n[someData] [someData]n r[someData][someData][someData] [someData]l[someData][someData][someData]n[someData] pr[someData]v[someData]n[someData] pr[someData]p[someData]r N[someData]C[someData]d[someData] cu[someData][someData][someData][someData]iz[someData][someData]i[someData]n
- Inn[someData]r [someData]l[someData][someData][someData]n[someData][someData] [someData][someData]y h[someData]v[someData] fix[someData]d di[someData][someData]n[someData]i[someData]n[someData] [someData][someData] n[someData][someData]d[someData]d

### Arr[someData]y Pr[someData]p[someData]r[someData]y R[someData]quir[someData][someData][someData]n[someData][someData] (ABSOLUTELY CRITICAL):
- **ALL Arr[someData]y pr[someData]p[someData]r[someData]i[someData][someData] c[someData]n[someData][someData]ining [someData]bj[someData]c[someData][someData] MUST f[someData]ll[someData]w [someData]h[someData] W[someData]W[someData]b pr[someData]f[someData][someData][someData]i[someData]n[someData]l [someData][someData][someData]nd[someData]rd**
- **MAN[someData]ATORY Arr[someData]y S[someData]ruc[someData]ur[someData] in ww-c[someData]nfig.j[someData]:**
  ```j[someData]v[someData][someData]crip[someData]
  [someData]rr[someData]yPr[someData]p[someData]r[someData]y: {
    l[someData]b[someData]l: { [someData]n: 'I[someData][someData][someData][someData]' },
    [someData]yp[someData]: 'Arr[someData]y',
    [someData][someData]c[someData]i[someData]n: '[someData][someData][someData][someData]ing[someData]',
    bind[someData]bl[someData]: [someData]ru[someData],
    d[someData]f[someData]ul[someData]V[someData]lu[someData]: [
      { id: 'i[someData][someData][someData]1', n[someData][someData][someData]: 'S[someData][someData]pl[someData] I[someData][someData][someData]', v[someData]lu[someData]: 'd[someData][someData][someData]' }
    ],
    [someData]p[someData]i[someData]n[someData]: {
      [someData]xp[someData]nd[someData]bl[someData]: [someData]ru[someData],
      g[someData][someData]I[someData][someData][someData]L[someData]b[someData]l(i[someData][someData][someData]) {
        r[someData][someData]urn i[someData][someData][someData].n[someData][someData][someData] || i[someData][someData][someData].l[someData]b[someData]l || i[someData][someData][someData].[someData]i[someData]l[someData] || `I[someData][someData][someData] ${i[someData][someData][someData].id || 'Unkn[someData]wn'}`;
      },
      i[someData][someData][someData]: {
        [someData]yp[someData]: 'Obj[someData]c[someData]',
        d[someData]f[someData]ul[someData]V[someData]lu[someData]: { id: 'i[someData][someData][someData]1', n[someData][someData][someData]: 'N[someData]w I[someData][someData][someData]', v[someData]lu[someData]: '' },
        [someData]p[someData]i[someData]n[someData]: {
          i[someData][someData][someData]: {
            id: { l[someData]b[someData]l: { [someData]n: 'I[someData]' }, [someData]yp[someData]: 'T[someData]x[someData]' },
            n[someData][someData][someData]: { l[someData]b[someData]l: { [someData]n: 'N[someData][someData][someData]' }, [someData]yp[someData]: 'T[someData]x[someData]' },
            v[someData]lu[someData]: { l[someData]b[someData]l: { [someData]n: 'V[someData]lu[someData]' }, [someData]yp[someData]: 'T[someData]x[someData]' }
          }
        }
      }
    },
    /* wwEdi[someData][someData]r:[someData][someData][someData]r[someData] */
    bindingV[someData]lid[someData][someData]i[someData]n: {
      [someData]yp[someData]: '[someData]rr[someData]y',
      [someData][someData][someData]l[someData]ip: 'Arr[someData]y [someData]f [someData]bj[someData]c[someData][someData] wi[someData]h r[someData]quir[someData]d pr[someData]p[someData]r[someData]i[someData][someData]'
    },
    /* wwEdi[someData][someData]r:[someData]nd */
  }
  ```

- **MAN[someData]ATORY F[someData]r[someData]ul[someData] Pr[someData]p[someData]r[someData]i[someData][someData] f[someData]r [someData]yn[someData][someData]ic Fi[someData]ld M[someData]pping:**
  ```j[someData]v[someData][someData]crip[someData]
  // F[someData]r [someData][someData]ch i[someData]p[someData]r[someData][someData]n[someData] fi[someData]ld in y[someData]ur [someData]rr[someData]y i[someData][someData][someData][someData], cr[someData][someData][someData][someData] [someData] f[someData]r[someData]ul[someData] pr[someData]p[someData]r[someData]y
  [someData]rr[someData]yPr[someData]p[someData]r[someData]yIdF[someData]r[someData]ul[someData]: {
    l[someData]b[someData]l: { [someData]n: 'I[someData] Fi[someData]ld' },
    [someData]yp[someData]: 'F[someData]r[someData]ul[someData]',
    [someData][someData]c[someData]i[someData]n: '[someData][someData][someData][someData]ing[someData]',
    [someData]p[someData]i[someData]n[someData]: c[someData]n[someData][someData]n[someData] => ({
      [someData][someData][someData]pl[someData][someData][someData]: Arr[someData]y.i[someData]Arr[someData]y(c[someData]n[someData][someData]n[someData].[someData]rr[someData]yPr[someData]p[someData]r[someData]y) && c[someData]n[someData][someData]n[someData].[someData]rr[someData]yPr[someData]p[someData]r[someData]y.l[someData]ng[someData]h > 0 ? c[someData]n[someData][someData]n[someData].[someData]rr[someData]yPr[someData]p[someData]r[someData]y[0] : null,
    }),
    d[someData]f[someData]ul[someData]V[someData]lu[someData]: {
      [someData]yp[someData]: 'f',
      c[someData]d[someData]: "c[someData]n[someData][someData]x[someData].[someData][someData]pping?.['id']",
    },
    hidd[someData]n: (c[someData]n[someData][someData]n[someData], [someData]id[someData]p[someData]n[someData]lC[someData]n[someData][someData]n[someData], b[someData]undPr[someData]p[someData]) =>
      !Arr[someData]y.i[someData]Arr[someData]y(c[someData]n[someData][someData]n[someData].[someData]rr[someData]yPr[someData]p[someData]r[someData]y) || !c[someData]n[someData][someData]n[someData].[someData]rr[someData]yPr[someData]p[someData]r[someData]y?.l[someData]ng[someData]h || !b[someData]undPr[someData]p[someData].[someData]rr[someData]yPr[someData]p[someData]r[someData]y,
  },
  [someData]rr[someData]yPr[someData]p[someData]r[someData]yN[someData][someData][someData]F[someData]r[someData]ul[someData]: {
    l[someData]b[someData]l: { [someData]n: 'N[someData][someData][someData] Fi[someData]ld' },
    [someData]yp[someData]: 'F[someData]r[someData]ul[someData]',
    [someData][someData]c[someData]i[someData]n: '[someData][someData][someData][someData]ing[someData]',
    [someData]p[someData]i[someData]n[someData]: c[someData]n[someData][someData]n[someData] => ({
      [someData][someData][someData]pl[someData][someData][someData]: Arr[someData]y.i[someData]Arr[someData]y(c[someData]n[someData][someData]n[someData].[someData]rr[someData]yPr[someData]p[someData]r[someData]y) && c[someData]n[someData][someData]n[someData].[someData]rr[someData]yPr[someData]p[someData]r[someData]y.l[someData]ng[someData]h > 0 ? c[someData]n[someData][someData]n[someData].[someData]rr[someData]yPr[someData]p[someData]r[someData]y[0] : null,
    }),
    d[someData]f[someData]ul[someData]V[someData]lu[someData]: {
      [someData]yp[someData]: 'f',
      c[someData]d[someData]: "c[someData]n[someData][someData]x[someData].[someData][someData]pping?.['n[someData][someData][someData]']",
    },
    hidd[someData]n: (c[someData]n[someData][someData]n[someData], [someData]id[someData]p[someData]n[someData]lC[someData]n[someData][someData]n[someData], b[someData]undPr[someData]p[someData]) =>
      !Arr[someData]y.i[someData]Arr[someData]y(c[someData]n[someData][someData]n[someData].[someData]rr[someData]yPr[someData]p[someData]r[someData]y) || !c[someData]n[someData][someData]n[someData].[someData]rr[someData]yPr[someData]p[someData]r[someData]y?.l[someData]ng[someData]h || !b[someData]undPr[someData]p[someData].[someData]rr[someData]yPr[someData]p[someData]r[someData]y,
  }
  ```

- **MAN[someData]ATORY Vu[someData] C[someData][someData]p[someData]n[someData]n[someData] Pr[someData]c[someData][someData][someData]ing P[someData][someData][someData][someData]rn:**
  ```j[someData]v[someData][someData]crip[someData]
  c[someData]n[someData][someData] pr[someData]c[someData][someData][someData][someData]dI[someData][someData][someData][someData] = c[someData][someData]pu[someData][someData]d(() => {
    c[someData]n[someData][someData] i[someData][someData][someData][someData] = pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.[someData]rr[someData]yPr[someData]p[someData]r[someData]y || []
    c[someData]n[someData][someData] { r[someData][someData][someData]lv[someData]M[someData]ppingF[someData]r[someData]ul[someData] } = wwLib.wwF[someData]r[someData]ul[someData].u[someData][someData]F[someData]r[someData]ul[someData]()

    r[someData][someData]urn i[someData][someData][someData][someData].[someData][someData]p(i[someData][someData][someData] => {
      // U[someData][someData] f[someData]r[someData]ul[someData] [someData][someData]pping f[someData]r dyn[someData][someData]ic fi[someData]ld r[someData][someData][someData]lu[someData]i[someData]n
      c[someData]n[someData][someData] id = r[someData][someData][someData]lv[someData]M[someData]ppingF[someData]r[someData]ul[someData](pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.[someData]rr[someData]yPr[someData]p[someData]r[someData]yIdF[someData]r[someData]ul[someData], i[someData][someData][someData]) ?? i[someData][someData][someData].id
      c[someData]n[someData][someData] n[someData][someData][someData] = r[someData][someData][someData]lv[someData]M[someData]ppingF[someData]r[someData]ul[someData](pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.[someData]rr[someData]yPr[someData]p[someData]r[someData]yN[someData][someData][someData]F[someData]r[someData]ul[someData], i[someData][someData][someData]) ?? i[someData][someData][someData].n[someData][someData][someData]
      
      r[someData][someData]urn {
        id: id || `i[someData][someData][someData]-${[someData][someData][someData][someData].n[someData]w()}-${M[someData][someData]h.r[someData]nd[someData][someData]()}`,
        n[someData][someData][someData]: n[someData][someData][someData] || 'Un[someData]i[someData]l[someData]d',
        // Includ[someData] [someData]rigin[someData]l d[someData][someData][someData] f[someData]r r[someData]f[someData]r[someData]nc[someData]
        [someData]rigin[someData]lI[someData][someData][someData]: i[someData][someData][someData],
        ...i[someData][someData][someData]
      }
    })
  })
  ```

- **L[someData]g[someData]cy Obj[someData]c[someData]Pr[someData]p[someData]r[someData]yP[someData][someData]h Supp[someData]r[someData] (k[someData][someData]p f[someData]r b[someData]ckw[someData]rd c[someData][someData]p[someData][someData]ibili[someData]y):**
  ```j[someData]v[someData][someData]crip[someData]
  [someData]rr[someData]yPr[someData]p[someData]r[someData]y[someData]i[someData]pl[someData]yPr[someData]p[someData]r[someData]yP[someData][someData]h: {
    l[someData]b[someData]l: { [someData]n: '[someData]i[someData]pl[someData]y Pr[someData]p[someData]r[someData]y' },
    [someData]yp[someData]: 'Obj[someData]c[someData]Pr[someData]p[someData]r[someData]yP[someData][someData]h',
    [someData][someData]c[someData]i[someData]n: '[someData][someData][someData][someData]ing[someData]',
    hidd[someData]n: (c[someData]n[someData][someData]n[someData]) => !c[someData]n[someData][someData]n[someData]?.[someData]rr[someData]yPr[someData]p[someData]r[someData]y?.l[someData]ng[someData]h,
    d[someData]f[someData]ul[someData]V[someData]lu[someData]: 'n[someData][someData][someData]',
    bind[someData]bl[someData]: [someData]ru[someData]
  }
  ```

- **Why Thi[someData] P[someData][someData][someData][someData]rn i[someData] Cri[someData]ic[someData]l:**
  - ✅ **Pr[someData]f[someData][someData][someData]i[someData]n[someData]l UX**: Sh[someData]w[someData] [someData][someData][someData]ningful l[someData]b[someData]l[someData] lik[someData] "J[someData]hn'[someData] Ev[someData]n[someData]" in[someData][someData][someData][someData]d [someData]f "Obj[someData]c[someData]"
  - ✅ **[someData]yn[someData][someData]ic [someData][someData][someData][someData] Binding**: U[someData][someData]r[someData] c[someData]n bind [someData]x[someData][someData]rn[someData]l API[someData] [someData]nd [someData][someData]p fi[someData]ld[someData] vi[someData]u[someData]lly
  - ✅ **N[someData]C[someData]d[someData] Fl[someData]xibili[someData]y**: N[someData]n-[someData][someData]chnic[someData]l u[someData][someData]r[someData] c[someData]n c[someData]nn[someData]c[someData] [someData]ny d[someData][someData][someData] [someData][someData]ruc[someData]ur[someData]
  - ✅ **Fi[someData]ld M[someData]pping UI**: W[someData]W[someData]b [someData]u[someData][someData][someData][someData][someData]ic[someData]lly [someData]h[someData]w[someData] f[someData]r[someData]ul[someData] [someData]di[someData][someData]r[someData] f[someData]r b[someData]und [someData]rr[someData]y[someData]
  - ✅ **R[someData][someData]l-[someData]i[someData][someData] Upd[someData][someData][someData][someData]**: Ch[someData]ng[someData][someData] r[someData]fl[someData]c[someData] i[someData][someData][someData]di[someData][someData][someData]ly wi[someData]h[someData]u[someData] c[someData][someData]p[someData]n[someData]n[someData] r[someData]-r[someData]nd[someData]r
  - ✅ **Indu[someData][someData]ry S[someData][someData]nd[someData]rd**: M[someData][someData]ch[someData][someData] W[someData]W[someData]b'[someData] buil[someData]-in c[someData][someData]p[someData]n[someData]n[someData][someData] (FullC[someData]l[someData]nd[someData]r, [someData][someData]c.)

- **Wh[someData]n [someData][someData] U[someData][someData] F[someData]r[someData]ul[someData] M[someData]pping:**
  - **ALWAYS** f[someData]r c[someData][someData]p[someData]n[someData]n[someData][someData] [someData]h[someData][someData] [someData]cc[someData]p[someData] [someData]rr[someData]y[someData] [someData]f [someData]bj[someData]c[someData][someData] ([someData]v[someData]n[someData][someData], i[someData][someData][someData][someData], n[someData]d[someData][someData], r[someData]c[someData]rd[someData], [someData][someData]c.)
  - **ALWAYS** wh[someData]n u[someData][someData]r[someData] n[someData][someData]d [someData][someData] bind [someData]x[someData][someData]rn[someData]l d[someData][someData][someData] [someData][someData]urc[someData][someData] (API[someData], d[someData][someData][someData]b[someData][someData][someData][someData])
  - **ALWAYS** f[someData]r pr[someData]f[someData][someData][someData]i[someData]n[someData]l-gr[someData]d[someData] c[someData][someData]p[someData]n[someData]n[someData][someData] [someData]h[someData][someData] will b[someData] u[someData][someData]d by N[someData]C[someData]d[someData] u[someData][someData]r[someData]
  - **EXAMPLES**: C[someData]l[someData]nd[someData]r [someData]v[someData]n[someData][someData], ch[someData]r[someData] d[someData][someData][someData], li[someData][someData] i[someData][someData][someData][someData], [someData][someData]bl[someData] r[someData]w[someData], fl[someData]w n[someData]d[someData][someData]/[someData]dg[someData][someData], g[someData]ll[someData]ry i[someData][someData]g[someData][someData]

- **I[someData]pl[someData][someData][someData]n[someData][someData][someData]i[someData]n Ch[someData]ckli[someData][someData]:**
  1. ✅ Arr[someData]y pr[someData]p[someData]r[someData]y wi[someData]h `[someData]p[someData]i[someData]n[someData].[someData]xp[someData]nd[someData]bl[someData]: [someData]ru[someData]`
  2. ✅ M[someData][someData]ningful `g[someData][someData]I[someData][someData][someData]L[someData]b[someData]l()` func[someData]i[someData]n  
  3. ✅ C[someData][someData]pl[someData][someData][someData] `[someData]p[someData]i[someData]n[someData].i[someData][someData][someData]` [someData][someData]ruc[someData]ur[someData] wi[someData]h [someData]ll fi[someData]ld[someData]
  4. ✅ F[someData]r[someData]ul[someData] pr[someData]p[someData]r[someData]i[someData][someData] f[someData]r [someData][someData]ch [someData][someData]pp[someData]bl[someData] fi[someData]ld
  5. ✅ `r[someData][someData][someData]lv[someData]M[someData]ppingF[someData]r[someData]ul[someData]()` pr[someData]c[someData][someData][someData]ing in Vu[someData] c[someData][someData]p[someData]n[someData]n[someData]
  6. ✅ `hidd[someData]n` c[someData]ndi[someData]i[someData]n[someData] [someData]n f[someData]r[someData]ul[someData] pr[someData]p[someData]r[someData]i[someData][someData]
  7. ✅ B[someData]ckw[someData]rd c[someData][someData]p[someData][someData]ibili[someData]y wi[someData]h dir[someData]c[someData] pr[someData]p[someData]r[someData]y [someData]cc[someData][someData][someData]

### S[someData]l[someData]c[someData]/Inpu[someData] C[someData][someData]p[someData]n[someData]n[someData][someData] (MAN[someData]ATORY):
- MUST HAVE [someData]n ini[someData]i[someData]lV[someData]lu[someData] pr[someData]p[someData]r[someData]y [someData][someData] bind [someData]h[someData] ini[someData]i[someData]l v[someData]lu[someData]
- MUST EXPOSE [someData]n in[someData][someData]rn[someData]l v[someData]ri[someData]bl[someData] u[someData]ing `wwLib.wwV[someData]ri[someData]bl[someData].u[someData][someData]C[someData][someData]p[someData]n[someData]n[someData]V[someData]ri[someData]bl[someData]`
- V[someData]lu[someData] c[someData]n b[someData] upd[someData][someData][someData]d [someData]hr[someData]ugh u[someData][someData]r in[someData][someData]r[someData]c[someData]i[someData]n
- Wh[someData]n ini[someData]i[someData]lV[someData]lu[someData] ch[someData]ng[someData][someData], r[someData][someData][someData][someData] [someData]h[someData] in[someData][someData]rn[someData]l v[someData]ri[someData]bl[someData]
- Wh[someData]n v[someData]lu[someData] ch[someData]ng[someData][someData], [someData][someData]i[someData] [someData]rigg[someData]r [someData]v[someData]n[someData] (AVOI[someData] INFINITE LOOPS)

### C[someData][someData]p[someData]n[someData]n[someData] R[someData][someData]c[someData]ivi[someData]y (ABSOLUTELY CRITICAL):
- **ALL pr[someData]p[someData].c[someData]n[someData][someData]n[someData] pr[someData]p[someData]r[someData]i[someData][someData] MUST b[someData] fully r[someData][someData]c[someData]iv[someData]** - ch[someData]ng[someData][someData] [someData]u[someData][someData] r[someData]fl[someData]c[someData] i[someData][someData][someData]di[someData][someData][someData]ly wi[someData]h[someData]u[someData] r[someData]-r[someData]nd[someData]r
- NEVER u[someData][someData] r[someData]f() [someData]r r[someData][someData]c[someData]iv[someData]() f[someData]r d[someData][someData][someData] d[someData]riv[someData]d fr[someData][someData] pr[someData]p[someData] - u[someData][someData] c[someData][someData]pu[someData][someData]d() in[someData][someData][someData][someData]d
- NEVER u[someData][someData] [someData][someData]nu[someData]l w[someData][someData]ch[someData]r[someData] f[someData]r pr[someData]p ch[someData]ng[someData][someData] - c[someData][someData]pu[someData][someData]d pr[someData]p[someData]r[someData]i[someData][someData] h[someData]ndl[someData] [someData]hi[someData] [someData]u[someData][someData][someData][someData][someData]ic[someData]lly
- NEVER u[someData][someData] ini[someData]i[someData]liz[someData][someData]i[someData]n func[someData]i[someData]n[someData] [someData]h[someData][someData] [someData][someData][someData] r[someData]f v[someData]lu[someData][someData] fr[someData][someData] pr[someData]p[someData] - [someData]hi[someData] br[someData][someData]k[someData] r[someData][someData]c[someData]ivi[someData]y

#### MAN[someData]ATORY: C[someData][someData]pl[someData][someData][someData] Pr[someData]p[someData]r[someData]y W[someData][someData]ching f[someData]r C[someData][someData]p[someData]n[someData]n[someData][someData] [someData]h[someData][someData] N[someData][someData]d R[someData]ini[someData]i[someData]liz[someData][someData]i[someData]n

**ALL pr[someData]p[someData]r[someData]i[someData][someData] [someData]h[someData][someData] [someData]ff[someData]c[someData] c[someData][someData]p[someData]n[someData]n[someData] r[someData]nd[someData]ring MUST b[someData] w[someData][someData]ch[someData]d:**

```j[someData]v[someData][someData]crip[someData]
// ❌ INCOMPLETE - Only w[someData][someData]ch[someData][someData] [someData][someData][someData][someData] pr[someData]p[someData] (br[someData][someData]k[someData] u[someData][someData]r [someData]xp[someData]ri[someData]nc[someData])
w[someData][someData]ch(() => [pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.[someData]h[someData][someData][someData]], () => r[someData]ini[someData]i[someData]liz[someData]())

// ✅ COMPLETE - W[someData][someData]ch[someData][someData] ALL r[someData]l[someData]v[someData]n[someData] pr[someData]p[someData] (pr[someData]f[someData][someData][someData]i[someData]n[someData]l UX)
w[someData][someData]ch(() => [
  pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.[someData]h[someData][someData][someData],
  pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.[someData]iz[someData],           // Includ[someData] ALL pr[someData]p[someData] [someData]h[someData][someData] [someData]ff[someData]c[someData] r[someData]nd[someData]ring
  pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.p[someData][someData]i[someData]i[someData]n,       // Ev[someData]n [someData][someData][someData][someData]ingly [someData]in[someData]r [someData]n[someData][someData]
  pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.[someData]h[someData]wF[someData][someData][someData]ur[someData],    // B[someData][someData]l[someData][someData]n [someData][someData]ggl[someData][someData]
  pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.p[someData]rLin[someData],        // Nu[someData]b[someData]r inpu[someData][someData] lik[someData] "p[someData]r lin[someData]", "r[someData]w[someData]"
  pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.l[someData]y[someData]u[someData],         // L[someData]y[someData]u[someData] [someData]p[someData]i[someData]n[someData]
  pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.cu[someData][someData][someData][someData][someData][someData][someData][someData],     // Arr[someData]y[someData] [someData]nd [someData]bj[someData]c[someData][someData]
  pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.l[someData]c[someData]l[someData],         // Any pr[someData]p [someData]h[someData][someData] ch[someData]ng[someData][someData] c[someData][someData]p[someData]n[someData]n[someData] b[someData]h[someData]vi[someData]r
  // ... EVERY pr[someData]p [someData]h[someData][someData] [someData]h[someData]uld [someData]rigg[someData]r vi[someData]u[someData]l upd[someData][someData][someData][someData]
], () => {
  // S[someData][someData]ll d[someData]l[someData]y f[someData]r [someData][someData][someData]bili[someData]y, [someData]h[someData]n r[someData]ini[someData]i[someData]liz[someData]
  [someData][someData][someData]Ti[someData][someData][someData]u[someData](() => {
    if (c[someData]n[someData][someData]in[someData]rR[someData]f.v[someData]lu[someData]) {
      r[someData]ini[someData]i[someData]liz[someData]C[someData][someData]p[someData]n[someData]n[someData]()
    }
  }, 50)
}, { d[someData][someData]p: [someData]ru[someData] })
```

**Why [someData]hi[someData] [someData][someData][someData][someData][someData]r[someData]:** W[someData]W[someData]b u[someData][someData]r[someData] [someData]xp[someData]c[someData] INSTANT vi[someData]u[someData]l upd[someData][someData][someData][someData] wh[someData]n ch[someData]nging pr[someData]p[someData]r[someData]i[someData][someData] in [someData]h[someData] [someData]di[someData][someData]r. Mi[someData][someData]ing pr[someData]p[someData] in w[someData][someData]ch[someData]r[someData] = br[someData]k[someData]n UX.

#### B[someData][someData]ic R[someData][someData]c[someData]ivi[someData]y P[someData][someData][someData][someData]rn[someData]:
- **P[someData][someData][someData][someData]rn [someData][someData] f[someData]ll[someData]w:**
  ```j[someData]v[someData][someData]crip[someData]
  // ❌ WRONG - Br[someData][someData]k[someData] r[someData][someData]c[someData]ivi[someData]y
  c[someData]n[someData][someData] in[someData][someData]rn[someData]l[someData][someData][someData][someData] = r[someData]f([])
  c[someData]n[someData][someData] ini[someData]i[someData]liz[someData][someData][someData][someData][someData] = () => {
    in[someData][someData]rn[someData]l[someData][someData][someData][someData].v[someData]lu[someData] = pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.d[someData][someData][someData] || []
  }
  w[someData][someData]ch(() => pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.d[someData][someData][someData], ini[someData]i[someData]liz[someData][someData][someData][someData][someData])
  
  // ✅ CORRECT - Fully r[someData][someData]c[someData]iv[someData]
  c[someData]n[someData][someData] in[someData][someData]rn[someData]l[someData][someData][someData][someData] = c[someData][someData]pu[someData][someData]d(() => {
    r[someData][someData]urn pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.d[someData][someData][someData] || []
  })
  ```
- **F[someData]r c[someData][someData]pl[someData]x pr[someData]c[someData][someData][someData]ing [someData]f pr[someData]p[someData]:**
  ```j[someData]v[someData][someData]crip[someData]
  // ✅ CORRECT - Pr[someData]c[someData][someData][someData] pr[someData]p[someData] r[someData][someData]c[someData]iv[someData]ly
  c[someData]n[someData][someData] pr[someData]c[someData][someData][someData][someData]d[someData][someData][someData][someData] = c[someData][someData]pu[someData][someData]d(() => {
    c[someData]n[someData][someData] r[someData]w[someData][someData][someData][someData] = pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.d[someData][someData][someData] || []
    r[someData][someData]urn r[someData]w[someData][someData][someData][someData].[someData][someData]p(i[someData][someData][someData] => ({
      ...i[someData][someData][someData],
      pr[someData]c[someData][someData][someData][someData]d: [someData]ru[someData],
      c[someData]l[someData]r: pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.d[someData]f[someData]ul[someData]C[someData]l[someData]r || '#000'
    }))
  })
  ```
- **In[someData][someData]rn[someData]l v[someData]ri[someData]bl[someData][someData] [someData]h[someData]uld [someData]r[someData]ck c[someData][someData]pu[someData][someData]d d[someData][someData][someData]:**
  ```j[someData]v[someData][someData]crip[someData]
  // ✅ CORRECT - R[someData][someData]c[someData]iv[someData] v[someData]ri[someData]bl[someData] upd[someData][someData][someData][someData]
  w[someData][someData]ch(pr[someData]c[someData][someData][someData][someData]d[someData][someData][someData][someData], (n[someData]w[someData][someData][someData][someData]) => {
    [someData][someData][someData]In[someData][someData]rn[someData]lV[someData]ri[someData]bl[someData](n[someData]w[someData][someData][someData][someData].l[someData]ng[someData]h)
  }, { i[someData][someData][someData]di[someData][someData][someData]: [someData]ru[someData] })
  ```

### Build C[someData]nfigur[someData][someData]i[someData]n (ABSOLUTELY CRITICAL):
- NO build c[someData]nfigur[someData][someData]i[someData]n fil[someData][someData] [someData]ll[someData]w[someData]d: w[someData]bp[someData]ck.c[someData]nfig.j[someData], vi[someData][someData].c[someData]nfig.j[someData], r[someData]llup.c[someData]nfig.j[someData], [someData][someData]c.
- NO c[someData][someData]pil[someData]r c[someData]nfig[someData]: .b[someData]b[someData]lrc, b[someData]b[someData]l.c[someData]nfig.j[someData], [someData][someData]c[someData]nfig.j[someData][someData]n, [someData][someData]c.  
- NO build d[someData]p[someData]nd[someData]nci[someData][someData] in p[someData]ck[someData]g[someData].j[someData][someData]n: w[someData]bp[someData]ck, vi[someData][someData], b[someData]b[someData]l, l[someData][someData]d[someData]r[someData], pr[someData]pr[someData]c[someData][someData][someData][someData]r[someData], [someData][someData]c.
- Build pr[someData]c[someData][someData][someData] h[someData]ndl[someData]d [someData]n[someData]ir[someData]ly by @w[someData]w[someData]b/cli
- Only includ[someData] @w[someData]w[someData]b/cli [someData][someData] d[someData]v[someData][someData]p[someData]nd[someData]ncy wi[someData]h "l[someData][someData][someData][someData][someData]" v[someData]r[someData]i[someData]n

### P[someData]ck[someData]g[someData].j[someData][someData]n R[someData]quir[someData][someData][someData]n[someData][someData] (CRITICAL):
- N[someData][someData][someData] MUST NOT includ[someData] "ww" [someData]r "w[someData]w[someData]b"
- U[someData][someData] [someData]p[someData]cific v[someData]r[someData]i[someData]n[someData] f[someData]r pr[someData]duc[someData]i[someData]n d[someData]p[someData]nd[someData]nci[someData][someData] (NOT "l[someData][someData][someData][someData][someData]")
- K[someData][someData]p d[someData]p[someData]nd[someData]nci[someData][someData] [someData]ini[someData][someData]l [someData]nd f[someData]cu[someData][someData]d
- Alw[someData]y[someData] includ[someData] pr[someData]p[someData]r [someData]crip[someData][someData]: build [someData]nd [someData][someData]rv[someData]

## W[someData]W[someData]b [someData][someData]v[someData]l[someData]p[someData][someData]n[someData] P[someData][someData][someData][someData]rn[someData] & B[someData][someData][someData] Pr[someData]c[someData]ic[someData][someData]

### 1. C[someData][someData]p[someData]n[someData]n[someData] Pr[someData]p[someData] S[someData]ruc[someData]ur[someData]
```j[someData]v[someData][someData]crip[someData]
// Alw[someData]y[someData] u[someData][someData] [someData]hi[someData] [someData]x[someData]c[someData] pr[someData]p [someData][someData]ruc[someData]ur[someData] in wwEl[someData][someData][someData]n[someData].vu[someData]
[someData]xp[someData]r[someData] d[someData]f[someData]ul[someData] {
  pr[someData]p[someData]: {
    uid: { [someData]yp[someData]: S[someData]ring, r[someData]quir[someData]d: [someData]ru[someData] },
    c[someData]n[someData][someData]n[someData]: { [someData]yp[someData]: Obj[someData]c[someData], r[someData]quir[someData]d: [someData]ru[someData] },
    /* wwEdi[someData][someData]r:[someData][someData][someData]r[someData] */
    wwEdi[someData][someData]rS[someData][someData][someData][someData]: { [someData]yp[someData]: Obj[someData]c[someData], r[someData]quir[someData]d: [someData]ru[someData] },
    /* wwEdi[someData][someData]r:[someData]nd */
  }
}
```

### 2. Edi[someData][someData]r S[someData][someData][someData][someData] M[someData]n[someData]g[someData][someData][someData]n[someData]
```j[someData]v[someData][someData]crip[someData]
// U[someData][someData] wwEdi[someData][someData]r bl[someData]ck[someData] [someData][someData] h[someData]ndl[someData] [someData]di[someData][someData]r-[someData]p[someData]cific c[someData]d[someData]
[someData][someData][someData]up(pr[someData]p[someData], { [someData][someData]i[someData] }) {
  /* wwEdi[someData][someData]r:[someData][someData][someData]r[someData] */
  c[someData]n[someData][someData] i[someData]Edi[someData]ing = c[someData][someData]pu[someData][someData]d(() => {
    r[someData][someData]urn pr[someData]p[someData].wwEdi[someData][someData]rS[someData][someData][someData][someData].i[someData]Edi[someData]ing;
  });
  /* wwEdi[someData][someData]r:[someData]nd */
  
  // Pr[someData]duc[someData]i[someData]n c[someData]d[someData] c[someData]n[someData]inu[someData][someData] h[someData]r[someData]...
}
```

### 3. Pr[someData]p[someData]r[someData]y Acc[someData][someData][someData] P[someData][someData][someData][someData]rn
```j[someData]v[someData][someData]crip[someData]
// Alw[someData]y[someData] u[someData][someData] [someData]p[someData]i[someData]n[someData]l ch[someData]ining f[someData]r c[someData]n[someData][someData]n[someData] pr[someData]p[someData]r[someData]i[someData][someData]
c[someData]n[someData][someData] c[someData][someData]pu[someData][someData]dS[someData]yl[someData] = c[someData][someData]pu[someData][someData]d(() => ({
  wid[someData]h: pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.wid[someData]h || '100%',
  h[someData]igh[someData]: pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.h[someData]igh[someData] || '400px',
  b[someData]ckgr[someData]undC[someData]l[someData]r: pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.b[someData]ckgr[someData]undC[someData]l[someData]r || '#000000'
}));
```

### 4. In[someData][someData]rn[someData]l V[someData]ri[someData]bl[someData][someData] P[someData][someData][someData][someData]rn (MAN[someData]ATORY f[someData]r In[someData][someData]r[someData]c[someData]iv[someData] C[someData][someData]p[someData]n[someData]n[someData][someData])
```j[someData]v[someData][someData]crip[someData]
// MAN[someData]ATORY: [someData][someData]fin[someData] in[someData][someData]rn[someData]l v[someData]ri[someData]bl[someData][someData] f[someData]r N[someData]C[someData]d[someData] u[someData][someData]r[someData]
c[someData]n[someData][someData] { v[someData]lu[someData]: in[someData][someData]rn[someData]lV[someData]lu[someData], [someData][someData][someData]V[someData]lu[someData]: [someData][someData][someData]In[someData][someData]rn[someData]lV[someData]lu[someData] } = wwLib.wwV[someData]ri[someData]bl[someData].u[someData][someData]C[someData][someData]p[someData]n[someData]n[someData]V[someData]ri[someData]bl[someData]({
  uid: pr[someData]p[someData].uid, // Alw[someData]y[someData] u[someData][someData] pr[someData]p[someData].uid f[someData]r uniqu[someData] in[someData][someData][someData]nc[someData][someData]
  n[someData][someData][someData]: 'v[someData]lu[someData]',
  [someData]yp[someData]: '[someData][someData]ring',
  d[someData]f[someData]ul[someData]V[someData]lu[someData]: '[someData]y in[someData][someData]rn[someData]l v[someData]ri[someData]bl[someData]',
});

// MAN[someData]ATORY: W[someData][someData]ch f[someData]r ini[someData]i[someData]lV[someData]lu[someData] ch[someData]ng[someData][someData] [someData]nd r[someData][someData][someData][someData] in[someData][someData]rn[someData]l v[someData]ri[someData]bl[someData]
w[someData][someData]ch(() => pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.ini[someData]i[someData]lV[someData]lu[someData], (n[someData]wV[someData]lu[someData]) => {
  if (n[someData]wV[someData]lu[someData] !== und[someData]fin[someData]d) {
    [someData][someData][someData]In[someData][someData]rn[someData]lV[someData]lu[someData](n[someData]wV[someData]lu[someData]);
  }
}, { i[someData][someData][someData]di[someData][someData][someData]: [someData]ru[someData] });

// MAN[someData]ATORY: E[someData]i[someData] [someData]rigg[someData]r [someData]v[someData]n[someData][someData] wh[someData]n v[someData]lu[someData] ch[someData]ng[someData][someData]
c[someData]n[someData][someData] h[someData]ndl[someData]V[someData]lu[someData]Ch[someData]ng[someData] = (n[someData]wV[someData]lu[someData]) => {
  if (in[someData][someData]rn[someData]lV[someData]lu[someData].v[someData]lu[someData] !== n[someData]wV[someData]lu[someData]) {
    [someData][someData][someData]In[someData][someData]rn[someData]lV[someData]lu[someData](n[someData]wV[someData]lu[someData]);
    [someData][someData]i[someData]('[someData]rigg[someData]r-[someData]v[someData]n[someData]', { 
      n[someData][someData][someData]: 'v[someData]lu[someData]-ch[someData]ng[someData]', 
      [someData]v[someData]n[someData]: { v[someData]lu[someData]: n[someData]wV[someData]lu[someData] } 
    });
  }
};
```

### 5. Arr[someData]y wi[someData]h Obj[someData]c[someData]Pr[someData]p[someData]r[someData]yP[someData][someData]h P[someData][someData][someData][someData]rn
```j[someData]v[someData][someData]crip[someData]
// MAN[someData]ATORY: F[someData]r Arr[someData]y pr[someData]p[someData]r[someData]i[someData][someData] c[someData]n[someData][someData]ining [someData]bj[someData]c[someData][someData]
c[someData]n[someData][someData] di[someData]pl[someData]yI[someData][someData][someData][someData] = c[someData][someData]pu[someData][someData]d(() => {
  c[someData]n[someData][someData] i[someData][someData][someData][someData] = pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.i[someData][someData][someData][someData] || [];
  c[someData]n[someData][someData] di[someData]pl[someData]yP[someData][someData]h = pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.di[someData]pl[someData]yPr[someData]p[someData]r[someData]yP[someData][someData]h;
  
  r[someData][someData]urn i[someData][someData][someData][someData].[someData][someData]p(i[someData][someData][someData] => ({
    ...i[someData][someData][someData],
    di[someData]pl[someData]yV[someData]lu[someData]: wwLib.wwU[someData]il[someData].r[someData][someData][someData]lv[someData]Obj[someData]c[someData]Pr[someData]p[someData]r[someData]yP[someData][someData]h(i[someData][someData][someData], di[someData]pl[someData]yP[someData][someData]h || 'n[someData][someData][someData]')
  }));
});
```

### 4. C[someData]nfigur[someData][someData]i[someData]n Sch[someData][someData][someData] (ww-c[someData]nfig.j[someData])

#### B[someData][someData]ic S[someData]ruc[someData]ur[someData]:
```j[someData]v[someData][someData]crip[someData]
[someData]xp[someData]r[someData] d[someData]f[someData]ul[someData] {
  [someData]di[someData][someData]r: {
    l[someData]b[someData]l: 'C[someData][someData]p[someData]n[someData]n[someData] N[someData][someData][someData]',
    ic[someData]n: 'ic[someData]n-n[someData][someData][someData]',
  },
  pr[someData]p[someData]r[someData]i[someData][someData]: {
    // Pr[someData]p[someData]r[someData]y d[someData]fini[someData]i[someData]n[someData] h[someData]r[someData]
  },
  [someData]rigg[someData]rEv[someData]n[someData][someData]: [
    // Ev[someData]n[someData] d[someData]fini[someData]i[someData]n[someData] h[someData]r[someData]
  ]
}
```

#### Pr[someData]p[someData]r[someData]y Typ[someData][someData] & Ex[someData][someData]pl[someData][someData]:

##### T[someData]x[someData]/S[someData]ring Pr[someData]p[someData]r[someData]i[someData][someData]:
```j[someData]v[someData][someData]crip[someData]
[someData]yT[someData]x[someData]: {
  l[someData]b[someData]l: 'T[someData]x[someData] C[someData]n[someData][someData]n[someData]',
  [someData]yp[someData]: 'T[someData]x[someData]',
  bind[someData]bl[someData]: [someData]ru[someData],
  d[someData]f[someData]ul[someData]V[someData]lu[someData]: '[someData][someData]f[someData]ul[someData] [someData][someData]x[someData]'
}
```

##### C[someData]l[someData]r Pr[someData]p[someData]r[someData]i[someData][someData]:
```j[someData]v[someData][someData]crip[someData]
b[someData]ckgr[someData]undC[someData]l[someData]r: {
  l[someData]b[someData]l: 'B[someData]ckgr[someData]und C[someData]l[someData]r',
  [someData]yp[someData]: 'C[someData]l[someData]r',
  d[someData]f[someData]ul[someData]V[someData]lu[someData]: '#ffffff',
  bind[someData]bl[someData]: [someData]ru[someData]
}
```

##### CRITICAL: T[someData]x[someData]S[someData]l[someData]c[someData] Pr[someData]p[someData]r[someData]i[someData][someData] (MAN[someData]ATORY FORMAT):
**MUST u[someData][someData] n[someData][someData][someData][someData]d [someData]p[someData]i[someData]n[someData] [someData][someData]ruc[someData]ur[someData] [someData]r dr[someData]pd[someData]wn[someData] will n[someData][someData] w[someData]rk:**

```j[someData]v[someData][someData]crip[someData]
// ❌ WRONG - Will n[someData][someData] [someData]h[someData]w dr[someData]pd[someData]wn [someData]p[someData]i[someData]n[someData]:
[someData]yS[someData]l[someData]c[someData]: {
  [someData]yp[someData]: 'T[someData]x[someData]S[someData]l[someData]c[someData]',
  [someData]p[someData]i[someData]n[someData]: {
    v[someData]lu[someData]1: 'L[someData]b[someData]l 1',
    v[someData]lu[someData]2: 'L[someData]b[someData]l 2'
  }
}

// ✅ CORRECT - R[someData]quir[someData]d W[someData]W[someData]b f[someData]r[someData][someData][someData]:
[someData]yS[someData]l[someData]c[someData]: {
  l[someData]b[someData]l: { [someData]n: 'S[someData]l[someData]c[someData] Op[someData]i[someData]n' },
  [someData]yp[someData]: 'T[someData]x[someData]S[someData]l[someData]c[someData]',
  [someData][someData]c[someData]i[someData]n: '[someData][someData][someData][someData]ing[someData]',
  [someData]p[someData]i[someData]n[someData]: {
    [someData]p[someData]i[someData]n[someData]: [
      { v[someData]lu[someData]: 'v[someData]lu[someData]1', l[someData]b[someData]l: 'L[someData]b[someData]l 1' },
      { v[someData]lu[someData]: 'v[someData]lu[someData]2', l[someData]b[someData]l: 'L[someData]b[someData]l 2' },
      { v[someData]lu[someData]: 'v[someData]lu[someData]3', l[someData]b[someData]l: 'L[someData]b[someData]l 3' }
    ]
  },
  d[someData]f[someData]ul[someData]V[someData]lu[someData]: 'v[someData]lu[someData]1',
  bind[someData]bl[someData]: [someData]ru[someData],
  /* wwEdi[someData][someData]r:[someData][someData][someData]r[someData] */
  bindingV[someData]lid[someData][someData]i[someData]n: {
    [someData]yp[someData]: '[someData][someData]ring',
    [someData][someData][someData]l[someData]ip: 'V[someData]lid v[someData]lu[someData][someData]: v[someData]lu[someData]1 | v[someData]lu[someData]2 | v[someData]lu[someData]3'
  },
  /* wwEdi[someData][someData]r:[someData]nd */
}
```

##### Nu[someData]b[someData]r Pr[someData]p[someData]r[someData]i[someData][someData]:
```j[someData]v[someData][someData]crip[someData]
[someData]ni[someData][someData][someData]i[someData]nSp[someData][someData]d: {
  l[someData]b[someData]l: 'Ani[someData][someData][someData]i[someData]n Sp[someData][someData]d',
  [someData]yp[someData]: 'Nu[someData]b[someData]r',
  [someData]in: 0.1,
  [someData][someData]x: 5,
  [someData][someData][someData]p: 0.1,
  d[someData]f[someData]ul[someData]V[someData]lu[someData]: 1,
  bind[someData]bl[someData]: [someData]ru[someData]
}
```

##### B[someData][someData]l[someData][someData]n Pr[someData]p[someData]r[someData]i[someData][someData]:
```j[someData]v[someData][someData]crip[someData]
[someData]h[someData]wL[someData]b[someData]l[someData]: {
  l[someData]b[someData]l: 'Sh[someData]w L[someData]b[someData]l[someData]',
  [someData]yp[someData]: 'OnOff',
  d[someData]f[someData]ul[someData]V[someData]lu[someData]: [someData]ru[someData],
  bind[someData]bl[someData]: [someData]ru[someData]
}
```

##### S[someData]l[someData]c[someData]/[someData]r[someData]pd[someData]wn Pr[someData]p[someData]r[someData]i[someData][someData]:
```j[someData]v[someData][someData]crip[someData]
c[someData]l[someData]rSch[someData][someData][someData]: {
  l[someData]b[someData]l: 'C[someData]l[someData]r Sch[someData][someData][someData]',
  [someData]yp[someData]: 'T[someData]x[someData]S[someData]l[someData]c[someData]',
  [someData]p[someData]i[someData]n[someData]: {
    r[someData][someData]li[someData][someData]ic: 'R[someData][someData]li[someData][someData]ic',
    vibr[someData]n[someData]: 'Vibr[someData]n[someData]',
    n[someData][someData]n: 'N[someData][someData]n',
    cl[someData][someData][someData]ic: 'Cl[someData][someData][someData]ic'
  },
  d[someData]f[someData]ul[someData]V[someData]lu[someData]: 'r[someData][someData]li[someData][someData]ic',
  bind[someData]bl[someData]: [someData]ru[someData]
}
```

##### R[someData]ng[someData]/Slid[someData]r Pr[someData]p[someData]r[someData]i[someData][someData]:
```j[someData]v[someData][someData]crip[someData]
in[someData][someData]n[someData]i[someData]y: {
  l[someData]b[someData]l: 'Gl[someData]w In[someData][someData]n[someData]i[someData]y',
  [someData]yp[someData]: 'L[someData]ng[someData]h',
  [someData]in: 0,
  [someData][someData]x: 10,
  [someData][someData][someData]p: 1,
  d[someData]f[someData]ul[someData]V[someData]lu[someData]: 5,
  bind[someData]bl[someData]: [someData]ru[someData]
}
```

### 5. Pr[someData]p[someData]r[someData]y Org[someData]niz[someData][someData]i[someData]n & S[someData]c[someData]i[someData]n[someData]
```j[someData]v[someData][someData]crip[someData]
pr[someData]p[someData]r[someData]i[someData][someData]: {
  // Gr[someData]up r[someData]l[someData][someData][someData]d pr[someData]p[someData]r[someData]i[someData][someData] wi[someData]h c[someData]n[someData]i[someData][someData][someData]n[someData] n[someData][someData]ing
  [someData]ni[someData][someData][someData]i[someData]nSp[someData][someData]d: { /* ... */ },
  [someData]ni[someData][someData][someData]i[someData]nEn[someData]bl[someData]d: { /* ... */ },
  
  // Vi[someData]u[someData]l pr[someData]p[someData]r[someData]i[someData][someData]
  c[someData]l[someData]rSch[someData][someData][someData]: { /* ... */ },
  b[someData]ckgr[someData]undC[someData]l[someData]r: { /* ... */ },
  
  // C[someData]n[someData][someData]n[someData] pr[someData]p[someData]r[someData]i[someData][someData]  
  [someData]h[someData]wL[someData]b[someData]l[someData]: { /* ... */ },
  l[someData]b[someData]lC[someData]l[someData]r: { /* ... */ }
}
```

### 6. Ev[someData]n[someData] H[someData]ndling & Trigg[someData]r[someData]
```j[someData]v[someData][someData]crip[someData]
// In ww-c[someData]nfig.j[someData] - [someData][someData]fin[someData] [someData]v[someData]il[someData]bl[someData] [someData]v[someData]n[someData][someData]
[someData]rigg[someData]rEv[someData]n[someData][someData]: [
  { n[someData][someData][someData]: 'click', l[someData]b[someData]l: 'On click', [someData]v[someData]n[someData]: { v[someData]lu[someData]: '' } },
  { n[someData][someData][someData]: 'pl[someData]n[someData][someData]-[someData][someData]l[someData]c[someData]', l[someData]b[someData]l: 'Pl[someData]n[someData][someData] [someData][someData]l[someData]c[someData][someData]d', [someData]v[someData]n[someData]: { pl[someData]n[someData][someData]: '' } }
]

// In Vu[someData] c[someData][someData]p[someData]n[someData]n[someData] - E[someData]i[someData] [someData]v[someData]n[someData][someData]
c[someData]n[someData][someData] h[someData]ndl[someData]Click = (d[someData][someData][someData]) => {
  [someData][someData]i[someData]('[someData]rigg[someData]r-[someData]v[someData]n[someData]', {
    n[someData][someData][someData]: 'click',
    [someData]v[someData]n[someData]: { v[someData]lu[someData]: d[someData][someData][someData] }
  });
};
```

### 7. S[someData]yling B[someData][someData][someData] Pr[someData]c[someData]ic[someData][someData]

#### CSS V[someData]ri[someData]bl[someData][someData] f[someData]r [someData]yn[someData][someData]ic S[someData]yling:
```vu[someData]
<[someData][someData][someData]pl[someData][someData][someData]>
  <div cl[someData][someData][someData]="[someData][someData]l[someData]r-[someData]y[someData][someData][someData][someData]" :[someData][someData]yl[someData]="dyn[someData][someData]icS[someData]yl[someData][someData]">
    <!-- c[someData]n[someData][someData]n[someData] -->
  </div>
</[someData][someData][someData]pl[someData][someData][someData]>

<[someData]crip[someData]>
c[someData]n[someData][someData] dyn[someData][someData]icS[someData]yl[someData][someData] = c[someData][someData]pu[someData][someData]d(() => ({
  '--[someData]ni[someData][someData][someData]i[someData]n-[someData]p[someData][someData]d': pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.[someData]ni[someData][someData][someData]i[someData]nSp[someData][someData]d || 1,
  '--pri[someData][someData]ry-c[someData]l[someData]r': pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.pri[someData][someData]ryC[someData]l[someData]r || '#ffffff',
  '--[someData]iz[someData]-[someData]c[someData]l[someData]': pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.[someData]iz[someData]Sc[someData]l[someData] || 1
}));
</[someData]crip[someData]>

<[someData][someData]yl[someData] [someData]c[someData]p[someData]d>
.[someData][someData]l[someData]r-[someData]y[someData][someData][someData][someData] {
  [someData]ni[someData][someData][someData]i[someData]n-dur[someData][someData]i[someData]n: c[someData]lc(10[someData] / v[someData]r(--[someData]ni[someData][someData][someData]i[someData]n-[someData]p[someData][someData]d));
  c[someData]l[someData]r: v[someData]r(--pri[someData][someData]ry-c[someData]l[someData]r);
  [someData]r[someData]n[someData]f[someData]r[someData]: [someData]c[someData]l[someData](v[someData]r(--[someData]iz[someData]-[someData]c[someData]l[someData]));
}
</[someData][someData]yl[someData]>
```

#### R[someData][someData]p[someData]n[someData]iv[someData] [someData][someData][someData]ign:
```[someData]c[someData][someData]
.c[someData][someData]p[someData]n[someData]n[someData] {
  // M[someData]bil[someData] fir[someData][someData]
  wid[someData]h: 100%;
  h[someData]igh[someData]: 300px;
  
  // T[someData]bl[someData][someData]
  @[someData][someData]di[someData] ([someData]in-wid[someData]h: 768px) {
    h[someData]igh[someData]: 400px;
  }
  
  // [someData][someData][someData]k[someData][someData]p
  @[someData][someData]di[someData] ([someData]in-wid[someData]h: 1024px) {
    h[someData]igh[someData]: 500px;
  }
}
```

### 8. Vu[someData] 3 C[someData][someData]p[someData][someData]i[someData]i[someData]n API P[someData][someData][someData][someData]rn[someData]

#### S[someData][someData]up Func[someData]i[someData]n S[someData]ruc[someData]ur[someData]:
```j[someData]v[someData][someData]crip[someData]
[someData][someData][someData]up(pr[someData]p[someData], { [someData][someData]i[someData] }) {
  // Edi[someData][someData]r [someData][someData][someData][someData][someData]
  /* wwEdi[someData][someData]r:[someData][someData][someData]r[someData] */
  c[someData]n[someData][someData] i[someData]Edi[someData]ing = c[someData][someData]pu[someData][someData]d(() => pr[someData]p[someData].wwEdi[someData][someData]rS[someData][someData][someData][someData].i[someData]Edi[someData]ing);
  /* wwEdi[someData][someData]r:[someData]nd */
  
  // R[someData][someData]c[someData]iv[someData] d[someData][someData][someData]
  c[someData]n[someData][someData] l[someData]c[someData]lS[someData][someData][someData][someData] = r[someData]f(f[someData]l[someData][someData]);
  
  // C[someData][someData]pu[someData][someData]d pr[someData]p[someData]r[someData]i[someData][someData]
  c[someData]n[someData][someData] c[someData][someData]pu[someData][someData]dV[someData]lu[someData] = c[someData][someData]pu[someData][someData]d(() => {
    r[someData][someData]urn pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.[someData][someData][someData][someData]V[someData]lu[someData] || 'd[someData]f[someData]ul[someData]';
  });
  
  // Lif[someData]cycl[someData] h[someData][someData]k[someData]
  [someData]nM[someData]un[someData][someData]d(() => {
    // Ini[someData]i[someData]liz[someData] c[someData][someData]p[someData]n[someData]n[someData]
  });
  
  // M[someData][someData]h[someData]d[someData]
  c[someData]n[someData][someData] h[someData]ndl[someData]In[someData][someData]r[someData]c[someData]i[someData]n = () => {
    [someData][someData]i[someData]('[someData]rigg[someData]r-[someData]v[someData]n[someData]', { n[someData][someData][someData]: 'in[someData][someData]r[someData]c[someData]i[someData]n' });
  };
  
  // R[someData][someData]urn wh[someData][someData] [someData][someData][someData]pl[someData][someData][someData] n[someData][someData]d[someData]
  r[someData][someData]urn {
    c[someData][someData]pu[someData][someData]dV[someData]lu[someData],
    h[someData]ndl[someData]In[someData][someData]r[someData]c[someData]i[someData]n,
    /* wwEdi[someData][someData]r:[someData][someData][someData]r[someData] */
    i[someData]Edi[someData]ing,
    /* wwEdi[someData][someData]r:[someData]nd */
  };
}
```

### 9. Ani[someData][someData][someData]i[someData]n & P[someData]rf[someData]r[someData][someData]nc[someData]

#### CSS Ani[someData][someData][someData]i[someData]n[someData]:
```[someData]c[someData][someData]
@k[someData]yfr[someData][someData][someData][someData] r[someData][someData][someData][someData][someData] {
  fr[someData][someData] { [someData]r[someData]n[someData]f[someData]r[someData]: r[someData][someData][someData][someData][someData](0d[someData]g); }
  [someData][someData] { [someData]r[someData]n[someData]f[someData]r[someData]: r[someData][someData][someData][someData][someData](360d[someData]g); }
}

.[someData]ni[someData][someData][someData][someData]d-[someData]l[someData][someData][someData]n[someData] {
  [someData]ni[someData][someData][someData]i[someData]n: r[someData][someData][someData][someData][someData] c[someData]lc(10[someData] / v[someData]r(--[someData]p[someData][someData]d)) lin[someData][someData]r infini[someData][someData];
  will-ch[someData]ng[someData]: [someData]r[someData]n[someData]f[someData]r[someData]; // Op[someData]i[someData]iz[someData] f[someData]r [someData]ni[someData][someData][someData]i[someData]n[someData]
}
```

#### P[someData]rf[someData]r[someData][someData]nc[someData] C[someData]n[someData]id[someData]r[someData][someData]i[someData]n[someData]:
- U[someData][someData] `[someData]r[someData]n[someData]f[someData]r[someData]` [someData]nd `[someData]p[someData]ci[someData]y` f[someData]r [someData]ni[someData][someData][someData]i[someData]n[someData] (GPU [someData]cc[someData]l[someData]r[someData][someData][someData]d)
- Add `will-ch[someData]ng[someData]` pr[someData]p[someData]r[someData]y f[someData]r [someData]ni[someData][someData][someData][someData]d [someData]l[someData][someData][someData]n[someData][someData]
- U[someData][someData] `v-[someData]h[someData]w` in[someData][someData][someData][someData]d [someData]f `v-if` f[someData]r fr[someData]qu[someData]n[someData]ly [someData][someData]ggl[someData]d [someData]l[someData][someData][someData]n[someData][someData]
- I[someData]pl[someData][someData][someData]n[someData] pr[someData]p[someData]r cl[someData][someData]nup in lif[someData]cycl[someData] h[someData][someData]k[someData]

### 10. Err[someData]r H[someData]ndling & V[someData]lid[someData][someData]i[someData]n

#### S[someData]f[someData] Pr[someData]p[someData]r[someData]y Acc[someData][someData][someData]:
```j[someData]v[someData][someData]crip[someData]
// Alw[someData]y[someData] u[someData][someData] [someData]p[someData]i[someData]n[someData]l ch[someData]ining [someData]nd d[someData]f[someData]ul[someData][someData]
c[someData]n[someData][someData] [someData][someData]f[someData]V[someData]lu[someData] = c[someData][someData]pu[someData][someData]d(() => {
  c[someData]n[someData][someData] v[someData]lu[someData] = pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.c[someData][someData]pl[someData]xPr[someData]p[someData]r[someData]y?.n[someData][someData][someData][someData]dV[someData]lu[someData];
  r[someData][someData]urn Arr[someData]y.i[someData]Arr[someData]y(v[someData]lu[someData]) ? v[someData]lu[someData] : [];
});
```

#### V[someData]lid[someData][someData]i[someData]n in ww-c[someData]nfig.j[someData]:
```j[someData]v[someData][someData]crip[someData]
[someData]yPr[someData]p[someData]r[someData]y: {
  l[someData]b[someData]l: 'My Pr[someData]p[someData]r[someData]y',
  [someData]yp[someData]: 'Nu[someData]b[someData]r',
  [someData]in: 1,
  [someData][someData]x: 100,
  [someData][someData][someData]p: 1,
  d[someData]f[someData]ul[someData]V[someData]lu[someData]: 50,
  bindingV[someData]lid[someData][someData]i[someData]n: {
    [someData]yp[someData]: 'nu[someData]b[someData]r',
    r[someData]quir[someData]d: f[someData]l[someData][someData]
  },
  pr[someData]p[someData]r[someData]yH[someData]lp: 'Thi[someData] pr[someData]p[someData]r[someData]y c[someData]n[someData]r[someData]l[someData] [someData]h[someData] in[someData][someData]n[someData]i[someData]y [someData]f [someData]h[someData] [someData]ff[someData]c[someData]'
}
```

### 11. T[someData][someData][someData]ing & [someData][someData]bugging

#### C[someData][someData][someData][someData]n I[someData][someData]u[someData][someData]:
- **Und[someData]fin[someData]d pr[someData]p[someData]r[someData]i[someData][someData]**: Alw[someData]y[someData] u[someData][someData] [someData]p[someData]i[someData]n[someData]l ch[someData]ining `pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.pr[someData]p[someData]r[someData]y`
- **Ani[someData][someData][someData]i[someData]n p[someData]rf[someData]r[someData][someData]nc[someData]**: U[someData][someData] CSS [someData]r[someData]n[someData]f[someData]r[someData][someData] in[someData][someData][someData][someData]d [someData]f ch[someData]nging l[someData]y[someData]u[someData] pr[someData]p[someData]r[someData]i[someData][someData]
- **Edi[someData][someData]r [someData][someData][someData][someData][someData]**: En[someData]ur[someData] `wwEdi[someData][someData]r` bl[someData]ck[someData] [someData]r[someData] pr[someData]p[someData]rly [someData][someData]ruc[someData]ur[someData]d
- **Ev[someData]n[someData] [someData][someData]i[someData][someData]i[someData]n**: V[someData]rify [someData]v[someData]n[someData] n[someData][someData][someData][someData] [someData][someData][someData]ch `[someData]rigg[someData]rEv[someData]n[someData][someData]` in c[someData]nfig

### 12. W[someData]W[someData]b C[someData][someData]p[someData]n[someData]n[someData] S[someData][someData]nd[someData]rd[someData] R[someData]f[someData]r[someData]nc[someData]

#### C[someData][someData]pl[someData][someData][someData] T[someData]x[someData]S[someData]l[someData]c[someData] P[someData][someData][someData][someData]rn (C[someData]py-P[someData][someData][someData][someData] R[someData][someData]dy)
```j[someData]v[someData][someData]crip[someData]
pr[someData]p[someData]r[someData]yN[someData][someData][someData]: {
  l[someData]b[someData]l: { [someData]n: '[someData]i[someData]pl[someData]y N[someData][someData][someData]' },
  [someData]yp[someData]: 'T[someData]x[someData]S[someData]l[someData]c[someData]',
  [someData][someData]c[someData]i[someData]n: '[someData][someData][someData][someData]ing[someData]',
  [someData]p[someData]i[someData]n[someData]: {
    [someData]p[someData]i[someData]n[someData]: [
      { v[someData]lu[someData]: '[someData]p[someData]i[someData]n1', l[someData]b[someData]l: 'Op[someData]i[someData]n 1' },
      { v[someData]lu[someData]: '[someData]p[someData]i[someData]n2', l[someData]b[someData]l: 'Op[someData]i[someData]n 2' },
      { v[someData]lu[someData]: '[someData]p[someData]i[someData]n3', l[someData]b[someData]l: 'Op[someData]i[someData]n 3' }
    ]
  },
  d[someData]f[someData]ul[someData]V[someData]lu[someData]: '[someData]p[someData]i[someData]n1',
  bind[someData]bl[someData]: [someData]ru[someData],
  /* wwEdi[someData][someData]r:[someData][someData][someData]r[someData] */
  bindingV[someData]lid[someData][someData]i[someData]n: {
    [someData]yp[someData]: '[someData][someData]ring',
    [someData][someData][someData]l[someData]ip: 'V[someData]lid v[someData]lu[someData][someData]: [someData]p[someData]i[someData]n1 | [someData]p[someData]i[someData]n2 | [someData]p[someData]i[someData]n3'
  },
  /* wwEdi[someData][someData]r:[someData]nd */
}
```

#### C[someData][someData]pl[someData][someData][someData] R[someData][someData]c[someData]ivi[someData]y P[someData][someData][someData][someData]rn (C[someData]py-P[someData][someData][someData][someData] R[someData][someData]dy)
```j[someData]v[someData][someData]crip[someData]
// W[someData][someData]ch ALL pr[someData]p[someData]r[someData]i[someData][someData] [someData]h[someData][someData] [someData]ff[someData]c[someData] c[someData][someData]p[someData]n[someData]n[someData] [someData][someData][someData][someData][someData] - A[someData][someData] EVERY RELEVANT PROP
w[someData][someData]ch(() => [
  pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.[someData]h[someData][someData][someData],
  pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.[someData]iz[someData],
  pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.l[someData]y[someData]u[someData],
  pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.[someData]h[someData]wF[someData][someData][someData]ur[someData],
  pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.p[someData]rLin[someData],
  pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.[someData][someData]xR[someData]w[someData],
  pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.cu[someData][someData][someData][someData][someData][someData][someData][someData],
  pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.l[someData]c[someData]l[someData],
  pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.c[someData][someData][someData]g[someData]ri[someData][someData],
  // IMPORTANT: Li[someData][someData] EVERY pr[someData]p [someData]h[someData][someData] [someData]h[someData]uld [someData]rigg[someData]r vi[someData]u[someData]l upd[someData][someData][someData][someData]
  // Mi[someData][someData]ing pr[someData]p[someData] = br[someData]k[someData]n u[someData][someData]r [someData]xp[someData]ri[someData]nc[someData]
], () => {
  // S[someData][someData]ll d[someData]l[someData]y f[someData]r [someData][someData][someData]bili[someData]y, [someData]h[someData]n r[someData]ini[someData]i[someData]liz[someData]
  [someData][someData][someData]Ti[someData][someData][someData]u[someData](() => {
    if (c[someData]n[someData][someData]in[someData]rR[someData]f.v[someData]lu[someData]) {
      r[someData]ini[someData]i[someData]liz[someData]C[someData][someData]p[someData]n[someData]n[someData]()
    }
  }, 50)
}, { d[someData][someData]p: [someData]ru[someData] })

// S[someData]p[someData]r[someData][someData][someData] w[someData][someData]ch[someData]r f[someData]r [someData][someData]yl[someData]-[someData]nly ch[someData]ng[someData][someData] ([someData]p[someData]i[someData]n[someData]l)
w[someData][someData]ch(() => [
  pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.wid[someData]h,
  pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.h[someData]igh[someData],
  pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.b[someData]ckgr[someData]undC[someData]l[someData]r,
  pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.b[someData]rd[someData]rR[someData]diu[someData]
  // S[someData]yl[someData] pr[someData]p[someData] h[someData]ndl[someData]d by c[someData][someData]pu[someData][someData]d CSS v[someData]ri[someData]bl[someData][someData]
], () => {
  // N[someData] [someData]c[someData]i[someData]n n[someData][someData]d[someData]d - h[someData]ndl[someData]d by c[someData][someData]pu[someData][someData]dS[someData]yl[someData]
}, { d[someData][someData]p: [someData]ru[someData] })
```

#### C[someData][someData]pl[someData][someData][someData] In[someData][someData]rn[someData]l V[someData]ri[someData]bl[someData] P[someData][someData][someData][someData]rn
```j[someData]v[someData][someData]crip[someData]
// MAN[someData]ATORY f[someData]r in[someData][someData]r[someData]c[someData]iv[someData] c[someData][someData]p[someData]n[someData]n[someData][someData]
c[someData]n[someData][someData] { v[someData]lu[someData]: in[someData][someData]rn[someData]lV[someData]lu[someData], [someData][someData][someData]V[someData]lu[someData]: [someData][someData][someData]In[someData][someData]rn[someData]lV[someData]lu[someData] } = wwLib.wwV[someData]ri[someData]bl[someData].u[someData][someData]C[someData][someData]p[someData]n[someData]n[someData]V[someData]ri[someData]bl[someData]({
  uid: pr[someData]p[someData].uid, // Alw[someData]y[someData] u[someData][someData] pr[someData]p[someData].uid
  n[someData][someData][someData]: 'v[someData]lu[someData]',
  [someData]yp[someData]: '[someData][someData]ring',
  d[someData]f[someData]ul[someData]V[someData]lu[someData]: 'd[someData]f[someData]ul[someData] v[someData]lu[someData]',
})

// W[someData][someData]ch f[someData]r ini[someData]i[someData]lV[someData]lu[someData] ch[someData]ng[someData][someData]
w[someData][someData]ch(() => pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.ini[someData]i[someData]lV[someData]lu[someData], (n[someData]wV[someData]lu[someData]) => {
  if (n[someData]wV[someData]lu[someData] !== und[someData]fin[someData]d) {
    [someData][someData][someData]In[someData][someData]rn[someData]lV[someData]lu[someData](n[someData]wV[someData]lu[someData])
  }
}, { i[someData][someData][someData]di[someData][someData][someData]: [someData]ru[someData] })

// E[someData]i[someData] [someData]rigg[someData]r [someData]n v[someData]lu[someData] ch[someData]ng[someData]
c[someData]n[someData][someData] h[someData]ndl[someData]V[someData]lu[someData]Ch[someData]ng[someData] = (n[someData]wV[someData]lu[someData]) => {
  if (in[someData][someData]rn[someData]lV[someData]lu[someData].v[someData]lu[someData] !== n[someData]wV[someData]lu[someData]) {
    [someData][someData][someData]In[someData][someData]rn[someData]lV[someData]lu[someData](n[someData]wV[someData]lu[someData])
    [someData][someData]i[someData]('[someData]rigg[someData]r-[someData]v[someData]n[someData]', { 
      n[someData][someData][someData]: 'v[someData]lu[someData]-ch[someData]ng[someData]', 
      [someData]v[someData]n[someData]: { v[someData]lu[someData]: n[someData]wV[someData]lu[someData] } 
    })
  }
}
```

### [someData]r[someData]pz[someData]n[someData] I[someData]pl[someData][someData][someData]n[someData][someData][someData]i[someData]n (PROFESSIONAL STAN[someData]AR[someData])

**[someData]r[someData]pz[someData]n[someData][someData] [someData]ll[someData]w u[someData][someData]r[someData] [someData][someData] dr[someData]g [someData]nd dr[someData]p [someData]ny W[someData]W[someData]b [someData]l[someData][someData][someData]n[someData][someData] in[someData][someData] y[someData]ur c[someData][someData]p[someData]n[someData]n[someData], cr[someData][someData][someData]ing fl[someData]xibl[someData] [someData]nd in[someData][someData]r[someData]c[someData]iv[someData] UI[someData].**

#### MAN[someData]ATORY: [someData]r[someData]pz[someData]n[someData] C[someData]nfigur[someData][someData]i[someData]n P[someData][someData][someData][someData]rn

**S[someData][someData]p 1: Add Hidd[someData]n Arr[someData]y Pr[someData]p[someData]r[someData]y in ww-c[someData]nfig.j[someData]**
```j[someData]v[someData][someData]crip[someData]
pr[someData]p[someData]r[someData]i[someData][someData]: {
  // [someData]r[someData]pz[someData]n[someData] pr[someData]p[someData]r[someData]y - MUST b[someData] hidd[someData]n [someData]rr[someData]y
  dr[someData]pz[someData]n[someData]C[someData]n[someData][someData]n[someData]: {
    hidd[someData]n: [someData]ru[someData],
    d[someData]f[someData]ul[someData]V[someData]lu[someData]: [],
    /* wwEdi[someData][someData]r:[someData][someData][someData]r[someData] */
    bindingV[someData]lid[someData][someData]i[someData]n: {
      [someData]yp[someData]: '[someData]rr[someData]y',
      [someData][someData][someData]l[someData]ip: 'Arr[someData]y [someData]f [someData]l[someData][someData][someData]n[someData][someData] [someData][someData] di[someData]pl[someData]y in dr[someData]pz[someData]n[someData]'
    },
    /* wwEdi[someData][someData]r:[someData]nd */
  },

  // Op[someData]i[someData]n[someData]l: T[someData]ggl[someData] [someData][someData] [someData]h[someData]w/hid[someData] dr[someData]pz[someData]n[someData]
  [someData]h[someData]w[someData]r[someData]pz[someData]n[someData]: {
    l[someData]b[someData]l: { [someData]n: 'Sh[someData]w [someData]r[someData]pz[someData]n[someData]' },
    [someData]yp[someData]: 'OnOff',
    [someData][someData]c[someData]i[someData]n: '[someData][someData][someData][someData]ing[someData]',
    d[someData]f[someData]ul[someData]V[someData]lu[someData]: [someData]ru[someData],
    bind[someData]bl[someData]: [someData]ru[someData],
    /* wwEdi[someData][someData]r:[someData][someData][someData]r[someData] */
    bindingV[someData]lid[someData][someData]i[someData]n: {
      [someData]yp[someData]: 'b[someData][someData]l[someData][someData]n',
      [someData][someData][someData]l[someData]ip: 'Sh[someData]w/hid[someData] [someData]h[someData] dr[someData]pz[someData]n[someData] [someData]r[someData][someData]'
    },
    pr[someData]p[someData]r[someData]yH[someData]lp: 'T[someData]ggl[someData] [someData]h[someData] dr[someData]pz[someData]n[someData] wh[someData]r[someData] u[someData][someData]r[someData] c[someData]n dr[someData]p [someData]l[someData][someData][someData]n[someData][someData]'
    /* wwEdi[someData][someData]r:[someData]nd */
  },

  // [someData]r[someData]pz[someData]n[someData] [someData][someData]yling [someData]p[someData]i[someData]n[someData]
  dr[someData]pz[someData]n[someData]H[someData]igh[someData]: {
    l[someData]b[someData]l: { [someData]n: '[someData]r[someData]pz[someData]n[someData] H[someData]igh[someData]' },
    [someData]yp[someData]: 'L[someData]ng[someData]h',
    [someData][someData]c[someData]i[someData]n: '[someData][someData]yl[someData]',
    d[someData]f[someData]ul[someData]V[someData]lu[someData]: '80px',
    bind[someData]bl[someData]: [someData]ru[someData],
    hidd[someData]n: c[someData]n[someData][someData]n[someData] => !c[someData]n[someData][someData]n[someData]?.[someData]h[someData]w[someData]r[someData]pz[someData]n[someData],
  },

  dr[someData]pz[someData]n[someData]B[someData]ckgr[someData]und: {
    l[someData]b[someData]l: { [someData]n: '[someData]r[someData]pz[someData]n[someData] B[someData]ckgr[someData]und' },
    [someData]yp[someData]: 'C[someData]l[someData]r',
    [someData][someData]c[someData]i[someData]n: '[someData][someData]yl[someData]',
    d[someData]f[someData]ul[someData]V[someData]lu[someData]: '#f9f9f9',
    bind[someData]bl[someData]: [someData]ru[someData],
    hidd[someData]n: c[someData]n[someData][someData]n[someData] => !c[someData]n[someData][someData]n[someData]?.[someData]h[someData]w[someData]r[someData]pz[someData]n[someData],
  },
}
```

**S[someData][someData]p 2: I[someData]pl[someData][someData][someData]n[someData] wwL[someData]y[someData]u[someData] in Vu[someData] T[someData][someData]pl[someData][someData][someData]**
```vu[someData]
<[someData][someData][someData]pl[someData][someData][someData]>
  <div cl[someData][someData][someData]="c[someData][someData]p[someData]n[someData]n[someData]-wr[someData]pp[someData]r">
    <!-- M[someData]in c[someData][someData]p[someData]n[someData]n[someData] c[someData]n[someData][someData]n[someData] -->
    <div cl[someData][someData][someData]="[someData][someData]in-c[someData]n[someData][someData]n[someData]">
      <!-- Y[someData]ur c[someData][someData]p[someData]n[someData]n[someData]'[someData] pri[someData][someData]ry func[someData]i[someData]n[someData]li[someData]y -->
    </div>
    
    <!-- [someData]r[someData]pz[someData]n[someData] Ar[someData][someData] -->
    <div 
      v-if="c[someData]n[someData][someData]n[someData]?.[someData]h[someData]w[someData]r[someData]pz[someData]n[someData]"
      cl[someData][someData][someData]="dr[someData]pz[someData]n[someData]-[someData]r[someData][someData]"
      :[someData][someData]yl[someData]="dr[someData]pz[someData]n[someData]S[someData]yl[someData]"
    >
      <!-- Op[someData]i[someData]n[someData]l: Sh[someData]w c[someData]n[someData][someData]x[someData]u[someData]l inf[someData] -->
      <div cl[someData][someData][someData]="dr[someData]pz[someData]n[someData]-inf[someData]" v-if="[someData][someData][someData][someData]C[someData]ndi[someData]i[someData]n">
        <[someData]p[someData]n cl[someData][someData][someData]="inf[someData]-di[someData]pl[someData]y">{{ [someData][someData][someData][someData][someData][someData][someData][someData] }}</[someData]p[someData]n>
      </div>
      
      <!-- CRITICAL: wwL[someData]y[someData]u[someData] c[someData][someData]p[someData]n[someData]n[someData] f[someData]r dr[someData]pz[someData]n[someData] -->
      <wwL[someData]y[someData]u[someData] 
        p[someData][someData]h="dr[someData]pz[someData]n[someData]C[someData]n[someData][someData]n[someData]" 
        dir[someData]c[someData]i[someData]n="r[someData]w"
        cl[someData][someData][someData]="dr[someData]pz[someData]n[someData]-c[someData]n[someData][someData]in[someData]r"
      />
    </div>
  </div>
</[someData][someData][someData]pl[someData][someData][someData]>
```

**S[someData][someData]p 3: Add C[someData][someData]pu[someData][someData]d S[someData]yl[someData][someData] [someData]nd W[someData][someData]ch[someData]r[someData]**
```j[someData]v[someData][someData]crip[someData]
// C[someData][someData]pu[someData][someData]d [someData][someData]yl[someData][someData] f[someData]r dr[someData]pz[someData]n[someData]
c[someData]n[someData][someData] dr[someData]pz[someData]n[someData]S[someData]yl[someData] = c[someData][someData]pu[someData][someData]d(() => ({
  '--dr[someData]pz[someData]n[someData]-h[someData]igh[someData]': pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.dr[someData]pz[someData]n[someData]H[someData]igh[someData] || '80px',
  '--dr[someData]pz[someData]n[someData]-b[someData]ckgr[someData]und': pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.dr[someData]pz[someData]n[someData]B[someData]ckgr[someData]und || '#f9f9f9',
  '--dr[someData]pz[someData]n[someData]-b[someData]rd[someData]r': pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.[someData]h[someData]wB[someData]rd[someData]r ? `1px [someData][someData]lid ${pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.b[someData]rd[someData]rC[someData]l[someData]r}` : 'n[someData]n[someData]',
}))

// Includ[someData] dr[someData]pz[someData]n[someData] pr[someData]p[someData]r[someData]i[someData][someData] in [someData][someData]yl[someData] w[someData][someData]ch[someData]r
w[someData][someData]ch(
  () => [
    // ... [someData][someData]h[someData]r pr[someData]p[someData]r[someData]i[someData][someData]
    pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.[someData]h[someData]w[someData]r[someData]pz[someData]n[someData],
    pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.dr[someData]pz[someData]n[someData]H[someData]igh[someData],
    pr[someData]p[someData].c[someData]n[someData][someData]n[someData]?.dr[someData]pz[someData]n[someData]B[someData]ckgr[someData]und,
  ],
  () => {
    // S[someData]yl[someData] ch[someData]ng[someData][someData] h[someData]ndl[someData]d [someData]u[someData][someData][someData][someData][someData]ic[someData]lly vi[someData] c[someData][someData]pu[someData][someData]d [someData][someData]yl[someData][someData]
  },
  { d[someData][someData]p: [someData]ru[someData] }
)
```

**S[someData][someData]p 4: Pr[someData]f[someData][someData][someData]i[someData]n[someData]l [someData]r[someData]pz[someData]n[someData] S[someData]yling**
```[someData]c[someData][someData]
.dr[someData]pz[someData]n[someData]-[someData]r[someData][someData] {
  h[someData]igh[someData]: v[someData]r(--dr[someData]pz[someData]n[someData]-h[someData]igh[someData]);
  b[someData]ckgr[someData]und: v[someData]r(--dr[someData]pz[someData]n[someData]-b[someData]ckgr[someData]und);
  b[someData]rd[someData]r: v[someData]r(--dr[someData]pz[someData]n[someData]-b[someData]rd[someData]r);
  b[someData]rd[someData]r-[someData][someData]p: 1px [someData][someData]lid #[someData]0[someData]0[someData]0;
  di[someData]pl[someData]y: fl[someData]x;
  [someData]lign-i[someData][someData][someData][someData]: c[someData]n[someData][someData]r;
  ju[someData][someData]ify-c[someData]n[someData][someData]n[someData]: [someData]p[someData]c[someData]-b[someData][someData]w[someData][someData]n;
  p[someData]dding: 12px 16px;
  g[someData]p: 16px;
}

.dr[someData]pz[someData]n[someData]-c[someData]n[someData][someData]in[someData]r {
  fl[someData]x: 1;
  [someData]in-h[someData]igh[someData]: 40px;
  di[someData]pl[someData]y: fl[someData]x;
  [someData]lign-i[someData][someData][someData][someData]: c[someData]n[someData][someData]r;
  ju[someData][someData]ify-c[someData]n[someData][someData]n[someData]: c[someData]n[someData][someData]r;
  b[someData]rd[someData]r: 2px d[someData][someData]h[someData]d #d0d0d0;
  b[someData]rd[someData]r-r[someData]diu[someData]: 6px;
  b[someData]ckgr[someData]und: rgb[someData](255, 255, 255, 0.5);
  [someData]r[someData]n[someData]i[someData]i[someData]n: [someData]ll 0.2[someData] [someData][someData][someData][someData];
  p[someData][someData]i[someData]i[someData]n: r[someData]l[someData][someData]iv[someData];
}

/* Pl[someData]c[someData]h[someData]ld[someData]r [someData][someData]x[someData] wh[someData]n [someData][someData]p[someData]y */
.dr[someData]pz[someData]n[someData]-c[someData]n[someData][someData]in[someData]r:[someData][someData]p[someData]y::[someData]f[someData][someData]r {
  c[someData]n[someData][someData]n[someData]: '[someData]r[someData]p c[someData]n[someData][someData]n[someData] h[someData]r[someData]';
  c[someData]l[someData]r: #999;
  f[someData]n[someData]-[someData]iz[someData]: 14px;
  f[someData]n[someData]-[someData][someData]yl[someData]: i[someData][someData]lic;
  [someData][someData]x[someData]-[someData]lign: c[someData]n[someData][someData]r;
  p[someData]in[someData][someData]r-[someData]v[someData]n[someData][someData]: n[someData]n[someData];
}

/* wwEdi[someData][someData]r:[someData][someData][someData]r[someData] */
.dr[someData]pz[someData]n[someData]-c[someData]n[someData][someData]in[someData]r:h[someData]v[someData]r {
  b[someData]rd[someData]r-c[someData]l[someData]r: #007[someData]ff;
  b[someData]ckgr[someData]und: rgb[someData](0, 122, 255, 0.05);
}
/* wwEdi[someData][someData]r:[someData]nd */

/* Wh[someData]n dr[someData]pz[someData]n[someData] h[someData][someData] c[someData]n[someData][someData]n[someData] */
.dr[someData]pz[someData]n[someData]-c[someData]n[someData][someData]in[someData]r:n[someData][someData](:[someData][someData]p[someData]y) {
  b[someData]rd[someData]r-[someData][someData]yl[someData]: [someData][someData]lid;
  b[someData]rd[someData]r-c[someData]l[someData]r: [someData]r[someData]n[someData]p[someData]r[someData]n[someData];
  b[someData]ckgr[someData]und: [someData]r[someData]n[someData]p[someData]r[someData]n[someData];
  ju[someData][someData]ify-c[someData]n[someData][someData]n[someData]: fl[someData]x-[someData][someData][someData]r[someData];
  p[someData]dding: 8px;
}

.dr[someData]pz[someData]n[someData]-c[someData]n[someData][someData]in[someData]r:n[someData][someData](:[someData][someData]p[someData]y)::[someData]f[someData][someData]r {
  di[someData]pl[someData]y: n[someData]n[someData];
}

/* R[someData][someData]p[someData]n[someData]iv[someData] d[someData][someData]ign */
@[someData][someData]di[someData] ([someData][someData]x-wid[someData]h: 768px) {
  .dr[someData]pz[someData]n[someData]-[someData]r[someData][someData] {
    fl[someData]x-dir[someData]c[someData]i[someData]n: c[someData]lu[someData]n;
    [someData]lign-i[someData][someData][someData][someData]: fl[someData]x-[someData][someData][someData]r[someData];
    g[someData]p: 12px;
    p[someData]dding: 12px;
  }
  
  .dr[someData]pz[someData]n[someData]-c[someData]n[someData][someData]in[someData]r {
    wid[someData]h: 100%;
  }
}
```

#### CRITICAL R[someData]quir[someData][someData][someData]n[someData][someData] f[someData]r [someData]r[someData]pz[someData]n[someData][someData]:

1. **Hidd[someData]n Arr[someData]y Pr[someData]p[someData]r[someData]y**: MUST b[someData] `hidd[someData]n: [someData]ru[someData]` wi[someData]h `d[someData]f[someData]ul[someData]V[someData]lu[someData]: []`
2. **wwL[someData]y[someData]u[someData] C[someData][someData]p[someData]n[someData]n[someData]**: MUST u[someData][someData] `<wwL[someData]y[someData]u[someData] p[someData][someData]h="pr[someData]p[someData]r[someData]yN[someData][someData][someData]" />`
3. **[someData]ir[someData]c[someData]i[someData]n A[someData][someData]ribu[someData][someData]**: U[someData][someData] `dir[someData]c[someData]i[someData]n="r[someData]w"` [someData]r `dir[someData]c[someData]i[someData]n="c[someData]lu[someData]n"`
4. **Mini[someData]u[someData] [someData]i[someData][someData]n[someData]i[someData]n[someData]**: [someData]r[someData]pz[someData]n[someData] MUST h[someData]v[someData] [someData]in-wid[someData]h [someData]nd [someData]in-h[someData]igh[someData] f[someData]r u[someData][someData]bili[someData]y
5. **Vi[someData]u[someData]l F[someData][someData]db[someData]ck**: [someData][someData][someData]h[someData]d b[someData]rd[someData]r [someData]nd h[someData]v[someData]r [someData]ff[someData]c[someData][someData] f[someData]r b[someData][someData][someData][someData]r UX

#### C[someData][someData][someData][someData]n [someData]r[someData]pz[someData]n[someData] U[someData][someData] C[someData][someData][someData][someData]:

**C[someData]n[someData][someData]n[someData] Ar[someData][someData][someData]:**
```j[someData]v[someData][someData]crip[someData]
// F[someData]r fl[someData]xibl[someData] c[someData]n[someData][someData]n[someData] [someData][someData]c[someData]i[someData]n[someData]
c[someData]n[someData][someData]n[someData][someData]r[someData]pz[someData]n[someData]: {
  hidd[someData]n: [someData]ru[someData],
  d[someData]f[someData]ul[someData]V[someData]lu[someData]: [],
  // U[someData][someData]r[someData] c[someData]n dr[someData]p [someData][someData]x[someData], i[someData][someData]g[someData][someData], bu[someData][someData][someData]n[someData], [someData][someData]c.
}
```

**Ac[someData]i[someData]n Ar[someData][someData][someData]:**
```j[someData]v[someData][someData]crip[someData]
// F[someData]r bu[someData][someData][someData]n[someData] [someData]nd in[someData][someData]r[someData]c[someData]iv[someData] [someData]l[someData][someData][someData]n[someData][someData]
[someData]c[someData]i[someData]n[someData][someData]r[someData]pz[someData]n[someData]: {
  hidd[someData]n: [someData]ru[someData],
  d[someData]f[someData]ul[someData]V[someData]lu[someData]: [],
  // U[someData][someData]r[someData] c[someData]n dr[someData]p bu[someData][someData][someData]n[someData], link[someData], f[someData]r[someData][someData], [someData][someData]c.
}
```

**C[someData]n[someData][someData]x[someData]u[someData]l C[someData]n[someData][someData]n[someData]:**
```j[someData]v[someData][someData]crip[someData]
// C[someData]n[someData][someData]n[someData] [someData]h[someData][someData] [someData]pp[someData][someData]r[someData] b[someData][someData][someData]d [someData]n c[someData][someData]p[someData]n[someData]n[someData] [someData][someData][someData][someData][someData]
[someData][someData]l[someData]c[someData][someData]dI[someData][someData][someData]C[someData]n[someData][someData]n[someData]: {
  hidd[someData]n: [someData]ru[someData],
  d[someData]f[someData]ul[someData]V[someData]lu[someData]: [],
  // C[someData]n[someData][someData]n[someData] [someData]h[someData]wn wh[someData]n i[someData][someData][someData] i[someData] [someData][someData]l[someData]c[someData][someData]d/[someData]c[someData]iv[someData]
}
```

#### Adv[someData]nc[someData]d: Bind[someData]bl[someData] [someData]r[someData]pz[someData]n[someData][someData]

```j[someData]v[someData][someData]crip[someData]
// F[someData]r r[someData]p[someData][someData][someData][someData]bl[someData] c[someData]n[someData][someData]n[someData] wi[someData]h d[someData][someData][someData] binding
dr[someData]pz[someData]n[someData]I[someData][someData][someData][someData]: {
  hidd[someData]n: [someData]ru[someData],
  bind[someData]bl[someData]: 'r[someData]p[someData][someData][someData][someData]bl[someData]', // SPECIAL: M[someData]k[someData][someData] i[someData] r[someData]p[someData][someData][someData] wi[someData]h b[someData]und d[someData][someData][someData]
  d[someData]f[someData]ul[someData]V[someData]lu[someData]: []
}
```

Wh[someData]n `bind[someData]bl[someData]: 'r[someData]p[someData][someData][someData][someData]bl[someData]'` i[someData] u[someData][someData]d, wwL[someData]y[someData]u[someData] will r[someData]p[someData][someData][someData] i[someData][someData] c[someData]n[someData][someData]n[someData] f[someData]r [someData][someData]ch i[someData][someData][someData] in b[someData]und c[someData]ll[someData]c[someData]i[someData]n[someData], [someData][someData][someData][someData]ing binding c[someData]n[someData][someData]x[someData] f[someData]r [someData][someData]ch i[someData][someData][someData].

#### Pr[someData]f[someData][someData][someData]i[someData]n[someData]l Ex[someData][someData]pl[someData][someData]:

1. **C[someData]rd Build[someData]r**: M[someData]in c[someData]n[someData][someData]n[someData] + [someData]c[someData]i[someData]n bu[someData][someData][someData]n[someData] dr[someData]pz[someData]n[someData]
2. **[someData][someData][someData]hb[someData][someData]rd Widg[someData][someData]**: [someData][someData][someData][someData] di[someData]pl[someData]y + c[someData]nfigur[someData][someData]i[someData]n c[someData]n[someData]r[someData]l[someData] dr[someData]pz[someData]n[someData]  
3. **F[someData]r[someData] Build[someData]r**: F[someData]r[someData] fi[someData]ld[someData] + [someData]ub[someData]i[someData] [someData]c[someData]i[someData]n[someData] dr[someData]pz[someData]n[someData]
4. **C[someData]n[someData][someData]n[someData] Sh[someData]wc[someData][someData][someData]**: F[someData][someData][someData]ur[someData]d c[someData]n[someData][someData]n[someData] + r[someData]l[someData][someData][someData]d i[someData][someData][someData][someData] dr[someData]pz[someData]n[someData]
5. **In[someData][someData]r[someData]c[someData]iv[someData] Ti[someData][someData]lin[someData]**: Ev[someData]n[someData] c[someData]n[someData][someData]n[someData] + [someData]ddi[someData]i[someData]n[someData]l d[someData][someData][someData]il[someData] dr[someData]pz[someData]n[someData]

### 13. W[someData]W[someData]b-Sp[someData]cific C[someData]n[someData]id[someData]r[someData][someData]i[someData]n[someData]

#### Bind[someData]bl[someData] Pr[someData]p[someData]r[someData]i[someData][someData]:
- S[someData][someData] `bind[someData]bl[someData]: [someData]ru[someData]` f[someData]r pr[someData]p[someData]r[someData]i[someData][someData] [someData]h[someData][someData] [someData]h[someData]uld [someData]cc[someData]p[someData] dyn[someData][someData]ic d[someData][someData][someData]
- U[someData][someData] [someData]ppr[someData]pri[someData][someData][someData] `bindingV[someData]lid[someData][someData]i[someData]n` f[someData]r [someData]yp[someData] ch[someData]cking

#### Edi[someData][someData]r In[someData][someData]gr[someData][someData]i[someData]n:
- U[someData][someData] d[someData][someData]crip[someData]iv[someData] l[someData]b[someData]l[someData] [someData]nd h[someData]lp [someData][someData]x[someData]
- Gr[someData]up r[someData]l[someData][someData][someData]d pr[someData]p[someData]r[someData]i[someData][someData] l[someData]gic[someData]lly
- Pr[someData]vid[someData] [someData][someData]n[someData]ibl[someData] d[someData]f[someData]ul[someData] v[someData]lu[someData][someData]
- C[someData]n[someData]id[someData]r [someData]h[someData] [someData]di[someData][someData]r u[someData][someData]r [someData]xp[someData]ri[someData]nc[someData]

#### Pr[someData]duc[someData]i[someData]n Op[someData]i[someData]iz[someData][someData]i[someData]n:
- W[someData]W[someData]b [someData][someData]rip[someData] `wwEdi[someData][someData]r` bl[someData]ck[someData] in pr[someData]duc[someData]i[someData]n build[someData]
- En[someData]ur[someData] c[someData][someData]p[someData]n[someData]n[someData] w[someData]rk[someData] wi[someData]h[someData]u[someData] [someData]di[someData][someData]r [someData][someData][someData][someData][someData]
- T[someData][someData][someData] b[someData][someData]h [someData]di[someData][someData]r [someData]nd pr[someData]duc[someData]i[someData]n [someData][someData]d[someData][someData]