feat: tamagui first commit

README.md

@@ -12,6 +12,7 @@
 
 | Package | Description | Version | Dependencies |
 |---------|-------------|---------|--------------|
+| 📦 [`@rocket.chat/fuselage-core`](/packages/core) |  | [![npm](https://img.shields.io/npm/v/@rocket.chat/fuselage-core?style=flat-square)](https://www.npmjs.com/package/@rocket.chat/fuselage-core) | ![deps](https://img.shields.io/librariesio/release/npm/@rocket.chat/fuselage-core?style=flat-square) |
 | 📦 [`@rocket.chat/css-in-js`](/packages/css-in-js) | Toolset to transpile and use CSS on runtime | [![npm](https://img.shields.io/npm/v/@rocket.chat/css-in-js?style=flat-square)](https://www.npmjs.com/package/@rocket.chat/css-in-js) | ![deps](https://img.shields.io/librariesio/release/npm/@rocket.chat/css-in-js?style=flat-square) |
 | 📦 [`@rocket.chat/css-supports`](/packages/css-supports) | Memoized and SSR-compatible facade of CSS.supports API | [![npm](https://img.shields.io/npm/v/@rocket.chat/css-supports?style=flat-square)](https://www.npmjs.com/package/@rocket.chat/css-supports) | ![deps](https://img.shields.io/librariesio/release/npm/@rocket.chat/css-supports?style=flat-square) |
 | 📦 [`@rocket.chat/emitter`](/packages/emitter) | Event Emitter by Rocket.Chat | [![npm](https://img.shields.io/npm/v/@rocket.chat/emitter?style=flat-square)](https://www.npmjs.com/package/@rocket.chat/emitter) | ![deps](https://img.shields.io/librariesio/release/npm/@rocket.chat/emitter?style=flat-square) |

package.json

@@ -5,6 +5,14 @@
     "packages/*",
     "tools/*"
   ],
+  "resolutions": {
+    "tamagui": "1.142.0",
+    "@tamagui/core": "1.142.0",
+    "@tamagui/web": "1.142.0",
+    "@tamagui/static": "1.142.0",
+    "tamagui-loader": "1.142.0",
+    "@tamagui/create-theme": "1.142.0"
+  },
   "scripts": {
     "build": "yarn turbo run build",
     "build-storybook": "yarn turbo run build-storybook --cache-dir=\".turbo\"",

packages/core/.gitignore

@@ -0,0 +1,4 @@
+/dist/
+/storybook-static/
+/bundle-report*.html
+/coverage/

packages/core/README.md

@@ -0,0 +1,59 @@
+<!--header-->
+
+<p align="center">
+  <a href="https://rocket.chat" title="Rocket.Chat">
+    <img src="https://github.com/RocketChat/Rocket.Chat.Artwork/raw/master/Logos/2020/png/logo-horizontal-red.png" alt="Rocket.Chat" />
+  </a>
+</p>
+
+# `@rocket.chat/fuselage-core`
+
+---
+
+[![npm@latest](https://img.shields.io/npm/v/@rocket.chat/fuselage-core/latest?style=flat-square)](https://www.npmjs.com/package/@rocket.chat/fuselage-core/v/latest) [![npm@next](https://img.shields.io/npm/v/@rocket.chat/fuselage-core/next?style=flat-square)](https://www.npmjs.com/package/@rocket.chat/fuselage-core/v/next) ![npm downloads](https://img.shields.io/npm/dw/@rocket.chat/fuselage-core?style=flat-square) ![License: undefined](https://img.shields.io/npm/l/@rocket.chat/fuselage-core?style=flat-square)
+
+![deps](https://img.shields.io/librariesio/release/npm/@rocket.chat/fuselage-core?style=flat-square) ![npm bundle size](https://img.shields.io/bundlephobia/min/@rocket.chat/fuselage-core?style=flat-square)
+
+<!--/header-->
+
+## Install
+
+<!--install-->
+
+Add `@rocket.chat/fuselage-core` as a dependency:
+
+```sh
+npm i @rocket.chat/fuselage-core
+
+# or, if you are using yarn:
+
+yarn add @rocket.chat/fuselage-core
+```
+
+<!--/install-->
+
+## Contributing
+
+<!--contributing(msg)-->
+
+Contributions, issues, and feature requests are welcome!<br />
+Feel free to check the [issues](https://github.com/RocketChat/fuselage/issues).
+
+<!--/contributing(msg)-->
+
+### Building
+
+As this package dependends on others in this monorepo, before anything run the following at the root directory:
+
+<!--yarn(build)-->
+
+```sh
+yarn build
+```
+
+<!--/yarn(build)-->
+
+
+
+
+

packages/core/package.json

@@ -0,0 +1,36 @@
+{
+  "name": "@rocket.chat/fuselage-core",
+  "version": "2.0.0",
+  "sideEffects": [
+    "*.css"
+  ],
+  "private": true,
+  "main": "src/index.tsx",
+  "module:jsx": "src",
+  "files": [
+    "types",
+    "dist"
+  ],
+  "scripts": {
+    "build": "tamagui-build",
+    "watch": "tamagui-build --watch",
+    "clean": "rm -rf dist types node_modules .turbo"
+  },
+  "dependencies": {
+    "@rocket.chat/fuselage-tokens": "workspace:~",
+    "@shopify/flash-list": "^1.6.3",
+    "@supabase/supabase-js": "^2.38.4",
+    "@tamagui/animations-react-native": "1.142.0",
+    "@tamagui/font-inter": "1.142.0",
+    "@tamagui/react-native-media-driver": "1.142.0",
+    "@tamagui/shorthands": "1.142.0",
+    "@tamagui/themes": "1.142.0",
+    "@tamagui/toast": "1.142.0",
+    "@tanstack/react-virtual": "3.0.0-beta.68",
+    "jotai": "^2.5.1",
+    "tamagui": "~1.142.0"
+  },
+  "devDependencies": {
+    "@tamagui/build": "1.142.0"
+  }
+}

packages/core/src/Button.tsx

@@ -0,0 +1,80 @@
+import {
+  SizeTokens,
+  createStyledContext,
+  styled,
+  withStaticProperties,
+} from '@tamagui/web'
+
+
+import { Focusable } from './Focusable'
+import { SizableText } from './SizableText'
+import React from 'react'
+
+
+export const ButtonContext = createStyledContext({
+  size: '$lg' as SizeTokens,
+  small: false,
+  fontScale: '$hero',
+})
+
+export const ButtonFrame = styled(Focusable, {
+
+  tag: 'button',
+
+  name: 'Button',
+
+  context: ButtonContext,
+
+  alignItems: 'center',
+
+  borderRadius: '$default',
+
+  flexDirection: 'row',
+
+  variants: {
+
+    size: {
+
+      '...size': (name, { tokens }) => ({
+        paddingInline: name === '$sm' ? tokens.size['$sm'] : tokens.size['$lg'],
+        paddingBlock: name === '$sm' ? tokens.size['$sm'] : tokens.size['$md'],
+      })
+    }
+  }
+
+})
+
+export const ButtonText = styled(SizableText, {
+  name: 'ButtonText',
+  context: ButtonContext,
+  userSelect: 'none',
+  fontScale: '$p2m',
+  variants: {
+    small: {
+      true: {
+        fontScale: '$c2',
+      }
+    }
+  }
+})
+
+
+const ButtonComponent = ButtonFrame.styleable<{
+  small?: boolean
+}>(function Button(
+  {children, small, ...props},
+  ref
+) {
+  return <ButtonFrame {
+    ...props} ref={ref}>
+    <ButtonText small={small} >{children}</ButtonText>
+    </ButtonFrame>
+})
+
+
+export const Button = withStaticProperties(ButtonComponent, {
+
+  Props: ButtonContext.Provider,
+
+  Text: ButtonText,
+})