slack-blocks-to-jsx 0.0.4 → 0.0.5

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # slack-blocks-to-jsx
 
+## 0.0.5
+
+### Patch Changes
+
+- 87a3113: Setup tailwindcss n add build script for it
+
 ## 0.0.4
 
 ### Patch Changes

package/dist/global.css

@@ -0,0 +1,2 @@
+@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700&display=swap");
+/*! tailwindcss v3.3.3 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;font-feature-settings:normal;font-variation-settings:normal}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:initial}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;background-color:initial;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:initial}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}*,::backdrop,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:#3b82f680;--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.pointer-events-none{pointer-events:none}.visible{visibility:visible}.absolute{position:absolute}.relative{position:relative}.-left-3{left:-.75rem}.right-1{right:.25rem}.top-1\/2{top:50%}.top-\[24px\]{top:24px}.z-10{z-index:10}.z-20{z-index:20}.my-1{margin-top:.25rem;margin-bottom:.25rem}.my-2{margin-top:.5rem;margin-bottom:.5rem}.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}.ml-1{margin-left:.25rem}.ml-2{margin-left:.5rem}.mr-2{margin-right:.5rem}.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.block{display:block}.flex{display:flex}.grid{display:grid}.h-3{height:.75rem}.h-5{height:1.25rem}.h-7{height:1.75rem}.h-9{height:2.25rem}.h-\[14px\]{height:14px}.h-\[15px\]{height:15px}.h-\[25\.25px\]{height:25.25px}.h-\[28px\]{height:28px}.h-\[88px\]{height:88px}.h-full{height:100%}.max-h-\[240px\]{max-height:240px}.min-h-\[28px\]{min-height:28px}.w-3{width:.75rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-9{width:2.25rem}.w-\[15px\]{width:15px}.w-\[190px\]{width:190px}.w-\[25\.31px\]{width:25.31px}.w-\[322px\]{width:322px}.w-\[88px\]{width:88px}.w-full{width:100%}.min-w-\[56px\]{min-width:56px}.max-w-\[322px\]{max-width:322px}.max-w-\[600px\]{max-width:600px}.max-w-max{max-width:-moz-max-content;max-width:max-content}.shrink-0{flex-shrink:0}.grow{flex-grow:1}.-translate-y-1\/2{--tw-translate-y:-50%}.-translate-y-1\/2,.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.cursor-pointer{cursor:pointer}.select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.gap-\[5px\]{gap:5px}.overflow-auto{overflow:auto}.overflow-hidden,.truncate{overflow:hidden}.truncate{text-overflow:ellipsis}.truncate,.whitespace-nowrap{white-space:nowrap}.break-words{overflow-wrap:break-word}.rounded{border-radius:.25rem}.rounded-\[2px\]{border-radius:2px}.rounded-\[6px\]{border-radius:6px}.rounded-\[8px\]{border-radius:8px}.rounded-md{border-radius:.375rem}.border{border-width:1px}.border-b{border-bottom-width:1px}.border-solid{border-style:solid}.border-black-primary{--tw-border-opacity:1;border-color:rgb(29 28 29/var(--tw-border-opacity))}.border-black-primary\.3{border-color:#1d1c1d4d}.border-gray-primary{--tw-border-opacity:1;border-color:rgb(221 221 221/var(--tw-border-opacity))}.border-green-primary{--tw-border-opacity:1;border-color:rgb(0 122 90/var(--tw-border-opacity))}.border-green-primary\.3{border-color:#007a5a4d}.border-red-primary{--tw-border-opacity:1;border-color:rgb(224 30 90/var(--tw-border-opacity))}.border-red-primary\.3{border-color:#e01e5a4d}.bg-black-primary\/\[0\.13\]{background-color:#1d1c1d21}.bg-white-secondary{--tw-bg-opacity:1;background-color:rgb(248 248 248/var(--tw-bg-opacity))}.object-cover{-o-object-fit:cover;object-fit:cover}.px-2{padding-left:.5rem;padding-right:.5rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.px-\[3px\]{padding-left:3px;padding-right:3px}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-\[1px\]{padding-top:1px}.pb-\[1px\],.py-\[1px\]{padding-bottom:1px}.pr-3{padding-right:.75rem}.pr-7{padding-right:1.75rem}.pt-0{padding-top:0}.text-\[10px\]{font-size:10px}.text-\[15px\],.text-base{font-size:15px}.text-base{line-height:1.46668}.text-small{font-size:13px;line-height:1.38461538}.text-xs{font-size:.75rem;line-height:1rem}.font-black{font-weight:900}.font-normal{font-weight:400}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.italic{font-style:italic}.leading-\[12\.5px\]{line-height:12.5px}.leading-\[17\.6px\]{line-height:17.6px}.text-black-primary{--tw-text-opacity:1;color:rgb(29 28 29/var(--tw-text-opacity))}.text-black-primary\.3{color:#1d1c1d4d}.text-black-primary\/\[0\.7\]{color:#1d1c1db3}.text-black-secondary{--tw-text-opacity:1;color:rgb(97 96 97/var(--tw-text-opacity))}.text-blue-primary{--tw-text-opacity:1;color:rgb(18 100 163/var(--tw-text-opacity))}.text-green-primary{--tw-text-opacity:1;color:rgb(0 122 90/var(--tw-text-opacity))}.text-red-primary{--tw-text-opacity:1;color:rgb(224 30 90/var(--tw-text-opacity))}.shadow-custom_shadow-1{--tw-shadow-color:#1d1c1d21 0px 0px 0px 1px,#0000001f 0px 5px 10px 0px;--tw-shadow:var(--tw-shadow-colored)}.outline{outline-style:solid}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.slack-message{font-family:Open Sans,sans-serif!important;white-space:pre-wrap!important}.slack-message code{white-space:pre-wrap;overflow-wrap:break-word;border-radius:3px;border-width:1px;border-color:#1d1c1d21;background-color:#1d1c1d0a;padding:.125rem 3px 1px;font-size:.75rem;line-height:1rem;line-height:18px;--tw-text-opacity:1;color:rgb(224 30 90/var(--tw-text-opacity))}.hover\:bg-blue-primary:hover{--tw-bg-opacity:1;background-color:rgb(18 100 163/var(--tw-bg-opacity))}.hover\:text-white-primary:hover{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity))}.focus\:outline-none:focus{outline:2px solid #0000;outline-offset:2px}

package/dist/index.css

@@ -0,0 +1,13 @@
+@import "https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700&display=swap";
+
+/* src/global.css */
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+.slack-message {
+  font-family: "Open Sans", sans-serif !important;
+  white-space: pre-wrap !important;
+}
+.slack-message code {
+  @apply text-xs leading-[18px] px-[3px] pt-0.5 pb-px whitespace-pre-wrap break-words text-red-primary rounded-[3px] border border-black-primary/[0.13] bg-black-primary/[0.04];
+}

