@ruby-native/vue 0.6.0

package/index.js

@@ -0,0 +1,109 @@
+import { defineComponent, h } from "vue"
+
+import("@inertiajs/vue3").then(m => { window.__inertiaRouter = m.router }).catch(() => {})
+
+export const NativeTabs = defineComponent({
+  name: "NativeTabs",
+  props: {
+    enabled: { type: Boolean, default: true }
+  },
+  render() {
+    if (!this.enabled) return null
+    return h("div", { "data-native-tabs": true, hidden: true })
+  }
+})
+
+export const NativePush = defineComponent({
+  name: "NativePush",
+  render() {
+    return h("div", { "data-native-push": true, hidden: true })
+  }
+})
+
+export const NativeForm = defineComponent({
+  name: "NativeForm",
+  render() {
+    return h("div", { "data-native-form": true, hidden: true })
+  }
+})
+
+export const NativeNavbar = defineComponent({
+  name: "NativeNavbar",
+  props: { title: { type: String, required: true } },
+  render() {
+    return h("div", { "data-native-navbar": this.title, hidden: true }, this.$slots.default?.())
+  }
+})
+
+export const NativeButton = defineComponent({
+  name: "NativeButton",
+  props: {
+    position: { type: String, default: "trailing" },
+    icon: String,
+    title: String,
+    href: String,
+    click: String,
+    selected: { type: Boolean, default: undefined }
+  },
+  render() {
+    const attrs = { "data-native-button": true }
+    if (this.icon) attrs["data-native-icon"] = this.icon
+    if (this.title) attrs["data-native-title"] = this.title
+    if (this.href) attrs["data-native-href"] = this.href
+    if (this.click) attrs["data-native-click"] = this.click
+    if (this.position) attrs["data-native-position"] = this.position
+    if (this.selected) attrs["data-native-selected"] = ""
+    return h("div", attrs, this.$slots.default?.())
+  }
+})
+
+export const NativeMenuItem = defineComponent({
+  name: "NativeMenuItem",
+  props: {
+    title: String,
+    href: String,
+    click: String,
+    icon: String,
+    selected: { type: Boolean, default: undefined }
+  },
+  render() {
+    const attrs = { "data-native-menu-item": true }
+    if (this.title) attrs["data-native-title"] = this.title
+    if (this.href) attrs["data-native-href"] = this.href
+    if (this.click) attrs["data-native-click"] = this.click
+    if (this.icon) attrs["data-native-icon"] = this.icon
+    if (this.selected) attrs["data-native-selected"] = ""
+    return h("div", attrs)
+  }
+})
+
+export const NativeOverscroll = defineComponent({
+  name: "NativeOverscroll",
+  props: {
+    top: { type: String, required: true },
+    bottom: String
+  },
+  render() {
+    return h("div", {
+      "data-native-overscroll-top": this.top,
+      "data-native-overscroll-bottom": this.bottom || this.top,
+      hidden: true
+    })
+  }
+})
+
+export const NativeSubmitButton = defineComponent({
+  name: "NativeSubmitButton",
+  props: {
+    title: { type: String, default: "Save" },
+    click: { type: String, default: "[type='submit']" }
+  },
+  render() {
+    return h("div", {
+      "data-native-submit-button": true,
+      "data-native-title": this.title,
+      "data-native-click": this.click,
+      hidden: true
+    })
+  }
+})

package/package.json

@@ -0,0 +1,21 @@
+{
+  "name": "@ruby-native/vue",
+  "version": "0.6.0",
+  "description": "Vue components for Ruby Native",
+  "main": "index.js",
+  "files": ["index.js"],
+  "peerDependencies": {
+    "vue": ">=3",
+    "@inertiajs/vue3": ">=2"
+  },
+  "peerDependenciesMeta": {
+    "@inertiajs/vue3": { "optional": true }
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/ruby-native/gem.git",
+    "directory": "packages/vue"
+  },
+  "homepage": "https://rubynative.com",
+  "license": "MIT"
+}