@enigmax/primitives 0.23.0 → 0.25.0

package/src/react/input/types.ts

@@ -12,6 +12,7 @@
  * are compile errors rather than props that quietly do nothing.
  */
 
+import type { ColorFormat } from "@/core/color";
 import type { ComponentPropsWithoutRef, ReactNode } from "react";
 import type { SearchMatch, FuseConstructor, SearchOptions } from "@/core/search";
 import type { GeneratePasswordOptions, EstimateOptions, PasswordStrengthReport } from "@/core/password";
@@ -135,12 +136,71 @@ export interface SearchOnlyProps<Item = unknown> {
     clearLabel?: string;
 }
 
+/** Which side of the field the picker's panel opens on. `auto` measures the room there is. */
+export type ColorPanelPlacement = "auto" | "top" | "bottom";
+
+/** The picker's accessible names, for a UI that is not in English. */
+export interface ColorLabels {
+    /** The swatch that opens the panel. */
+    open?: string;
+    /** The panel itself. */
+    panel?: string;
+    /** The saturation and brightness square. */
+    area?: string;
+    hue?: string;
+    alpha?: string;
+    eyedropper?: string;
+    swatches?: string;
+    /** The editable readout under the rails. Default "Colour value". */
+    value?: string;
+    /** The button that cycles the readout between HEX, RGB and HSL. Default "Show as". */
+    formatAs?: string;
+    /** The word before the colour in what a screen reader announces. Default "Colour". */
+    color?: string;
+}
+
+/** The half only a colour field has. */
+export interface ColorOnlyProps {
+    type: "color";
+    /**
+     * How the picker writes the value back: `#3b82f6`, `rgb(59, 130, 246)` or an `hsl()`.
+     * Default hex. Whatever the format, every one of them is READ - a pasted `rgb()` in a hex
+     * field is understood and normalized on blur rather than rejected.
+     */
+    format?: ColorFormat;
+    /**
+     * The opacity rail, and the alpha channel in the value. OFF by default: it turns
+     * `#3b82f6` into `#3b82f680`, which is not what a column typed as a 7-character hex, or a
+     * `<input type="color">` on the server side, is expecting.
+     */
+    alpha?: boolean;
+    /** Preset colours under the rails - a brand palette, or the last few that were used. */
+    swatches?: readonly string[];
+    /**
+     * The screen eyedropper, where the browser has one (Chromium today). Default true, and
+     * feature-detected: the button is not rendered at all where the API is missing.
+     */
+    eyedropper?: boolean;
+    /** Which side the panel opens on. Default `auto`, which flips near the bottom of the window. */
+    placement?: ColorPanelPlacement;
+    /**
+     * The panel's baseline stylesheet, injected once. Default true, and the one place this
+     * package ships a look - see `color-styles.ts` for why a picker cannot be unstyled.
+     */
+    styles?: boolean;
+    colorLabels?: ColorLabels;
+}
+
 /** Everything else: one `<input>`, its native props, and no extras to bundle. */
 export interface PlainOnlyProps {
-    type?: Exclude<InputType, "password" | "search">;
+    type?: Exclude<InputType, "password" | "search" | "color">;
 }
 
-export type InputProps<Item = unknown> = InputBaseProps & (PasswordOnlyProps | SearchOnlyProps<Item> | PlainOnlyProps);
+export type InputProps<Item = unknown> = InputBaseProps & (PasswordOnlyProps | SearchOnlyProps<Item> | ColorOnlyProps | PlainOnlyProps);
 
 /** Everything the implementation reads, after the union has done its job at the call site. */
-export type AnyInputProps<Item = unknown> = InputBaseProps & Partial<Omit<PasswordOnlyProps, "type">> & Partial<Omit<SearchOnlyProps<Item>, "type">> & { type?: InputType; };
+export type AnyInputProps<Item = unknown> = InputBaseProps
+    & Partial<Omit<PasswordOnlyProps, "type">>
+    & Partial<Omit<SearchOnlyProps<Item>, "type">>
+    & Partial<Omit<ColorOnlyProps, "type">>
+    & { type?: InputType; };

package/dist/password-C8lG4Zm9.d.ts

@@ -1,71 +0,0 @@
-/**
- * Making a password, and judging one.
- *
- * Both are opt-in. A sign-in form wants neither: offering to generate a password where one
- * already exists is noise, and scoring one the visitor cannot change is worse. They belong
- * on a registration form and a change-password form, which is where an agent should switch
- * them on.
- */
-/** Character classes a generated password can draw from. */
-interface PasswordAlphabet {
-    lowercase?: boolean;
-    uppercase?: boolean;
-    digits?: boolean;
-    symbols?: boolean;
-}
-interface GeneratePasswordOptions extends PasswordAlphabet {
-    /** Default 20. Long beats clever: length is the only term that scales. */
-    length?: number;
-    /**
-     * Drop the characters that are read wrong off a screen or off paper - I l 1 O 0.
-     * Worth it when the password will be typed by hand, not worth the entropy otherwise.
-     */
-    excludeAmbiguous?: boolean;
-    /** Characters to remove from every class, e.g. ones your backend rejects. */
-    exclude?: string;
-    /**
-     * Guarantee at least one character from every class asked for. Most password policies
-     * demand it; it costs a little entropy, because it removes every password that happens
-     * to lack one.
-     */
-    requireEachClass?: boolean;
-}
-/**
- * A random password from the classes asked for.
- *
- * @throws when the runtime has no CSPRNG, or when the options ask for something impossible
- *         (every class excluded, or a length too short to hold one of each).
- */
-declare function generatePassword(options?: GeneratePasswordOptions): string;
-type PasswordScore = 0 | 1 | 2 | 3 | 4;
-interface PasswordStrengthReport {
-    /** 0 worst, 4 best. What the bars under the field render. */
-    score: PasswordScore;
-    /** Estimated bits of entropy after the penalties below. */
-    bits: number;
-    /**
-     * Why it scored what it scored, worst first. Show the first one; showing all of them
-     * turns a hint into a lecture.
-     */
-    warnings: string[];
-    /** Empty field. Render nothing rather than a zero score, which reads as a failure. */
-    empty: boolean;
-}
-interface EstimateOptions {
-    /**
-     * Values the visitor has already typed elsewhere - email, name, company. A password
-     * containing one of them is guessable by anyone who has the sign-up form in front of
-     * them, and no character-class rule catches it.
-     */
-    userInputs?: string[];
-}
-/**
- * Score a password.
- *
- * The bits are an estimate and the bands are a convention, not a measurement - they exist
- * to move a bar, not to certify anything. Swap this out for zxcvbn where the number has to
- * mean something, and check the breach corpus for the cases no estimator can see.
- */
-declare function estimatePasswordStrength(password: string, options?: EstimateOptions): PasswordStrengthReport;
-
-export { type EstimateOptions as E, type GeneratePasswordOptions as G, type PasswordAlphabet as P, type PasswordScore as a, type PasswordStrengthReport as b, estimatePasswordStrength as e, generatePassword as g };