tembro 2.1.13 → 3.1.1

package/packages/cli/vendor/src/components/form/form-password-input.tsx

@@ -1,25 +0,0 @@
-import { type FormInputPasswordVariantProps as BaseFormPasswordInputProps } from "@/components/form/form-input"
-import { renderDeprecatedFormInputAlias } from "@/components/form/deprecated-compat"
-import type { FieldPath, FieldValues } from "react-hook-form"
-
-export type FormPasswordInputProps<
-  TFieldValues extends FieldValues = FieldValues,
-  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
-> = Omit<BaseFormPasswordInputProps<TFieldValues, TName>, "kind">
-
-/**
- * @deprecated Use {@link FormInput} with `kind="password"` instead.
- */
-function FormPasswordInput<
-  TFieldValues extends FieldValues = FieldValues,
-  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
->(props: FormPasswordInputProps<TFieldValues, TName>) {
-  return renderDeprecatedFormInputAlias({
-    componentName: "FormPasswordInput",
-    replacement: "FormInput with kind=\"password\"",
-    kind: "password",
-    props,
-  })
-}
-
-export { FormPasswordInput }

package/packages/cli/vendor/src/components/form/form-phone-input.tsx

@@ -1,32 +0,0 @@
-import { type FormInputPhoneInputValueMode, type FormInputPhoneVariantProps } from "@/components/form/form-input"
-import { renderDeprecatedFormInputAlias } from "@/components/form/deprecated-compat"
-import type { FieldPath, FieldValues } from "react-hook-form"
-
-export type FormPhoneInputValueMode = FormInputPhoneInputValueMode
-export type { FormInputPhoneInputValueMode }
-
-export type FormPhoneInputProps<
-  TFieldValues extends FieldValues = FieldValues,
-  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
-> = Omit<FormInputPhoneVariantProps<TFieldValues, TName>, "kind" | "valueMode"> & {
-  valueMode?: FormInputPhoneInputValueMode
-}
-
-/**
- * @deprecated Use {@link FormInput} with `kind="phone"` instead.
- */
-function FormPhoneInput<
-  TFieldValues extends FieldValues = FieldValues,
-  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
->(props: FormPhoneInputProps<TFieldValues, TName>) {
-  const { valueMode, ...rest } = props
-  return renderDeprecatedFormInputAlias({
-    componentName: "FormPhoneInput",
-    replacement: "FormInput with kind=\"phone\"",
-    kind: "phone",
-    props: rest,
-    extraProps: { valueMode },
-  })
-}
-
-export { FormPhoneInput }

package/packages/cli/vendor/src/components/form/form-search-input.tsx

@@ -1,25 +0,0 @@
-import { type FormInputSearchVariantProps } from "@/components/form/form-input"
-import { renderDeprecatedFormInputAlias } from "@/components/form/deprecated-compat"
-import type { FieldPath, FieldValues } from "react-hook-form"
-
-export type FormSearchInputProps<
-  TFieldValues extends FieldValues = FieldValues,
-  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
-> = Omit<FormInputSearchVariantProps<TFieldValues, TName>, "kind">
-
-/**
- * @deprecated Use {@link FormInput} with `kind="search"` instead.
- */
-function FormSearchInput<
-  TFieldValues extends FieldValues = FieldValues,
-  TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
->(props: FormSearchInputProps<TFieldValues, TName>) {
-  return renderDeprecatedFormInputAlias({
-    componentName: "FormSearchInput",
-    replacement: "FormInput with kind=\"search\"",
-    kind: "search",
-    props,
-  })
-}
-
-export { FormSearchInput }

package/packages/cli/vendor/src/components/modern/menubar.tsx

@@ -1,31 +0,0 @@
-import * as React from "react"
-
-import { cn } from "@/lib/utils"
-
-export type MenubarProps = React.ComponentProps<"nav">
-export type MenubarMenuProps = React.ComponentProps<"div">
-export type MenubarTriggerProps = React.ComponentProps<"button">
-export type MenubarContentProps = React.ComponentProps<"div">
-export type MenubarItemProps = React.ComponentProps<"button">
-
-function Menubar({ className, ...props }: MenubarProps) {
-  return <nav data-slot="menubar" className={cn("flex items-center gap-1 rounded-md border bg-background p-1", className)} {...props} />
-}
-
-function MenubarMenu({ className, ...props }: MenubarMenuProps) {
-  return <div data-slot="menubar-menu" className={cn("relative", className)} {...props} />
-}
-
-function MenubarTrigger({ className, ...props }: MenubarTriggerProps) {
-  return <button type="button" data-slot="menubar-trigger" className={cn("rounded-sm px-3 py-1.5 text-sm font-medium hover:bg-muted", className)} {...props} />
-}
-
-function MenubarContent({ className, ...props }: MenubarContentProps) {
-  return <div data-slot="menubar-content" className={cn("absolute left-0 top-full z-50 mt-1 min-w-40 rounded-md border bg-popover p-1 text-popover-foreground shadow-md", className)} {...props} />
-}
-
-function MenubarItem({ className, ...props }: MenubarItemProps) {
-  return <button type="button" data-slot="menubar-item" className={cn("flex w-full items-center rounded-sm px-2 py-1.5 text-left text-sm hover:bg-muted", className)} {...props} />
-}
-
-export { Menubar, MenubarContent, MenubarItem, MenubarMenu, MenubarTrigger }

