tauri-controls

• update version for tauri v2 beta #23 (tauri-plugin-window is deprecated #22), thank you @sdvina
• switch default package manager from pnpm to bun

• Remove all Tauri dependencies from the list of dependecies. This will require the user to install these (which were already in the instructions), but allow for more control of a single version of these packages. #20, thanks to @jbolda

• fix: compatibility with the latest Tauri release #14, thanks to @flerouwu
  • tauri v2.0.0-alpha.14

• fix(react,solid): Temporarily disable isWindowMaximized on macOS #10 @allenli178, https://github.com/tauri-apps/tauri/issues/5812 - https://github.com/agmmnn/tauri-controls/commit/532b9a5527a244f98c039088d4ecfff9759f80a9
• feat: gnome more accurate button spacing and fix icons sizes(svelte, vue) - https://github.com/agmmnn/tauri-controls/commit/b47e0f164bd0b3885bbaa518e3963de1353a407b
  
• feat: macos controls use space instead of mr, px-2 to px-3 - https://github.com/agmmnn/tauri-controls/commit/c041424c4a4a96eb108091fc036af05b7b6a6042
  
• fix(vue): pass attrs (props) to icons - https://github.com/agmmnn/tauri-controls/commit/becc979b30e998424aedc33c40abb8ad85151d68
• chore: demo-app use space instead of gap, update deps, format code - https://github.com/agmmnn/tauri-controls/commit/0f70dd0d1d9c22a734d687e98292ddd29d934e33

✨ @tauri-controls/vue - @allenli178

Big thanks to @allenli178, tauri-controls is now also available for Vue.js 3.

Check out the pull request here #11 🎉

pnpm add @tauri-controls/vue

<script setup lang="ts">
import { WindowTitlebar } from "@tauri-controls/solid"
</script>

<template>
	<WindowTitlebar>{/* Place your titlebar content here */}</WindowTitlebar>
</template>

🏠 https://www.npmjs.com/package/@tauri-controls/vue

✨ @tauri-controls/solid - @ronanru

A big shoutout to @ronanru, tauri-controls is now also available for Solid.js.

Check out the pull request here #8 🎉

pnpm add @tauri-controls/solid

import { WindowTitlebar } from "@tauri-controls/solid"

function MyTitlebar() {
  return (
    <WindowTitlebar>{/* Place your titlebar content here */}</WindowTitlebar>
  )
}

🏠 https://www.npmjs.com/package/@tauri-controls/solid

Repo Changes:

• Converted the repository to a monorepo using Turborepo. - https://github.com/agmmnn/tauri-controls/commit/81853bb98f0b5309eddf694e9579efc7ac1c1083

New Features:

• Svelte/Sveltekit implementation: Tauri Controls is now available for Svelte and Sveltekit projects.
• Add justify option to WindowControls: When set to true, WindowControls will justify/snap within the flexbox container it is placed in.

✨ @tauri-controls/svelte

Tauri Controls has been implemented for Svelte/Sveltekit, you can easily install it for svelte following the same installation steps except the extra tailwind step.

pnpm add @tauri-controls/svelte

<script lang="ts">
  import { WindowTitlebar } from "@tauri-controls/svelte"
</script>

<WindowTitlebar>{/* Place your titlebar content here */}</WindowTitlebar>

Check out the Tauri app demo with pnpm tauri dev: master/apps/tauri-controls-svelte

Footnote

All templates in tauri-ui now contain tauri-controls. https://github.com/agmmnn/tauri-ui/releases/tag/v0.3.0

• more accurate justification/snapping for controls in different scenarios - https://github.com/agmmnn/tauri-controls/commit/b8cbde14d42d7ec02a32edd5b34b680c07093899

• fix osType logic - https://github.com/agmmnn/tauri-controls/commit/5244bbb201eba6f8b507fc8542ed0c1dc25a966e
• add default value infos to types - https://github.com/agmmnn/tauri-controls/commit/4a7fadbe85fe55fb007dd902d8ac4765a3ddf879

• add: Support for Next.js #6 https://github.com/agmmnn/tauri-controls/commit/1f9dd6cca76b3948882c6e9ae63fc13789caeb88

Dev

• code refactor
  • TauriAppWindowProvider: contexts/plugin-window
• update vite-rollup config

• fix: display of controls is different in macos/safari(13) #5 https://github.com/agmmnn/tauri-controls/commit/cd59f8f8691440a975192932688f0bb312dee619 @reyamir
  • mr used instead of gap (Safari<14.1 doesnt support flex gap: https://www.falldowngoboone.com/blog/the-curious-case-of-flexbox-gap-and-safari/)
  • added also weight values to buttons and icons
• create: main css file with tailwind directives https://github.com/agmmnn/tauri-controls/commit/f9db13d0fe149e647bd75cbd97656d737fcde0f3
• WindowTitlebar: bg-background, overflow-hidden attributes added. cd59f8f

• add: WindowTitlebar component.
• add: hide, hideMethod options to WindowControls.
• add: MIT license file. #3 @abose
• fix "Meta" key for macos window-controls.

Development Environment

• add: tauri-demo application for testing.
• add: eslint, prettier configurations.

✨ WindowTitlebar

WindowTitlebar component handles the window controls and dynamically adjusts the control buttons and titlebar content order based on the current operating system.

Usage:

<WindowTitlebar>
  {/* Place your titlebar content here */}
</WindowTitlebar>

Options:

• controlsOrder?: "right" | "left" | "platform": Specify the position of window controls. leave it undefined for default OS-based positioning or use "right" for right-aligned, "left" for left-aligned, "platform" for OS-based positioning specified in windowControlsProps.
• windowControlsProps?: WindowControls
  The windowControlsProps property allows you to customize the appearance and behavior of the window controls within the WindowTitlebar. You can utilize the WindowControls component and provide specific options to tailor the controls to your application's requirements.

// this will show only macos controls with macos order
<WindowTitlebar
  controlsOrder="platform"
  windowControlsProps={{platform: "macos"}}
>
  {/* Place your titlebar content here. Menu, app icon, window title etc. */}
</WindowTitlebar>

• fix types