@octaviaflow/core 3.1.0-beta.97 → 3.1.0-beta.99
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,33 +1,3 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* OrgSwitcher — move between the organizations a person belongs to.
|
|
3
|
-
*
|
|
4
|
-
* FOUR variants, because "switch org" is a different job depending on where it
|
|
5
|
-
* sits and how many orgs a person has. They are offered side by side so a
|
|
6
|
-
* product can pick the one that fits its chrome, not so it can use all four.
|
|
7
|
-
*
|
|
8
|
-
* menu a labelled trigger in the top bar → dropdown list.
|
|
9
|
-
* The default. Reads as "you are in X"; the switch is secondary.
|
|
10
|
-
* rail a vertical column of org avatars, always visible.
|
|
11
|
-
* For people who live in 2–5 orgs and switch constantly; costs
|
|
12
|
-
* permanent horizontal space and does not scale past ~8.
|
|
13
|
-
* search a trigger that opens a filtered list.
|
|
14
|
-
* The only one that works at 20+ orgs; slower for 3.
|
|
15
|
-
* inline a flat list, no popover.
|
|
16
|
-
* For settings pages and the post-login picker, where the choice
|
|
17
|
-
* IS the screen.
|
|
18
|
-
*
|
|
19
|
-
* ── The thing that shapes the whole component ──────────────────────────────
|
|
20
|
-
* Switching organization is NOT a client-side filter. The org a session can
|
|
21
|
-
* see is a signed claim in the access token, so switching re-mints the
|
|
22
|
-
* session server-side. That means it is a round-trip that can fail, and the
|
|
23
|
-
* UI must not pretend otherwise: pass `switchingOrgId` while it is in flight
|
|
24
|
-
* and the target row shows a pending state, the control is disabled, and
|
|
25
|
-
* nothing appears to have changed until the caller says it has.
|
|
26
|
-
*
|
|
27
|
-
* Rendering a switch as instant would be a lie, and a confusing one — the
|
|
28
|
-
* data on screen still belongs to the previous org until the new token
|
|
29
|
-
* arrives.
|
|
30
|
-
*/
|
|
31
1
|
import { type ComponentPropsWithoutRef } from "react";
|
|
32
2
|
export type OrgSwitcherVariant = "menu" | "rail" | "search" | "inline";
|
|
33
3
|
export interface OrgSwitcherOrg {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"OrgSwitcher.d.ts","sourceRoot":"","sources":["../../../src/components/OrgSwitcher/OrgSwitcher.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"OrgSwitcher.d.ts","sourceRoot":"","sources":["../../../src/components/OrgSwitcher/OrgSwitcher.tsx"],"names":[],"mappings":"AAyCA,OAAO,EACL,KAAK,wBAAwB,EAO9B,MAAM,OAAO,CAAC;AAKf,MAAM,MAAM,kBAAkB,GAAG,MAAM,GAAG,MAAM,GAAG,QAAQ,GAAG,QAAQ,CAAC;AAEvE,MAAM,WAAW,cAAc;IAC7B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,kDAAkD;IAClD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,yEAAyE;IACzE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,+DAA+D;IAC/D,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,gBACf,SAAQ,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC;IACzD,aAAa,EAAE,cAAc,EAAE,CAAC;IAChC,gDAAgD;IAChD,YAAY,EAAE,MAAM,CAAC;IACrB,4EAA4E;IAC5E,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,OAAO,CAAC,EAAE,kBAAkB,CAAC;IAC7B;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC/B,mEAAmE;IACnE,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB;;;;;;;;;;;OAWG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,uCAAuC;IACvC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AA4DD,wBAAgB,WAAW,CAAC,EAC1B,aAAa,EACb,YAAY,EACZ,QAAQ,EACR,OAAgB,EAChB,cAAqB,EACrB,QAAQ,EACR,WAAmC,EACnC,IAAW,EACX,IAAY,EACZ,SAAiC,EACjC,SAAS,EACT,GAAG,IAAI,EACR,EAAE,QAAQ,CAAC,gBAAgB,CAAC,2CAoN5B"}
|
package/dist/index.cjs
CHANGED
|
@@ -11122,9 +11122,8 @@ var ConditionBuilder = (0, import_react66.forwardRef)(function ConditionBuilder2
|
|
|
11122
11122
|
ConditionBuilder.displayName = "ConditionBuilder";
|
|
11123
11123
|
|
|
11124
11124
|
// src/components/OrgSwitcher/OrgSwitcher.tsx
|
|
11125
|
-
var import_react67 = require("react");
|
|
11126
11125
|
var import_icons15 = require("@octaviaflow/icons");
|
|
11127
|
-
var
|
|
11126
|
+
var import_react67 = require("react");
|
|
11128
11127
|
var import_jsx_runtime50 = require("react/jsx-runtime");
|
|
11129
11128
|
var initialsFrom = (name) => name.split(/\s+/).filter(Boolean).map((w) => w[0]).join("").slice(0, 2).toUpperCase();
|
|
11130
11129
|
function OrgRow({
|
|
@@ -11145,8 +11144,8 @@ function OrgRow({
|
|
|
11145
11144
|
disabled: disabled || isCurrent,
|
|
11146
11145
|
onClick: onSelect,
|
|
11147
11146
|
className: cn(
|
|
11148
|
-
|
|
11149
|
-
isCurrent &&
|
|
11147
|
+
"ods-org-switcher__row",
|
|
11148
|
+
isCurrent && "ods-org-switcher__row--current"
|
|
11150
11149
|
),
|
|
11151
11150
|
children: [
|
|
11152
11151
|
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
@@ -11158,12 +11157,12 @@ function OrgRow({
|
|
|
11158
11157
|
alt: org.name
|
|
11159
11158
|
}
|
|
11160
11159
|
),
|
|
11161
|
-
/* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("span", { className:
|
|
11162
|
-
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className:
|
|
11163
|
-
meta2 && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className:
|
|
11160
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("span", { className: "ods-org-switcher__row-text", children: [
|
|
11161
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "ods-org-switcher__row-name", children: org.name }),
|
|
11162
|
+
meta2 && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "ods-org-switcher__row-meta", children: meta2 })
|
|
11164
11163
|
] }),
|
|
11165
11164
|
isSwitching && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Spinner, { size: "sm", label: `Switching to ${org.name}` }),
|
|
11166
|
-
isCurrent && !isSwitching && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_icons15.CheckmarkIcon, { size: "sm", "aria-hidden": "true", className:
|
|
11165
|
+
isCurrent && !isSwitching && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_icons15.CheckmarkIcon, { size: "sm", "aria-hidden": "true", className: "ods-org-switcher__tick" })
|
|
11167
11166
|
]
|
|
11168
11167
|
}
|
|
11169
11168
|
);
|
|
@@ -11232,12 +11231,12 @@ function OrgSwitcher({
|
|
|
11232
11231
|
},
|
|
11233
11232
|
org.id
|
|
11234
11233
|
)),
|
|
11235
|
-
orgs.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("p", { className:
|
|
11234
|
+
orgs.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("p", { className: "ods-org-switcher__empty", children: "No organizations match." }),
|
|
11236
11235
|
onCreate && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
11237
11236
|
"button",
|
|
11238
11237
|
{
|
|
11239
11238
|
type: "button",
|
|
11240
|
-
className:
|
|
11239
|
+
className: "ods-org-switcher__create",
|
|
11241
11240
|
onClick: () => {
|
|
11242
11241
|
setOpen(false);
|
|
11243
11242
|
onCreate();
|
|
@@ -11252,9 +11251,9 @@ function OrgSwitcher({
|
|
|
11252
11251
|
"div",
|
|
11253
11252
|
{
|
|
11254
11253
|
ref: rootRef,
|
|
11255
|
-
className: cn(
|
|
11254
|
+
className: cn("ods-org-switcher", "ods-org-switcher--inline", className),
|
|
11256
11255
|
...rest,
|
|
11257
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { role: "listbox", "aria-label": ariaLabel, className:
|
|
11256
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { role: "listbox", "aria-label": ariaLabel, className: "ods-org-switcher__list", children: renderRows(organizations) })
|
|
11258
11257
|
}
|
|
11259
11258
|
);
|
|
11260
11259
|
}
|
|
@@ -11263,9 +11262,9 @@ function OrgSwitcher({
|
|
|
11263
11262
|
"div",
|
|
11264
11263
|
{
|
|
11265
11264
|
ref: rootRef,
|
|
11266
|
-
className: cn(
|
|
11265
|
+
className: cn("ods-org-switcher", "ods-org-switcher--rail", className),
|
|
11267
11266
|
...rest,
|
|
11268
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { role: "listbox", "aria-label": ariaLabel, className:
|
|
11267
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { role: "listbox", "aria-label": ariaLabel, className: "ods-org-switcher__rail", children: organizations.map((org) => {
|
|
11269
11268
|
const isCurrent = org.id === currentOrgId;
|
|
11270
11269
|
return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
11271
11270
|
"button",
|
|
@@ -11278,8 +11277,8 @@ function OrgSwitcher({
|
|
|
11278
11277
|
disabled: busy || isCurrent,
|
|
11279
11278
|
onClick: () => select(org.id),
|
|
11280
11279
|
className: cn(
|
|
11281
|
-
|
|
11282
|
-
isCurrent &&
|
|
11280
|
+
"ods-org-switcher__rail-item",
|
|
11281
|
+
isCurrent && "ods-org-switcher__rail-item--current"
|
|
11283
11282
|
),
|
|
11284
11283
|
children: switchingOrgId === org.id ? /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Spinner, { size: "sm", label: `Switching to ${org.name}` }) : /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
11285
11284
|
Avatar,
|
|
@@ -11301,7 +11300,7 @@ function OrgSwitcher({
|
|
|
11301
11300
|
"div",
|
|
11302
11301
|
{
|
|
11303
11302
|
ref: rootRef,
|
|
11304
|
-
className: cn(
|
|
11303
|
+
className: cn("ods-org-switcher", className),
|
|
11305
11304
|
...rest,
|
|
11306
11305
|
children: [
|
|
11307
11306
|
/* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
|
|
@@ -11309,9 +11308,9 @@ function OrgSwitcher({
|
|
|
11309
11308
|
{
|
|
11310
11309
|
type: "button",
|
|
11311
11310
|
className: cn(
|
|
11312
|
-
|
|
11313
|
-
size === "sm" &&
|
|
11314
|
-
lead &&
|
|
11311
|
+
"ods-org-switcher__trigger",
|
|
11312
|
+
size === "sm" && "ods-org-switcher__trigger--sm",
|
|
11313
|
+
lead && "ods-org-switcher__trigger--lead"
|
|
11315
11314
|
),
|
|
11316
11315
|
"aria-label": ariaLabel,
|
|
11317
11316
|
"aria-haspopup": "listbox",
|
|
@@ -11329,23 +11328,23 @@ function OrgSwitcher({
|
|
|
11329
11328
|
alt: current?.name ?? "Organization"
|
|
11330
11329
|
}
|
|
11331
11330
|
),
|
|
11332
|
-
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className:
|
|
11331
|
+
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "ods-org-switcher__trigger-name", children: current?.name ?? "Select organization" }),
|
|
11333
11332
|
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
11334
11333
|
import_icons15.ChevronDownIcon,
|
|
11335
11334
|
{
|
|
11336
11335
|
size: "sm",
|
|
11337
11336
|
"aria-hidden": "true",
|
|
11338
11337
|
className: cn(
|
|
11339
|
-
|
|
11340
|
-
open &&
|
|
11338
|
+
"ods-org-switcher__chev",
|
|
11339
|
+
open && "ods-org-switcher__chev--open"
|
|
11341
11340
|
)
|
|
11342
11341
|
}
|
|
11343
11342
|
)
|
|
11344
11343
|
]
|
|
11345
11344
|
}
|
|
11346
11345
|
),
|
|
11347
|
-
open && /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className:
|
|
11348
|
-
variant === "search" && /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className:
|
|
11346
|
+
open && /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "ods-org-switcher__panel", "data-ods-floating": "", children: [
|
|
11347
|
+
variant === "search" && /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "ods-org-switcher__search", children: [
|
|
11349
11348
|
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_icons15.SearchIcon, { size: "sm", "aria-hidden": "true" }),
|
|
11350
11349
|
/* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
|
|
11351
11350
|
"input",
|
|
@@ -11356,7 +11355,7 @@ function OrgSwitcher({
|
|
|
11356
11355
|
placeholder: "Find an organization",
|
|
11357
11356
|
"aria-label": "Find an organization",
|
|
11358
11357
|
onChange: (e) => setQuery(e.target.value),
|
|
11359
|
-
className:
|
|
11358
|
+
className: "ods-org-switcher__search-input"
|
|
11360
11359
|
}
|
|
11361
11360
|
)
|
|
11362
11361
|
] }),
|
|
@@ -11366,7 +11365,7 @@ function OrgSwitcher({
|
|
|
11366
11365
|
id: listboxId,
|
|
11367
11366
|
role: "listbox",
|
|
11368
11367
|
"aria-label": ariaLabel,
|
|
11369
|
-
className:
|
|
11368
|
+
className: "ods-org-switcher__list",
|
|
11370
11369
|
children: renderRows(filtered)
|
|
11371
11370
|
}
|
|
11372
11371
|
)
|
|
@@ -24055,7 +24054,7 @@ function findOpenTrigger(value, caret, trigger) {
|
|
|
24055
24054
|
function getCaretRect(textarea, caret) {
|
|
24056
24055
|
if (typeof document === "undefined") return null;
|
|
24057
24056
|
const mirror = document.createElement("div");
|
|
24058
|
-
const
|
|
24057
|
+
const styles = window.getComputedStyle(textarea);
|
|
24059
24058
|
for (const prop of [
|
|
24060
24059
|
"boxSizing",
|
|
24061
24060
|
"width",
|
|
@@ -24078,7 +24077,7 @@ function getCaretRect(textarea, caret) {
|
|
|
24078
24077
|
"tabSize",
|
|
24079
24078
|
"whiteSpace"
|
|
24080
24079
|
]) {
|
|
24081
|
-
mirror.style[prop] =
|
|
24080
|
+
mirror.style[prop] = styles[prop];
|
|
24082
24081
|
}
|
|
24083
24082
|
mirror.style.position = "absolute";
|
|
24084
24083
|
mirror.style.visibility = "hidden";
|
|
@@ -24235,7 +24234,7 @@ function getSelectionRect(textarea, start, end) {
|
|
|
24235
24234
|
if (typeof document === "undefined") return null;
|
|
24236
24235
|
if (start === end) return null;
|
|
24237
24236
|
const mirror = document.createElement("div");
|
|
24238
|
-
const
|
|
24237
|
+
const styles = window.getComputedStyle(textarea);
|
|
24239
24238
|
for (const prop of [
|
|
24240
24239
|
"boxSizing",
|
|
24241
24240
|
"width",
|
|
@@ -24258,7 +24257,7 @@ function getSelectionRect(textarea, start, end) {
|
|
|
24258
24257
|
"tabSize",
|
|
24259
24258
|
"whiteSpace"
|
|
24260
24259
|
]) {
|
|
24261
|
-
mirror.style[prop] =
|
|
24260
|
+
mirror.style[prop] = styles[prop];
|
|
24262
24261
|
}
|
|
24263
24262
|
mirror.style.position = "absolute";
|
|
24264
24263
|
mirror.style.visibility = "hidden";
|