@pglevy/sailwind 0.1.0

package/dist/components/Dropdown/DropdownFieldBase.d.ts

@@ -0,0 +1,54 @@
+import { SAILLabelPosition, SAILMarginSize } from '../../types/sail';
+import * as React from 'react';
+type SearchDisplay = "AUTO" | "ON" | "OFF";
+interface DropdownFieldBaseProps {
+    /** Whether to allow multiple selections */
+    multiple: boolean;
+    /** Text to display as the field label */
+    label?: string;
+    /** Determines where the label appears */
+    labelPosition?: SAILLabelPosition;
+    /** Supplemental text about this field */
+    instructions?: string;
+    /** Determines if a value is required to submit the form */
+    required?: boolean;
+    /** Determines if the field should display as grayed out */
+    disabled?: boolean;
+    /** Text to display when nothing is selected */
+    placeholder?: string;
+    /** Array of options for the user to select */
+    choiceLabels: any[];
+    /** Array of values associated with the corresponding choices */
+    choiceValues: any[];
+    /** Current selected value(s) */
+    value?: any;
+    /** Validation errors to display below the field */
+    validations?: string[];
+    /** Callback when selection changes */
+    saveInto?: (value: any) => void;
+    /** Callback when selection changes (React-style alias for saveInto) */
+    onChange?: (value: any) => void;
+    /** Validation group name (no spaces) */
+    validationGroup?: string;
+    /** Custom message when field is required and not provided */
+    requiredMessage?: string;
+    /** Displays a help icon with tooltip text */
+    helpTooltip?: string;
+    /** Additional text for screen readers */
+    accessibilityText?: string;
+    /** Determines whether component is displayed */
+    showWhen?: boolean;
+    /** Determines when search box displays */
+    searchDisplay?: SearchDisplay;
+    /** Data source (record type) - not implemented in prototype */
+    data?: any;
+    /** Sort configurations - not implemented in prototype */
+    sort?: any[];
+    /** Space added above component */
+    marginAbove?: SAILMarginSize;
+    /** Space added below component */
+    marginBelow?: SAILMarginSize;
+}
+export declare const DropdownFieldBase: React.FC<DropdownFieldBaseProps>;
+export {};
+//# sourceMappingURL=DropdownFieldBase.d.ts.map

package/dist/components/Dropdown/DropdownFieldBase.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DropdownFieldBase.d.ts","sourceRoot":"","sources":["../../../src/components/Dropdown/DropdownFieldBase.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,KAAK,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAGzE,KAAK,aAAa,GAAG,MAAM,GAAG,IAAI,GAAG,KAAK,CAAA;AAE1C,UAAU,sBAAsB;IAC9B,2CAA2C;IAC3C,QAAQ,EAAE,OAAO,CAAA;IACjB,yCAAyC;IACzC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,yCAAyC;IACzC,aAAa,CAAC,EAAE,iBAAiB,CAAA;IACjC,yCAAyC;IACzC,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,+CAA+C;IAC/C,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,8CAA8C;IAC9C,YAAY,EAAE,GAAG,EAAE,CAAA;IACnB,gEAAgE;IAChE,YAAY,EAAE,GAAG,EAAE,CAAA;IACnB,gCAAgC;IAChC,KAAK,CAAC,EAAE,GAAG,CAAA;IACX,mDAAmD;IACnD,WAAW,CAAC,EAAE,MAAM,EAAE,CAAA;IACtB,sCAAsC;IACtC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAA;IAC/B,uEAAuE;IACvE,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK,IAAI,CAAA;IAC/B,wCAAwC;IACxC,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,6DAA6D;IAC7D,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,6CAA6C;IAC7C,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,yCAAyC;IACzC,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,gDAAgD;IAChD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,0CAA0C;IAC1C,aAAa,CAAC,EAAE,aAAa,CAAA;IAC7B,+DAA+D;IAC/D,IAAI,CAAC,EAAE,GAAG,CAAA;IACV,yDAAyD;IACzD,IAAI,CAAC,EAAE,GAAG,EAAE,CAAA;IACZ,kCAAkC;IAClC,WAAW,CAAC,EAAE,cAAc,CAAA;IAC5B,kCAAkC;IAClC,WAAW,CAAC,EAAE,cAAc,CAAA;CAC7B;AAED,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CA+Q9D,CAAA"}

