@activecollab/components 2.0.421 → 2.0.422

package/dist/esm/presentation/shared/portfolioDetails.js

@@ -0,0 +1,490 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import React, { useEffect, useMemo, useState } from "react";
+import styled from "styled-components";
+import { Button } from "../../components/Button";
+import { Dialog } from "../../components/Dialog";
+import { IconButton } from "../../components/IconButton";
+import { SortGeneralIcon } from "../../components/Icons";
+import { Input } from "../../components/Input";
+import { Label } from "../../components/Label";
+import { RadioGroup } from "../../components/RadioGroup";
+import { Select } from "../../components/Select";
+import { SelectTrigger } from "../../components/SelectTrigger";
+
+/*
+  Portfolio details form — the shared "step 2" of the Create Portfolio wizard,
+  reused verbatim as the Edit Portfolio dialog.
+
+  This mirrors a pattern used across the app: the fields that make up the final
+  step of a creation wizard are the same fields shown, later, when the object is
+  edited. So the form body (name, the type's picker, visibility) and its
+  validation live here once, and two consumers render it:
+
+    - The Create Portfolio wizard (PortfoliosList.stories.tsx) renders
+      <PortfolioDetailsFields> inside its step-2 <Dialog.Content>, with a
+      "Create Portfolio" action.
+    - <EditPortfolioDialog> (opened from PortfolioOptionsMenu's Edit item)
+      renders the SAME <PortfolioDetailsFields> inside a standalone <Dialog>,
+      with a "Save Changes" action.
+
+  Both use isPortfolioDetailsValid() and the same always-enabled-submit,
+  outline-on-submit validation rule.
+*/
+
+/* ------------------------------------------------------------------ */
+/* Domain types                                                        */
+/* ------------------------------------------------------------------ */
+
+/** How a portfolio decides its members (two kinds, three context types). */
+
+/** Grouping of the projects multi-select — matches Invite-to-Projects. */
+
+/** The editable shape shared by create step 2 and the edit dialog. */
+
+/** A blank custom portfolio — the fallback seed for the edit dialog. */
+export const DEFAULT_PORTFOLIO_FORM_VALUES = {
+  type: "custom",
+  name: "",
+  context: undefined,
+  projectIds: [],
+  groupBy: "favorites",
+  visibility: "everyone"
+};
+
+/* ------------------------------------------------------------------ */
+/* Pickers' mock data                                                  */
+/* ------------------------------------------------------------------ */
+
+export const LEADERS_LIST = [{
+  name: "Theo Brandt",
+  short: "Theo B."
+}, {
+  name: "Isabel Cortez",
+  short: "Isabel C."
+}, {
+  name: "Grace Bauer",
+  short: "Grace B."
+}, {
+  name: "Noah Mercer",
+  short: "Noah M."
+}];
+export const CATEGORIES = ["Brand & Identity", "Web & Product", "Marketing", "Internal Ops"];
+export const CLIENTS = ["Aperture Studio", "Orbit Telecom", "Northwind Traders", "Meridian Health"];
+const PICKER_PROJECTS = [{
+  id: 1,
+  name: "Website Redesign",
+  client: "Aperture Studio",
+  category: "Web & Product",
+  label: "Design",
+  leader: "Theo Brandt",
+  favorite: true
+}, {
+  id: 2,
+  name: "Brand Refresh",
+  client: "Aperture Studio",
+  category: "Brand & Identity",
+  label: "Design",
+  leader: "Isabel Cortez",
+  favorite: true
+}, {
+  id: 3,
+  name: "Mobile App",
+  client: "Orbit Telecom",
+  category: "Web & Product",
+  label: "Build",
+  leader: "Grace Bauer",
+  favorite: false
+}, {
+  id: 4,
+  name: "Q3 Campaign",
+  client: "Orbit Telecom",
+  category: "Marketing",
+  label: "Campaign",
+  leader: "Noah Mercer",
+  favorite: true
+}, {
+  id: 5,
+  name: "Internal Wiki",
+  client: "",
+  category: "Internal Ops",
+  label: "",
+  leader: "Theo Brandt",
+  favorite: false
+}, {
+  id: 6,
+  name: "Packaging System",
+  client: "Northwind Traders",
+  category: "Brand & Identity",
+  label: "Design",
+  leader: "Isabel Cortez",
+  favorite: false
+}, {
+  id: 7,
+  name: "Support Portal",
+  client: "Meridian Health",
+  category: "Web & Product",
+  label: "Build",
+  leader: "Grace Bauer",
+  favorite: false
+}, {
+  id: 8,
+  name: "Annual Report",
+  client: "Northwind Traders",
+  category: "Marketing",
+  label: "Campaign",
+  leader: "Noah Mercer",
+  favorite: true
+}];
+
+/* Group-by options and default match the Invite-to-Projects picker exactly. */
+const GROUP_BY_OPTIONS = [{
+  id: "favorites",
+  name: "Favorites"
+}, {
+  id: "labels",
+  name: "Label"
+}, {
+  id: "companies",
+  name: "Client"
+}, {
+  id: "categories",
+  name: "Category"
+}, {
+  id: "leaders",
+  name: "Project Leader"
+}];
+const projectOptionId = project => "p" + project.id;
+
+/** A small deterministic set of project option ids — seeds a custom
+    portfolio's edit dialog so the picker reads as an existing selection. */
+export const sampleProjectOptionIds = count => PICKER_PROJECTS.slice(0, Math.max(0, count)).map(projectOptionId);
+const toProjectOptions = projects => projects.map(project => ({
+  id: projectOptionId(project),
+  name: project.name
+})).sort((a, b) => a.name.localeCompare(b.name));
+
+/* Build the grouped option tree the Select expects. Alphabetical rows and
+   groups; the "Without ..." / "Other" bucket sits last; the Favorites grouping
+   collapses to a flat list when it is the only group (as the app's does). */
+const groupPickerProjects = groupBy => {
+  if (groupBy === "favorites") {
+    const favorite = PICKER_PROJECTS.filter(project => project.favorite);
+    const other = PICKER_PROJECTS.filter(project => !project.favorite);
+    const groups = [];
+    if (favorite.length) {
+      groups.push({
+        id: "g-fav",
+        name: "Favorite",
+        options: toProjectOptions(favorite)
+      });
+    }
+    if (other.length) {
+      groups.push({
+        id: "g-other",
+        name: "Other",
+        options: toProjectOptions(other)
+      });
+    }
+    return groups.length === 1 ? groups[0].options : groups;
+  }
+  const field = groupBy === "labels" ? "label" : groupBy === "companies" ? "client" : groupBy === "categories" ? "category" : "leader";
+  const without = groupBy === "labels" ? "Without Label" : groupBy === "companies" ? "Without Client" : groupBy === "categories" ? "Without Category" : "Without Leader";
+  const buckets = new Map();
+  PICKER_PROJECTS.forEach(project => {
+    var _buckets$get;
+    const key = project[field] || without;
+    if (!buckets.has(key)) {
+      buckets.set(key, []);
+    }
+    (_buckets$get = buckets.get(key)) == null || _buckets$get.push(project);
+  });
+  return Array.from(buckets.entries()).map(_ref => {
+    let name = _ref[0],
+      projects = _ref[1];
+    return {
+      id: "g-" + name,
+      name,
+      options: toProjectOptions(projects)
+    };
+  }).sort((a, b) => a.name === without ? 1 : b.name === without ? -1 : a.name.localeCompare(b.name));
+};
+
+/* ------------------------------------------------------------------ */
+/* Type + visibility option copy                                       */
+/* ------------------------------------------------------------------ */
+
+export const PORTFOLIO_TYPES = [{
+  id: "custom",
+  title: "Custom Portfolio",
+  description: "The projects you pick by hand. Nothing joins automatically."
+}, {
+  id: "client",
+  title: "Client Portfolio",
+  description: "All projects for a client company. New ones join automatically."
+}, {
+  id: "leader",
+  title: "Project Leader Portfolio",
+  description: "All projects led by a person. New ones join automatically."
+}, {
+  id: "category",
+  title: "Category Portfolio",
+  description: "All projects in a project category. New ones join automatically."
+}];
+export const VISIBILITY_OPTIONS = [{
+  id: "everyone",
+  title: "Visible to Everyone",
+  description: "Anyone who can use portfolios sees this one. They still only see the projects they already have access to."
+}, {
+  id: "me",
+  title: "Visible Only to Me",
+  description: "Nobody else sees this portfolio."
+}];
+export const contextFieldLabel = type => type === "custom" ? "Projects" : type === "category" ? "Category" : type === "client" ? "Client" : "Project leader";
+export const leaderShortName = name => {
+  var _LEADERS_LIST$find$sh, _LEADERS_LIST$find;
+  return (_LEADERS_LIST$find$sh = (_LEADERS_LIST$find = LEADERS_LIST.find(leader => leader.name === name)) == null ? void 0 : _LEADERS_LIST$find.short) != null ? _LEADERS_LIST$find$sh : name;
+};
+
+/* Default names: "{Category} Projects", "{Client} Projects", "Lead by {N.}". */
+export const defaultPortfolioName = (type, context) => {
+  if (!context) return "";
+  if (type === "category" || type === "client") return context + " Projects";
+  if (type === "leader") return "Lead by " + leaderShortName(context);
+  return "";
+};
+
+/* ------------------------------------------------------------------ */
+/* Validation (shared by create step 2 and the edit dialog)            */
+/* ------------------------------------------------------------------ */
+
+/** Name is required; a custom portfolio needs at least one project, a context
+    portfolio needs its context chosen. Same rule for create and edit. */
+export const isPortfolioDetailsValid = values => values.name.trim().length > 0 && (values.type === "custom" ? values.projectIds.length > 0 : Boolean(values.context));
+
+/* ------------------------------------------------------------------ */
+/* Pickers                                                             */
+/* ------------------------------------------------------------------ */
+
+/* Group-by control: the SortGeneralIcon button the Invite-to-Projects picker
+   shows as the search bar's right-side adornment. Controls grouping, not sort. */
+const ProjectsGroupBy = _ref2 => {
+  let selected = _ref2.selected,
+    onChange = _ref2.onChange;
+  return /*#__PURE__*/React.createElement(Select, {
+    keepSameOptionsOrder: true,
+    disableSearch: true,
+    disabledInternalSort: true,
+    forceCloseMenu: true,
+    position: "bottom-end",
+    selected: selected,
+    onChange: value => onChange(value),
+    options: GROUP_BY_OPTIONS,
+    target: /*#__PURE__*/React.createElement(IconButton, {
+      type: "button",
+      variant: "text gray"
+    }, /*#__PURE__*/React.createElement(SortGeneralIcon, null))
+  });
+};
+const ProjectsPicker = _ref3 => {
+  let selected = _ref3.selected,
+    onChange = _ref3.onChange,
+    groupBy = _ref3.groupBy,
+    onGroupBy = _ref3.onGroupBy,
+    invalid = _ref3.invalid;
+  const options = useMemo(() => groupPickerProjects(groupBy), [groupBy]);
+  const count = selected.length;
+  const triggerText = count === 0 ? "Choose projects" : count === 1 ? "1 project selected" : count + " projects selected";
+  return /*#__PURE__*/React.createElement(Select, {
+    type: "multiple",
+    options: options,
+    selected: selected,
+    onChange: value => onChange(value),
+    noResultText: "No results",
+    endAdornment: /*#__PURE__*/React.createElement(ProjectsGroupBy, {
+      selected: groupBy,
+      onChange: onGroupBy
+    }),
+    target: /*#__PURE__*/React.createElement(SelectTrigger, {
+      id: "pf-projects",
+      className: "pf-trigger",
+      invalid: invalid,
+      typographyProps: {
+        color: count > 0 ? "primary" : "quaternary"
+      }
+    }, triggerText)
+  });
+};
+const ContextPicker = _ref4 => {
+  let type = _ref4.type,
+    value = _ref4.value,
+    onChange = _ref4.onChange,
+    invalid = _ref4.invalid;
+  const options = type === "category" ? CATEGORIES.map(name => ({
+    id: name,
+    name
+  })) : type === "client" ? CLIENTS.map(name => ({
+    id: name,
+    name
+  })) : LEADERS_LIST.map(leader => ({
+    id: leader.name,
+    name: leader.name
+  }));
+  const placeholder = type === "category" ? "Choose a category" : type === "client" ? "Choose a client" : "Choose a project leader";
+  return /*#__PURE__*/React.createElement(Select, {
+    forceCloseMenu: true,
+    options: options,
+    selected: value != null ? value : "",
+    onChange: next => onChange(String(next)),
+    target: /*#__PURE__*/React.createElement(SelectTrigger, {
+      id: "pf-context",
+      className: "pf-trigger",
+      invalid: invalid,
+      typographyProps: {
+        color: value ? "primary" : "quaternary"
+      }
+    }, value != null ? value : placeholder)
+  });
+};
+
+/* ------------------------------------------------------------------ */
+/* The reusable form body                                              */
+/* ------------------------------------------------------------------ */
+
+const StyledDetailsForm = styled.div.withConfig({
+  displayName: "portfolioDetails__StyledDetailsForm",
+  componentId: "sc-yxi1uj-0"
+})(["display:flex;flex-direction:column;gap:24px;.field{display:flex;flex-direction:column;gap:8px;}.field .c-input-wrapper{width:100%;}.field .pf-trigger{width:100%;}"]);
+/** Name + the type's picker + visibility. No Dialog wrappers and no action
+    button — the consumer (create step or edit dialog) supplies those. */
+export const PortfolioDetailsFields = _ref5 => {
+  let values = _ref5.values,
+    onName = _ref5.onName,
+    onContext = _ref5.onContext,
+    onProjects = _ref5.onProjects,
+    onGroupBy = _ref5.onGroupBy,
+    onVisibility = _ref5.onVisibility,
+    showErrors = _ref5.showErrors;
+  const type = values.type,
+    name = values.name,
+    context = values.context,
+    projectIds = values.projectIds,
+    groupBy = values.groupBy,
+    visibility = values.visibility;
+  const nameInvalid = showErrors && name.trim().length === 0;
+  const pickerInvalid = showErrors && (type === "custom" ? projectIds.length === 0 : !context);
+  return /*#__PURE__*/React.createElement(StyledDetailsForm, null, /*#__PURE__*/React.createElement("div", {
+    className: "field"
+  }, /*#__PURE__*/React.createElement(Label, {
+    htmlFor: "pf-name"
+  }, "Name"), /*#__PURE__*/React.createElement(Input, {
+    id: "pf-name",
+    value: name,
+    placeholder: "Portfolio name",
+    invalid: nameInvalid,
+    onChange: event => onName(event.target.value)
+  })), /*#__PURE__*/React.createElement("div", {
+    className: "field"
+  }, /*#__PURE__*/React.createElement(Label, {
+    htmlFor: type === "custom" ? "pf-projects" : "pf-context"
+  }, contextFieldLabel(type)), type === "custom" ? /*#__PURE__*/React.createElement(ProjectsPicker, {
+    selected: projectIds,
+    onChange: onProjects,
+    groupBy: groupBy,
+    onGroupBy: onGroupBy,
+    invalid: pickerInvalid
+  }) : /*#__PURE__*/React.createElement(ContextPicker, {
+    type: type,
+    value: context,
+    onChange: onContext,
+    invalid: pickerInvalid
+  })), /*#__PURE__*/React.createElement("div", {
+    className: "field"
+  }, /*#__PURE__*/React.createElement(RadioGroup, {
+    label: "Visibility",
+    variant: "plain",
+    value: visibility,
+    onChange: value => onVisibility(value),
+    options: VISIBILITY_OPTIONS.map(option => ({
+      id: option.id,
+      name: option.title,
+      description: option.description
+    }))
+  })));
+};
+PortfolioDetailsFields.displayName = "PortfolioDetailsFields";
+
+/* ------------------------------------------------------------------ */
+/* Edit Portfolio dialog — the create wizard's step 2, on its own      */
+/* ------------------------------------------------------------------ */
+
+/*
+  Same fields, same validation as create step 2. The type is fixed to the
+  portfolio's kind (edit changes the details, not the kind), so there is no
+  type radio here — only the name, the type's picker, and visibility.
+*/
+export const EditPortfolioDialog = _ref6 => {
+  let open = _ref6.open,
+    initialValues = _ref6.initialValues,
+    onClose = _ref6.onClose,
+    onSave = _ref6.onSave;
+  const _useState = useState(initialValues),
+    values = _useState[0],
+    setValues = _useState[1];
+  const _useState2 = useState(false),
+    showErrors = _useState2[0],
+    setShowErrors = _useState2[1];
+
+  /* Re-seed from the portfolio each time the dialog opens. */
+  useEffect(() => {
+    if (open) {
+      setValues(initialValues);
+      setShowErrors(false);
+    }
+    // Seed on open only — initialValues is read at that moment by design.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [open]);
+  const patch = next => setValues(current => _extends({}, current, next));
+  const handleSave = () => {
+    if (!isPortfolioDetailsValid(values)) {
+      setShowErrors(true);
+      return;
+    }
+    onSave == null || onSave(values);
+    onClose();
+  };
+  return /*#__PURE__*/React.createElement(Dialog, {
+    open: open,
+    onClose: onClose,
+    disableCloseOnEsc: true
+  }, /*#__PURE__*/React.createElement(Dialog.Title, null, "Edit Portfolio"), /*#__PURE__*/React.createElement(Dialog.ContentDivider, null), /*#__PURE__*/React.createElement(Dialog.Content, null, /*#__PURE__*/React.createElement(PortfolioDetailsFields, {
+    values: values,
+    onName: name => patch({
+      name
+    }),
+    onContext: context => patch({
+      context
+    }),
+    onProjects: projectIds => patch({
+      projectIds
+    }),
+    onGroupBy: groupBy => patch({
+      groupBy
+    }),
+    onVisibility: visibility => patch({
+      visibility
+    }),
+    showErrors: showErrors
+  })), /*#__PURE__*/React.createElement(Dialog.ContentDivider, null), /*#__PURE__*/React.createElement(Dialog.Actions, null, /*#__PURE__*/React.createElement(Button, {
+    variant: "primary",
+    style: {
+      marginRight: "12px"
+    },
+    onClick: handleSave
+  }, "Save Changes"), /*#__PURE__*/React.createElement(Button, {
+    variant: "secondary",
+    "data-action": "cancel",
+    onClick: onClose
+  }, "Cancel")));
+};
+EditPortfolioDialog.displayName = "EditPortfolioDialog";
+//# sourceMappingURL=portfolioDetails.js.map

package/dist/esm/presentation/shared/portfolioDetails.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"portfolioDetails.js","names":["React","useEffect","useMemo","useState","styled","Button","Dialog","IconButton","SortGeneralIcon","Input","Label","RadioGroup","Select","SelectTrigger","DEFAULT_PORTFOLIO_FORM_VALUES","type","name","context","undefined","projectIds","groupBy","visibility","LEADERS_LIST","short","CATEGORIES","CLIENTS","PICKER_PROJECTS","id","client","category","label","leader","favorite","GROUP_BY_OPTIONS","projectOptionId","project","sampleProjectOptionIds","count","slice","Math","max","map","toProjectOptions","projects","sort","a","b","localeCompare","groupPickerProjects","filter","other","groups","length","push","options","field","without","buckets","Map","forEach","_buckets$get","key","has","set","get","Array","from","entries","_ref","PORTFOLIO_TYPES","title","description","VISIBILITY_OPTIONS","contextFieldLabel","leaderShortName","_LEADERS_LIST$find$sh","_LEADERS_LIST$find","find","defaultPortfolioName","isPortfolioDetailsValid","values","trim","Boolean","ProjectsGroupBy","_ref2","selected","onChange","createElement","keepSameOptionsOrder","disableSearch","disabledInternalSort","forceCloseMenu","position","value","target","variant","ProjectsPicker","_ref3","onGroupBy","invalid","triggerText","noResultText","endAdornment","className","typographyProps","color","ContextPicker","_ref4","placeholder","next","String","StyledDetailsForm","div","withConfig","displayName","componentId","PortfolioDetailsFields","_ref5","onName","onContext","onProjects","onVisibility","showErrors","nameInvalid","pickerInvalid","htmlFor","event","option","EditPortfolioDialog","_ref6","open","initialValues","onClose","onSave","_useState","setValues","_useState2","setShowErrors","patch","current","_extends","handleSave","disableCloseOnEsc","Title","ContentDivider","Content","Actions","style","marginRight","onClick"],"sources":["../../../../src/presentation/shared/portfolioDetails.tsx"],"sourcesContent":["import React, { ReactElement, useEffect, useMemo, useState } from \"react\";\n\nimport styled from \"styled-components\";\n\nimport { Button } from \"../../components/Button\";\nimport { Dialog } from \"../../components/Dialog\";\nimport { IconButton } from \"../../components/IconButton\";\nimport { SortGeneralIcon } from \"../../components/Icons\";\nimport { Input } from \"../../components/Input\";\nimport { Label } from \"../../components/Label\";\nimport { RadioGroup } from \"../../components/RadioGroup\";\nimport { Select } from \"../../components/Select\";\nimport { SelectTrigger } from \"../../components/SelectTrigger\";\n\n/*\n  Portfolio details form — the shared \"step 2\" of the Create Portfolio wizard,\n  reused verbatim as the Edit Portfolio dialog.\n\n  This mirrors a pattern used across the app: the fields that make up the final\n  step of a creation wizard are the same fields shown, later, when the object is\n  edited. So the form body (name, the type's picker, visibility) and its\n  validation live here once, and two consumers render it:\n\n    - The Create Portfolio wizard (PortfoliosList.stories.tsx) renders\n      <PortfolioDetailsFields> inside its step-2 <Dialog.Content>, with a\n      \"Create Portfolio\" action.\n    - <EditPortfolioDialog> (opened from PortfolioOptionsMenu's Edit item)\n      renders the SAME <PortfolioDetailsFields> inside a standalone <Dialog>,\n      with a \"Save Changes\" action.\n\n  Both use isPortfolioDetailsValid() and the same always-enabled-submit,\n  outline-on-submit validation rule.\n*/\n\n/* ------------------------------------------------------------------ */\n/* Domain types                                                        */\n/* ------------------------------------------------------------------ */\n\n/** How a portfolio decides its members (two kinds, three context types). */\nexport type PortfolioKind = \"custom\" | \"category\" | \"client\" | \"leader\";\n\nexport type PortfolioVisibility = \"everyone\" | \"me\";\n\n/** Grouping of the projects multi-select — matches Invite-to-Projects. */\nexport type GroupBy =\n  | \"favorites\"\n  | \"labels\"\n  | \"companies\"\n  | \"categories\"\n  | \"leaders\";\n\n/** The editable shape shared by create step 2 and the edit dialog. */\nexport interface PortfolioFormValues {\n  type: PortfolioKind;\n  name: string;\n  /** For context portfolios: the chosen category / client / leader. */\n  context?: string;\n  /** For custom portfolios: the hand-picked project option ids. */\n  projectIds: string[];\n  groupBy: GroupBy;\n  visibility: PortfolioVisibility;\n}\n\n/** A blank custom portfolio — the fallback seed for the edit dialog. */\nexport const DEFAULT_PORTFOLIO_FORM_VALUES: PortfolioFormValues = {\n  type: \"custom\",\n  name: \"\",\n  context: undefined,\n  projectIds: [],\n  groupBy: \"favorites\",\n  visibility: \"everyone\",\n};\n\n/* ------------------------------------------------------------------ */\n/* Pickers' mock data                                                  */\n/* ------------------------------------------------------------------ */\n\nexport interface PickerLeader {\n  name: string;\n  /** Short \"Firstname L.\" form used in the default portfolio name. */\n  short: string;\n}\n\nexport const LEADERS_LIST: PickerLeader[] = [\n  { name: \"Theo Brandt\", short: \"Theo B.\" },\n  { name: \"Isabel Cortez\", short: \"Isabel C.\" },\n  { name: \"Grace Bauer\", short: \"Grace B.\" },\n  { name: \"Noah Mercer\", short: \"Noah M.\" },\n];\n\nexport const CATEGORIES = [\n  \"Brand & Identity\",\n  \"Web & Product\",\n  \"Marketing\",\n  \"Internal Ops\",\n];\n\nexport const CLIENTS = [\n  \"Aperture Studio\",\n  \"Orbit Telecom\",\n  \"Northwind Traders\",\n  \"Meridian Health\",\n];\n\ninterface PickerProject {\n  id: number;\n  name: string;\n  client: string;\n  category: string;\n  label: string;\n  leader: string;\n  favorite: boolean;\n}\n\nconst PICKER_PROJECTS: PickerProject[] = [\n  {\n    id: 1,\n    name: \"Website Redesign\",\n    client: \"Aperture Studio\",\n    category: \"Web & Product\",\n    label: \"Design\",\n    leader: \"Theo Brandt\",\n    favorite: true,\n  },\n  {\n    id: 2,\n    name: \"Brand Refresh\",\n    client: \"Aperture Studio\",\n    category: \"Brand & Identity\",\n    label: \"Design\",\n    leader: \"Isabel Cortez\",\n    favorite: true,\n  },\n  {\n    id: 3,\n    name: \"Mobile App\",\n    client: \"Orbit Telecom\",\n    category: \"Web & Product\",\n    label: \"Build\",\n    leader: \"Grace Bauer\",\n    favorite: false,\n  },\n  {\n    id: 4,\n    name: \"Q3 Campaign\",\n    client: \"Orbit Telecom\",\n    category: \"Marketing\",\n    label: \"Campaign\",\n    leader: \"Noah Mercer\",\n    favorite: true,\n  },\n  {\n    id: 5,\n    name: \"Internal Wiki\",\n    client: \"\",\n    category: \"Internal Ops\",\n    label: \"\",\n    leader: \"Theo Brandt\",\n    favorite: false,\n  },\n  {\n    id: 6,\n    name: \"Packaging System\",\n    client: \"Northwind Traders\",\n    category: \"Brand & Identity\",\n    label: \"Design\",\n    leader: \"Isabel Cortez\",\n    favorite: false,\n  },\n  {\n    id: 7,\n    name: \"Support Portal\",\n    client: \"Meridian Health\",\n    category: \"Web & Product\",\n    label: \"Build\",\n    leader: \"Grace Bauer\",\n    favorite: false,\n  },\n  {\n    id: 8,\n    name: \"Annual Report\",\n    client: \"Northwind Traders\",\n    category: \"Marketing\",\n    label: \"Campaign\",\n    leader: \"Noah Mercer\",\n    favorite: true,\n  },\n];\n\n/* Group-by options and default match the Invite-to-Projects picker exactly. */\nconst GROUP_BY_OPTIONS: { id: GroupBy; name: string }[] = [\n  { id: \"favorites\", name: \"Favorites\" },\n  { id: \"labels\", name: \"Label\" },\n  { id: \"companies\", name: \"Client\" },\n  { id: \"categories\", name: \"Category\" },\n  { id: \"leaders\", name: \"Project Leader\" },\n];\n\ninterface ProjectOption {\n  id: string;\n  name: string;\n}\ninterface ProjectOptionGroup {\n  id: string;\n  name: string;\n  options: ProjectOption[];\n}\n\nconst projectOptionId = (project: PickerProject): string => `p${project.id}`;\n\n/** A small deterministic set of project option ids — seeds a custom\n    portfolio's edit dialog so the picker reads as an existing selection. */\nexport const sampleProjectOptionIds = (count: number): string[] =>\n  PICKER_PROJECTS.slice(0, Math.max(0, count)).map(projectOptionId);\n\nconst toProjectOptions = (projects: PickerProject[]): ProjectOption[] =>\n  projects\n    .map((project) => ({ id: projectOptionId(project), name: project.name }))\n    .sort((a, b) => a.name.localeCompare(b.name));\n\n/* Build the grouped option tree the Select expects. Alphabetical rows and\n   groups; the \"Without ...\" / \"Other\" bucket sits last; the Favorites grouping\n   collapses to a flat list when it is the only group (as the app's does). */\nconst groupPickerProjects = (\n  groupBy: GroupBy\n): ProjectOption[] | ProjectOptionGroup[] => {\n  if (groupBy === \"favorites\") {\n    const favorite = PICKER_PROJECTS.filter((project) => project.favorite);\n    const other = PICKER_PROJECTS.filter((project) => !project.favorite);\n    const groups: ProjectOptionGroup[] = [];\n    if (favorite.length) {\n      groups.push({\n        id: \"g-fav\",\n        name: \"Favorite\",\n        options: toProjectOptions(favorite),\n      });\n    }\n    if (other.length) {\n      groups.push({\n        id: \"g-other\",\n        name: \"Other\",\n        options: toProjectOptions(other),\n      });\n    }\n    return groups.length === 1 ? groups[0].options : groups;\n  }\n\n  const field: keyof PickerProject =\n    groupBy === \"labels\"\n      ? \"label\"\n      : groupBy === \"companies\"\n      ? \"client\"\n      : groupBy === \"categories\"\n      ? \"category\"\n      : \"leader\";\n  const without =\n    groupBy === \"labels\"\n      ? \"Without Label\"\n      : groupBy === \"companies\"\n      ? \"Without Client\"\n      : groupBy === \"categories\"\n      ? \"Without Category\"\n      : \"Without Leader\";\n\n  const buckets = new Map<string, PickerProject[]>();\n  PICKER_PROJECTS.forEach((project) => {\n    const key = (project[field] as string) || without;\n    if (!buckets.has(key)) {\n      buckets.set(key, []);\n    }\n    buckets.get(key)?.push(project);\n  });\n\n  return Array.from(buckets.entries())\n    .map(([name, projects]) => ({\n      id: `g-${name}`,\n      name,\n      options: toProjectOptions(projects),\n    }))\n    .sort((a, b) =>\n      a.name === without\n        ? 1\n        : b.name === without\n        ? -1\n        : a.name.localeCompare(b.name)\n    );\n};\n\n/* ------------------------------------------------------------------ */\n/* Type + visibility option copy                                       */\n/* ------------------------------------------------------------------ */\n\nexport const PORTFOLIO_TYPES: {\n  id: PortfolioKind;\n  title: string;\n  description: string;\n}[] = [\n  {\n    id: \"custom\",\n    title: \"Custom Portfolio\",\n    description: \"The projects you pick by hand. Nothing joins automatically.\",\n  },\n  {\n    id: \"client\",\n    title: \"Client Portfolio\",\n    description:\n      \"All projects for a client company. New ones join automatically.\",\n  },\n  {\n    id: \"leader\",\n    title: \"Project Leader Portfolio\",\n    description: \"All projects led by a person. New ones join automatically.\",\n  },\n  {\n    id: \"category\",\n    title: \"Category Portfolio\",\n    description:\n      \"All projects in a project category. New ones join automatically.\",\n  },\n];\n\nexport const VISIBILITY_OPTIONS: {\n  id: PortfolioVisibility;\n  title: string;\n  description: string;\n}[] = [\n  {\n    id: \"everyone\",\n    title: \"Visible to Everyone\",\n    description:\n      \"Anyone who can use portfolios sees this one. They still only see the projects they already have access to.\",\n  },\n  {\n    id: \"me\",\n    title: \"Visible Only to Me\",\n    description: \"Nobody else sees this portfolio.\",\n  },\n];\n\nexport const contextFieldLabel = (type: PortfolioKind): string =>\n  type === \"custom\"\n    ? \"Projects\"\n    : type === \"category\"\n    ? \"Category\"\n    : type === \"client\"\n    ? \"Client\"\n    : \"Project leader\";\n\nexport const leaderShortName = (name: string): string =>\n  LEADERS_LIST.find((leader) => leader.name === name)?.short ?? name;\n\n/* Default names: \"{Category} Projects\", \"{Client} Projects\", \"Lead by {N.}\". */\nexport const defaultPortfolioName = (\n  type: PortfolioKind,\n  context: string\n): string => {\n  if (!context) return \"\";\n  if (type === \"category\" || type === \"client\") return `${context} Projects`;\n  if (type === \"leader\") return `Lead by ${leaderShortName(context)}`;\n  return \"\";\n};\n\n/* ------------------------------------------------------------------ */\n/* Validation (shared by create step 2 and the edit dialog)            */\n/* ------------------------------------------------------------------ */\n\n/** Name is required; a custom portfolio needs at least one project, a context\n    portfolio needs its context chosen. Same rule for create and edit. */\nexport const isPortfolioDetailsValid = (values: PortfolioFormValues): boolean =>\n  values.name.trim().length > 0 &&\n  (values.type === \"custom\"\n    ? values.projectIds.length > 0\n    : Boolean(values.context));\n\n/* ------------------------------------------------------------------ */\n/* Pickers                                                             */\n/* ------------------------------------------------------------------ */\n\n/* Group-by control: the SortGeneralIcon button the Invite-to-Projects picker\n   shows as the search bar's right-side adornment. Controls grouping, not sort. */\nconst ProjectsGroupBy = ({\n  selected,\n  onChange,\n}: {\n  selected: GroupBy;\n  onChange: (groupBy: GroupBy) => void;\n}): ReactElement => (\n  <Select\n    keepSameOptionsOrder\n    disableSearch\n    disabledInternalSort\n    forceCloseMenu\n    position=\"bottom-end\"\n    selected={selected}\n    onChange={(value) => onChange(value as GroupBy)}\n    options={GROUP_BY_OPTIONS}\n    target={\n      <IconButton type=\"button\" variant=\"text gray\">\n        <SortGeneralIcon />\n      </IconButton>\n    }\n  />\n);\n\nconst ProjectsPicker = ({\n  selected,\n  onChange,\n  groupBy,\n  onGroupBy,\n  invalid,\n}: {\n  selected: string[];\n  onChange: (ids: string[]) => void;\n  groupBy: GroupBy;\n  onGroupBy: (groupBy: GroupBy) => void;\n  invalid?: boolean;\n}): ReactElement => {\n  const options = useMemo(() => groupPickerProjects(groupBy), [groupBy]);\n  const count = selected.length;\n  const triggerText =\n    count === 0\n      ? \"Choose projects\"\n      : count === 1\n      ? \"1 project selected\"\n      : `${count} projects selected`;\n  return (\n    <Select\n      type=\"multiple\"\n      options={options}\n      selected={selected}\n      onChange={(value) => onChange(value as string[])}\n      noResultText=\"No results\"\n      endAdornment={<ProjectsGroupBy selected={groupBy} onChange={onGroupBy} />}\n      target={\n        <SelectTrigger\n          id=\"pf-projects\"\n          className=\"pf-trigger\"\n          invalid={invalid}\n          typographyProps={{ color: count > 0 ? \"primary\" : \"quaternary\" }}\n        >\n          {triggerText}\n        </SelectTrigger>\n      }\n    />\n  );\n};\n\nconst ContextPicker = ({\n  type,\n  value,\n  onChange,\n  invalid,\n}: {\n  type: PortfolioKind;\n  value?: string;\n  onChange: (value: string) => void;\n  invalid?: boolean;\n}): ReactElement => {\n  const options =\n    type === \"category\"\n      ? CATEGORIES.map((name) => ({ id: name, name }))\n      : type === \"client\"\n      ? CLIENTS.map((name) => ({ id: name, name }))\n      : LEADERS_LIST.map((leader) => ({ id: leader.name, name: leader.name }));\n  const placeholder =\n    type === \"category\"\n      ? \"Choose a category\"\n      : type === \"client\"\n      ? \"Choose a client\"\n      : \"Choose a project leader\";\n  return (\n    <Select\n      forceCloseMenu\n      options={options}\n      selected={value ?? \"\"}\n      onChange={(next) => onChange(String(next))}\n      target={\n        <SelectTrigger\n          id=\"pf-context\"\n          className=\"pf-trigger\"\n          invalid={invalid}\n          typographyProps={{ color: value ? \"primary\" : \"quaternary\" }}\n        >\n          {value ?? placeholder}\n        </SelectTrigger>\n      }\n    />\n  );\n};\n\n/* ------------------------------------------------------------------ */\n/* The reusable form body                                              */\n/* ------------------------------------------------------------------ */\n\nconst StyledDetailsForm = styled.div`\n  display: flex;\n  flex-direction: column;\n  gap: 24px;\n\n  .field {\n    display: flex;\n    flex-direction: column;\n    gap: 8px;\n  }\n\n  /* DS form controls are fixed-width (Input 360px, SelectTrigger 300px); let\n     them fill the dialog column instead. */\n  .field .c-input-wrapper {\n    width: 100%;\n  }\n\n  .field .pf-trigger {\n    width: 100%;\n  }\n`;\n\nexport interface PortfolioDetailsFieldsProps {\n  values: PortfolioFormValues;\n  onName: (value: string) => void;\n  onContext: (value: string) => void;\n  onProjects: (ids: string[]) => void;\n  onGroupBy: (groupBy: GroupBy) => void;\n  onVisibility: (value: PortfolioVisibility) => void;\n  /* Form pattern (propagating through the app): the submit button is ALWAYS\n     enabled. On submit the consumer flips showErrors; each field then outlines\n     itself (aria-invalid) while it is invalid, and clears once it becomes\n     valid. No field disables submit. */\n  showErrors: boolean;\n}\n\n/** Name + the type's picker + visibility. No Dialog wrappers and no action\n    button — the consumer (create step or edit dialog) supplies those. */\nexport const PortfolioDetailsFields = ({\n  values,\n  onName,\n  onContext,\n  onProjects,\n  onGroupBy,\n  onVisibility,\n  showErrors,\n}: PortfolioDetailsFieldsProps): ReactElement => {\n  const { type, name, context, projectIds, groupBy, visibility } = values;\n  const nameInvalid = showErrors && name.trim().length === 0;\n  const pickerInvalid =\n    showErrors && (type === \"custom\" ? projectIds.length === 0 : !context);\n\n  return (\n    <StyledDetailsForm>\n      <div className=\"field\">\n        <Label htmlFor=\"pf-name\">Name</Label>\n        <Input\n          id=\"pf-name\"\n          value={name}\n          placeholder=\"Portfolio name\"\n          invalid={nameInvalid}\n          onChange={(event) => onName(event.target.value)}\n        />\n      </div>\n      <div className=\"field\">\n        <Label htmlFor={type === \"custom\" ? \"pf-projects\" : \"pf-context\"}>\n          {contextFieldLabel(type)}\n        </Label>\n        {type === \"custom\" ? (\n          <ProjectsPicker\n            selected={projectIds}\n            onChange={onProjects}\n            groupBy={groupBy}\n            onGroupBy={onGroupBy}\n            invalid={pickerInvalid}\n          />\n        ) : (\n          <ContextPicker\n            type={type}\n            value={context}\n            onChange={onContext}\n            invalid={pickerInvalid}\n          />\n        )}\n      </div>\n      <div className=\"field\">\n        <RadioGroup\n          label=\"Visibility\"\n          variant=\"plain\"\n          value={visibility}\n          onChange={(value) => onVisibility(value as PortfolioVisibility)}\n          options={VISIBILITY_OPTIONS.map((option) => ({\n            id: option.id,\n            name: option.title,\n            description: option.description,\n          }))}\n        />\n      </div>\n    </StyledDetailsForm>\n  );\n};\n\nPortfolioDetailsFields.displayName = \"PortfolioDetailsFields\";\n\n/* ------------------------------------------------------------------ */\n/* Edit Portfolio dialog — the create wizard's step 2, on its own      */\n/* ------------------------------------------------------------------ */\n\nexport interface EditPortfolioDialogProps {\n  open: boolean;\n  /** The portfolio's current values; the dialog seeds itself from these on\n      open, so Cancel discards edits and Save commits them. */\n  initialValues: PortfolioFormValues;\n  onClose: () => void;\n  onSave?: (values: PortfolioFormValues) => void;\n}\n\n/*\n  Same fields, same validation as create step 2. The type is fixed to the\n  portfolio's kind (edit changes the details, not the kind), so there is no\n  type radio here — only the name, the type's picker, and visibility.\n*/\nexport const EditPortfolioDialog = ({\n  open,\n  initialValues,\n  onClose,\n  onSave,\n}: EditPortfolioDialogProps): ReactElement => {\n  const [values, setValues] = useState<PortfolioFormValues>(initialValues);\n  const [showErrors, setShowErrors] = useState(false);\n\n  /* Re-seed from the portfolio each time the dialog opens. */\n  useEffect(() => {\n    if (open) {\n      setValues(initialValues);\n      setShowErrors(false);\n    }\n    // Seed on open only — initialValues is read at that moment by design.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [open]);\n\n  const patch = (next: Partial<PortfolioFormValues>): void =>\n    setValues((current) => ({ ...current, ...next }));\n\n  const handleSave = (): void => {\n    if (!isPortfolioDetailsValid(values)) {\n      setShowErrors(true);\n      return;\n    }\n    onSave?.(values);\n    onClose();\n  };\n\n  return (\n    <Dialog open={open} onClose={onClose} disableCloseOnEsc>\n      <Dialog.Title>Edit Portfolio</Dialog.Title>\n      <Dialog.ContentDivider />\n      <Dialog.Content>\n        <PortfolioDetailsFields\n          values={values}\n          onName={(name) => patch({ name })}\n          onContext={(context) => patch({ context })}\n          onProjects={(projectIds) => patch({ projectIds })}\n          onGroupBy={(groupBy) => patch({ groupBy })}\n          onVisibility={(visibility) => patch({ visibility })}\n          showErrors={showErrors}\n        />\n      </Dialog.Content>\n      <Dialog.ContentDivider />\n      <Dialog.Actions>\n        <Button\n          variant=\"primary\"\n          style={{ marginRight: \"12px\" }}\n          onClick={handleSave}\n        >\n          Save Changes\n        </Button>\n        <Button variant=\"secondary\" data-action=\"cancel\" onClick={onClose}>\n          Cancel\n        </Button>\n      </Dialog.Actions>\n    </Dialog>\n  );\n};\n\nEditPortfolioDialog.displayName = \"EditPortfolioDialog\";\n"],"mappings":"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","ignoreList":[]}

package/dist/esm/utils/useStableId.d.ts

@@ -0,0 +1,2 @@
+export default function useStableId(providedId?: string): string;
+//# sourceMappingURL=useStableId.d.ts.map

package/dist/esm/utils/useStableId.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useStableId.d.ts","sourceRoot":"","sources":["../../../src/utils/useStableId.ts"],"names":[],"mappings":"AAkBA,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,UAAU,CAAC,EAAE,MAAM,GAAG,MAAM,CAQ/D"}

package/dist/esm/utils/useStableId.js

@@ -0,0 +1,25 @@
+import * as React from "react";
+
+/**
+ * Stable id generator for a single element.
+ *
+ * `React.useId` only exists in React 18+. This package still declares React
+ * 16/17 in `peerDependencies`, so we must not call `React.useId` directly.
+ * Instead we read it off the React export once, at module load, and fall back
+ * to a module-level counter when it is absent. Which branch runs is fixed for
+ * the life of the module, so the hook call order stays stable across renders.
+ *
+ * Intentionally NOT re-exported from `src/utils/index.ts`: the package root
+ * re-exports `./utils`, and this helper is internal to the radio components.
+ */
+let counter = 0;
+const reactUseId = React.useId;
+export default function useStableId(providedId) {
+  const generatedId = reactUseId ?
+  // eslint-disable-next-line react-hooks/rules-of-hooks
+  reactUseId() :
+  // eslint-disable-next-line react-hooks/rules-of-hooks
+  React.useMemo(() => "ds-" + (counter += 1), []);
+  return providedId != null ? providedId : generatedId;
+}
+//# sourceMappingURL=useStableId.js.map

package/dist/esm/utils/useStableId.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useStableId.js","names":["React","counter","reactUseId","useId","useStableId","providedId","generatedId","useMemo"],"sources":["../../../src/utils/useStableId.ts"],"sourcesContent":["import * as React from \"react\";\n\n/**\n * Stable id generator for a single element.\n *\n * `React.useId` only exists in React 18+. This package still declares React\n * 16/17 in `peerDependencies`, so we must not call `React.useId` directly.\n * Instead we read it off the React export once, at module load, and fall back\n * to a module-level counter when it is absent. Which branch runs is fixed for\n * the life of the module, so the hook call order stays stable across renders.\n *\n * Intentionally NOT re-exported from `src/utils/index.ts`: the package root\n * re-exports `./utils`, and this helper is internal to the radio components.\n */\nlet counter = 0;\n\nconst reactUseId = (React as { useId?: () => string }).useId;\n\nexport default function useStableId(providedId?: string): string {\n  const generatedId = reactUseId\n    ? // eslint-disable-next-line react-hooks/rules-of-hooks\n      reactUseId()\n    : // eslint-disable-next-line react-hooks/rules-of-hooks\n      React.useMemo(() => `ds-${(counter += 1)}`, []);\n\n  return providedId ?? generatedId;\n}\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;;AAE9B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAIC,OAAO,GAAG,CAAC;AAEf,MAAMC,UAAU,GAAIF,KAAK,CAA8BG,KAAK;AAE5D,eAAe,SAASC,WAAWA,CAACC,UAAmB,EAAU;EAC/D,MAAMC,WAAW,GAAGJ,UAAU;EAC1B;EACAA,UAAU,CAAC,CAAC;EACZ;EACAF,KAAK,CAACO,OAAO,CAAC,eAAaN,OAAO,IAAI,CAAC,CAAG,EAAE,EAAE,CAAC;EAEnD,OAAOI,UAAU,WAAVA,UAAU,GAAIC,WAAW;AAClC","ignoreList":[]}