package/packages/cli/vendor/src/components/modern/navigation-menu.tsx

@@ -1,26 +0,0 @@
-import * as React from "react"
-
-import { cn } from "@/lib/utils"
-
-export type NavigationMenuProps = React.ComponentProps<"nav">
-export type NavigationMenuListProps = React.ComponentProps<"ul">
-export type NavigationMenuItemProps = React.ComponentProps<"li">
-export type NavigationMenuLinkProps = React.ComponentProps<"a"> & { active?: boolean }
-
-function NavigationMenu({ className, ...props }: NavigationMenuProps) {
-  return <nav data-slot="navigation-menu" className={cn("flex items-center", className)} {...props} />
-}
-
-function NavigationMenuList({ className, ...props }: NavigationMenuListProps) {
-  return <ul data-slot="navigation-menu-list" className={cn("flex items-center gap-1", className)} {...props} />
-}
-
-function NavigationMenuItem(props: NavigationMenuItemProps) {
-  return <li data-slot="navigation-menu-item" {...props} />
-}
-
-function NavigationMenuLink({ active, className, ...props }: NavigationMenuLinkProps) {
-  return <a data-slot="navigation-menu-link" data-active={active ? "true" : undefined} className={cn("rounded-md px-3 py-2 text-sm font-medium text-muted-foreground hover:bg-muted hover:text-foreground", active && "bg-muted text-foreground", className)} {...props} />
-}
-
-export { NavigationMenu, NavigationMenuItem, NavigationMenuLink, NavigationMenuList }

package/packages/cli/vendor/src/lib/deprecated-warning.ts

@@ -1,15 +0,0 @@
-const warnedDeprecatedComponents = new Set<string>()
-
-export function warnDeprecatedComponent(name: string, replacement: string) {
-  const nodeEnv = (globalThis as { process?: { env?: { NODE_ENV?: string } } }).process?.env?.NODE_ENV
-  if (nodeEnv === "production") return
-
-  if (warnedDeprecatedComponents.has(name)) return
-
-  warnedDeprecatedComponents.add(name)
-  if (console?.warn) {
-    console.warn(
-      `[tembro] ${name} is deprecated. ${replacement} This alias is kept for compatibility only.`
-    )
-  }
-}

package/packages/cli/vendor/src/showcase/premium/menubar/index.ts

@@ -1,3 +0,0 @@
-export { menubarMock } from "./mock"
-export { MenubarShowcase } from "./showcase"
-

package/packages/cli/vendor/src/showcase/premium/menubar/mock.ts

@@ -1,29 +0,0 @@
-import type { ComponentDemoMock } from "../types"
-
-export const menubarMock: ComponentDemoMock = {
-  code: `import { Menubar, MenubarContent, MenubarItem, MenubarMenu, MenubarTrigger } from "tembro"
-
-export function Example() {
-  return (
-    <Menubar>
-      <MenubarMenu>
-        <MenubarTrigger>File</MenubarTrigger>
-        <MenubarContent>
-          <MenubarItem>New project</MenubarItem>
-          <MenubarItem>Open</MenubarItem>
-        </MenubarContent>
-      </MenubarMenu>
-    </Menubar>
-  )
-}`,
-  cliCommand: "npx tembro add menubar",
-  highlights: [
-    "Composable menubar surfaces with grouped actions",
-    "Trigger + content + item primitives",
-  ],
-  scenarios: [
-    { title: "Editor top bar", description: "Display grouped app actions in one compact area." },
-    { title: "Admin tools", description: "Expose grouped controls without full menu system overhead." },
-  ],
-}
-

package/packages/cli/vendor/src/showcase/premium/menubar/showcase.tsx