package/dist/components/Dropdown/DropdownFieldBase.js

@@ -0,0 +1,183 @@
+import { jsxs as a, jsx as t, Fragment as K } from "react/jsx-runtime";
+import { useState as E, useRef as T, useEffect as B } from "react";
+import { FieldWrapper as L } from "../shared/FieldWrapper.js";
+import { X as Q, ChevronDown as Y, Search as Z } from "lucide-react";
+const se = ({
+  multiple: c,
+  label: R,
+  labelPosition: D = "ABOVE",
+  instructions: y,
+  required: w = !1,
+  disabled: l = !1,
+  placeholder: F,
+  choiceLabels: i,
+  choiceValues: u,
+  value: n,
+  validations: N = [],
+  saveInto: v,
+  onChange: S,
+  validationGroup: q,
+  requiredMessage: O,
+  helpTooltip: _,
+  accessibilityText: $,
+  showWhen: G = !0,
+  searchDisplay: C = "AUTO",
+  data: V,
+  sort: ee,
+  marginAbove: I = "NONE",
+  marginBelow: U = "STANDARD"
+}) => {
+  if (!G) return null;
+  const f = `dropdown-${Math.random().toString(36).substr(2, 9)}`, [o, m] = E(!1), [p, A] = E(""), h = T(null), g = T(null), b = C === "ON" || C === "AUTO" && i.length > 11, j = p ? i.map((e, r) => ({ label: e, value: u[r], index: r })).filter(
+    (e) => String(e.label).toLowerCase().includes(p.toLowerCase())
+  ) : i.map((e, r) => ({ label: e, value: u[r], index: r })), d = c ? Array.isArray(n) ? n : n ? [n] : [] : n != null ? [n] : [], z = () => {
+    if (d.length === 0)
+      return F || "Select...";
+    if (c)
+      return d.map((e) => {
+        const r = u.indexOf(e);
+        return r >= 0 ? i[r] : e;
+      }).join(", ");
+    {
+      const e = u.indexOf(n);
+      return e >= 0 ? i[e] : n;
+    }
+  }, M = (e) => {
+    const r = S || v;
+    if (!(!r || l))
+      if (c) {
+        const s = Array.isArray(n) ? n : [], k = s.includes(e) ? s.filter((J) => J !== e) : [...s, e];
+        r(k.length > 0 ? k : null);
+      } else
+        r(e), m(!1);
+  }, P = (e) => {
+    e.stopPropagation();
+    const r = S || v;
+    r && !l && r(null);
+  };
+  B(() => {
+    const e = (r) => {
+      h.current && !h.current.contains(r.target) && (m(!1), A(""));
+    };
+    if (o)
+      return document.addEventListener("mousedown", e), () => document.removeEventListener("mousedown", e);
+  }, [o]), B(() => {
+    o && b && g.current && g.current.focus();
+  }, [o, b]);
+  const x = N.length > 0, W = w && d.length === 0 && O, X = /* @__PURE__ */ a("div", { ref: h, className: "relative", children: [
+    /* @__PURE__ */ a(
+      "button",
+      {
+        type: "button",
+        id: f,
+        onClick: () => !l && m(!o),
+        disabled: l,
+        className: [
+          "w-full",
+          "flex items-center justify-between",
+          "px-3 py-2",
+          "border border-gray-200 rounded-sm",
+          "bg-white",
+          "text-base text-left",
+          l ? "opacity-50 cursor-not-allowed bg-gray-50" : "cursor-pointer hover:border-gray-500",
+          x && "border-red-700",
+          "focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
+        ].filter(Boolean).join(" "),
+        "aria-expanded": o,
+        "aria-haspopup": "listbox",
+        "aria-invalid": x,
+        "aria-describedby": y ? `${f}-instructions` : void 0,
+        children: [
+          /* @__PURE__ */ t("span", { className: d.length === 0 ? "text-gray-500" : "text-gray-900", children: z() }),
+          /* @__PURE__ */ a("div", { className: "flex items-center gap-1", children: [
+            d.length > 0 && !l && /* @__PURE__ */ t(
+              Q,
+              {
+                className: "h-4 w-4 text-gray-500 hover:text-gray-700",
+                onClick: P
+              }
+            ),
+            /* @__PURE__ */ t(
+              Y,
+              {
+                className: [
+                  "h-4 w-4 text-gray-500 transition-transform",
+                  o && "transform rotate-180"
+                ].filter(Boolean).join(" ")
+              }
+            )
+          ] })
+        ]
+      }
+    ),
+    o && /* @__PURE__ */ a("div", { className: "absolute z-50 w-full mt-1 bg-white border border-gray-200 rounded-sm shadow-lg max-h-60 overflow-hidden", children: [
+      b && /* @__PURE__ */ t("div", { className: "p-2 border-b border-gray-200", children: /* @__PURE__ */ a("div", { className: "relative", children: [
+        /* @__PURE__ */ t(Z, { className: "absolute left-2 top-1/2 transform -translate-y-1/2 h-4 w-4 text-gray-500" }),
+        /* @__PURE__ */ t(
+          "input",
+          {
+            ref: g,
+            type: "text",
+            value: p,
+            onChange: (e) => A(e.target.value),
+            placeholder: "Search...",
+            className: "w-full pl-8 pr-3 py-1.5 border border-gray-200 rounded-sm text-sm focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
+          }
+        )
+      ] }) }),
+      /* @__PURE__ */ t("div", { className: "overflow-y-auto max-h-48", role: "listbox", children: j.length === 0 ? /* @__PURE__ */ t("div", { className: "px-3 py-2 text-sm text-gray-500", children: "No results found" }) : j.map(({ label: e, value: r }) => {
+        const s = d.includes(r);
+        return /* @__PURE__ */ a(
+          "button",
+          {
+            type: "button",
+            onClick: () => M(r),
+            role: "option",
+            "aria-selected": s,
+            className: [
+              "w-full px-3 py-2 text-left text-base",
+              "hover:bg-gray-100",
+              s && "bg-blue-50 text-blue-700 font-medium",
+              "focus:outline-none focus:bg-gray-100"
+            ].filter(Boolean).join(" "),
+            children: [
+              c && /* @__PURE__ */ t(
+                "input",
+                {
+                  type: "checkbox",
+                  checked: s,
+                  readOnly: !0,
+                  className: "mr-2 h-4 w-4 rounded border-gray-200 text-blue-500"
+                }
+              ),
+              e
+            ]
+          },
+          r
+        );
+      }) })
+    ] })
+  ] }), H = /* @__PURE__ */ a(K, { children: [
+    x && /* @__PURE__ */ t("div", { id: `${f}-error`, className: "mt-2", role: "alert", children: N.map((e, r) => /* @__PURE__ */ t("p", { className: "text-sm text-red-700", children: e }, r)) }),
+    W && /* @__PURE__ */ t("p", { className: "text-sm text-red-700 mt-2", role: "alert", children: O })
+  ] });
+  return /* @__PURE__ */ t(
+    L,
+    {
+      label: R,
+      labelPosition: D,
+      required: w,
+      instructions: y,
+      helpTooltip: _,
+      accessibilityText: $,
+      inputId: f,
+      marginAbove: I,
+      marginBelow: U,
+      footer: H,
+      children: X
+    }
+  );
+};
+export {
+  se as DropdownFieldBase
+};

