@xjur-ui/react 1.0.4 → 1.0.6

package/.turbo/turbo-build.log

@@ -1,8 +1,8 @@
 
-> @xjur-ui/react@1.0.3 build
+> @xjur-ui/react@1.0.5 build
 > tsup
 
-CLI Building entry: src/index.ts, src/components/avatar-group.tsx, src/components/avatar.tsx, src/components/badge.tsx, src/components/button.tsx, src/components/calendar.tsx, src/components/checkbox.tsx, src/components/chip.tsx, src/components/collapsible.tsx, src/components/date-picker.tsx, src/components/divider.tsx, src/components/dropdown-menu.tsx, src/components/icon.tsx, src/components/input.tsx, src/components/list.tsx, src/components/logo.tsx, src/components/otp-input.tsx, src/components/radio.tsx, src/components/rich-editor.tsx, src/components/search-input.tsx, src/components/select.tsx, src/components/sheet.tsx, src/components/skeleton.tsx, src/components/switch.tsx, src/components/table.tsx, src/components/tabs.tsx, src/components/tag.tsx, src/components/tooltip.tsx, src/components/typography.tsx
+CLI Building entry: src/index.ts, src/components/avatar-group.tsx, src/components/avatar.tsx, src/components/badge.tsx, src/components/button.tsx, src/components/calendar.tsx, src/components/checkbox.tsx, src/components/chip.tsx, src/components/collapsible.tsx, src/components/date-picker.tsx, src/components/divider.tsx, src/components/dropdown-menu.tsx, src/components/icon.tsx, src/components/input.tsx, src/components/list.tsx, src/components/logo.tsx, src/components/otp-input.tsx, src/components/radio.tsx, src/components/rich-editor.tsx, src/components/search-input.tsx, src/components/select.tsx, src/components/sheet.tsx, src/components/skeleton.tsx, src/components/status.tsx, src/components/switch.tsx, src/components/table.tsx, src/components/tabs.tsx, src/components/tag.tsx, src/components/test.tsx, src/components/tooltip.tsx, src/components/typography.tsx
 CLI Using tsconfig: tsconfig.json
 CLI tsup v8.5.0
 CLI Using tsup config: /home/vsts/work/1/s/packages/react/tsup.config.ts
@@ -11,37 +11,39 @@ CLI Cleaning output folder
 ESM Build start
 DTS Build start
 ESM dist/index.js                    0 B
-ESM dist/components/avatar-group.js  4.98 KB
-ESM dist/index.css                   63.18 KB
-ESM dist/components/avatar.js        1.38 KB
-ESM dist/components/badge.js         3.08 KB
-ESM dist/components/button.js        2.73 KB
-ESM dist/components/calendar.js      19.27 KB
-ESM dist/components/checkbox.js      4.64 KB
-ESM dist/components/chip.js          6.49 KB
-ESM dist/components/collapsible.js   998.00 B
 ESM dist/components/divider.js       708.00 B
-ESM dist/components/date-picker.js   6.87 KB
+ESM dist/index.css                   63.26 KB
 ESM dist/components/dropdown-menu.js 7.23 KB
 ESM dist/components/icon.js          2.80 KB
 ESM dist/components/input.js         8.04 KB
 ESM dist/components/list.js          4.34 KB
 ESM dist/components/logo.js          20.93 KB
 ESM dist/components/otp-input.js     993.00 B
-ESM dist/components/radio.js         4.52 KB
 ESM dist/components/rich-editor.js   20.54 KB
 ESM dist/components/search-input.js  7.67 KB
+ESM dist/components/radio.js         4.52 KB
 ESM dist/components/select.js        15.37 KB
 ESM dist/components/sheet.js         6.89 KB
 ESM dist/components/skeleton.js      349.00 B
+ESM dist/components/status.js        3.09 KB
 ESM dist/components/switch.js        1.13 KB
 ESM dist/components/table.js         4.35 KB
 ESM dist/components/tabs.js          1.43 KB
 ESM dist/components/tag.js           4.77 KB
-ESM dist/components/tooltip.js       1.96 KB
+ESM dist/components/test.js          166.00 B
 ESM dist/components/typography.js    2.21 KB
