@creativecodeco/ui 0.5.0 → 0.6.1

package/lib/hooks/use-safe-button-props.hook.d.ts

@@ -1,23 +1,22 @@
-/// <reference types="react" />
-/// <reference types="react" />
 import type { ButtonEvent } from '../types';
 export default function useSafeButtonProps({ onClick, onSubmit, loading, ...props }: React.ComponentPropsWithoutRef<'button'> & {
     loading?: boolean;
 }): {
     onClick: (event: ButtonEvent) => void;
     onSubmit: (event: ButtonEvent) => void;
-    name?: string | undefined;
+    children?: import("react").ReactNode | undefined;
     color?: string | undefined;
+    name?: string | undefined;
     disabled?: boolean | undefined;
     onChange?: import("react").FormEventHandler<HTMLButtonElement> | undefined;
-    value?: string | number | readonly string[] | undefined;
+    value?: string | readonly string[] | number | undefined;
     form?: string | undefined;
-    formAction?: string | undefined;
+    formAction?: string | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_EXPERIMENTAL_FORM_ACTIONS] | undefined;
     formEncType?: string | undefined;
     formMethod?: string | undefined;
     formNoValidate?: boolean | undefined;
     formTarget?: string | undefined;
-    type?: "button" | "reset" | "submit" | undefined;
+    type?: "submit" | "reset" | "button" | undefined;
     defaultChecked?: boolean | undefined;
     defaultValue?: string | number | readonly string[] | undefined;
     suppressContentEditableWarning?: boolean | undefined;
@@ -62,34 +61,34 @@ export default function useSafeButtonProps({ onClick, onSubmit, loading, ...prop
     itemRef?: string | undefined;
     results?: number | undefined;
     security?: string | undefined;
-    unselectable?: "off" | "on" | undefined;
-    inputMode?: "search" | "email" | "tel" | "text" | "url" | "none" | "numeric" | "decimal" | undefined;
+    unselectable?: "on" | "off" | undefined;
+    inputMode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined;
     is?: string | undefined;
     "aria-activedescendant"?: string | undefined;
     "aria-atomic"?: (boolean | "true" | "false") | undefined;
-    "aria-autocomplete"?: "list" | "none" | "inline" | "both" | undefined;
+    "aria-autocomplete"?: "none" | "inline" | "list" | "both" | undefined;
     "aria-braillelabel"?: string | undefined;
     "aria-brailleroledescription"?: string | undefined;
     "aria-busy"?: (boolean | "true" | "false") | undefined;
-    "aria-checked"?: boolean | "true" | "false" | "mixed" | undefined;
+    "aria-checked"?: boolean | "false" | "mixed" | "true" | undefined;
     "aria-colcount"?: number | undefined;
     "aria-colindex"?: number | undefined;
     "aria-colindextext"?: string | undefined;
     "aria-colspan"?: number | undefined;
     "aria-controls"?: string | undefined;
-    "aria-current"?: boolean | "step" | "date" | "time" | "true" | "false" | "page" | "location" | undefined;
+    "aria-current"?: boolean | "false" | "true" | "page" | "step" | "location" | "date" | "time" | undefined;
     "aria-describedby"?: string | undefined;
     "aria-description"?: string | undefined;
     "aria-details"?: string | undefined;
     "aria-disabled"?: (boolean | "true" | "false") | undefined;
-    "aria-dropeffect"?: "link" | "none" | "copy" | "execute" | "move" | "popup" | undefined;
+    "aria-dropeffect"?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined;
     "aria-errormessage"?: string | undefined;
     "aria-expanded"?: (boolean | "true" | "false") | undefined;
     "aria-flowto"?: string | undefined;
     "aria-grabbed"?: (boolean | "true" | "false") | undefined;
-    "aria-haspopup"?: boolean | "true" | "false" | "dialog" | "grid" | "listbox" | "menu" | "tree" | undefined;
+    "aria-haspopup"?: boolean | "false" | "true" | "menu" | "listbox" | "tree" | "grid" | "dialog" | undefined;
     "aria-hidden"?: (boolean | "true" | "false") | undefined;
-    "aria-invalid"?: boolean | "true" | "false" | "grammar" | "spelling" | undefined;
+    "aria-invalid"?: boolean | "false" | "true" | "grammar" | "spelling" | undefined;
     "aria-keyshortcuts"?: string | undefined;
     "aria-label"?: string | undefined;
     "aria-labelledby"?: string | undefined;
@@ -102,9 +101,9 @@ export default function useSafeButtonProps({ onClick, onSubmit, loading, ...prop
     "aria-owns"?: string | undefined;
     "aria-placeholder"?: string | undefined;
     "aria-posinset"?: number | undefined;
-    "aria-pressed"?: boolean | "true" | "false" | "mixed" | undefined;
+    "aria-pressed"?: boolean | "false" | "mixed" | "true" | undefined;
     "aria-readonly"?: (boolean | "true" | "false") | undefined;
-    "aria-relevant"?: "text" | "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text additions" | "text removals" | undefined;
+    "aria-relevant"?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined;
     "aria-required"?: (boolean | "true" | "false") | undefined;
     "aria-roledescription"?: string | undefined;
     "aria-rowcount"?: number | undefined;
@@ -118,7 +117,6 @@ export default function useSafeButtonProps({ onClick, onSubmit, loading, ...prop
     "aria-valuemin"?: number | undefined;
     "aria-valuenow"?: number | undefined;
     "aria-valuetext"?: string | undefined;
-    children?: import("react").ReactNode;
     dangerouslySetInnerHTML?: {
         __html: string | TrustedHTML;
     } | undefined;
@@ -258,9 +256,7 @@ export default function useSafeButtonProps({ onClick, onSubmit, loading, ...prop
     onPointerCancel?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
     onPointerCancelCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
     onPointerEnter?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
-    onPointerEnterCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
     onPointerLeave?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
-    onPointerLeaveCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
     onPointerOver?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
     onPointerOverCapture?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;
     onPointerOut?: import("react").PointerEventHandler<HTMLButtonElement> | undefined;

package/lib/theme/css/badge.css

@@ -0,0 +1,45 @@
+.badge {
+  &-size {
+    &-lg {
+      @apply badge-lg;
+    }
+
+    &-sm {
+      @apply badge-sm;
+    }
+
+    &-xs {
+      @apply badge-xs;
+    }
+  }
+
+  &-color {
+    &-primary {
+      @apply badge-primary;
+    }
+
+    &-secondary {
+      @apply badge-secondary;
+    }
+
+    &-accent {
+      @apply badge-accent;
+    }
+
+    &-success {
+      @apply badge-success;
+    }
+
+    &-warning {
+      @apply badge-warning;
+    }
+
+    &-info {
+      @apply badge-info;
+    }
+
+    &-error {
+      @apply badge-error;
+    }
+  }
+}

package/lib/theme/css/button.css

@@ -1,6 +1,4 @@
 .button {
-  @apply btn;
-
   &-link {
     @apply btn-link;
   }
@@ -41,6 +39,10 @@
     &-error {
       @apply btn-error;
     }
+
+    &-ghost {
+      @apply btn-ghost;
+    }
   }
 
   &-size {

package/lib/theme/css/main.css

@@ -4,6 +4,7 @@
 
 @import './accordion.css';
 @import './avatar.css';
+@import './badge.css';
 @import './button.css';
 @import './checkbox.css';
 @import './radio.css';