package/dist/components/Dropdown/MultipleDropdownField.d.ts

@@ -0,0 +1,85 @@
+import { SAILLabelPosition, SAILMarginSize } from '../../types/sail';
+import * as React from 'react';
+type SearchDisplay = "AUTO" | "ON" | "OFF";
+/**
+ * Displays a list of choices for the user to select multiple items
+ * Maps to SAIL a!multipleDropdownField()
+ */
+export interface MultipleDropdownFieldProps {
+    /** Text to display as the field label */
+    label?: string;
+    /** Supplemental text about this field */
+    instructions?: string;
+    /** Determines if a value is required to submit the form */
+    required?: boolean;
+    /** Determines if the field should display as grayed out */
+    disabled?: boolean;
+    /** Text to display in the field when it is empty */
+    placeholder?: string;
+    /** Array of options for the user to select */
+    choiceLabels: any[];
+    /** Array of values associated with the corresponding choices */
+    choiceValues: any[];
+    /** Values of choices to display as selected */
+    value?: any[];
+    /** Validation errors to display below the field */
+    validations?: string[];
+    /** Callback when the user changes the selections */
+    saveInto?: (value: any[] | null) => void;
+    /** Callback when the user changes the selections (React-style alias for saveInto) */
+    onChange?: (value: any[] | null) => void;
+    /** Validation group name (no spaces) */
+    validationGroup?: string;
+    /** Custom message when field is required and not provided */
+    requiredMessage?: string;
+    /** Determines where the label appears */
+    labelPosition?: SAILLabelPosition;
+    /** Displays a help icon with tooltip text */
+    helpTooltip?: string;
+    /** Additional text for screen readers */
+    accessibilityText?: string;
+    /** Determines whether component is displayed */
+    showWhen?: boolean;
+    /** Determines when a search box displays above options */
+    searchDisplay?: SearchDisplay;
+    /** Data source (record type) - not implemented in prototype */
+    data?: any;
+    /** Sort configurations - not implemented in prototype */
+    sort?: any[];
+    /** Space added above component */
+    marginAbove?: SAILMarginSize;
+    /** Space added below component */
+    marginBelow?: SAILMarginSize;
+}
+/**
+ * Multi-select dropdown field component
+ *
+ * @example
+ * ```tsx
+ * <MultipleDropdownField
+ *   label="Language"
+ *   instructions="Which language(s) are you proficient in?"
+ *   choiceLabels={["English", "Spanish", "French", "German"]}
+ *   choiceValues={["en_US", "es_ES", "fr_FR", "de_DE"]}
+ *   value={selectedLanguages}
+ *   saveInto={(value) => setSelectedLanguages(value)}
+ *   searchDisplay="AUTO"
+ * />
+ * ```
+ *
+ * SAIL Translation:
+ * ```sail
+ * a!multipleDropdownField(
+ *   label: "Language",
+ *   instructions: "Which language(s) are you proficient in?",
+ *   choiceLabels: {"English", "Spanish", "French", "German"},
+ *   choiceValues: {"en_US", "es_ES", "fr_FR", "de_DE"},
+ *   value: local!language,
+ *   saveInto: local!language,
+ *   searchDisplay: "AUTO"
+ * )
+ * ```
+ */
+export declare const MultipleDropdownField: React.FC<MultipleDropdownFieldProps>;
+export {};
+//# sourceMappingURL=MultipleDropdownField.d.ts.map

