Files
Ivan Starkov 42af921093 feat: Add head component (#4751)
## Description

Allows Head component

Hidden under `headSlotComponent` flag

Vercel fixture now have a HTMLRewriter example. Improves development.

## Todo In Next PR
- Head Title support
- Icons
- Allow reset `as` field

- [x] - BG is now white always
- [x] - It's shown as fixed element to not break layout 


##  Implementation details

This component has more priority above PageSettings meta tags
e.g. If some tag exists in PageSettings and in HeadSlot the HeadSlot
wins

## Steps for reproduction

Create HeadSlot

<img width="674" alt="image"
src="https://github.com/user-attachments/assets/b41f878e-b8fd-48b4-9204-5f079dc1719b"
/>

- [x] - Visit
https://webstudio-fixture-project-a-0su3o.wstd.work/head-tag
check server response.

<img width="433" alt="image"
src="https://github.com/user-attachments/assets/efb7de0d-c23e-4b0d-b775-170e6b61648e"
/>

See `og:title` is not duplicated.

- [x] - Check Elements Panel

<img width="565" alt="image"
src="https://github.com/user-attachments/assets/5742c3a8-47b1-4877-9b01-528eb3afffe5"
/>

See no duplicated. All tags exists.


- [x] - Click Home. 
See no meta tags are in Elements panel from `/head-tag` page

- [x] - Click back button

<img width="555" alt="image"
src="https://github.com/user-attachments/assets/2b166249-5fd0-4d0f-a451-ff3c1b4e62b5"
/>

See all meta is rendered and is not duplicated. 



## Code Review

- [ ] hi @kof, I need you to do
  - conceptual review (architecture, feature-correctness)
  - detailed review (read every line)
  - test it on preview

## Before requesting a review

- [ ] made a self-review
- [ ] added inline comments where things may be not obvious (the "why",
not "what")

## Before merging

- [ ] tested locally and on preview environment (preview dev login:
0000)
- [ ] updated [test
cases](https://github.com/webstudio-is/webstudio/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file
2025-01-18 21:34:00 +03:00

6 lines
198 B
TypeScript

import type { Hook } from "@webstudio-is/react-sdk";
import { hooksSelect } from "./select";
import { hooksHeadSlot } from "./head-slot";
export const hooks: Hook[] = [hooksSelect, hooksHeadSlot];