@spark-ui/tailwind-plugins 3.5.0 → 3.7.0

package/CHANGELOG.md

@@ -3,6 +3,19 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [3.7.0](https://github.com/adevinta/spark/compare/@spark-ui/tailwind-plugins@3.6.0...@spark-ui/tailwind-plugins@3.7.0) (2024-04-12)
+
+### Features
+
+- **snackbar:** add left gesture to close ([5a0fe20](https://github.com/adevinta/spark/commit/5a0fe200b8dd632b4c6f6c0319f44bc2e5183564))
+- **snackbar:** improve swipe hook and updating styles ([1addc58](https://github.com/adevinta/spark/commit/1addc584567523c149ebfc3dc863e2996f3a028b))
+
+# [3.6.0](https://github.com/adevinta/spark/compare/@spark-ui/tailwind-plugins@3.5.0...@spark-ui/tailwind-plugins@3.6.0) (2024-01-04)
+
+### Features
+
+- **tailwind-plugins:** export TCV utils ([6fba6dc](https://github.com/adevinta/spark/commit/6fba6dc08a18f0f1c0773464494a5aba331dd572))
+
 # [3.5.0](https://github.com/adevinta/spark/compare/@spark-ui/tailwind-plugins@3.4.2...@spark-ui/tailwind-plugins@3.5.0) (2024-01-03)
 
 ### Features

package/animations/index.js

@@ -163,6 +163,14 @@ module.exports = plugin.withOptions(
             '0%': { transform: 'translateX(0)' },
             '100%': { transform: 'translateX(-100%)' },
           },
+          swipeOutRight: {
+            '0%': { transform: 'translateX(var(--swipe-position-x))' },
+            '100%': { transform: 'translateX(100vw)' },
+          },
+          swipeOutLeft: {
+            '0%': { transform: 'translateX(var(--swipe-position-x))' },
+            '100%': { transform: 'translateX(-100vw)' },
+          },
           standaloneIndeterminateBar: {
             '0%': {
               left: '0',
@@ -197,6 +205,9 @@ module.exports = plugin.withOptions(
           'slide-out-left': 'slideOutLeft 0.4s cubic-bezier(0.05, 0.7, 0.1, 1)',
           'standalone-indeterminate-bar':
             'standaloneIndeterminateBar 1s ease-out infinite normal none running',
+          // swipeOut
+          'swipe-out-right': 'swipeOutRight 0.1s ease-out',
+          'swipe-out-left': 'swipeOutLeft 0.1s ease-out',
         },
       },
     },

package/index.js

@@ -4,7 +4,8 @@ const sizings = require('./sizings')
 const utilities = require('./utilities')
 const variants = require('./variants')
 const sparkTheme = require('./spark-theme')
-const tailwindConfigViewerMisc = require('./tailwind.config.viewer.misc')
+const tailwindConfigViewerUtils = require('./tailwind-config-viewer')
+const tailwindConfigViewerMisc = require('./tailwind-config-viewer/misc')
 const tailwindcssRadix = require('tailwindcss-radix')
 
 /**
@@ -37,5 +38,6 @@ module.exports = {
   variants,
   sparkTheme,
   sparkConfig,
+  tailwindConfigViewerUtils,
   tailwindConfigViewerMisc,
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@spark-ui/tailwind-plugins",
-  "version": "3.5.0",
+  "version": "3.7.0",
   "description": "Spark Tailwind plugins",
   "publishConfig": {
     "access": "public"
@@ -35,5 +35,5 @@
   },
   "homepage": "https://sparkui.vercel.app",
   "license": "MIT",
-  "gitHead": "d408a2ca70c66ed2b69b7f7bc028f471df99313c"
+  "gitHead": "0f4337672a59af327db0c62e0efbd14545bf4003"
 }

package/tailwind-config-viewer/index.js

@@ -0,0 +1,48 @@
+const utils = {
+  isObject(value) {
+    return !!value && value.constructor === Object
+  },
+  isStringOrNumber(value) {
+    return typeof value === 'string' || typeof value === 'number'
+  },
+  toKebabCase(value) {
+    if (value.toUpperCase() === value) return value.toLowerCase()
+
+    return value.replace(/[A-Z0-9]/g, e => `-${e.toLocaleLowerCase()}`)
+  },
+  doubleHyphensRegex: /(?<!var\()--+/g,
+}
+
+function toTailwindConfigViewer(defaultTheme) {
+  const result = {}
+
+  function flatten(theme, paths = []) {
+    Object.entries(theme).forEach(([key, value]) => {
+      if (utils.isObject(value)) return flatten(value, paths.concat(key))
+
+      if (utils.isStringOrNumber(value)) {
+        if (paths.includes('colors')) {
+          result[
+            `rgb(var(--${[...paths, key]
+              .map(utils.toKebabCase)
+              .join('-')
+              .replace(utils.doubleHyphensRegex, '-')}) / <alpha-value>)`
+          ] = value
+        }
+
+        result[
+          `var(--${[...paths, key]
+            .map(utils.toKebabCase)
+            .join('-')
+            .replace(utils.doubleHyphensRegex, '-')})`
+        ] = value
+      }
+    })
+  }
+
+  flatten(defaultTheme)
+
+  return result
+}
+
+module.exports = { toTailwindConfigViewer }