package/dist/components/Dropdown/MultipleDropdownField.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MultipleDropdownField.d.ts","sourceRoot":"","sources":["../../../src/components/Dropdown/MultipleDropdownField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAA;AAEzE,KAAK,aAAa,GAAG,MAAM,GAAG,IAAI,GAAG,KAAK,CAAA;AAE1C;;;GAGG;AACH,MAAM,WAAW,0BAA0B;IACzC,yCAAyC;IACzC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,yCAAyC;IACzC,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,oDAAoD;IACpD,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,8CAA8C;IAC9C,YAAY,EAAE,GAAG,EAAE,CAAA;IACnB,gEAAgE;IAChE,YAAY,EAAE,GAAG,EAAE,CAAA;IACnB,+CAA+C;IAC/C,KAAK,CAAC,EAAE,GAAG,EAAE,CAAA;IACb,mDAAmD;IACnD,WAAW,CAAC,EAAE,MAAM,EAAE,CAAA;IACtB,oDAAoD;IACpD,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,EAAE,GAAG,IAAI,KAAK,IAAI,CAAA;IACxC,qFAAqF;IACrF,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,EAAE,GAAG,IAAI,KAAK,IAAI,CAAA;IACxC,wCAAwC;IACxC,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,6DAA6D;IAC7D,eAAe,CAAC,EAAE,MAAM,CAAA;IACxB,yCAAyC;IACzC,aAAa,CAAC,EAAE,iBAAiB,CAAA;IACjC,6CAA6C;IAC7C,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,yCAAyC;IACzC,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,gDAAgD;IAChD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,0DAA0D;IAC1D,aAAa,CAAC,EAAE,aAAa,CAAA;IAC7B,+DAA+D;IAC/D,IAAI,CAAC,EAAE,GAAG,CAAA;IACV,yDAAyD;IACzD,IAAI,CAAC,EAAE,GAAG,EAAE,CAAA;IACZ,kCAAkC;IAClC,WAAW,CAAC,EAAE,cAAc,CAAA;IAC5B,kCAAkC;IAClC,WAAW,CAAC,EAAE,cAAc,CAAA;CAC7B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,0BAA0B,CAEtE,CAAA"}