@@ -1,30 +0,0 @@
-import { Menubar, MenubarContent, MenubarItem, MenubarMenu, MenubarTrigger } from "@/index"
-
-export function MenubarShowcase() {
-  return (
-    <div className="space-y-3">
-      <Menubar className="w-fit">
-        <MenubarMenu>
-          <MenubarTrigger>File</MenubarTrigger>
-          <MenubarContent>
-            <MenubarItem>New project</MenubarItem>
-            <MenubarItem>Open</MenubarItem>
-            <MenubarItem>Save</MenubarItem>
-          </MenubarContent>
-        </MenubarMenu>
-        <MenubarMenu>
-          <MenubarTrigger>Edit</MenubarTrigger>
-          <MenubarContent>
-            <MenubarItem>Undo</MenubarItem>
-            <MenubarItem>Redo</MenubarItem>
-            <MenubarItem>Find</MenubarItem>
-          </MenubarContent>
-        </MenubarMenu>
-      </Menubar>
-      <p className="text-sm text-muted-foreground">
-        Menubar is a non-dropdown primitive. Use it as a command surface for quick contextual actions.
-      </p>
-    </div>
-  )
-}
-

package/packages/cli/vendor/src/showcase/premium/navigation-menu/index.ts

@@ -1,3 +0,0 @@
-export { navigationMenuMock } from "./mock"
-export { NavigationMenuShowcase } from "./showcase"
-

package/packages/cli/vendor/src/showcase/premium/navigation-menu/mock.ts

@@ -1,27 +0,0 @@
-import type { ComponentDemoMock } from "../types"
-
-export const navigationMenuMock: ComponentDemoMock = {
-  code: `import { NavigationMenu, NavigationMenuItem, NavigationMenuLink, NavigationMenuList } from "tembro"
-
-export function Example() {
-  return (
-    <NavigationMenu>
-      <NavigationMenuList>
-        <NavigationMenuItem>
-          <NavigationMenuLink href="#" active>Home</NavigationMenuLink>
-        </NavigationMenuItem>
-      </NavigationMenuList>
-    </NavigationMenu>
-  )
-}`,
-  cliCommand: "npx tembro add navigation-menu",
-  highlights: [
-    "Accessible anchor-style navigation links",
-    "Active state is handled via prop",
-    "Simple composition with list and item primitives",
-  ],
-  scenarios: [
-    { title: "Landing header", description: "Build top navigation with clear active route feedback." },
-    { title: "Docs menu", description: "Use for horizontally aligned documentation categories." },
-  ],
-}

package/packages/cli/vendor/src/showcase/premium/navigation-menu/showcase.tsx

@@ -1,34 +0,0 @@
-import * as React from "react"
-
-import { NavigationMenu, NavigationMenuItem, NavigationMenuLink, NavigationMenuList } from "@/index"
-
-const items = ["Products", "Solutions", "Resources", "Pricing"]
-
-export function NavigationMenuShowcase() {
-  const [active, setActive] = React.useState(items[0])
-
-  return (
-    <div className="space-y-3">
-      <NavigationMenu>
-        <NavigationMenuList>
-          {items.map((item) => (
-            <NavigationMenuItem key={item}>
-              <NavigationMenuLink
-                href="#"
-                active={active === item}
-                onClick={(event) => {
-                  event.preventDefault()
-                  setActive(item)
-                }}
-              >
-                {item}
-              </NavigationMenuLink>
-            </NavigationMenuItem>
-          ))}
-        </NavigationMenuList>
-      </NavigationMenu>
-      <p className="text-sm text-muted-foreground">Active segment: {active}</p>
-    </div>
-  )
-}
-

package/packages/cli/vendor/src/showcase/premium/qr-code/index.ts

@@ -1,3 +0,0 @@
-export { qrCodeMock } from "./mock"
-export { QRCodeShowcase } from "./showcase"
-

package/packages/cli/vendor/src/showcase/premium/qr-code/mock.ts

@@ -1,20 +0,0 @@
-import type { ComponentDemoMock } from "../types"
-
-export const qrCodeMock: ComponentDemoMock = {
-  code: `import { QRCode } from "tembro"
-
-export function Example() {
-  return <QRCode value="https://azamat-ui.vercel.app" alt="Azamat UI" />
-}`,
-  cliCommand: "npx tembro add qr-code",
-  highlights: [
-    "Fallback SVG renderer if no image is provided",
-    "Configurable size and module density",
-    "Works with plain strings and long URLs",
-  ],
-  scenarios: [
-    { title: "Marketing", description: "Expose links in campaigns and materials." },
-    { title: "Apps", description: "Generate codes for sharing deep links in dashboards." },
-  ],
-}
-

package/packages/cli/vendor/src/showcase/premium/qr-code/showcase.tsx