package/package.json

@@ -11,7 +11,7 @@
   ],
   "repository": "https://github.com/themashcodee/slack-blocks-to-jsx.git",
   "license": "MIT",
-  "version": "0.0.4",
+  "version": "0.0.5",
   "main": "dist/index.js",
   "module": "dist/index.mjs",
   "types": "dist/index.d.ts",
@@ -35,8 +35,9 @@
     "typescript": "^5.2.2"
   },
   "scripts": {
-    "build": "tsup ./src/index.ts --format cjs,esm --dts",
+    "build": "tsup ./src/index.ts --format cjs,esm --dts && npm run build:tailwind",
     "release": "pnpm run build && changeset publish",
-    "lint": "tsc"
+    "lint": "tsc",
+    "build:tailwind": "npx tailwindcss -i ./src/global.css -o ./dist/global.css --minify"
   }
 }

package/tailwind.config.js

@@ -0,0 +1,48 @@
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+	content: [
+		"./src/**/*.{js,ts,jsx,tsx,mdx}",
+	],
+	theme: {
+		extend: {
+			colors: {
+				white: {
+					primary: "#ffffff",
+					"secondary": "#f8f8f8",
+				},
+				"custom_shadow": {
+					"1": "rgba(29, 28, 29, 0.13) 0px 0px 0px 1px, rgba(0, 0, 0, 0.12) 0px 5px 10px 0px",
+				},
+				black: {
+					primary: "rgb(29, 28, 29)",
+					"primary.3": "rgba(29, 28, 29, 0.3)",
+					secondary: "rgb(97, 96, 97)",
+				},
+				gray: {
+					primary: "rgb(221,221,221)",
+				},
+				red: {
+					primary: " rgb(224, 30, 90)",
+					"primary.3": "rgba(224, 30, 90, 0.3)",
+				},
+				blue: {
+					primary: "rgb(18,100,163)",
+				},
+				green: {
+					primary: "rgb(0, 122, 90)",
+					"primary.3": "rgba(0, 122, 90, 0.3)",
+				},
+			},
+			fontSize: {
+				"small": ["13px", "1.38461538"],
+				"base": ["15px", "1.46668"],
+			},
+			backgroundImage: {
+				"gradient-radial": "radial-gradient(var(--tw-gradient-stops))",
+				"gradient-conic":
+					"conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))",
+			},
+		},
+	},
+	plugins: [],
+}