package/dist/components/Dropdown/MultipleDropdownField.js

@@ -0,0 +1,7 @@
+import { jsx as r } from "react/jsx-runtime";
+import "react";
+import { DropdownFieldBase as t } from "./DropdownFieldBase.js";
+const l = (o) => /* @__PURE__ */ r(t, { multiple: !0, ...o });
+export {
+  l as MultipleDropdownField
+};

package/dist/components/Dropdown/index.d.ts

@@ -0,0 +1,5 @@
+export { DropdownField } from './DropdownField';
+export type { DropdownFieldProps } from './DropdownField';
+export { MultipleDropdownField } from './MultipleDropdownField';
+export type { MultipleDropdownFieldProps } from './MultipleDropdownField';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Dropdown/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Dropdown/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAA;AAC/C,YAAY,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAA;AACzD,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAA;AAC/D,YAAY,EAAE,0BAA0B,EAAE,MAAM,yBAAyB,CAAA"}

package/dist/components/Heading/HeadingField.d.ts

@@ -0,0 +1,48 @@
+import { SAILAlign, SAILMarginSize, SAILSemanticColor } from '../../types/sail';
+import * as React from 'react';
+/**
+ * Heading size values matching SAIL's size parameter
+ */
+type HeadingSize = "EXTRA_SMALL" | "SMALL" | "MEDIUM" | "MEDIUM_PLUS" | "LARGE" | "LARGE_PLUS";
+/**
+ * Heading tag values for accessibility
+ */
+type HeadingTag = "H1" | "H2" | "H3" | "H4" | "H5" | "H6";
+/**
+ * Font weight values matching SAIL's fontWeight parameter
+ */
+type FontWeight = "LIGHT" | "REGULAR" | "SEMI_BOLD" | "BOLD";
+/**
+ * Props for the HeadingField component
+ */
+export interface HeadingFieldProps {
+    /** Text to display in the header */
+    text: string;
+    /** Determines the text size */
+    size?: HeadingSize;
+    /** Determines the heading tag for screen readers */
+    headingTag?: HeadingTag;
+    /** Determines the label color - hex color or semantic color */
+    color?: string | SAILSemanticColor;
+    /** Determines the thickness of the text */
+    fontWeight?: FontWeight;
+    /** Link to apply to the text (simplified - accepts onClick handler) */
+    link?: () => void;
+    /** Determines whether the component is displayed */
+    showWhen?: boolean;
+    /** Determines alignment of the text */
+    align?: SAILAlign;
+    /** Determines space added above the layout */
+    marginAbove?: SAILMarginSize;
+    /** Determines space added below the layout */
+    marginBelow?: SAILMarginSize;
+    /** Prevents wrapping to multiple lines when true */
+    preventWrapping?: boolean;
+}
+/**
+ * Displays a heading with configurations for color, size, and font weight.
+ * Supports heading accessibility tags for screen readers.
+ */
+export declare const HeadingField: React.FC<HeadingFieldProps>;
+export {};
+//# sourceMappingURL=HeadingField.d.ts.map