@@ -1,23 +0,0 @@
-import * as React from "react"
-
-import { Button, QRCode } from "@/index"
-
-const urls = ["https://azamat-ui.vercel.app", "https://github.com", "mailto:hello@example.com"]
-
-export function QRCodeShowcase() {
-  const [index, setIndex] = React.useState(0)
-  const value = urls[index % urls.length]
-
-  return (
-    <div className="space-y-3">
-      <div className="flex gap-2">
-        <Button size="sm" onClick={() => setIndex((value) => (value + 1) % urls.length)}>
-          Next payload
-        </Button>
-      </div>
-      <QRCode value={value} alt={value} size={176} />
-      <p className="text-xs text-muted-foreground">Payload: {value}</p>
-    </div>
-  )
-}
-

package/packages/cli/vendor/src/showcase/premium/rich-text-editor/index.ts

@@ -1,3 +0,0 @@
-export { richTextEditorMock } from "./mock"
-export { RichTextEditorShowcase } from "./showcase"
-

package/packages/cli/vendor/src/showcase/premium/rich-text-editor/mock.ts

@@ -1,22 +0,0 @@
-import type { ComponentDemoMock } from "../types"
-
-export const richTextEditorMock: ComponentDemoMock = {
-  code: `import { RichTextEditor } from "tembro"
-
-export function Example() {
-  const [value, setValue] = useState("<p>Start writing...</p>")
-
-  return <RichTextEditor value={value} onValueChange={setValue} />
-}`,
-  cliCommand: "npx tembro add rich-text-editor",
-  highlights: [
-    "Inline editable content block",
-    "Simple toolbar actions for basic formatting",
-    "Controlled value with value/onValueChange",
-  ],
-  scenarios: [
-    { title: "CMS blocks", description: "Capture short rich-text snippets for card descriptions." },
-    { title: "Internal notes", description: "Attach lightweight WYSIWYG content to records." },
-  ],
-}
-

package/packages/cli/vendor/src/showcase/premium/rich-text-editor/showcase.tsx

@@ -1,15 +0,0 @@
-import * as React from "react"
-
-import { RichTextEditor } from "@/index"
-
-export function RichTextEditorShowcase() {
-  const [value, setValue] = React.useState("<p>Type <strong>formatted</strong> text here.</p>")
-
-  return (
-    <div className="space-y-3">
-      <RichTextEditor value={value} onValueChange={setValue} placeholder="Write product notes..." />
-      <p className="text-sm text-muted-foreground">Current HTML length: {value.length}</p>
-    </div>
-  )
-}
-

package/packages/cli/vendor/src/showcase/premium/tour/index.ts

@@ -1,3 +0,0 @@
-export { tourMock } from "./mock"
-export { TourShowcase } from "./showcase"
-

package/packages/cli/vendor/src/showcase/premium/tour/mock.ts

@@ -1,33 +0,0 @@
-import type { ComponentDemoMock } from "../types"
-
-export const tourMock: ComponentDemoMock = {
-  code: `import { Button, Tour } from "tembro"
-import { useState } from "react"
-
-export function Example() {
-  const [open, setOpen] = useState(true)
-  const [index, setIndex] = useState(0)
-
-  return (
-    <Tour
-      steps={[
-        { title: "Welcome", description: "Intro your app flow." },
-        { title: "Next", description: "Continue to another key step." },
-      ]}
-      index={index}
-      onIndexChange={setIndex}
-      onClose={() => setOpen(false)}
-    />
-  )
-}`,
-  cliCommand: "npx tembro add tour",
-  highlights: [
-    "Controlled tour state with index-driven steps",
-    "Built-in close handling",
-  ],
-  scenarios: [
-    { title: "Product onboarding", description: "Guide new users through first-time workflow." },
-    { title: "Release tours", description: "Attach temporary walkthroughs to feature releases." },
-  ],
-}
-

package/packages/cli/vendor/src/showcase/premium/tour/showcase.tsx

@@ -1,29 +0,0 @@
-import * as React from "react"
-
-import { Button, Tour } from "@/index"
-
-const tourSteps = [
-  { title: "Welcome", description: "Use this for quick onboarding overlays." },
-  { title: "Key actions", description: "Guide users through essential workflows." },
-  { title: "Done", description: "Save and share the tour flow with the team." },
-]
-
-export function TourShowcase() {
-  const [index, setIndex] = React.useState(0)
-  const [open, setOpen] = React.useState(true)
-
-  return (
-    <div className="space-y-3">
-      <div className="flex gap-2">
-        <Button size="sm" onClick={() => setOpen(true)}>
-          Open tour
-        </Button>
-        <Button size="sm" variant="outline" onClick={() => setIndex((value) => (value + 1) % tourSteps.length)}>
-          Next step
-        </Button>
-      </div>
-      {open ? <Tour steps={tourSteps} index={index} onIndexChange={setIndex} onClose={() => setOpen(false)} /> : null}
-    </div>
-  )
-}
-