lucent-ui 0.8.0 → 0.9.1

package/dist/index.d.ts

@@ -203,6 +203,46 @@ export declare interface CollapsibleProps {
     style?: CSSProperties;
 }
 
+export declare const COLOR_PICKER_MANIFEST: ComponentManifest;
+
+export declare const COLOR_SWATCH_MANIFEST: ComponentManifest;
+
+export declare function ColorPicker({ value, onChange, label, disabled, presetGroups, id, style, }: ColorPickerProps): JSX_2.Element;
+
+export declare namespace ColorPicker {
+    var displayName: string;
+}
+
+export declare interface ColorPickerProps {
+    value?: string;
+    onChange?: (hex: string) => void;
+    label?: string;
+    disabled?: boolean;
+    presetGroups?: ColorPresetGroup[];
+    id?: string;
+    style?: CSSProperties;
+}
+
+export declare interface ColorPresetGroup {
+    label: string;
+    colors: string[];
+}
+
+export declare const ColorSwatch: ForwardRefExoticComponent<ColorSwatchProps & RefAttributes<HTMLButtonElement>>;
+
+export declare interface ColorSwatchProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'color'> {
+    color: string;
+    size?: ColorSwatchSize;
+    shape?: ColorSwatchShape;
+    /** Show a checkerboard underneath — use when color may have transparency */
+    showCheckerboard?: boolean;
+    selected?: boolean;
+}
+
+export declare type ColorSwatchShape = 'circle' | 'square';
+
+export declare type ColorSwatchSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
+
 export declare const COMMAND_PALETTE_MANIFEST: ComponentManifest;
 
 export declare interface CommandItem {
@@ -525,15 +565,24 @@ export declare const Input: ForwardRefExoticComponent<InputProps & RefAttributes
 
 export declare const InputManifest: ComponentManifest;
 
-export declare interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> {
+export declare interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'prefix'> {
     type?: InputType;
+    size?: InputSize;
     label?: string;
     helperText?: string;
     errorText?: string;
+    /** Icon/element floated inside the left edge — does not resize the field */
     leftElement?: ReactNode;
+    /** Icon/element floated inside the right edge — does not resize the field */
     rightElement?: ReactNode;
+    /** Inset label attached to the left of the field (e.g. "$", "https://") */
+    prefix?: ReactNode;
+    /** Inset label attached to the right of the field (e.g. "kg", ".com") */
+    suffix?: ReactNode;
 }
 
+declare type InputSize = 'sm' | 'md' | 'lg';
+
 export declare type InputType = 'text' | 'number' | 'password' | 'email' | 'tel' | 'url' | 'search' | 'color';
 
 export declare function isValidPropDescriptor(prop: unknown): prop is PropDescriptor;
@@ -751,6 +800,38 @@ export declare interface SearchResult {
     label: string;
 }
 
+export declare const SEGMENTED_CONTROL_MANIFEST: ComponentManifest;
+
+export declare function SegmentedControl({ options, value, defaultValue, onChange, size, disabled, fullWidth, id, style, }: SegmentedControlProps): JSX_2.Element;
+
+export declare namespace SegmentedControl {
+    var displayName: string;
+}
+
+export declare interface SegmentedControlProps {
+    options: SegmentedOption[];
+    /** Controlled selected value */
+    value?: string;
+    /** Initial value for uncontrolled usage */
+    defaultValue?: string;
+    onChange?: (value: string) => void;
+    size?: SegmentedControlSize;
+    /** Disabled all options */
+    disabled?: boolean;
+    /** Stretch to fill available width */
+    fullWidth?: boolean;
+    id?: string;
+    style?: CSSProperties;
+}
+
+export declare type SegmentedControlSize = 'sm' | 'md' | 'lg';
+
+export declare interface SegmentedOption {
+    value: string;
+    label: ReactNode;
+    disabled?: boolean;
+}
+
 export declare const Select: ForwardRefExoticComponent<SelectProps & RefAttributes<HTMLSelectElement>>;
 
 export declare const SelectManifest: ComponentManifest;