@inploi/plugin-job-search 0.17.1 → 0.18.0

package/dist/index.cjs

@@ -2204,7 +2204,7 @@ const AlertsButton = ({
 }) => {
   const [plugin, setPlugin] = h();
   y(() => {
-    Promise.resolve().then(() => require("./plugin-job-alerts-ee47a7fb.cjs")).then((m2) => setPlugin(m2.jobAlertsPlugin()({ analytics, apiClient, logger })));
+    Promise.resolve().then(() => require("./plugin-job-alerts-e8471004.cjs")).then((m2) => setPlugin(m2.jobAlertsPlugin()({ analytics, apiClient, logger })));
   }, [analytics, apiClient, logger]);
   y(() => {
     plugin == null ? void 0 : plugin.render({
@@ -3942,7 +3942,7 @@ const FilterContentActive = ({
           ) });
         case "revalidating":
         case "loaded": {
-          const allSuggestions = sortResults(unfilteredQuery.data[property.key] ?? [], property.sortSuggestions);
+          const allSuggestions = unfilteredQuery.data[property.key] ?? [];
           const filteredSuggestions = search && search.length > 1 ? allSuggestions.filter((s2) => s2.label.toLowerCase().includes(search.toLowerCase())) : allSuggestions;
           const suggestions = [];
           for (const suggestion of filteredSuggestions) {
@@ -3965,7 +3965,7 @@ const FilterContentActive = ({
           const noEnabledOptions = !suggestions.find((suggestion) => !suggestion.disabled);
           if (noEnabledOptions)
             return /* @__PURE__ */ u$1("p", { class: "font-style-tag text-style-tag font-weight-tag border-px w-full border-transparent px-4 py-2 text-center", children: "No filter options available." });
-          const isLongList = suggestions.length > SUGGESTIONS_COUNT_THRESHOLD || suggestions.some((suggestion) => suggestion.label.length > 24);
+          const isLongList = allSuggestions.length > SUGGESTIONS_COUNT_THRESHOLD || allSuggestions.some((suggestion) => suggestion.label.length > 24);
           return /* @__PURE__ */ u$1("div", { class: "pointer-fine:px-4", children: /* @__PURE__ */ u$1(
             "ul",
             {
@@ -3973,7 +3973,7 @@ const FilterContentActive = ({
                 "--maxHeight": TAG_HEIGHT * (LINE_COUNT + 0.5) + 2 * PADDING_Y + "px"
               },
               class: suggestionsListClass({ type: isLongList ? "long" : "short" }),
-              children: suggestions.map((suggestion) => {
+              children: sortResults(suggestions, property.sortSuggestions).map((suggestion) => {
                 const active = selectedValues.includes(suggestion.value);
                 return /* @__PURE__ */ u$1("li", { class: suggestionItemClass({ type: isLongList ? "line" : "pill" }), children: /* @__PURE__ */ u$1(
                   "button",
@@ -4205,6 +4205,36 @@ const useFilterKeyboardFocus = (activeKey, ref) => {
 };
 function noop() {
 }
+const mergeFilterValues = (subject, mergeWith) => {
+  var _a, _b, _c;
+  switch (mergeWith.select) {
+    case "many":
+      (_a = mergeWith.value) == null ? void 0 : _a.forEach((val) => {
+        var _a2, _b2;
+        switch (subject.select) {
+          case "many":
+            if (!((_a2 = subject.value) == null ? void 0 : _a2.includes(val)))
+              (_b2 = subject.value) == null ? void 0 : _b2.push(val);
+            break;
+          case "one":
+            subject.value = val;
+        }
+      });
+      break;
+    case "one":
+      if (!mergeWith.value)
+        break;
+      switch (subject.select) {
+        case "many":
+          if (!((_b = subject.value) == null ? void 0 : _b.includes(mergeWith.value)))
+            (_c = subject.value) == null ? void 0 : _c.push(mergeWith.value);
+          break;
+        case "one":
+          subject.value = mergeWith.value;
+      }
+      break;
+  }
+};
 const nextStateFromValue = ({
   property,
   value,
@@ -4245,10 +4275,7 @@ const FilterSection = ({
   var _a;
   const [activeKey, setActiveKey] = h((_a = properties[0]) == null ? void 0 : _a.key);
   useFilterKeyboardFocus(activeKey, parentRef);
-  const defaultFilters = T$1(
-    () => getFilterDefaults(properties.map(({ value: _2, ...prop }) => prop)),
-    [properties]
-  );
+  const defaultFilters = T$1(() => getFilterDefaults(properties, "value"), [properties]);
   const unfilteredQuery = getQueryState(
     useSWR(
       cacheKey({ filter: defaultFilters, baseKey: "filters" }),
@@ -4279,11 +4306,14 @@ const FilterSection = ({
   return /* @__PURE__ */ u$1("aside", { children: /* @__PURE__ */ u$1("div", { role: "tablist", class: "top-filters ijs-filters-section sticky flex flex-col gap-2 px-4 md:px-0", children: properties.filter((property) => property.hidden !== true).map((property) => {
     const active = activeKey === property.key;
     const value = appliedFilters[property.key] ?? { select: property.select, value: void 0 };
+    const propertyDefault = defaultFilters[property.key];
+    if (propertyDefault)
+      mergeFilterValues(value, propertyDefault);
     const onValueChange = (value2) => {
       const { newActiveKey, newValue } = nextStateFromValue({
         property,
         activeKey,
-        value: value2,
+        value: value2 ?? propertyDefault,
         properties,
         appliedFilters
       });
@@ -5010,17 +5040,18 @@ const ResultsPage = ({
       exhaustive(state);
   }
 };
-const getFilterDefaults = (properties) => properties.reduce(
+const getFilterDefaults = (properties, field = "value") => properties.reduce(
   (acc, property) => {
-    var _a;
     switch (property.select) {
       case "one": {
-        const value = typeof property.value === "string" ? property.value : (_a = property.value) == null ? void 0 : _a[0];
+        const defaultValue = property[field];
+        const value = typeof defaultValue === "string" ? defaultValue : defaultValue == null ? void 0 : defaultValue[0];
         acc[property.key] = { select: property.select, value };
         break;
       }
       case "many": {
-        const value = typeof property.value === "string" ? [property.value] : Array.isArray(property.value) ? property.value : [];
+        const defaultValue = property[field];
+        const value = typeof defaultValue === "string" ? [defaultValue] : Array.isArray(defaultValue) ? defaultValue : [];
         acc[property.key] = {
           select: property.select,
           value
@@ -5047,7 +5078,7 @@ const JobSearch = ({
   const appRef = A$1(null);
   const [appliedFilters, setAppliedFilters] = h(() => ({
     default: true,
-    filters: getFilterDefaults(properties)
+    filters: getFilterDefaults(properties, "defaultValue")
   }));
   return /* @__PURE__ */ u$1("div", { ref: appRef, class: className, id: JOB_SEARCH_SCOPE_ELEMENT_ID, children: /* @__PURE__ */ u$1("div", { class: "ijs-app bg-app rounded-app font-family-default font-weight-default font-style-default mx-auto flex min-h-screen max-w-screen-lg flex-col gap-4 py-4 md:grid md:grid-cols-3 md:px-4", children: [
     /* @__PURE__ */ u$1(ErrorBoundary, { Fallback: ErrorView, children: /* @__PURE__ */ u$1("div", { class: "flex flex-col gap-2", children: [
@@ -5236,35 +5267,38 @@ const match = (subject) => {
   return run(subject);
 };
 const [black, white, transparent] = ["oklch(0 0 0)", "oklch(100 0 0)", "transparent"];
-const tokens = designTokens().core(({ theme }) => ({
-  color: {
-    black,
-    white,
-    lowest: theme.mode === "light" ? white : black,
-    highest: theme.mode === "light" ? black : white,
-    ...generatePalette({
-      prefix: "a-",
-      hue: theme.accent.hue,
-      chroma: theme.accent.chroma,
-      mode: theme.mode,
-      transform: sameAsInput
-    }),
-    ...generatePalette({
-      prefix: "n-",
-      hue: theme.accent.hue,
-      chroma: 0.05,
-      mode: theme.mode,
-      transform: sameAsInput
-    }),
-    ...generatePalette({
-      prefix: "m-",
-      hue: 140,
-      chroma: theme.accent.chroma,
-      mode: theme.mode,
-      transform: sameAsInput
-    })
-  }
-})).semantic(({ core, theme, raw }) => {
+const tokens = designTokens().core(({ theme }) => {
+  var _a, _b;
+  return {
+    color: {
+      black,
+      white,
+      lowest: theme.mode === "light" ? white : black,
+      highest: theme.mode === "light" ? black : white,
+      ...generatePalette({
+        prefix: "a-",
+        hue: theme.accent.hue,
+        chroma: theme.accent.chroma,
+        mode: theme.mode,
+        transform: sameAsInput
+      }),
+      ...generatePalette({
+        prefix: "n-",
+        hue: ((_a = theme.neutral) == null ? void 0 : _a.hue) ?? theme.accent.hue,
+        chroma: ((_b = theme.neutral) == null ? void 0 : _b.chroma) ?? 0.05,
+        mode: theme.mode,
+        transform: sameAsInput
+      }),
+      ...generatePalette({
+        prefix: "m-",
+        hue: 140,
+        chroma: theme.accent.chroma,
+        mode: theme.mode,
+        transform: sameAsInput
+      })
+    }
+  };
+}).semantic(({ core, theme, raw }) => {
   var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n2, _o, _p, _q, _r, _s, _t, _u;
   const withOpacity = (token, opacity) => raw.core.color[token].replace(")", ` / ${opacity})`);
   const { typography, highlights } = theme;

package/dist/index.js

@@ -2202,7 +2202,7 @@ const AlertsButton = ({
 }) => {
   const [plugin, setPlugin] = h();
   y(() => {
-    import("./plugin-job-alerts-ddf07a02.js").then((m2) => setPlugin(m2.jobAlertsPlugin()({ analytics, apiClient, logger })));
+    import("./plugin-job-alerts-2ce58f09.js").then((m2) => setPlugin(m2.jobAlertsPlugin()({ analytics, apiClient, logger })));
   }, [analytics, apiClient, logger]);
   y(() => {
     plugin == null ? void 0 : plugin.render({
@@ -3940,7 +3940,7 @@ const FilterContentActive = ({
           ) });
         case "revalidating":
         case "loaded": {
-          const allSuggestions = sortResults(unfilteredQuery.data[property.key] ?? [], property.sortSuggestions);
+          const allSuggestions = unfilteredQuery.data[property.key] ?? [];
           const filteredSuggestions = search && search.length > 1 ? allSuggestions.filter((s2) => s2.label.toLowerCase().includes(search.toLowerCase())) : allSuggestions;
           const suggestions = [];
           for (const suggestion of filteredSuggestions) {
@@ -3963,7 +3963,7 @@ const FilterContentActive = ({
           const noEnabledOptions = !suggestions.find((suggestion) => !suggestion.disabled);
           if (noEnabledOptions)
             return /* @__PURE__ */ u$1("p", { class: "font-style-tag text-style-tag font-weight-tag border-px w-full border-transparent px-4 py-2 text-center", children: "No filter options available." });
-          const isLongList = suggestions.length > SUGGESTIONS_COUNT_THRESHOLD || suggestions.some((suggestion) => suggestion.label.length > 24);
+          const isLongList = allSuggestions.length > SUGGESTIONS_COUNT_THRESHOLD || allSuggestions.some((suggestion) => suggestion.label.length > 24);
           return /* @__PURE__ */ u$1("div", { class: "pointer-fine:px-4", children: /* @__PURE__ */ u$1(
             "ul",
             {
@@ -3971,7 +3971,7 @@ const FilterContentActive = ({
                 "--maxHeight": TAG_HEIGHT * (LINE_COUNT + 0.5) + 2 * PADDING_Y + "px"
               },
               class: suggestionsListClass({ type: isLongList ? "long" : "short" }),
-              children: suggestions.map((suggestion) => {
+              children: sortResults(suggestions, property.sortSuggestions).map((suggestion) => {
                 const active = selectedValues.includes(suggestion.value);
                 return /* @__PURE__ */ u$1("li", { class: suggestionItemClass({ type: isLongList ? "line" : "pill" }), children: /* @__PURE__ */ u$1(
                   "button",
@@ -4203,6 +4203,36 @@ const useFilterKeyboardFocus = (activeKey, ref) => {
 };
 function noop() {
 }
+const mergeFilterValues = (subject, mergeWith) => {
+  var _a, _b, _c;
+  switch (mergeWith.select) {
+    case "many":
+      (_a = mergeWith.value) == null ? void 0 : _a.forEach((val) => {
+        var _a2, _b2;
+        switch (subject.select) {
+          case "many":
+            if (!((_a2 = subject.value) == null ? void 0 : _a2.includes(val)))
+              (_b2 = subject.value) == null ? void 0 : _b2.push(val);
+            break;
+          case "one":
+            subject.value = val;
+        }
+      });
+      break;
+    case "one":
+      if (!mergeWith.value)
+        break;
+      switch (subject.select) {
+        case "many":
+          if (!((_b = subject.value) == null ? void 0 : _b.includes(mergeWith.value)))
+            (_c = subject.value) == null ? void 0 : _c.push(mergeWith.value);
+          break;
+        case "one":
+          subject.value = mergeWith.value;
+      }
+      break;
+  }
+};
 const nextStateFromValue = ({
   property,
   value,
@@ -4243,10 +4273,7 @@ const FilterSection = ({
   var _a;
   const [activeKey, setActiveKey] = h((_a = properties[0]) == null ? void 0 : _a.key);
   useFilterKeyboardFocus(activeKey, parentRef);
-  const defaultFilters = T$1(
-    () => getFilterDefaults(properties.map(({ value: _2, ...prop }) => prop)),
-    [properties]
-  );
+  const defaultFilters = T$1(() => getFilterDefaults(properties, "value"), [properties]);
   const unfilteredQuery = getQueryState(
     useSWR(
       cacheKey({ filter: defaultFilters, baseKey: "filters" }),
@@ -4277,11 +4304,14 @@ const FilterSection = ({
   return /* @__PURE__ */ u$1("aside", { children: /* @__PURE__ */ u$1("div", { role: "tablist", class: "top-filters ijs-filters-section sticky flex flex-col gap-2 px-4 md:px-0", children: properties.filter((property) => property.hidden !== true).map((property) => {
     const active = activeKey === property.key;
     const value = appliedFilters[property.key] ?? { select: property.select, value: void 0 };
+    const propertyDefault = defaultFilters[property.key];
+    if (propertyDefault)
+      mergeFilterValues(value, propertyDefault);
     const onValueChange = (value2) => {
       const { newActiveKey, newValue } = nextStateFromValue({
         property,
         activeKey,
-        value: value2,
+        value: value2 ?? propertyDefault,
         properties,
         appliedFilters
       });
@@ -5008,17 +5038,18 @@ const ResultsPage = ({
       exhaustive(state);
   }
 };
-const getFilterDefaults = (properties) => properties.reduce(
+const getFilterDefaults = (properties, field = "value") => properties.reduce(
   (acc, property) => {
-    var _a;
     switch (property.select) {
       case "one": {
-        const value = typeof property.value === "string" ? property.value : (_a = property.value) == null ? void 0 : _a[0];
+        const defaultValue = property[field];
+        const value = typeof defaultValue === "string" ? defaultValue : defaultValue == null ? void 0 : defaultValue[0];
         acc[property.key] = { select: property.select, value };
         break;
       }
       case "many": {
-        const value = typeof property.value === "string" ? [property.value] : Array.isArray(property.value) ? property.value : [];
+        const defaultValue = property[field];
+        const value = typeof defaultValue === "string" ? [defaultValue] : Array.isArray(defaultValue) ? defaultValue : [];
         acc[property.key] = {
           select: property.select,
           value
@@ -5045,7 +5076,7 @@ const JobSearch = ({
   const appRef = A$1(null);
   const [appliedFilters, setAppliedFilters] = h(() => ({
     default: true,
-    filters: getFilterDefaults(properties)
+    filters: getFilterDefaults(properties, "defaultValue")
   }));
   return /* @__PURE__ */ u$1("div", { ref: appRef, class: className, id: JOB_SEARCH_SCOPE_ELEMENT_ID, children: /* @__PURE__ */ u$1("div", { class: "ijs-app bg-app rounded-app font-family-default font-weight-default font-style-default mx-auto flex min-h-screen max-w-screen-lg flex-col gap-4 py-4 md:grid md:grid-cols-3 md:px-4", children: [
     /* @__PURE__ */ u$1(ErrorBoundary, { Fallback: ErrorView, children: /* @__PURE__ */ u$1("div", { class: "flex flex-col gap-2", children: [
@@ -5234,35 +5265,38 @@ const match = (subject) => {
   return run(subject);
 };
 const [black, white, transparent] = ["oklch(0 0 0)", "oklch(100 0 0)", "transparent"];
-const tokens = designTokens().core(({ theme }) => ({
-  color: {
-    black,
-    white,
-    lowest: theme.mode === "light" ? white : black,
-    highest: theme.mode === "light" ? black : white,
-    ...generatePalette({
-      prefix: "a-",
-      hue: theme.accent.hue,
-      chroma: theme.accent.chroma,
-      mode: theme.mode,
-      transform: sameAsInput
-    }),
-    ...generatePalette({
-      prefix: "n-",
-      hue: theme.accent.hue,
-      chroma: 0.05,
-      mode: theme.mode,
-      transform: sameAsInput
-    }),
-    ...generatePalette({
-      prefix: "m-",
-      hue: 140,
-      chroma: theme.accent.chroma,
-      mode: theme.mode,
-      transform: sameAsInput
-    })
-  }
-})).semantic(({ core, theme, raw }) => {
+const tokens = designTokens().core(({ theme }) => {
+  var _a, _b;
+  return {
+    color: {
+      black,
+      white,
+      lowest: theme.mode === "light" ? white : black,
+      highest: theme.mode === "light" ? black : white,
+      ...generatePalette({
+        prefix: "a-",
+        hue: theme.accent.hue,
+        chroma: theme.accent.chroma,
+        mode: theme.mode,
+        transform: sameAsInput
+      }),
+      ...generatePalette({
+        prefix: "n-",
+        hue: ((_a = theme.neutral) == null ? void 0 : _a.hue) ?? theme.accent.hue,
+        chroma: ((_b = theme.neutral) == null ? void 0 : _b.chroma) ?? 0.05,
+        mode: theme.mode,
+        transform: sameAsInput
+      }),
+      ...generatePalette({
+        prefix: "m-",
+        hue: 140,
+        chroma: theme.accent.chroma,
+        mode: theme.mode,
+        transform: sameAsInput
+      })
+    }
+  };
+}).semantic(({ core, theme, raw }) => {
   var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n2, _o, _p, _q, _r, _s, _t, _u;
   const withOpacity = (token, opacity) => raw.core.color[token].replace(")", ` / ${opacity})`);
   const { typography, highlights } = theme;

package/dist/job-search.d.ts

@@ -31,8 +31,10 @@ export type FilterProperty = {
      * You can use this property to hard-code searches without allowing the user to modify or view them.
      */
     hidden?: boolean;
-    /** The initial value for the filter. */
+    /** The **fixed** value for the filter. Cannot be removed or changed. */
     value?: string | string[];
+    /** The **default** value for the filter. Can be removed or changed, but defaults to it during initial load. */
+    defaultValue?: string | string[];
     /** Whether users can search from the available results.
      *  @default false
      */
@@ -83,6 +85,12 @@ export type JobSearchPluginParams = {
             /** Float between 0 and 2. Acts as a multiplier to the original generated palette. */
             chroma: number;
         };
+        neutral?: {
+            /** Number between 0 and 360. Number above or below range will loop. */
+            hue: number;
+            /** Float between 0 and 2. Acts as a multiplier to the original generated palette. */
+            chroma: number;
+        };
         typography: Partial<FontSettings> & Partial<Record<TextStyle, Partial<FontSettings>>>;
         /** Applies to the filter section on desktop. Override to ensure the filters are stuck to the top of the viewport,
          * but not obscured by the header. This is useful when the header is sticky on your website.
@@ -195,14 +203,13 @@ export declare const jobSearchPlugin: () => ({ apiClient, logger, analytics }: {
                     id: number;
                     createdAt: string | null;
                     company: {
-                        /** Whether users can search from the available results.
-                         *  @default false
-                         */
                         name: string;
                         logo: string | undefined;
                     };
                     employmentType: string;
-                    locationType: "LOCATION" | "REMOTE" | "HYBRID";
+                    locationType: "LOCATION" | "REMOTE" | "HYBRID"; /** Whether users can search from the available results.
+                     *  @default false
+                     */
                     pay: string | undefined;
                     description: string;
                     title: string;