package/dist/components/Heading/HeadingField.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"HeadingField.d.ts","sourceRoot":"","sources":["../../../src/components/Heading/HeadingField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,iBAAiB,EAAE,MAAM,kBAAkB,CAAA;AAEpF;;GAEG;AACH,KAAK,WAAW,GAAG,aAAa,GAAG,OAAO,GAAG,QAAQ,GAAG,aAAa,GAAG,OAAO,GAAG,YAAY,CAAA;AAE9F;;GAEG;AACH,KAAK,UAAU,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAA;AAEzD;;GAEG;AACH,KAAK,UAAU,GAAG,OAAO,GAAG,SAAS,GAAG,WAAW,GAAG,MAAM,CAAA;AAE5D;;GAEG;AACH,MAAM,WAAW,iBAAiB;IAChC,oCAAoC;IACpC,IAAI,EAAE,MAAM,CAAA;IACZ,+BAA+B;IAC/B,IAAI,CAAC,EAAE,WAAW,CAAA;IAClB,oDAAoD;IACpD,UAAU,CAAC,EAAE,UAAU,CAAA;IACvB,+DAA+D;IAC/D,KAAK,CAAC,EAAE,MAAM,GAAG,iBAAiB,CAAA;IAClC,2CAA2C;IAC3C,UAAU,CAAC,EAAE,UAAU,CAAA;IACvB,uEAAuE;IACvE,IAAI,CAAC,EAAE,MAAM,IAAI,CAAA;IACjB,oDAAoD;IACpD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,uCAAuC;IACvC,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,8CAA8C;IAC9C,WAAW,CAAC,EAAE,cAAc,CAAA;IAC5B,8CAA8C;IAC9C,WAAW,CAAC,EAAE,cAAc,CAAA;IAC5B,oDAAoD;IACpD,eAAe,CAAC,EAAE,OAAO,CAAA;CAC1B;AAED;;;GAGG;AACH,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CA2IpD,CAAA"}

package/dist/components/Heading/HeadingField.js

