jvetrau-ds 0.1.39 → 0.1.41

package/components/course-outline/course-outline.cjs

@@ -0,0 +1,190 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var React = require('react');
+require('./course-outline.css');
+var classnames = require('../helpers/classnames');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+function hasContent(value) {
+  return value !== null && value !== void 0;
+}
+function getInitialCollapsedGroups(groups) {
+  return new Map(
+    groups.map((group) => [
+      group.id,
+      Boolean(group.defaultCollapsed)
+    ])
+  );
+}
+function getGroupCollapsed(collapsedGroups, group) {
+  return collapsedGroups.get(group.id) ?? Boolean(group.defaultCollapsed);
+}
+const GroupTitle = ({
+  level,
+  children
+}) => {
+  if (!level) {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "course-outline__group-title", children });
+  }
+  switch (level) {
+    case 2:
+      return /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "course-outline__group-title", children });
+    case 3:
+      return /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "course-outline__group-title", children });
+    case 4:
+      return /* @__PURE__ */ jsxRuntime.jsx("h4", { className: "course-outline__group-title", children });
+    case 5:
+      return /* @__PURE__ */ jsxRuntime.jsx("h5", { className: "course-outline__group-title", children });
+    default:
+      return /* @__PURE__ */ jsxRuntime.jsx("h6", { className: "course-outline__group-title", children });
+  }
+};
+const CourseOutline = ({
+  groups,
+  headingLevel,
+  collapsible = false,
+  className = "",
+  ...props
+}) => {
+  const visibleGroups = React__default.default.useMemo(
+    () => groups.filter(
+      (group) => group.items.length > 0
+    ),
+    [groups]
+  );
+  const [collapsedGroups, setCollapsedGroups] = React__default.default.useState(
+    () => getInitialCollapsedGroups(visibleGroups)
+  );
+  const componentId = React__default.default.useId();
+  React__default.default.useEffect(() => {
+    if (!collapsible) {
+      return;
+    }
+    setCollapsedGroups((current) => {
+      const next = new Map(current);
+      let changed = false;
+      for (const group of visibleGroups) {
+        if (!next.has(group.id)) {
+          next.set(
+            group.id,
+            Boolean(group.defaultCollapsed)
+          );
+          changed = true;
+        }
+      }
+      return changed ? next : current;
+    });
+  }, [collapsible, visibleGroups]);
+  if (visibleGroups.length === 0) {
+    return null;
+  }
+  const classes = classnames.classnames(
+    "course-outline",
+    className,
+    {
+      "course-outline--collapsible": collapsible
+    }
+  );
+  const toggleGroup = (group) => {
+    setCollapsedGroups((current) => {
+      const next = new Map(current);
+      next.set(
+        group.id,
+        !getGroupCollapsed(current, group)
+      );
+      return next;
+    });
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      className: classes,
+      ...props,
+      children: /* @__PURE__ */ jsxRuntime.jsx("ol", { className: "course-outline__groups", children: visibleGroups.map((group, groupIndex) => {
+        const isCollapsed = collapsible && getGroupCollapsed(
+          collapsedGroups,
+          group
+        );
+        const groupContentId = `${componentId}-group-${groupIndex}`;
+        return /* @__PURE__ */ jsxRuntime.jsxs(
+          "li",
+          {
+            className: "course-outline__group",
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx("header", { className: "course-outline__group-header", children: /* @__PURE__ */ jsxRuntime.jsx(GroupTitle, { level: headingLevel, children: collapsible ? /* @__PURE__ */ jsxRuntime.jsx(
+                "button",
+                {
+                  className: "course-outline__group-toggle",
+                  type: "button",
+                  "aria-expanded": !isCollapsed,
+                  "aria-controls": groupContentId,
+                  onClick: () => toggleGroup(group),
+                  children: group.title
+                }
+              ) : group.title }) }),
+              hasContent(group.description) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "course-outline__group-description", children: group.description }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "ol",
+                {
+                  className: "course-outline__items",
+                  id: groupContentId,
+                  hidden: isCollapsed,
+                  children: group.items.map((item) => {
+                    const hasMeta = hasContent(item.meta);
+                    const hasStatus = hasContent(
+                      item.status
+                    );
+                    const hasAction = hasContent(
+                      item.action
+                    );
+                    const hasFooter = hasStatus || hasAction;
+                    const itemClasses = classnames.classnames(
+                      "course-outline__item",
+                      "",
+                      {
+                        "course-outline__item--active": Boolean(item.active),
+                        "course-outline__item--disabled": Boolean(item.disabled)
+                      }
+                    );
+                    return /* @__PURE__ */ jsxRuntime.jsx(
+                      "li",
+                      {
+                        className: itemClasses,
+                        children: /* @__PURE__ */ jsxRuntime.jsxs(
+                          "article",
+                          {
+                            className: "course-outline__item-body",
+                            "aria-disabled": item.disabled ? "true" : void 0,
+                            children: [
+                              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "course-outline__title", children: item.title }),
+                              hasMeta && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "course-outline__meta", children: item.meta }),
+                              hasFooter && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "course-outline__footer", children: [
+                                hasStatus && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "course-outline__status", children: item.status }),
+                                hasAction && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "course-outline__action", children: item.action })
+                              ] })
+                            ]
+                          }
+                        )
+                      },
+                      item.id
+                    );
+                  })
+                }
+              )
+            ]
+          },
+          group.id
+        );
+      }) })
+    }
+  );
+};
+var course_outline_default = CourseOutline;
+
+module.exports = course_outline_default;
+//# sourceMappingURL=course-outline.cjs.map
+//# sourceMappingURL=course-outline.cjs.map