-ESM ⚡️ Build success in 1411ms
-DTS ⚡️ Build success in 6457ms
+ESM dist/components/tooltip.js       1.96 KB
+ESM dist/components/badge.js         3.08 KB
+ESM dist/components/button.js        2.73 KB
+ESM dist/components/calendar.js      19.27 KB
+ESM dist/components/checkbox.js      4.64 KB
+ESM dist/components/chip.js          6.49 KB
+ESM dist/components/collapsible.js   998.00 B
+ESM dist/components/date-picker.js   6.87 KB
+ESM dist/components/avatar-group.js  4.98 KB
+ESM dist/components/avatar.js        1.38 KB
+ESM ⚡️ Build success in 1464ms
+DTS ⚡️ Build success in 8066ms
 DTS dist/index.d.ts                    13.00 B
 DTS dist/components/avatar-group.d.ts  815.00 B
 DTS dist/components/badge.d.ts         607.00 B
@@ -63,10 +65,12 @@ DTS dist/components/search-input.d.ts  1.10 KB
 DTS dist/components/button.d.ts        872.00 B
 DTS dist/components/sheet.d.ts         1.62 KB
 DTS dist/components/skeleton.d.ts      225.00 B
+DTS dist/components/status.d.ts        701.00 B
 DTS dist/components/switch.d.ts        300.00 B
 DTS dist/components/table.d.ts         1.28 KB
 DTS dist/components/tabs.d.ts          737.00 B
 DTS dist/components/tag.d.ts           1.07 KB
+DTS dist/components/test.d.ts          131.00 B
 DTS dist/components/tooltip.d.ts       808.00 B
 DTS dist/components/typography.d.ts    993.00 B
 DTS dist/components/input.d.ts         2.12 KB

package/CHANGELOG.md

@@ -1,5 +1,12 @@
 # @xjur-ui/react
 
+## 1.0.6
+
+### Patch Changes
+
+- 04a474a: Adiciona componente teste
+- 28e2da9: Adiciona status badge
+
 ## 1.0.4
 
 ### Patch Changes

package/dist/components/status.d.ts

