@longline/aqua-ui 1.0.345 → 1.0.348

package/containers/Grid/Grid.d.ts

@@ -0,0 +1,71 @@
+import * as React from 'react';
+import { ITestable } from '../../Types';
+interface IGridProps extends ITestable {
+    /** @ignore */
+    className?: string;
+    /** @ignore */
+    children?: React.ReactNode;
+    /**
+     * Column gap in pixels between items on the same row.
+     * @default 8
+     */
+    gap?: number;
+    /**
+     * Row gap in pixels between rows.
+     * @default 0
+     */
+    rowGap?: number;
+    /**
+     * If set, the grid grows to fill its flex container (`flex: 1`).
+     * @default false
+     */
+    fill?: boolean;
+    /**
+     * Optional inline styles applied to the outer element, for one-off overrides
+     * of the default styling.
+     */
+    style?: React.CSSProperties;
+}
+interface IGridItemProps extends ITestable {
+    /** @ignore */
+    className?: string;
+    /** @ignore */
+    children?: React.ReactNode;
+    /**
+     * How many of the grid's 6 columns this item spans (1–6): 6 is a full-width
+     * row, 3 a half, 2 a third, 1 a sixth.
+     * @default 6
+     */
+    weight?: number;
+    /**
+     * Optional inline styles applied to the outer element, for one-off overrides
+     * of the default styling.
+     */
+    style?: React.CSSProperties;
+}
+/**
+ * A `Grid` lays out its `Grid.Item` children on a fixed **6-column** grid — the
+ * layout used across our forms and detail views, where a `Grid.Item`'s `weight`
+ * (1–6) says how many columns it spans. Two `weight={3}` items sit side by side;
+ * a `weight={6}` item is a full-width row.
+ *
+ * ### Props
+ * - `gap`: column gap in pixels (default 8).
+ * - `rowGap`: row gap in pixels (default 0).
+ * - `fill`: grow to fill a flex container.
+ *
+ * @example
+ * ```tsx
+ * <Grid>
+ *   <Grid.Item weight={3}><View label="First name">Ada</View></Grid.Item>
+ *   <Grid.Item weight={3}><View label="Last name">Lovelace</View></Grid.Item>
+ *   <Grid.Item><View label="Address">…</View></Grid.Item>
+ * </Grid>
+ * ```
+ */
+declare const Grid: {
+    (props: IGridProps): React.JSX.Element;
+    displayName: string;
+    Item: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<IGridItemProps, never>> & string & Omit<(props: IGridItemProps) => React.JSX.Element, keyof React.Component<any, {}, any>>;
+};
+export { Grid, IGridProps, IGridItemProps };

package/containers/Grid/Grid.js