@@ -0,0 +1,103 @@
+import { jsx as r } from "react/jsx-runtime";
+import "react";
+const b = ({
+  text: s,
+  size: o = "MEDIUM_PLUS",
+  headingTag: i,
+  color: t = "STANDARD",
+  fontWeight: c = "REGULAR",
+  link: E,
+  showWhen: S = !0,
+  align: A = "START",
+  marginAbove: m = "NONE",
+  marginBelow: u = "MORE",
+  preventWrapping: L = !1
+}) => {
+  if (!S) return null;
+  const N = {
+    EXTRA_SMALL: "text-xs",
+    // 12px
+    SMALL: "text-sm",
+    // 14px
+    MEDIUM: "text-lg",
+    // 18px
+    MEDIUM_PLUS: "text-xl",
+    // 20px
+    LARGE: "text-2xl",
+    // 24px
+    LARGE_PLUS: "text-3xl"
+    // 28px (custom override)
+  }, M = {
+    LIGHT: "font-light",
+    // 300
+    REGULAR: "font-normal",
+    // 400
+    SEMI_BOLD: "font-semibold",
+    // 600
+    BOLD: "font-bold"
+    // 700
+  }, R = {
+    START: "text-left",
+    CENTER: "text-center",
+    END: "text-right"
+  }, g = {
+    NONE: "mt-0",
+    EVEN_LESS: "mt-1",
+    LESS: "mt-2",
+    STANDARD: "mt-4",
+    MORE: "mt-6",
+    EVEN_MORE: "mt-8"
+  }, D = {
+    NONE: "mb-0",
+    EVEN_LESS: "mb-1",
+    LESS: "mb-2",
+    STANDARD: "mb-4",
+    MORE: "mb-6",
+    EVEN_MORE: "mb-8"
+  }, T = {
+    ACCENT: "text-blue-500",
+    POSITIVE: "text-green-700",
+    NEGATIVE: "text-red-700",
+    SECONDARY: "text-gray-700",
+    STANDARD: "text-gray-900"
+  }, e = ((n) => ["ACCENT", "POSITIVE", "NEGATIVE", "SECONDARY", "STANDARD"].includes(n))(t) ? { className: T[t] } : { style: { color: t } }, f = i || ((n) => {
+    switch (n) {
+      case "LARGE_PLUS":
+        return "H1";
+      case "LARGE":
+        return "H1";
+      case "MEDIUM_PLUS":
+        return "H2";
+      case "MEDIUM":
+        return "H3";
+      case "SMALL":
+        return "H4";
+      case "EXTRA_SMALL":
+        return "H5";
+      default:
+        return "H2";
+    }
+  })(o), x = [
+    N[o],
+    M[c],
+    R[A],
+    g[m],
+    D[u],
+    L && "truncate",
+    e.className
+  ].filter(Boolean).join(" "), a = f.toLowerCase(), l = {
+    className: x,
+    ...e.style && { style: e.style }
+  };
+  return E ? /* @__PURE__ */ r(a, { ...l, children: /* @__PURE__ */ r(
+    "button",
+    {
+      onClick: E,
+      className: "text-inherit underline hover:no-underline focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2",
+      children: s
+    }
+  ) }) : /* @__PURE__ */ r(a, { ...l, children: s });
+};
+export {
+  b as HeadingField
+};

package/dist/components/Heading/index.d.ts

@@ -0,0 +1,3 @@
+export { HeadingField } from './HeadingField';
+export type { HeadingFieldProps } from './HeadingField';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Heading/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Heading/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAC7C,YAAY,EAAE,iBAAiB,EAAE,MAAM,gBAAgB,CAAA"}

package/dist/components/Image/DocumentImage.d.ts

@@ -0,0 +1,20 @@
+export interface DocumentImageProps {
+    /** The image file path (relative to public directory) */
+    document: string;
+    /** Alternate text for accessibility and screen readers */
+    altText?: string;
+    /** Optional caption text for mouseover and slideshow mode */
+    caption?: string;
+    /** Link behavior when image is clicked */
+    link?: () => void;
+    /** Controls visibility of the image */
+    showWhen?: boolean;
+}
+/**
+ * Document image interface for use within ImageField
+ * Maps to SAIL's a!documentImage() function
+ *
+ * This is not a React component - it's a data structure
+ * that gets processed by ImageField for rendering
+ */
+//# sourceMappingURL=DocumentImage.d.ts.map

package/dist/components/Image/DocumentImage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DocumentImage.d.ts","sourceRoot":"","sources":["../../../src/components/Image/DocumentImage.tsx"],"names":[],"mappings":"AAAA,MAAM,WAAW,kBAAkB;IACjC,yDAAyD;IACzD,QAAQ,EAAE,MAAM,CAAA;IAChB,0DAA0D;IAC1D,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,6DAA6D;IAC7D,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,0CAA0C;IAC1C,IAAI,CAAC,EAAE,MAAM,IAAI,CAAA;IACjB,uCAAuC;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB;AAED;;;;;;GAMG"}

package/dist/components/Image/ImageField.d.ts

