@bcrumbs.net/bc-ui 0.0.14 → 0.0.15

package/package.json

@@ -1,13 +1,16 @@
 {
   "name": "@bcrumbs.net/bc-ui",
   "description": "The UI components of Bread Crumbs portals",
-  "version": "0.0.14",
+  "version": "0.0.15",
   "keyword": [
     "bcrumbs",
     "bc-ui"
   ],
   "peerDependencies": {
-    "react": "18.3.1",
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0",
+    "i18next": "^21.0.0",
+    "react-i18next": "^11.0.0",
     "@emotion/react": "11.5.0",
     "@emotion/styled": "11.3.0",
     "@radix-ui/themes": "^3.1.5",

package/src/index.d.ts

@@ -41,6 +41,8 @@ export * from './lib/dateRangePicker';
 export * from './lib/InputWithSuggestions';
 export * from './lib/textArea';
 export * from './lib/tagDisplay/TagDisplay';
+export * from './lib/coloredTag/getDynamicTagColors';
+export * from './lib/coloredTag/ColoredTag';
 export * from './lib/styledFormInput/StyledFormInput';
 export * from './lib/newComponents/BCNewTable/BCNewTable';
 export * from './lib/newComponents/BCNewDropdown/BCNewDropdown';

package/src/lib/coloredTag/ColoredTag.d.ts

@@ -0,0 +1,15 @@
+export type ColoredTagProps = {
+    /** Text shown inside the tag; also drives the derived color. */
+    label: string;
+    /** Renders larger sizing for mobile layouts. */
+    isMobile?: boolean;
+    /** When provided, shows a remove (×) button and calls this on click. */
+    onRemove?: () => void;
+    /** Accessible title/tooltip for the remove button. */
+    removeTitle?: string;
+};
+/**
+ * Generic tag chip with a stable, near-unique color derived from its label.
+ * Same label always yields the same color across renders.
+ */
+export declare const ColoredTag: ({ label, isMobile, onRemove, removeTitle }: ColoredTagProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/src/lib/coloredTag/getDynamicTagColors.d.ts

@@ -0,0 +1,13 @@
+export type DynamicTagColors = {
+    color: string;
+    backgroundColor: string;
+    borderColor: string;
+};
+/**
+ * Derives a stable, near-unique color set for an arbitrary tag string.
+ *
+ * Unlike the predefined state maps, this hashes the full tag text into an HSL
+ * hue so every distinct tag gets its own color while staying consistent across
+ * renders (same tag -> same color).
+ */
+export declare const getDynamicTagColors: (tag: string) => DynamicTagColors;

package/src/lib/icon/bcicon.d.ts

@@ -461,4 +461,9 @@ export declare const BCIcons: {
         height?: number | undefined;
         fill?: string | undefined;
     }) => import("@emotion/react/jsx-runtime").JSX.Element;
+    Clock2: ({ width, height, fill }: {
+        width?: number | undefined;
+        height?: number | undefined;
+        fill?: string | undefined;
+    }) => import("@emotion/react/jsx-runtime").JSX.Element;
 };

package/src/lib/multiSelector/MutliSelector.d.ts

@@ -1,9 +1,4 @@
-/// <reference types="react" />
 import { BCDropListOptionsType } from '../constants/Droplist';
-export declare const TagContainer: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 export interface MultiSelectorProps {
     onSelect: (value: string | undefined) => void;
     options: BCDropListOptionsType[];