@@ -0,0 +1,14 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import { ComponentProps } from 'react';
+import { ClassVariantProps } from '@xjur-ui/util';
+
+declare const statusVariants: (props?: ({
+    variant?: "neutral" | "success" | "warning" | "danger" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface StatusProps extends ComponentProps<'div'>, ClassVariantProps<typeof statusVariants> {
+    text?: string;
+}
+declare function Status({ text, variant, className, ...props }: StatusProps): react_jsx_runtime.JSX.Element;
+
+export { Status, type StatusProps, statusVariants };

package/dist/components/status.js

@@ -0,0 +1,111 @@
+// src/components/status.tsx
+import { cva as cva2, cx } from "@xjur-ui/util";
+
+// src/components/typography.tsx
+import { Slot } from "@radix-ui/react-slot";
+import { cva } from "@xjur-ui/util";
+import { memo } from "react";
+import { jsx } from "react/jsx-runtime";
+var typographyVariants = cva("", {
+  variants: {
+    variant: {
+      body: "",
+      label: "",
+      title: "",
+      headline: ""
+    },
+    size: {
+      "sm-2x": "",
+      "sm-1x": "",
+      sm: "",
+      md: "",
+      lg: ""
+    },
+    weight: {
+      thin: "font-thin",
+      extraLight: "font-extralight",
+      light: "font-light",
+      normal: "font-normal",
+      medium: "font-medium",
+      semibold: "font-semibold",
+      bold: "font-bold",
+      extraBold: "font-extrabold",
+      black: "font-black"
+    }
+  },
+  compoundVariants: [
+    { variant: "body", size: "sm-1x", class: "text-size-body-sm-1x" },
+    { variant: "body", size: "sm", class: "text-size-body-sm" },
+    { variant: "body", size: "md", class: "text-size-body-md" },
+    { variant: "body", size: "lg", class: "text-size-body-lg" },
+    { variant: "label", size: "sm-2x", class: "text-size-label-sm-2x" },
+    { variant: "label", size: "sm-1x", class: "text-size-label-sm-1x" },
+    { variant: "label", size: "sm", class: "text-size-label-sm" },
+    { variant: "label", size: "md", class: "text-size-label-md" },
+    { variant: "label", size: "lg", class: "text-size-label-lg" },
+    { variant: "title", size: "sm", class: "text-size-title-sm" },
+    { variant: "title", size: "md", class: "text-size-title-md" },
+    { variant: "title", size: "lg", class: "text-size-title-lg" },
+    { variant: "headline", size: "sm", class: "text-size-headline-sm" },
+    { variant: "headline", size: "md", class: "text-size-headline-md" },
+    { variant: "headline", size: "lg", class: "text-size-headline-lg" }
+  ],
+  defaultVariants: {
+    variant: "body",
+    size: "md",
+    weight: "normal"
+  }
+});
+var Typography = memo(
+  ({
+    variant,
+    size,
+    weight,
+    asChild,
+    className,
+    ...props
+  }) => {
+    const Component = asChild ? Slot : "span";
+    return /* @__PURE__ */ jsx(
+      Component,
+      {
+        className: typographyVariants({ variant, size, weight, className }),
+        ...props
+      }
+    );
+  }
+);
+Typography.displayName = "Typography";
+
+// src/components/status.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+var statusVariants = cva2(
+  [
+    "inline-flex items-center justify-center px-small py-small-1x rounded-small-1x text-label-sm font-medium text-neutral-label h-large-2x"
+  ],
+  {
+    variants: {
+      variant: {
+        success: "bg-success-idle",
+        warning: "bg-warning-idle",
+        danger: "bg-danger-idle",
+        neutral: "bg-alt-3"
+      }
+    },
+    defaultVariants: {
+      variant: "neutral"
+    }
+  }
+);
+function Status({
+  text = "Status",
+  variant = "neutral",
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx2("div", { className: cx(statusVariants({ variant }), className), ...props, children: /* @__PURE__ */ jsx2(Typography, { size: "sm", variant: "label", weight: "medium", children: text }) });
+}
+export {
+  Status,
+  statusVariants
+};

package/dist/components/test.d.ts

@@ -0,0 +1,5 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+declare function Test(): react_jsx_runtime.JSX.Element;
+
+export { Test };

package/dist/components/test.js

@@ -0,0 +1,8 @@
+// src/components/test.tsx
+import { jsx } from "react/jsx-runtime";
+function Test() {
+  return /* @__PURE__ */ jsx("div", { children: "Test" });
+}
+export {
+  Test
+};

package/dist/index.css

@@ -92,6 +92,7 @@
     --color-layer-skeleton: #E5E7EB;
     --color-alt-1: #17171A;
     --color-alt-2: #3D3D47;
+    --color-alt-3: #69697A;
     --color-alt-4: #9C9CAD;
     --color-border-layer-1: #D6D6DC;
     --color-border-layer-2: #DEDEE3;
@@ -732,6 +733,9 @@
   .bg-alt-1 {
     background-color: var(--color-alt-1);
   }
+  .bg-alt-3 {
+    background-color: var(--color-alt-3);
+  }
   .bg-black\/50 {
     background-color: color-mix(in srgb, #000 50%, transparent);
     @supports (color: color-mix(in lab, red, red)) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xjur-ui/react",
-  "version": "1.0.4",
+  "version": "1.0.6",
   "type": "module",
   "description": "React components for XJur Design System",
   "main": "dist/index.js",
@@ -36,7 +36,9 @@
     "./avatar-group": "./dist/components/avatar-group.js",
     "./skeleton": "./dist/components/skeleton.js",
     "./rich-editor": "./dist/components/rich-editor.js",
-    "./tooltip": "./dist/components/tooltip.js"
+    "./tooltip": "./dist/components/tooltip.js",
+    "./status": "./dist/components/status.js",
+    "./test": "./dist/components/test.js"
   },
   "dependencies": {
     "@radix-ui/react-avatar": "^1.1.10",

package/src/components/status.tsx

@@ -0,0 +1,43 @@
+import type { ComponentProps } from 'react'
+import { cva, cx, type ClassVariantProps } from '@xjur-ui/util'
+import { Typography } from './typography'
+
+export const statusVariants = cva(
+  [
+    'inline-flex items-center justify-center px-small py-small-1x rounded-small-1x text-label-sm font-medium text-neutral-label h-large-2x'
+  ],
+  {
+    variants: {
+      variant: {
+        success: 'bg-success-idle',
+        warning: 'bg-warning-idle',
+        danger: 'bg-danger-idle',
+        neutral: 'bg-alt-3'
+      }
+    },
+    defaultVariants: {
+      variant: 'neutral'
+    }
+  }
+)
+
+export interface StatusProps
+  extends ComponentProps<'div'>,
+    ClassVariantProps<typeof statusVariants> {
+  text?: string
+}
+
+export function Status({
+  text = 'Status',
+  variant = 'neutral',
+  className,
+  ...props
+}: StatusProps) {
+  return (
+    <div className={cx(statusVariants({ variant }), className)} {...props}>
+      <Typography size="sm" variant="label" weight="medium">
+        {text}
+      </Typography>
+    </div>
+  )
+}

package/src/components/test.tsx

@@ -0,0 +1,3 @@
+export function Test() {
+  return <div>Test</div>
+}