@@ -0,0 +1,42 @@
+import { SAILLabelPosition, SAILMarginSize, SAILAlign } from '../../types/sail';
+import { DocumentImageProps } from './DocumentImage';
+import { UserImageProps } from './UserImage';
+import * as React from 'react';
+type ImageFieldImage = DocumentImageProps | UserImageProps;
+type ImageSize = "ICON" | "ICON_PLUS" | "TINY" | "EXTRA_SMALL" | "SMALL" | "SMALL_PLUS" | "MEDIUM" | "MEDIUM_PLUS" | "LARGE" | "LARGE_PLUS" | "EXTRA_LARGE" | "FIT" | "GALLERY";
+type ImageStyle = "STANDARD" | "AVATAR";
+export interface ImageFieldProps {
+    /** Text to display as the field label */
+    label?: string;
+    /** Determines where the label appears */
+    labelPosition?: SAILLabelPosition;
+    /** Supplemental text about this field */
+    instructions?: string;
+    /** Help tooltip text (max 500 characters) */
+    helpTooltip?: string;
+    /** Array of images to display (supports both document and user images) */
+    images: ImageFieldImage[];
+    /** Controls visibility of the component */
+    showWhen?: boolean;
+    /** Determines how the images are sized */
+    size?: ImageSize;
+    /** Determines whether images can be viewed larger when clicked */
+    isThumbnail?: boolean;
+    /** Determines how the images are rendered */
+    style?: ImageStyle;
+    /** Determines alignment of the images */
+    align?: SAILAlign;
+    /** Additional text for screen readers */
+    accessibilityText?: string;
+    /** Margin above the component */
+    marginAbove?: SAILMarginSize;
+    /** Margin below the component */
+    marginBelow?: SAILMarginSize;
+}
+/**
+ * Displays an array of images from document management or web
+ * Maps to SAIL's a!imageField() function
+ */
+export declare const ImageField: React.FC<ImageFieldProps>;
+export {};
+//# sourceMappingURL=ImageField.d.ts.map

package/dist/components/Image/ImageField.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ImageField.d.ts","sourceRoot":"","sources":["../../../src/components/Image/ImageField.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,KAAK,EAAE,iBAAiB,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAA;AACpF,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAA;AACzD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAA;AAGjD,KAAK,eAAe,GAAG,kBAAkB,GAAG,cAAc,CAAA;AAO1D,KAAK,SAAS,GACV,MAAM,GACN,WAAW,GACX,MAAM,GACN,aAAa,GACb,OAAO,GACP,YAAY,GACZ,QAAQ,GACR,aAAa,GACb,OAAO,GACP,YAAY,GACZ,aAAa,GACb,KAAK,GACL,SAAS,CAAA;AAEb,KAAK,UAAU,GAAG,UAAU,GAAG,QAAQ,CAAA;AAEvC,MAAM,WAAW,eAAe;IAC9B,yCAAyC;IACzC,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,yCAAyC;IACzC,aAAa,CAAC,EAAE,iBAAiB,CAAA;IACjC,yCAAyC;IACzC,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,6CAA6C;IAC7C,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,0EAA0E;IAC1E,MAAM,EAAE,eAAe,EAAE,CAAA;IACzB,2CAA2C;IAC3C,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,0CAA0C;IAC1C,IAAI,CAAC,EAAE,SAAS,CAAA;IAChB,kEAAkE;IAClE,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,6CAA6C;IAC7C,KAAK,CAAC,EAAE,UAAU,CAAA;IAClB,yCAAyC;IACzC,KAAK,CAAC,EAAE,SAAS,CAAA;IACjB,yCAAyC;IACzC,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,iCAAiC;IACjC,WAAW,CAAC,EAAE,cAAc,CAAA;IAC5B,iCAAiC;IACjC,WAAW,CAAC,EAAE,cAAc,CAAA;CAC7B;AAED;;;GAGG;AACH,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAwLhD,CAAA"}