@@ -0,0 +1,59 @@
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+import * as React from 'react';
+import styled, { css } from 'styled-components';
+var GridBase = function (props) {
+    return React.createElement("div", { "data-testid": props['data-testid'] || "Grid", className: props.className, style: props.style }, props.children);
+};
+// A fixed 6-column track. `minmax(0, 1fr)` (rather than a bare `1fr`) lets a
+// column shrink below the intrinsic width of its content — without it, a long
+// unbreakable value would blow the column, and the whole grid, past its
+// container. `column-gap` handles the inter-column spacing, so the tracks stay
+// even regardless of the gap size.
+var GridStyled = styled(GridBase)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  display: grid;\n  grid-template-columns: repeat(6, minmax(0, 1fr));\n  column-gap: ", "px;\n  row-gap: ", "px;\n  ", "\n"], ["\n  display: grid;\n  grid-template-columns: repeat(6, minmax(0, 1fr));\n  column-gap: ", "px;\n  row-gap: ", "px;\n  ", "\n"])), function (p) { var _a; return (_a = p.gap) !== null && _a !== void 0 ? _a : 8; }, function (p) { var _a; return (_a = p.rowGap) !== null && _a !== void 0 ? _a : 0; }, function (p) { return p.fill && css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["flex: 1;"], ["flex: 1;"]))); });
+var GridItemBase = function (props) {
+    return React.createElement("div", { "data-testid": props['data-testid'] || "Grid.Item", className: props.className, style: props.style }, props.children);
+};
+// A column-flex so its child (a Form.Field, a View, …) fills the cell width.
+// `min-width: 0` is the flex-item counterpart to the track's `minmax(0, 1fr)`:
+// together they stop a wide child from forcing the cell to overflow.
+var GridItem = styled(GridItemBase)(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  grid-column: span ", ";\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n"], ["\n  grid-column: span ", ";\n  display: flex;\n  flex-direction: column;\n  min-width: 0;\n"])), function (p) { var _a; return (_a = p.weight) !== null && _a !== void 0 ? _a : 6; });
+GridItem.displayName = "Grid.Item";
+/**
+ * A `Grid` lays out its `Grid.Item` children on a fixed **6-column** grid — the
+ * layout used across our forms and detail views, where a `Grid.Item`'s `weight`
+ * (1–6) says how many columns it spans. Two `weight={3}` items sit side by side;
+ * a `weight={6}` item is a full-width row.
+ *
+ * ### Props
+ * - `gap`: column gap in pixels (default 8).
+ * - `rowGap`: row gap in pixels (default 0).
+ * - `fill`: grow to fill a flex container.
+ *
+ * @example
+ * ```tsx
+ * <Grid>
+ *   <Grid.Item weight={3}><View label="First name">Ada</View></Grid.Item>
+ *   <Grid.Item weight={3}><View label="Last name">Lovelace</View></Grid.Item>
+ *   <Grid.Item><View label="Address">…</View></Grid.Item>
+ * </Grid>
+ * ```
+ */
+var Grid = function (props) { return React.createElement(GridStyled, __assign({}, props)); };
+Grid.displayName = "Grid";
+Grid.Item = GridItem;
+export { Grid };
+var templateObject_1, templateObject_2, templateObject_3;

package/containers/Grid/index.d.ts

@@ -0,0 +1 @@
+export { Grid } from './Grid';

package/containers/Grid/index.js

@@ -0,0 +1 @@
+export { Grid } from './Grid';

package/map/Map/Map.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { MapMouseEvent, Map as OriginalMap } from 'mapbox-gl';
-import { ViewState, ViewStateChangeEvent } from 'react-map-gl/mapbox';
+import { Map as GLMap, ViewState, ViewStateChangeEvent } from 'react-map-gl/mapbox';
 import { ITestable } from '../../Types';
 interface IMapProps extends ITestable {
     /** @ignore */
@@ -127,6 +127,12 @@ interface IMapProps extends ITestable {
      * Fired when mouse leaves map.
      */
     onMouseLeave?: (e: MapMouseEvent) => void;
+    /**
+     * Optional hook to rewrite outgoing map resource requests (tiles, style, glyphs,
+     * …) — e.g. to attach an `Authorization` header to authenticated tile requests.
+     * Forwarded verbatim to the underlying react-map-gl map (init-time only).
+     */
+    transformRequest?: React.ComponentProps<typeof GLMap>['transformRequest'];
 }
 declare const ViewStateContext: React.Context<ViewState | null>;
 declare const useViewState: () => ViewState | null;

package/map/Map/Map.js

@@ -224,7 +224,7 @@ var MapBase = function (props) {
         if (props.onMove)
             props.onMove(e);
     };
-    return (React.createElement(GLMap, __assign({ "data-testid": props['data-testid'] || "Map" }, viewState, { mapboxAccessToken: props.token, style: { width: '100%', height: '100%', minHeight: '300px', font: theme.font.bodyMedium }, logoPosition: props.logoPosition, mapStyle: props.style, minZoom: props.minZoom, maxZoom: props.maxZoom, interactiveLayerIds: props.interactiveLayerIds, doubleClickZoom: props.doubleClickZoom, cursor: props.cursor, preserveDrawingBuffer: props.preserveDrawingBuffer, fadeDuration: props.fadeDuration, onMove: handleMove, onMoveEnd: props.onMoveEnd, onMouseMove: props.onMouseMove, onMouseLeave: props.onMouseLeave, onLoad: handleLoad, onClick: props.onClick, onDblClick: props.onDblClick }),
+    return (React.createElement(GLMap, __assign({ "data-testid": props['data-testid'] || "Map" }, viewState, { mapboxAccessToken: props.token, transformRequest: props.transformRequest, style: { width: '100%', height: '100%', minHeight: '300px', font: theme.font.bodyMedium }, logoPosition: props.logoPosition, mapStyle: props.style, minZoom: props.minZoom, maxZoom: props.maxZoom, interactiveLayerIds: props.interactiveLayerIds, doubleClickZoom: props.doubleClickZoom, cursor: props.cursor, preserveDrawingBuffer: props.preserveDrawingBuffer, fadeDuration: props.fadeDuration, onMove: handleMove, onMoveEnd: props.onMoveEnd, onMouseMove: props.onMouseMove, onMouseLeave: props.onMouseLeave, onLoad: handleLoad, onClick: props.onClick, onDblClick: props.onDblClick }),
         props.clipped && React.createElement(React.Fragment, null,
             React.createElement(Source, { type: "raster", tiles: ["https://api.mapbox.com/raster/v1/mapbox.mapbox-terrain-dem-v1/{z}/{x}/{y}.webp?access_token=".concat(props.token)] },
                 React.createElement(Layer, { id: "overlay", type: "raster" })),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@longline/aqua-ui",
-  "version": "1.0.345",
+  "version": "1.0.348",
   "description": "AquaUI",
   "author": "Alexander van Oostenrijk / Longline Environment",
   "license": "Commercial",