@stack-spot/citric-react 0.2.0 → 0.3.0

package/dist/components/Textarea.d.ts

@@ -3,6 +3,6 @@ export interface BaseTextareaProps extends WithColorScheme {
     value?: string;
     onChange?: (value: string) => void;
 }
-export type TextareaProps = HTMLExtension<'textarea', BaseTextareaProps, 'onChange'>;
+export type TextareaProps = HTMLExtension<'textarea', BaseTextareaProps>;
 export declare const Textarea: ({ value, onChange, ...props }: TextareaProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Textarea.d.ts.map

package/dist/components/Textarea.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../src/components/Textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAGzD,MAAM,WAAW,iBAAkB,SAAQ,eAAe;IACxD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC;AAED,MAAM,MAAM,aAAa,GAAG,aAAa,CAAC,UAAU,EAAE,iBAAiB,EAAE,UAAU,CAAC,CAAA;AAEpF,eAAO,MAAM,QAAQ,GAAI,+BAA+B,aAAa,4CACwD,CAAA"}
+{"version":3,"file":"Textarea.d.ts","sourceRoot":"","sources":["../../src/components/Textarea.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAGzD,MAAM,WAAW,iBAAkB,SAAQ,eAAe;IACxD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CACpC;AAED,MAAM,MAAM,aAAa,GAAG,aAAa,CAAC,UAAU,EAAE,iBAAiB,CAAC,CAAA;AAExE,eAAO,MAAM,QAAQ,GAAI,+BAA+B,aAAa,4CACwD,CAAA"}

package/dist/components/Tooltip.d.ts

@@ -19,7 +19,13 @@ export interface BaseTooltipProps extends Omit<BaseOverlayProps<'div'>, 'tag' |
      * @default true
      */
     compact?: boolean;
+    /**
+     * Whether or not to disable the tooltip, i.e. not show it.
+     *
+     * @default false
+     */
+    disabled?: boolean;
 }
-export type TooltipProps = HTMLExtension<'div', BaseTooltipProps, 'children' | 'content'>;
-export declare const Tooltip: ({ tooltipId, children, showArrow, compact, attributes, colorScheme, colorPalette, ...props }: TooltipProps) => import("react/jsx-runtime").JSX.Element;
+export type TooltipProps = HTMLExtension<'div', BaseTooltipProps>;
+export declare const Tooltip: ({ tooltipId, children, showArrow, compact, attributes, colorScheme, colorPalette, disabled, ...props }: TooltipProps) => import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Tooltip.d.ts.map

package/dist/components/Tooltip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../src/components/Tooltip.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAE3E,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAA;AAElD,MAAM,WAAW,gBAAiB,SAChC,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,EAAE,KAAK,GAAG,eAAe,GAAG,WAAW,CAAC,EAAE,gBAAgB,EAAE,eAAe;IACvG;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,MAAM,MAAM,YAAY,GAAG,aAAa,CAAC,KAAK,EAAE,gBAAgB,EAAE,UAAU,GAAG,SAAS,CAAC,CAAA;AAEzF,eAAO,MAAM,OAAO,GAClB,8FAA4G,YAAY,4CAqBzH,CAAA"}
+{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../../src/components/Tooltip.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAE3E,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAA;AAElD,MAAM,WAAW,gBAAiB,SAChC,IAAI,CAAC,gBAAgB,CAAC,KAAK,CAAC,EAAE,KAAK,GAAG,eAAe,GAAG,WAAW,CAAC,EAAE,gBAAgB,EAAE,eAAe;IACvG;;;;OAIG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,MAAM,YAAY,GAAG,aAAa,CAAC,KAAK,EAAE,gBAAgB,CAAC,CAAA;AAEjE,eAAO,MAAM,OAAO,GAClB,wGAAsH,YAAY,4CAqBnI,CAAA"}

package/dist/components/Tooltip.js

@@ -2,9 +2,9 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { listToClass } from '@stack-spot/portal-theme';
 import { useRef } from 'react';
 import { Overlay } from './Overlay/index.js';
-export const Tooltip = ({ tooltipId, children, showArrow = true, compact = true, attributes, colorScheme, colorPalette, ...props }) => {
+export const Tooltip = ({ tooltipId, children, showArrow = true, compact = true, attributes, colorScheme, colorPalette, disabled, ...props }) => {
     const id = useRef(tooltipId || `${Math.random()}`);
-    return (_jsx(Overlay, { attributes: {
+    return disabled ? children : (_jsx(Overlay, { attributes: {
             className: listToClass([attributes?.className, showArrow && 'with-arrow', compact && 'compact']),
             style: { margin: '6px', ...attributes?.style },
             role: 'tooltip',

package/dist/components/Tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../src/components/Tooltip.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AACtD,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AA2BnC,MAAM,CAAC,MAAM,OAAO,GAAG,CACrB,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,GAAG,IAAI,EAAE,OAAO,GAAG,IAAI,EAAE,UAAU,EAAE,WAAW,EAAE,YAAY,EAAE,GAAG,KAAK,EAAgB,EACxH,EAAE;IACF,MAAM,EAAE,GAAG,MAAM,CAAC,SAAS,IAAI,GAAG,IAAI,CAAC,MAAM,EAAE,EAAE,CAAC,CAAA;IAClD,OAAO,CACL,KAAC,OAAO,IACN,UAAU,EAAE;YACV,SAAS,EAAE,WAAW,CAAC,CAAC,UAAU,EAAE,SAAS,EAAE,SAAS,IAAI,YAAY,EAAE,OAAO,IAAI,SAAS,CAAC,CAAC;YAChG,KAAK,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,UAAU,EAAE,KAAK,EAAE;YAC9C,IAAI,EAAE,SAAS;YACf,EAAE,EAAE,EAAE,CAAC,OAAO;YACd,aAAa,EAAE,SAAS;YACxB,mBAAmB,EAAE,WAAW;YAChC,oBAAoB,EAAE,YAAY;YAClC,GAAG,UAAU;SACd,EACD,aAAa,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,kBAAkB,EAAE,EAAE,CAAC,OAAO,CAAC,KAC9D,KAAK,YAER,QAAQ,GACD,CACX,CAAA;AACH,CAAC,CAAA"}
+{"version":3,"file":"Tooltip.js","sourceRoot":"","sources":["../../src/components/Tooltip.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AACtD,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAA;AAiCnC,MAAM,CAAC,MAAM,OAAO,GAAG,CACrB,EAAE,SAAS,EAAE,QAAQ,EAAE,SAAS,GAAG,IAAI,EAAE,OAAO,GAAG,IAAI,EAAE,UAAU,EAAE,WAAW,EAAE,YAAY,EAAE,QAAQ,EAAE,GAAG,KAAK,EAAgB,EAClI,EAAE;IACF,MAAM,EAAE,GAAG,MAAM,CAAC,SAAS,IAAI,GAAG,IAAI,CAAC,MAAM,EAAE,EAAE,CAAC,CAAA;IAClD,OAAO,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,CAC3B,KAAC,OAAO,IACN,UAAU,EAAE;YACV,SAAS,EAAE,WAAW,CAAC,CAAC,UAAU,EAAE,SAAS,EAAE,SAAS,IAAI,YAAY,EAAE,OAAO,IAAI,SAAS,CAAC,CAAC;YAChG,KAAK,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,UAAU,EAAE,KAAK,EAAE;YAC9C,IAAI,EAAE,SAAS;YACf,EAAE,EAAE,EAAE,CAAC,OAAO;YACd,aAAa,EAAE,SAAS;YACxB,mBAAmB,EAAE,WAAW;YAChC,oBAAoB,EAAE,YAAY;YAClC,GAAG,UAAU;SACd,EACD,aAAa,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,kBAAkB,EAAE,EAAE,CAAC,OAAO,CAAC,KAC9D,KAAK,YAER,QAAQ,GACD,CACX,CAAA;AACH,CAAC,CAAA"}

package/dist/types.d.ts

@@ -13,38 +13,38 @@ export type WithDataAttributes = {
     [key: `data-${string}`]: string | undefined;
 };
 export type TextAppearance = 'body1' | 'body2' | 'code1' | 'code2' | 'display1' | 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'microtext1' | 'overheader1' | 'overheader2' | 'subtitle1' | 'subtitle2' | 'subtitle3' | 'subtitle4';
-export interface HTMLTag {
-    a: React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>;
-    blockquote: React.DetailedHTMLProps<React.BlockquoteHTMLAttributes<HTMLQuoteElement>, HTMLQuoteElement>;
-    button: React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>;
-    div: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>;
-    form: React.DetailedHTMLProps<React.FormHTMLAttributes<HTMLFormElement>, HTMLFormElement>;
-    h1: React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>;
-    h2: React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>;
-    h3: React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>;
-    h4: React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>;
-    h5: React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>;
-    h6: React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>;
-    hr: React.DetailedHTMLProps<React.HTMLAttributes<HTMLHRElement>, HTMLHRElement>;
-    i: React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
-    image: React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>;
-    input: React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>;
-    label: React.DetailedHTMLProps<React.LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>;
-    li: React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>;
-    nav: React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
-    p: React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>;
-    pre: React.DetailedHTMLProps<React.HTMLAttributes<HTMLPreElement>, HTMLPreElement>;
-    select: React.DetailedHTMLProps<React.SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement>;
-    small: React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>;
-    span: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>;
-    table: React.DetailedHTMLProps<React.TableHTMLAttributes<HTMLTableElement>, HTMLTableElement>;
-    td: React.DetailedHTMLProps<React.TdHTMLAttributes<HTMLTableCellElement>, HTMLTableCellElement>;
-    th: React.DetailedHTMLProps<React.ThHTMLAttributes<HTMLTableCellElement>, HTMLTableCellElement>;
-    tr: React.DetailedHTMLProps<React.HTMLAttributes<HTMLTableRowElement>, HTMLTableRowElement>;
-    textarea: React.DetailedHTMLProps<React.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>;
-    ul: React.DetailedHTMLProps<React.HTMLAttributes<HTMLUListElement>, HTMLUListElement>;
-}
-export type HTMLExtension<K extends keyof HTMLTag, Props, Omitted extends string = ''> = (Omitted extends '' ? HTMLTag[K] : Omit<HTMLTag[K], Omitted>) & Props;
+export type HTMLTag = {
+    a: React.AnchorHTMLAttributes<HTMLAnchorElement>;
+    blockquote: React.BlockquoteHTMLAttributes<HTMLQuoteElement>;
+    button: React.ButtonHTMLAttributes<HTMLButtonElement>;
+    div: React.HTMLAttributes<HTMLDivElement>;
+    form: React.FormHTMLAttributes<HTMLFormElement>;
+    h1: React.HTMLAttributes<HTMLHeadingElement>;
+    h2: React.HTMLAttributes<HTMLHeadingElement>;
+    h3: React.HTMLAttributes<HTMLHeadingElement>;
+    h4: React.HTMLAttributes<HTMLHeadingElement>;
+    h5: React.HTMLAttributes<HTMLHeadingElement>;
+    h6: React.HTMLAttributes<HTMLHeadingElement>;
+    hr: React.HTMLAttributes<HTMLHRElement>;
+    i: React.HTMLAttributes<HTMLElement>;
+    image: React.ImgHTMLAttributes<HTMLImageElement>;
+    input: React.InputHTMLAttributes<HTMLInputElement>;
+    label: React.LabelHTMLAttributes<HTMLLabelElement>;
+    li: React.LiHTMLAttributes<HTMLLIElement>;
+    nav: React.HTMLAttributes<HTMLElement>;
+    p: React.HTMLAttributes<HTMLParagraphElement>;
+    pre: React.HTMLAttributes<HTMLPreElement>;
+    select: React.SelectHTMLAttributes<HTMLSelectElement>;
+    small: React.HTMLAttributes<HTMLElement>;
+    span: React.HTMLAttributes<HTMLSpanElement>;
+    table: React.TableHTMLAttributes<HTMLTableElement>;
+    td: React.TdHTMLAttributes<HTMLTableCellElement>;
+    th: React.ThHTMLAttributes<HTMLTableCellElement>;
+    tr: React.HTMLAttributes<HTMLTableRowElement>;
+    textarea: React.TextareaHTMLAttributes<HTMLTextAreaElement>;
+    ul: React.HTMLAttributes<HTMLUListElement>;
+};
+export type HTMLExtension<K extends keyof HTMLTag, Props> = Omit<HTMLTag[K], keyof Props> & Props;
 export interface WithStyleShortcuts {
     /**
      * Sets a theme color for the background.

package/dist/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"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"}

package/dist/utils/options.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"options.d.ts","sourceRoot":"","sources":["../../src/utils/options.ts"],"names":[],"mappings":"AAAA,wBAAgB,kBAAkB,CAAC,MAAM,EAAE,GAAG,UAE7C;AAED,wBAAgB,gBAAgB,CAAC,MAAM,EAAE,GAAG,sBAE3C"}
+{"version":3,"file":"options.d.ts","sourceRoot":"","sources":["../../src/utils/options.ts"],"names":[],"mappings":"AAEA,wBAAgB,kBAAkB,CAAC,MAAM,EAAE,GAAG,UAE7C;AAED,wBAAgB,gBAAgB,CAAC,MAAM,EAAE,GAAG,sBAE3C"}

package/dist/utils/options.js

@@ -1,5 +1,6 @@
+import { isNil } from 'lodash';
 export function defaultRenderLabel(option) {
-    return `${option}`;
+    return isNil(option) ? '' : `${option}`;
 }
 export function defaultRenderKey(option) {
     return ['string', 'number'].includes(typeof option) ? `${option}` : undefined;

package/dist/utils/options.js.map

@@ -1 +1 @@
-{"version":3,"file":"options.js","sourceRoot":"","sources":["../../src/utils/options.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,kBAAkB,CAAC,MAAW;IAC5C,OAAO,GAAG,MAAM,EAAE,CAAA;AACpB,CAAC;AAED,MAAM,UAAU,gBAAgB,CAAC,MAAW;IAC1C,OAAO,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC,QAAQ,CAAC,OAAO,MAAM,CAAC,CAAC,CAAC,CAAC,GAAG,MAAM,EAAE,CAAC,CAAC,CAAC,SAAS,CAAA;AAC/E,CAAC"}
+{"version":3,"file":"options.js","sourceRoot":"","sources":["../../src/utils/options.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,MAAM,QAAQ,CAAA;AAE9B,MAAM,UAAU,kBAAkB,CAAC,MAAW;IAC5C,OAAO,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,MAAM,EAAE,CAAA;AACzC,CAAC;AAED,MAAM,UAAU,gBAAgB,CAAC,MAAW;IAC1C,OAAO,CAAC,QAAQ,EAAE,QAAQ,CAAC,CAAC,QAAQ,CAAC,OAAO,MAAM,CAAC,CAAC,CAAC,CAAC,GAAG,MAAM,EAAE,CAAC,CAAC,CAAC,SAAS,CAAA;AAC/E,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stack-spot/citric-react",
-  "version": "0.2.0",
+  "version": "0.3.0",
   "author": "StackSpot",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",

package/src/components/Accordion.tsx

@@ -34,7 +34,7 @@ export interface BaseAccordionProps {
   maxHeight?: number,
 }
 
-export type AccordionProps = HTMLExtension<'div', BaseAccordionProps, 'onChange'>
+export type AccordionProps = HTMLExtension<'div', BaseAccordionProps>
 
 export const Accordion = (
   { id, appearance, expanded, onChange, header, maxHeight = 300, className, style, children, ...props }: AccordionProps,

package/src/components/Avatar.tsx

@@ -21,7 +21,7 @@ export interface BaseAvatarProps extends WithColorPalette {
   image?: string,
 }
 
-export type AvatarProps = HTMLExtension<'div', BaseAvatarProps, 'children'>
+export type AvatarProps = HTMLExtension<'div', BaseAvatarProps>
 
 export const Avatar = ({ size, name, appearance, className, image, ...props }: AvatarProps) => {
   const parts = name?.split(' ') ?? ['']

package/src/components/AvatarGroup.tsx

@@ -22,7 +22,7 @@ export interface BaseAvatarGroupProps extends WithColorPalette {
   maxItems?: number,
 }
 
-export type AvatarGroupProps = HTMLExtension<'div', BaseAvatarGroupProps, 'children'>
+export type AvatarGroupProps = HTMLExtension<'div', BaseAvatarGroupProps>
 
 export const AvatarGroup = ({ size, items, appearance, maxItems, className, ...props }: AvatarGroupProps) => {
   const avatars = items.map(({ name, image }) => <Avatar key={name} name={name} image={image} />, [items])

package/src/components/Breadcrumb.tsx

@@ -11,7 +11,7 @@ export interface BaseBreadcrumbProps {
   items: BreadCrumbItem[],
 }
 
-export type BreadcrumbProps = HTMLExtension<'nav', BaseBreadcrumbProps, 'children'>
+export type BreadcrumbProps = HTMLExtension<'nav', BaseBreadcrumbProps>
 
 export const Breadcrumb = ({ items, ...props }: BreadcrumbProps) => {
   const children = useMemo(

package/src/components/Button.tsx

@@ -44,7 +44,7 @@ export interface BaseButtonProps extends WithColorScheme {
   analytics?: boolean,
 }
 
-export type ButtonProps = HTMLExtension<'button', BaseButtonProps, 'onClick'>
+export type ButtonProps = HTMLExtension<'button', BaseButtonProps>
 
 export const Button = (
   { appearance, size, feedback, loading, disabled, onClick, className, children, type = 'button', analytics, ...props }: ButtonProps,

package/src/components/Checkbox.tsx

@@ -12,7 +12,7 @@ export interface BaseCheckboxProps extends WithColorScheme {
   children?: React.ReactNode,
 }
 
-export type CheckboxProps = HTMLExtension<'input', BaseCheckboxProps, 'type' | 'onChange' | 'value'>
+export type CheckboxProps = HTMLExtension<'input', BaseCheckboxProps>
 
 export const Checkbox = (
   { appearance = 'checkbox', value, onChange, colorScheme, children, className, style, ...props }: CheckboxProps,

package/src/components/CheckboxGroup.tsx

@@ -55,7 +55,7 @@ export interface BaseCheckboxGroupProps<T = any> extends WithColorScheme {
   isDisabled?: (option: T) => boolean,
 }
 
-export type CheckboxGroupProps<T> = HTMLExtension<'div', BaseCheckboxGroupProps<T>, 'onChange'>
+export type CheckboxGroupProps<T> = HTMLExtension<'div', BaseCheckboxGroupProps<T>>
 
 export function CheckboxGroup<T>({
   appearance = 'checkbox',

package/src/components/Favorite.tsx

@@ -22,7 +22,7 @@ export interface BaseFavoriteProps {
   isLoading?: boolean,
 }
 
-export type FavoriteProps = HTMLExtension<'input', BaseFavoriteProps, 'type' | 'checked' | 'onChange' | 'size' | 'value'>
+export type FavoriteProps = HTMLExtension<'input', BaseFavoriteProps>
 
 export const Favorite = ({ value, size, appearance, onChange, isLoading, className, ...props }: FavoriteProps) =>
   <CitricComponent

package/src/components/Input.tsx

@@ -14,7 +14,7 @@ export interface BaseInputProps<T extends SupportedInputType> extends WithColorS
 }
 
 export type InputProps<T extends SupportedInputType = 'text'> = 
-  HTMLExtension<'input', BaseInputProps<T> & { type?: T }, 'type' | 'value' | 'onChange'>
+  HTMLExtension<'input', BaseInputProps<T> & { type?: T }>
 
 export function Input<T extends SupportedInputType = 'text'>({ type, value, onChange, ...props }: InputProps<T>) {
   function handleChange(e: React.ChangeEvent<HTMLInputElement>) {

package/src/components/MenuOverlay/types.ts

@@ -165,7 +165,7 @@ export interface BaseMenuProps {
   menuStyle?: React.CSSProperties,
 }
 
-export type MenuProps = HTMLExtension<'div', BaseMenuProps, 'children'>
+export type MenuProps = HTMLExtension<'div', BaseMenuProps>
 
 export interface BaseMenuOverlayProps extends
   BaseMenuProps, Omit<BaseOverlayProps<'div'>, 'tag' | 'onRenderChild' | 'content' | 'triggerOn' | 'reference'> {

package/src/components/Overlay/types.ts

@@ -64,7 +64,7 @@ export interface BaseOverlayProps<T extends keyof HTMLTag> extends Omit<OverlayO
 }
 
 export type OverlayProps<T extends keyof HTMLTag> =
-  HTMLExtension<'div', BaseOverlayProps<T>, 'children' | 'content'>
+  HTMLExtension<'div', BaseOverlayProps<T>>
 
 export interface OverlayController {
   close: () => Promise<void>,

package/src/components/Pagination.tsx

@@ -29,7 +29,7 @@ export interface BasePaginationProps {
   onChange: (page: number, size: number) => void,
 }
 
-export type PaginationProps = HTMLExtension<'div', BasePaginationProps, 'children' | 'onChange'>
+export type PaginationProps = HTMLExtension<'div', BasePaginationProps>
 
 export const Pagination = (
   { pageSizeOptions = [10, 20, 30], pageSize, totalPages, page, onChange, ...props }: PaginationProps,

package/src/components/RadioGroup.tsx

@@ -50,7 +50,7 @@ export interface BaseRadioGroupProps<T> extends WithColorScheme {
   isDisabled?: (option: T) => boolean,
 }
 
-export type RadioGroupProps<T> = HTMLExtension<'div', BaseRadioGroupProps<T>, 'onChange'>
+export type RadioGroupProps<T> = HTMLExtension<'div', BaseRadioGroupProps<T>>
 
 export function RadioGroup<T>({
   name,

package/src/components/Rating.tsx

@@ -12,7 +12,7 @@ export interface BaseRatingProps {
   name?: string,
 }
 
-export type RatingProps = HTMLExtension<'div', BaseRatingProps, 'children' | 'onChange'>
+export type RatingProps = HTMLExtension<'div', BaseRatingProps>
 
 export const Rating = ({ value, onChange, name, ...props }: RatingProps) => (
   <CitricComponent tag="div" component="rating" {...props}>

package/src/components/Select/RichSelect.tsx

@@ -41,7 +41,7 @@ export function RichSelect<T>({
   }, [])
 
   const renderedOptions = useMemo(() => {
-    const items = required ? [] : [<li key="" className="empty" onClick={change(undefined)}>{t.empty}</li>]
+    const items = required ? [] : [<li key="" className="empty" onClick={change(undefined)}>{renderLabel(undefined) || t.empty}</li>]
     options.forEach((o) => {
       const key = renderKey(o)
       const label = renderLabel(o)
@@ -112,8 +112,9 @@ export function RichSelect<T>({
           setTimeout(() => getCurrent()?.click(), 0)
         }
       }
-    
-      document.addEventListener('click', listenToMouse)
+      // below, we wait 20ms so the same click that opened the select doesn't close it. Removing it will cause problems with selects under
+      // labels.
+      setTimeout(() => document.addEventListener('click', listenToMouse), 20)
       document.addEventListener('keydown', listenToKeyboard)
       return () => {
         document.removeEventListener('click', listenToMouse)
@@ -188,7 +189,7 @@ export function RichSelect<T>({
         }}
         aria-hidden
       >
-        {renderHeader?.(value) ?? (value ? (renderOption?.(value) ?? renderLabel(value)) : <span></span>)}
+        {renderHeader?.(value) ?? renderOption?.(value) ?? renderLabel(value)}
         {loading && <ProgressCircular size="xs" className="loader" />}
       </header>
       <div className="selection-panel" aria-hidden>

package/src/components/Select/SimpleSelect.tsx

@@ -26,7 +26,7 @@ export function SimpleSelect<T>({
 
   const renderedOptions = useMemo(() => {
     const valueKey = value ? renderKey(value) : undefined
-    const items = (!value || !required) ? [<option key=""></option>] : []
+    const items = (!value || !required) ? [<option key="">{renderLabel(undefined)}</option>] : []
     options.forEach((o) => {
       const key = renderKey(o)
       items.push(
@@ -38,11 +38,6 @@ export function SimpleSelect<T>({
     return items
   }, [options, value, required])
 
-  const children = <>
-    {required ? undefined : <option></option>}
-    {renderedOptions}
-  </>
-
   return wrap === false ? (
     <CitricComponent
       required={required}
@@ -53,12 +48,12 @@ export function SimpleSelect<T>({
       onFocus={onFocus}
       onBlur={onBlur}
     >
-      {children}
+      {renderedOptions}
     </CitricComponent>
   ) : (
     <CitricComponent tag="div" component="select" aria-busy={loading} {...props}>
       <select required={required} onChange={handleChange} disabled={disabled || loading} onFocus={onFocus} onBlur={onBlur}>
-        {children}
+        {renderedOptions}
       </select>
       {loading && <ProgressCircular className="loader" size="xs" />}
     </CitricComponent>

package/src/components/Select/types.ts

@@ -23,7 +23,7 @@ interface CommonSelectProps<T> extends WithColorScheme {
    * @param option the item to render.
    * @returns a React Node to render.
    */
-  renderLabel?: (value: T) => string,
+  renderLabel?: (value: T | undefined) => string,
   /**
    * A function to render the item value, a unique identifier for the option.
    * @example
@@ -94,7 +94,7 @@ export interface RichSelectProps<T> extends CommonSelectProps<T> {
    * @param value the option.
    * @returns the React Node.
    */
-  renderOption?: (value: T) => React.ReactNode,
+  renderOption?: (value: T | undefined) => React.ReactNode,
   /**
    * A function to render the selected option in the header.
    * 
@@ -118,4 +118,4 @@ export interface RichSelectProps<T> extends CommonSelectProps<T> {
 
 export type BaseSelectProps<T> = SimpleSelectProps<T> | RichSelectProps<T>
 
-export type SelectProps<T> = HTMLExtension<'div', BaseSelectProps<T>, 'onChange' | 'children'>
+export type SelectProps<T> = HTMLExtension<'div', BaseSelectProps<T>>

package/src/components/SelectBox.tsx

@@ -70,7 +70,7 @@ interface RadioProps<T> extends CommonSelectBoxProps<T> {
 
 export type BaseSelectBoxProps<T> = RadioProps<T> | CheckboxProps<T>
 
-export type SelectBoxProps<T> = HTMLExtension<'div', BaseSelectBoxProps<T>, 'onChange'>
+export type SelectBoxProps<T> = HTMLExtension<'div', BaseSelectBoxProps<T>>
 
 export function SelectBox<T>({
   multiple,

package/src/components/Skeleton.tsx

@@ -29,7 +29,7 @@ export interface BaseSkeletonProps {
   bgLevel?: 400 | 500 | 600, 
 }
 
-export type SkeletonProps = HTMLExtension<'div', BaseSkeletonProps, 'children'>
+export type SkeletonProps = HTMLExtension<'div', BaseSkeletonProps>
 
 export const Skeleton = ({ appearance, className, style, width, height, bgLevel, ...props }: SkeletonProps) =>
   <CitricComponent

package/src/components/Slider.tsx

@@ -32,7 +32,7 @@ export interface BaseSliderProps extends WithColorScheme, WithColorPalette {
   renderValue?: (value: number) => string,
 }
 
-export type SliderProps =  HTMLExtension<'input', BaseSliderProps, 'children' | 'type' | 'value' | 'onChange'>
+export type SliderProps =  HTMLExtension<'input', BaseSliderProps>
 
 export const Slider = (
   { value, onChange, min, max, style, showValue, renderValue, colorPalette, colorScheme, className, ...props }: SliderProps,

package/src/components/Stepper.tsx

@@ -57,7 +57,7 @@ export interface BaseStepperProps<Key extends string> extends BaseTabsProps<Key>
   },
 }
 
-export type StepperProps<Key extends string> = HTMLExtension<'div', BaseStepperProps<Key>, 'children' | 'value' | 'onChange'>
+export type StepperProps<Key extends string> = HTMLExtension<'div', BaseStepperProps<Key>>
 
 function getTabsWithDisabled<Key extends string>(tabs: Tab<Key>[], value: Key | undefined) {
   let index = findSelectedIndex(tabs, value ?? '')

package/src/components/Switch.tsx

@@ -7,7 +7,7 @@ interface Props extends WithColorScheme {
   children?: React.ReactNode,
 }
 
-export type SwitchProps = HTMLExtension<'input', Props, 'type'>
+export type SwitchProps = HTMLExtension<'input', Props>
 
 export const Switch = ({ value, onChange, children, className, style, ...props }: SwitchProps) => {
   const handleChange = onChange ? () => onChange(!value) : undefined

package/src/components/Tabs/types.ts

@@ -45,4 +45,4 @@ export interface BaseTabsProps<Key extends string> extends WithColorScheme, With
   controller?: TabController<Key>,
 }
 
-export type TabsProps<Key extends string> = HTMLExtension<'div', BaseTabsProps<Key>, 'children' | 'value' | 'onChange'>
+export type TabsProps<Key extends string> = HTMLExtension<'div', BaseTabsProps<Key>>

package/src/components/Textarea.tsx

@@ -6,7 +6,7 @@ export interface BaseTextareaProps extends WithColorScheme {
   onChange?: (value: string) => void,
 }
 
-export type TextareaProps = HTMLExtension<'textarea', BaseTextareaProps, 'onChange'>
+export type TextareaProps = HTMLExtension<'textarea', BaseTextareaProps>
 
 export const Textarea = ({ value, onChange, ...props }: TextareaProps) =>
   <CitricComponent tag="textarea" component="textarea" value={value} onChange={e => onChange?.(e.target.value)} {...props} />

package/src/components/Tooltip.tsx

@@ -24,15 +24,21 @@ export interface BaseTooltipProps extends
    * @default true
    */
   compact?: boolean,
+  /**
+   * Whether or not to disable the tooltip, i.e. not show it.
+   * 
+   * @default false
+   */
+  disabled?: boolean,
 }
 
-export type TooltipProps = HTMLExtension<'div', BaseTooltipProps, 'children' | 'content'>
+export type TooltipProps = HTMLExtension<'div', BaseTooltipProps>
 
 export const Tooltip = (
-  { tooltipId, children, showArrow = true, compact = true, attributes, colorScheme, colorPalette, ...props }: TooltipProps,
+  { tooltipId, children, showArrow = true, compact = true, attributes, colorScheme, colorPalette, disabled, ...props }: TooltipProps,
 ) => {
   const id = useRef(tooltipId || `${Math.random()}`)
-  return (
+  return disabled ? children : (
     <Overlay
       attributes={{
         className: listToClass([attributes?.className, showArrow && 'with-arrow', compact && 'compact']),

package/src/types.ts

@@ -19,40 +19,39 @@ export type TextAppearance = 'body1' | 'body2' | 'code1' | 'code2' | 'display1'
   'overheader1' | 'overheader2' | 'subtitle1' | 'subtitle2' | 'subtitle3' | 'subtitle4'
 
 // increase this list as needed. Generic uses of `JSX.IntrinsicElements` may lead to expensive operations.
-export interface HTMLTag {
-  a: React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>,
-  blockquote: React.DetailedHTMLProps<React.BlockquoteHTMLAttributes<HTMLQuoteElement>, HTMLQuoteElement>,
-  button: React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>,
-  div: React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>,
-  form: React.DetailedHTMLProps<React.FormHTMLAttributes<HTMLFormElement>, HTMLFormElement>,
-  h1: React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>,
-  h2: React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>,
-  h3: React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>,
-  h4: React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>,
-  h5: React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>,
-  h6: React.DetailedHTMLProps<React.HTMLAttributes<HTMLHeadingElement>, HTMLHeadingElement>,
-  hr: React.DetailedHTMLProps<React.HTMLAttributes<HTMLHRElement>, HTMLHRElement>,
-  i: React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>,
-  image: React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>,
-  input: React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>,
-  label: React.DetailedHTMLProps<React.LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>,
-  li: React.DetailedHTMLProps<React.LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>,
-  nav: React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>,
-  p: React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>,
-  pre: React.DetailedHTMLProps<React.HTMLAttributes<HTMLPreElement>, HTMLPreElement>,
-  select: React.DetailedHTMLProps<React.SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement>,
-  small: React.DetailedHTMLProps<React.HTMLAttributes<HTMLElement>, HTMLElement>,
-  span: React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>,
-  table: React.DetailedHTMLProps<React.TableHTMLAttributes<HTMLTableElement>, HTMLTableElement>,
-  td: React.DetailedHTMLProps<React.TdHTMLAttributes<HTMLTableCellElement>, HTMLTableCellElement>,
-  th: React.DetailedHTMLProps<React.ThHTMLAttributes<HTMLTableCellElement>, HTMLTableCellElement>,
-  tr: React.DetailedHTMLProps<React.HTMLAttributes<HTMLTableRowElement>, HTMLTableRowElement>,
-  textarea: React.DetailedHTMLProps<React.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>,
-  ul: React.DetailedHTMLProps<React.HTMLAttributes<HTMLUListElement>, HTMLUListElement>,
+export type HTMLTag = {
+  a: React.AnchorHTMLAttributes<HTMLAnchorElement>,
+  blockquote: React.BlockquoteHTMLAttributes<HTMLQuoteElement>,
+  button: React.ButtonHTMLAttributes<HTMLButtonElement>,
+  div: React.HTMLAttributes<HTMLDivElement>,
+  form: React.FormHTMLAttributes<HTMLFormElement>,
+  h1: React.HTMLAttributes<HTMLHeadingElement>,
+  h2: React.HTMLAttributes<HTMLHeadingElement>,
+  h3: React.HTMLAttributes<HTMLHeadingElement>,
+  h4: React.HTMLAttributes<HTMLHeadingElement>,
+  h5: React.HTMLAttributes<HTMLHeadingElement>,
+  h6: React.HTMLAttributes<HTMLHeadingElement>,
+  hr: React.HTMLAttributes<HTMLHRElement>,
+  i: React.HTMLAttributes<HTMLElement>,
+  image: React.ImgHTMLAttributes<HTMLImageElement>,
+  input: React.InputHTMLAttributes<HTMLInputElement>,
+  label: React.LabelHTMLAttributes<HTMLLabelElement>,
+  li: React.LiHTMLAttributes<HTMLLIElement>,
+  nav: React.HTMLAttributes<HTMLElement>,
+  p: React.HTMLAttributes<HTMLParagraphElement>,
+  pre: React.HTMLAttributes<HTMLPreElement>,
+  select: React.SelectHTMLAttributes<HTMLSelectElement>,
+  small: React.HTMLAttributes<HTMLElement>,
+  span: React.HTMLAttributes<HTMLSpanElement>,
+  table: React.TableHTMLAttributes<HTMLTableElement>,
+  td: React.TdHTMLAttributes<HTMLTableCellElement>,
+  th: React.ThHTMLAttributes<HTMLTableCellElement>,
+  tr: React.HTMLAttributes<HTMLTableRowElement>,
+  textarea: React.TextareaHTMLAttributes<HTMLTextAreaElement>,
+  ul: React.HTMLAttributes<HTMLUListElement>,
 }
 
-export type HTMLExtension<K extends keyof HTMLTag, Props, Omitted extends string = ''> = 
-  (Omitted extends '' ? HTMLTag[K] : Omit<HTMLTag[K], Omitted>) & Props
+export type HTMLExtension<K extends keyof HTMLTag, Props> = Omit<HTMLTag[K], keyof Props> & Props
 
 export interface WithStyleShortcuts {
   /**

package/src/utils/options.ts

@@ -1,5 +1,7 @@
+import { isNil } from 'lodash'
+
 export function defaultRenderLabel(option: any) {
-  return `${option}`
+  return isNil(option) ? '' : `${option}`
 }
 
 export function defaultRenderKey(option: any) {