2c:null 2d:["$","title",null,{"children":"Hello, Twind v1-beta! | Benjamin | Observable"}] 32:[] 30:{"id":"5b89fe46156a711a","slug":"hello-twind-v1-beta","title":"Hello, Twind v1-beta!","thumbnail":"9dcaefb2c9201681c331ed2cf090ba9c477fd786ce29396dd6deb97fe609006b","access_level":"public","create_time":"$D2022-02-18T02:01:05.538Z","update_time":"$D2022-05-07T11:27:47.340Z","view_time":null,"first_public_time":"$D2022-02-18T12:48:04.462Z","has_unpublished_edits":null,"fork":false,"stars":4,"starred":false,"owner":{"type":"team","id":"8a1645a08dfd342c","login":"hastebrot","name":"Benjamin","avatar_url":"https://avatars-next.observableusercontent.com/0b9afaf0bc47ae18ca1173624214fe43ca87fad77cea4fb734a8b0e1b8cfe919","tier":"starter_2024"},"version":768,"publish_version":768,"role":null,"authored":false,"authors":[{"type":"individual","id":"ca28e2692a714a78","login":"hastebrot","name":"Benjamin","avatar_url":"https://avatars-next.observableusercontent.com/0b9afaf0bc47ae18ca1173624214fe43ca87fad77cea4fb734a8b0e1b8cfe919","tier":null}],"members":[{"type":"individual","id":"ca28e2692a714a78","login":"hastebrot","name":"Benjamin","avatar_url":"https://avatars-next.observableusercontent.com/0b9afaf0bc47ae18ca1173624214fe43ca87fad77cea4fb734a8b0e1b8cfe919","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":{"id":"65facdd38a36dadd","slug":"twind","title":"Twind","owner":{"id":"8a1645a08dfd342c","login":"hastebrot","name":"Benjamin"}},"type":"notebook","body":{"titling":"auto","title":"Hello, Twind v1-beta!","cells":[{"id":0,"value":"# Hello, Twind v1-beta!","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":510,"value":"md`\n[Twind](https://twind.dev/) is small compiler that turns [Tailwind](https://tailwindcss.com/) short hand into CSS rules at run, build or serve time. If you have used Tailwind and/or a CSS-in-JS solution before then most of the API will feel very familiar.\n\n### Usage\n\n~~~js\nimport { Twind, tw } from \"@hastebrot/hello-twind-v1-beta\"\n~~~\n\n### References\n\n- Repository: https://github.com/tw-in-js/twind/tree/next\n- \\`twind@next\\`: https://github.com/tw-in-js/twind/tree/next/packages/twind\n- \\`@twind/preset-tailwind@next\\`: https://github.com/tw-in-js/twind/tree/next/packages/preset-tailwind\n\n---\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":76,"value":"html`\n

\n Hello Twind!\n

\n \n \n

Garlic bread with cheese: What the science tells us

\n For years parents have espoused the health benefits of eating garlic bread with cheese to their\n children, with the food earning such an iconic status in our culture that kids will often dress\n up as warm, cheesy loaf for Halloween.\n

\n But a recent study shows that the celebrated appetizer may be linked to a series of rabies cases\n springing up around the country.\n

\n`","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":682,"value":"---","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":669,"value":"sheetContents = {\n const options = {}\n const sheet = Twind.virtual()\n const twindSetup = (...args) => Twind.observe(Twind.twind(...args))\n setup(options, sheet, twindSetup)\n\n //const _sheet = Twind.getSheet()\n const sheetContents = Twind.stringify(sheet.target)\n return html`

${sheetContents}

`\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":122,"value":"md`---`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":24,"value":"tw = {\n const options = {}\n const sheet = Twind.getSheet()\n invalidation.then(() => sheet.destroy())\n return setup(options, sheet)\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":580,"value":"setup = (options = {}, sheet = undefined, twindSetup = Twind.setup) => {\n return twindSetup({\n presets: defaultPresets,\n hash: defaultCellOptions.hash,\n ...options,\n }, sheet)\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":493,"value":"defaultPresets = [\n Twind.presetAutoprefix(),\n apply(\n Twind.presetTailwind({\n disablePreflight: false,\n }),\n preset => ({\n ...preset,\n preflight: defaultCellOptions.preflight(preset.preflight),\n }),\n ),\n Twind.presetTailwindForms({\n strategy: \"class\",\n }),\n Twind.presetTypography({}),\n]","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":391,"value":"defaultCellOptions = ({\n // Twind.setup({ hash })\n hash: true,\n\n // Twind.presetTailwind().preflight\n preflight: preflight => {\n return {\n \"[class*='#']\": {\n ...preflight.body, \n ...preflight.html, \n ...preflight[\"*,::before,::after\"],\n margin: \"0\", \n padding: \"0\",\n \"&::before,&::after\": preflight[\"*,::before,::after\"],\n },\n }\n },\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":101,"value":"Twind = ({\n ...twindCore,\n presetAutoprefix: twindPresetAutoprefix.default,\n presetTailwind: twindPresetTailwind.default,\n presetTailwindForms: twindPresetTailwindForms.default,\n presetTypography: twindPresetTypography.default,\n})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":595,"value":"apply = (value, block) => block(value)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":401,"value":"md`---`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":450,"value":"twindVersion = \"1.0.0-next.37\" // https://cdn.skypack.dev/twind@next","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":48,"value":"twindCore = import(`https://cdn.skypack.dev/twind@${twindVersion}`)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":147,"value":"twindPresetAutoprefix = import(`https://cdn.skypack.dev/@twind/preset-autoprefix@${twindVersion}`)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":46,"value":"twindPresetTailwind = import(`https://cdn.skypack.dev/@twind/preset-tailwind@${twindVersion}`)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":96,"value":"twindPresetTailwindForms = import(`https://cdn.skypack.dev/@twind/preset-tailwind-forms@${twindVersion}`)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":130,"value":"twindPresetTypography = import(`https://cdn.skypack.dev/@twind/preset-typography@${twindVersion}`)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W32","stdlib":"1"}} 31:"$30:body"