package/components/course-outline/course-outline.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/course-outline/course-outline.tsx"],"names":["jsx","React","classnames","jsxs"],"mappings":"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","file":"course-outline.cjs","sourcesContent":["import React from 'react';\n\nimport './course-outline.css';\nimport { classnames } from '../helpers/classnames';\n\nexport type CourseOutlineHeadingLevel =\n  | 2\n  | 3\n  | 4\n  | 5\n  | 6;\n\nexport interface CourseOutlineItem {\n  id: React.Key;\n  title: React.ReactNode;\n  meta?: React.ReactNode;\n  status?: React.ReactNode;\n  action?: React.ReactNode;\n  active?: boolean;\n  disabled?: boolean;\n}\n\nexport interface CourseOutlineGroup {\n  id: React.Key;\n  title: React.ReactNode;\n  description?: React.ReactNode;\n  items: CourseOutlineItem[];\n  defaultCollapsed?: boolean;\n}\n\nexport interface CourseOutlineProps\n  extends Omit<\n    React.HTMLAttributes<HTMLDivElement>,\n    'children'\n  > {\n  groups: CourseOutlineGroup[];\n  headingLevel?: CourseOutlineHeadingLevel;\n  collapsible?: boolean;\n}\n\ntype CollapsedGroups = Map<React.Key, boolean>;\n\nfunction hasContent(\n  value: React.ReactNode,\n): value is Exclude<\n  React.ReactNode,\n  null | undefined\n> {\n  return value !== null && value !== undefined;\n}\n\nfunction getInitialCollapsedGroups(\n  groups: CourseOutlineGroup[],\n): CollapsedGroups {\n  return new Map(\n    groups.map((group) => [\n      group.id,\n      Boolean(group.defaultCollapsed),\n    ]),\n  );\n}\n\nfunction getGroupCollapsed(\n  collapsedGroups: CollapsedGroups,\n  group: CourseOutlineGroup,\n) {\n  return (\n    collapsedGroups.get(group.id) ??\n    Boolean(group.defaultCollapsed)\n  );\n}\n\ninterface GroupTitleProps {\n  level?: CourseOutlineHeadingLevel;\n  children: React.ReactNode;\n}\n\nconst GroupTitle: React.FC<GroupTitleProps> = ({\n  level,\n  children,\n}) => {\n  if (!level) {\n    return (\n      <div className=\"course-outline__group-title\">\n        {children}\n      </div>\n    );\n  }\n\n  switch (level) {\n    case 2:\n      return (\n        <h2 className=\"course-outline__group-title\">\n          {children}\n        </h2>\n      );\n\n    case 3:\n      return (\n        <h3 className=\"course-outline__group-title\">\n          {children}\n        </h3>\n      );\n\n    case 4:\n      return (\n        <h4 className=\"course-outline__group-title\">\n          {children}\n        </h4>\n      );\n\n    case 5:\n      return (\n        <h5 className=\"course-outline__group-title\">\n          {children}\n        </h5>\n      );\n\n    default:\n      return (\n        <h6 className=\"course-outline__group-title\">\n          {children}\n        </h6>\n      );\n  }\n};\n\nconst CourseOutline: React.FC<CourseOutlineProps> = ({\n  groups,\n  headingLevel,\n  collapsible = false,\n  className = '',\n  ...props\n}) => {\n  const visibleGroups = React.useMemo(\n    () =>\n      groups.filter(\n        (group) => group.items.length > 0,\n      ),\n    [groups],\n  );\n\n  const [collapsedGroups, setCollapsedGroups] =\n    React.useState<CollapsedGroups>(() =>\n      getInitialCollapsedGroups(visibleGroups),\n    );\n\n  const componentId = React.useId();\n\n  React.useEffect(() => {\n    if (!collapsible) {\n      return;\n    }\n\n    setCollapsedGroups((current) => {\n      const next = new Map(current);\n      let changed = false;\n\n      for (const group of visibleGroups) {\n        if (!next.has(group.id)) {\n          next.set(\n            group.id,\n            Boolean(group.defaultCollapsed),\n          );\n\n          changed = true;\n        }\n      }\n\n      return changed ? next : current;\n    });\n  }, [collapsible, visibleGroups]);\n\n  if (visibleGroups.length === 0) {\n    return null;\n  }\n\n  const classes = classnames(\n    'course-outline',\n    className,\n    {\n      'course-outline--collapsible': collapsible,\n    },\n  );\n\n  const toggleGroup = (\n    group: CourseOutlineGroup,\n  ) => {\n    setCollapsedGroups((current) => {\n      const next = new Map(current);\n\n      next.set(\n        group.id,\n        !getGroupCollapsed(current, group),\n      );\n\n      return next;\n    });\n  };\n\n  return (\n    <div\n      className={classes}\n      {...props}\n    >\n      <ol className=\"course-outline__groups\">\n        {visibleGroups.map((group, groupIndex) => {\n          const isCollapsed =\n            collapsible &&\n            getGroupCollapsed(\n              collapsedGroups,\n              group,\n            );\n\n          const groupContentId =\n            `${componentId}-group-${groupIndex}`;\n\n          return (\n            <li\n              key={group.id}\n              className=\"course-outline__group\"\n            >\n              <header className=\"course-outline__group-header\">\n                <GroupTitle level={headingLevel}>\n                  {collapsible ? (\n                    <button\n                      className=\"course-outline__group-toggle\"\n                      type=\"button\"\n                      aria-expanded={!isCollapsed}\n                      aria-controls={groupContentId}\n                      onClick={() => toggleGroup(group)}\n                    >\n                      {group.title}\n                    </button>\n                  ) : (\n                    group.title\n                  )}\n                </GroupTitle>\n              </header>\n\n              {hasContent(group.description) && (\n                <div className=\"course-outline__group-description\">\n                  {group.description}\n                </div>\n              )}\n\n              <ol\n                className=\"course-outline__items\"\n                id={groupContentId}\n                hidden={isCollapsed}\n              >\n                {group.items.map((item) => {\n                  const hasMeta = hasContent(item.meta);\n                  const hasStatus = hasContent(\n                    item.status,\n                  );\n                  const hasAction = hasContent(\n                    item.action,\n                  );\n\n                  const hasFooter =\n                    hasStatus || hasAction;\n\n                  const itemClasses = classnames(\n                    'course-outline__item',\n                    '',\n                    {\n                      'course-outline__item--active':\n                        Boolean(item.active),\n\n                      'course-outline__item--disabled':\n                        Boolean(item.disabled),\n                    },\n                  );\n\n                  return (\n                    <li\n                      key={item.id}\n                      className={itemClasses}\n                    >\n                      <article\n                        className=\"course-outline__item-body\"\n                        aria-disabled={\n                          item.disabled\n                            ? 'true'\n                            : undefined\n                        }\n                      >\n                        <div className=\"course-outline__title\">\n                          {item.title}\n                        </div>\n\n                        {hasMeta && (\n                          <div className=\"course-outline__meta\">\n                            {item.meta}\n                          </div>\n                        )}\n\n                        {hasFooter && (\n                          <div className=\"course-outline__footer\">\n                            {hasStatus && (\n                              <div className=\"course-outline__status\">\n                                {item.status}\n                              </div>\n                            )}\n\n                            {hasAction && (\n                              <div className=\"course-outline__action\">\n                                {item.action}\n                              </div>\n                            )}\n                          </div>\n                        )}\n                      </article>\n                    </li>\n                  );\n                })}\n              </ol>\n            </li>\n          );\n        })}\n      </ol>\n    </div>\n  );\n};\n\nexport default CourseOutline;\n"]}