@kaizen/draft-illustration - npm Package Compare versions

Comparing version 1.7.2 to 1.8.0

CHANGELOG.md

@@ -6,2 +6,13 @@ # Change Log
 
+# [1.8.0](https://github.com/cultureamp/kaizen-design-system/compare/@kaizen/draft-illustration@1.7.2...@kaizen/draft-illustration@1.8.0) (2021-04-26)
+
+
+### Features
+
+* Added Heart spot illustrations ([#1473](https://github.com/cultureamp/kaizen-design-system/issues/1473)) ([14df2be](https://github.com/cultureamp/kaizen-design-system/commit/14df2bef851f7f52e811e48fd507d03d665e3189))
+
+
+
+
+
 ## [1.7.2](https://github.com/cultureamp/kaizen-design-system/compare/@kaizen/draft-illustration@1.7.1...@kaizen/draft-illustration@1.7.2) (2021-04-23)
@@ -8,0 +19,0 @@

KaizenDraft/Illustration/Spot.d.ts

 import { BaseProps } from "./Base";
 export declare type SpotProps = Pick<BaseProps, "alt" | "classNameAndIHaveSpokenToDST">;
+/**
+ * Moods
+ */
+export declare const Cautionary: (props: SpotProps) => JSX.Element;
+export declare const Informative: (props: SpotProps) => JSX.Element;
+export declare const Negative: (props: SpotProps) => JSX.Element;
+/**
+ * @deprecated Use the non-gendered Positive illustration instead
+ */
+export declare const PositiveMale: (props: SpotProps) => JSX.Element;
+/**
+ * @deprecated Use the non-gendered Positive illustration instead
+ */
+export declare const PositiveFemale: (props: SpotProps) => JSX.Element;
+export declare const Positive: (props: SpotProps) => JSX.Element;
+export declare const Assertive: (props: SpotProps) => JSX.Element;
+/**
+ * Template Library / Engagement
+ */
 export declare const BenefitsSurvey: (props: SpotProps) => JSX.Element;
@@ -16,2 +35,8 @@ export declare const CustomSurvey: (props: SpotProps) => JSX.Element;
 export declare const ChangeSuccess: (props: SpotProps) => JSX.Element;
+export declare const PerformanceDiagnostics: (props: SpotProps) => JSX.Element;
+export declare const LeadingThroughCrisis: (props: SpotProps) => JSX.Element;
+export declare const EmergencyResponse: (props: SpotProps) => JSX.Element;
+/**
+ * Template Library / Experience
+ */
 export declare const CandidateSurvey: (props: SpotProps) => JSX.Element;
@@ -24,2 +49,7 @@ export declare const CustomOnboardSurvey: (props: SpotProps) => JSX.Element;
 export declare const SinglePointOnboardSurvey: (props: SpotProps) => JSX.Element;
+export declare const GeneralOnboardSurvey: (props: SpotProps) => JSX.Element;
+export declare const RemoteOnboardSurvey: (props: SpotProps) => JSX.Element;
+/**
+ * Template Library / Performance
+ */
 export declare const Individual360: (props: SpotProps) => JSX.Element;
@@ -30,2 +60,13 @@ export declare const Leadership360: (props: SpotProps) => JSX.Element;
 export declare const TeamEffectiveness2: (props: SpotProps) => JSX.Element;
+/**
+ * Template Library / COVID-19
+ */
+export declare const WellbeingSurvey: (props: SpotProps) => JSX.Element;
+export declare const Response: (props: SpotProps) => JSX.Element;
+export declare const RemoteWorkQSet: (props: SpotProps) => JSX.Element;
+export declare const ReturnToWorkplace: (props: SpotProps) => JSX.Element;
+export declare const PulseSurvey: (props: SpotProps) => JSX.Element;
+/**
+ * New Account
+ */
 export declare const AccountBasics: (props: SpotProps) => JSX.Element;
@@ -37,2 +78,16 @@ export declare const CompanyDetails: (props: SpotProps) => JSX.Element;
 export declare const AddUser: (props: SpotProps) => JSX.Element;
+/**
+ * Skills Coach (previously referred to as Manager Learning)
+ */
+export declare const Strategy: (props: SpotProps) => JSX.Element;
+export declare const Resilience: (props: SpotProps) => JSX.Element;
+export declare const RemoteManager: (props: SpotProps) => JSX.Element;
+export declare const Productivity: (props: SpotProps) => JSX.Element;
+export declare const ManagerLearning: (props: SpotProps) => JSX.Element;
+export declare const Feedback: (props: SpotProps) => JSX.Element;
+export declare const Coaching: (props: SpotProps) => JSX.Element;
+export declare const OneOnOne: (props: SpotProps) => JSX.Element;
+/**
+ * Miscellaneous
+ */
 export declare const ViewReports: (props: SpotProps) => JSX.Element;
@@ -59,15 +114,14 @@ export declare const ReadArticle: (props: SpotProps) => JSX.Element;
 export declare const LeaderReportSharing: (props: SpotProps) => JSX.Element;
-export declare const Cautionary: (props: SpotProps) => JSX.Element;
-export declare const Informative: (props: SpotProps) => JSX.Element;
-export declare const Negative: (props: SpotProps) => JSX.Element;
-export declare const PositiveMale: (props: SpotProps) => JSX.Element;
-export declare const PositiveFemale: (props: SpotProps) => JSX.Element;
-export declare const OneOnOne: (props: SpotProps) => JSX.Element;
-export declare const Productivity: (props: SpotProps) => JSX.Element;
-export declare const Strategy: (props: SpotProps) => JSX.Element;
-export declare const Resilience: (props: SpotProps) => JSX.Element;
-export declare const Coaching: (props: SpotProps) => JSX.Element;
-export declare const Feedback: (props: SpotProps) => JSX.Element;
-export declare const RemoteManager: (props: SpotProps) => JSX.Element;
-export declare const ManagerLearning: (props: SpotProps) => JSX.Element;
-export declare const PerformanceDiagnostics: (props: SpotProps) => JSX.Element;
+export declare const Alarm: (props: SpotProps) => JSX.Element;
+export declare const Fire: (props: SpotProps) => JSX.Element;
+export declare const Fireworks: (props: SpotProps) => JSX.Element;
+export declare const FullImport: (props: SpotProps) => JSX.Element;
+export declare const HrisImport: (props: SpotProps) => JSX.Element;
+export declare const PartialImport: (props: SpotProps) => JSX.Element;
+export declare const Starburst: (props: SpotProps) => JSX.Element;
+export declare const Stop: (props: SpotProps) => JSX.Element;
+export declare const TrafficCone: (props: SpotProps) => JSX.Element;
+export declare const Trophy: (props: SpotProps) => JSX.Element;
+export declare const UnderConstruction: (props: SpotProps) => JSX.Element;
+export declare const ValueAdd: (props: SpotProps) => JSX.Element;
+export declare const Recommendation: (props: SpotProps) => JSX.Element;

KaizenDraft/Illustration/Spot.js

@@ -33,71 +33,670 @@ "use strict";
 exports.__esModule = true;
-exports.PerformanceDiagnostics = exports.ManagerLearning = exports.RemoteManager = exports.Feedback = exports.Coaching = exports.Resilience = exports.Strategy = exports.Productivity = exports.OneOnOne = exports.PositiveFemale = exports.PositiveMale = exports.Negative = exports.Informative = exports.Cautionary = exports.LeaderReportSharing = exports.ManagerReportSharing = exports.ExecutiveReportSharing = exports.Team = exports.ShareReport = exports.Training3 = exports.Training2 = exports.Training1 = exports.Action = exports.TakeAim = exports.BlankSurvey = exports.ReportSharing = exports.Video = exports.Workshop = exports.MeetingVoices = exports.AddImage = exports.SpreadsheetTemplate = exports.BaselineSurvey = exports.FastAction = exports.ReadArticle = exports.ViewReports = exports.AddUser = exports.Timezone = exports.Gdpr = exports.EmployeeData = exports.CompanyDetails = exports.AccountBasics = exports.TeamEffectiveness2 = exports.TeamEffectiveness1 = exports.Manager360 = exports.Leadership360 = exports.Individual360 = exports.SinglePointOnboardSurvey = exports.PhasedWeek5OnboardSurvey = exports.PhasedWeek1OnboardSurvey = exports.InternSurvey = exports.ExitSurvey = exports.CustomOnboardSurvey = exports.CandidateSurvey = exports.ChangeSuccess = exports.ChangeReadiness = exports.WellbeingSurvey3 = exports.WellbeingSurvey2 = exports.WellbeingSurvey1 = exports.ValuesSurvey2 = exports.ValuesSurvey1 = exports.QuickEngagementSurvey = exports.InclusionSurvey = exports.EngagementSurvey = exports.CustomUnattributedSurvey = exports.CustomSurvey = exports.BenefitsSurvey = void 0;
+exports.Recommendation = exports.ValueAdd = exports.UnderConstruction = exports.Trophy = exports.TrafficCone = exports.Stop = exports.Starburst = exports.PartialImport = exports.HrisImport = exports.FullImport = exports.Fireworks = exports.Fire = exports.Alarm = exports.LeaderReportSharing = exports.ManagerReportSharing = exports.ExecutiveReportSharing = exports.Team = exports.ShareReport = exports.Training3 = exports.Training2 = exports.Training1 = exports.Action = exports.TakeAim = exports.BlankSurvey = exports.ReportSharing = exports.Video = exports.Workshop = exports.MeetingVoices = exports.AddImage = exports.SpreadsheetTemplate = exports.BaselineSurvey = exports.FastAction = exports.ReadArticle = exports.ViewReports = exports.OneOnOne = exports.Coaching = exports.Feedback = exports.ManagerLearning = exports.Productivity = exports.RemoteManager = exports.Resilience = exports.Strategy = exports.AddUser = exports.Timezone = exports.Gdpr = exports.EmployeeData = exports.CompanyDetails = exports.AccountBasics = exports.PulseSurvey = exports.ReturnToWorkplace = exports.RemoteWorkQSet = exports.Response = exports.WellbeingSurvey = exports.TeamEffectiveness2 = exports.TeamEffectiveness1 = exports.Manager360 = exports.Leadership360 = exports.Individual360 = exports.RemoteOnboardSurvey = exports.GeneralOnboardSurvey = exports.SinglePointOnboardSurvey = exports.PhasedWeek5OnboardSurvey = exports.PhasedWeek1OnboardSurvey = exports.InternSurvey = exports.ExitSurvey = exports.CustomOnboardSurvey = exports.CandidateSurvey = exports.EmergencyResponse = exports.LeadingThroughCrisis = exports.PerformanceDiagnostics = exports.ChangeSuccess = exports.ChangeReadiness = exports.WellbeingSurvey3 = exports.WellbeingSurvey2 = exports.WellbeingSurvey1 = exports.ValuesSurvey2 = exports.ValuesSurvey1 = exports.QuickEngagementSurvey = exports.InclusionSurvey = exports.EngagementSurvey = exports.CustomUnattributedSurvey = exports.CustomSurvey = exports.BenefitsSurvey = exports.Assertive = exports.Positive = exports.PositiveFemale = exports.PositiveMale = exports.Negative = exports.Informative = exports.Cautionary = void 0;
+var design_tokens_1 = require("@kaizen/design-tokens");
 var React = __importStar(require("react"));
 var Base_1 = require("./Base");
-exports.BenefitsSurvey = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/template-library-benefits-survey.svg" }))); };
-exports.CustomSurvey = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/template-library-custom-survey.svg" }))); };
-exports.CustomUnattributedSurvey = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/template-library-custom-unattributed-survey.svg" }))); };
-exports.EngagementSurvey = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/template-library-engagement-survey.svg" }))); };
-exports.InclusionSurvey = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/template-library-inclusion-survey.svg" }))); };
-exports.QuickEngagementSurvey = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/template-library-quick-engagement-survey.svg" }))); };
-exports.ValuesSurvey1 = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/template-library-values-survey-1.svg" }))); };
-exports.ValuesSurvey2 = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/template-library-values-survey-2.svg" }))); };
-exports.WellbeingSurvey1 = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/template-library-wellbeing-survey-1.svg" }))); };
-exports.WellbeingSurvey2 = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/template-library-wellbeing-survey-2.svg" }))); };
-exports.WellbeingSurvey3 = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/template-library-wellbeing-survey-3.svg" }))); };
-exports.ChangeReadiness = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/template-library-change-readiness.svg" }))); };
-exports.ChangeSuccess = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/template-library-change-success.svg" }))); };
-exports.CandidateSurvey = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/template-library-candidate-survey.svg" }))); };
-exports.CustomOnboardSurvey = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/template-library-custom-onboard-survey.svg" }))); };
-exports.ExitSurvey = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/template-library-exit-survey.svg" }))); };
-exports.InternSurvey = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/template-library-intern-survey.svg" }))); };
-exports.PhasedWeek1OnboardSurvey = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/template-library-phased-week-1-onboard-survey.svg" }))); };
-exports.PhasedWeek5OnboardSurvey = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/template-library-phased-week-5-onboard-survey.svg" }))); };
-exports.SinglePointOnboardSurvey = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/template-library-single-point-onboard-survey.svg" }))); };
-exports.Individual360 = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/template-library-individual-360.svg" }))); };
-exports.Leadership360 = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/template-library-leadership-360.svg" }))); };
-exports.Manager360 = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/template-library-manager-360.svg" }))); };
-exports.TeamEffectiveness1 = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/template-library-team-effectiveness-1.svg" }))); };
-exports.TeamEffectiveness2 = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/template-library-team-effectiveness-2.svg" }))); };
-exports.AccountBasics = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/new-account-account-basics.svg" }))); };
-exports.CompanyDetails = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/new-account-company-details.svg" }))); };
-exports.EmployeeData = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/new-account-employee-data.svg" }))); };
-exports.Gdpr = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/new-account-gdpr.svg" }))); };
-exports.Timezone = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/new-account-timezone.svg" }))); };
-exports.AddUser = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/new-account-add-user.svg" }))); };
-exports.ViewReports = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/miscellaneous-view-reports.svg" }))); };
-exports.ReadArticle = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/miscellaneous-read-article.svg" }))); };
-exports.FastAction = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/miscellaneous-fast-action.svg" }))); };
-exports.BaselineSurvey = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/miscellaneous-baseline-survey.svg" }))); };
-exports.SpreadsheetTemplate = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/miscellaneous-spreadsheet-template.svg" }))); };
-exports.AddImage = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/miscellaneous-add-image.svg" }))); };
-exports.MeetingVoices = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/miscellaneous-meeting-voices.svg" }))); };
-exports.Workshop = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/miscellaneous-workshop.svg" }))); };
-exports.Video = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/miscellaneous-video.svg" }))); };
-exports.ReportSharing = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/miscellaneous-report-sharing.svg" }))); };
-exports.BlankSurvey = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/miscellaneous-blank-survey.svg" }))); };
-exports.TakeAim = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/miscellaneous-take-aim.svg" }))); };
-exports.Action = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/miscellaneous-action.svg" }))); };
-exports.Training1 = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/miscellaneous-training-1.svg" }))); };
-exports.Training2 = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/miscellaneous-training-2.svg" }))); };
-exports.Training3 = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/miscellaneous-training-3.svg" }))); };
-exports.ShareReport = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/miscellaneous-share-report.svg" }))); };
-exports.Team = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/miscellaneous-team.svg" }))); };
-exports.ExecutiveReportSharing = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/miscellaneous-executive-report-sharing.svg" }))); };
-exports.ManagerReportSharing = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/miscellaneous-manager-report-sharing.svg" }))); };
-exports.LeaderReportSharing = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/miscellaneous-leader-report-sharing.svg" }))); };
-exports.Cautionary = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/moods-cautionary.svg" }))); };
-exports.Informative = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/moods-informative.svg" }))); };
-exports.Negative = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/moods-negative.svg" }))); };
-exports.PositiveMale = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/moods-positive-male.svg" }))); };
-exports.PositiveFemale = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/moods-positive-female.svg" }))); };
-exports.OneOnOne = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/manager-learning-1-on-1.svg" }))); };
-exports.Productivity = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/manager-learning-productivity.svg" }))); };
-exports.Strategy = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/manager-learning-strategy.svg" }))); };
-exports.Resilience = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/manager-learning-resilience.svg" }))); };
-exports.Coaching = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/manager-learning-coaching.svg" }))); };
-exports.Feedback = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/manager-learning-feedback.svg" }))); };
-exports.RemoteManager = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/manager-learning-remote-manager.svg" }))); };
-exports.ManagerLearning = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/manager-learning-manager-learning.svg" }))); };
-exports.PerformanceDiagnostics = function (props) { return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/spot/template-library-diagnostics.svg" }))); };
+var noZenIllustrationWarning = function (illustrationName) {
+    // eslint-disable-next-line no-console
+    console.warn("Kaizen Illustration: No corresponding Zen illustration for " + illustrationName + ". Displaying Heart illustration instead.\"");
+};
+/**
+ * Moods
+ */
+exports.Cautionary = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/moods-cautionary.svg"
+        : "illustrations/heart/spot/moods-cautionary.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.Informative = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/moods-informative.svg"
+        : "illustrations/heart/spot/moods-informative.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.Negative = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/moods-negative.svg"
+        : "illustrations/heart/spot/moods-negative.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+/**
+ * @deprecated Use the non-gendered Positive illustration instead
+ */
+exports.PositiveMale = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/moods-positive-male.svg"
+        : "illustrations/heart/spot/moods-positive.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+/**
+ * @deprecated Use the non-gendered Positive illustration instead
+ */
+exports.PositiveFemale = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/moods-positive-female.svg"
+        : "illustrations/heart/spot/moods-positive.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.Positive = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/moods-positive-female.svg"
+        : "illustrations/heart/spot/moods-positive.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.Assertive = function (props) {
+    var theme = design_tokens_1.useTheme();
+    if (theme.themeKey === "zen") {
+        noZenIllustrationWarning("Assertive");
+    }
+    return React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/heart/spot/moods-assertive.svg" }));
+};
+/**
+ * Template Library / Engagement
+ */
+exports.BenefitsSurvey = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/template-library-benefits-survey.svg"
+        : "illustrations/heart/spot/template-library-benefits-survey.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.CustomSurvey = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/template-library-custom-survey.svg"
+        : "illustrations/heart/spot/template-library-custom-survey.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.CustomUnattributedSurvey = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/template-library-custom-unattributed-survey.svg"
+        : "illustrations/heart/spot/template-library-custom-unattributed-survey.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.EngagementSurvey = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/template-library-engagement-survey.svg"
+        : "illustrations/heart/spot/template-library-engagement-survey.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.InclusionSurvey = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/template-library-inclusion-survey.svg"
+        : "illustrations/heart/spot/template-library-inclusion-survey.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.QuickEngagementSurvey = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/template-library-quick-engagement-survey.svg"
+        : "illustrations/heart/spot/template-library-quick-engagement-survey.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.ValuesSurvey1 = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/template-library-values-survey-1.svg"
+        : "illustrations/heart/spot/template-library-values-survey-1.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.ValuesSurvey2 = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/template-library-values-survey-2.svg"
+        : "illustrations/heart/spot/template-library-values-survey-2.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.WellbeingSurvey1 = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/template-library-wellbeing-survey-1.svg"
+        : "illustrations/heart/spot/template-library-wellbeing-survey-1.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.WellbeingSurvey2 = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/template-library-wellbeing-survey-2.svg"
+        : "illustrations/heart/spot/template-library-wellbeing-survey-2.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.WellbeingSurvey3 = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/template-library-wellbeing-survey-3.svg"
+        : "illustrations/heart/spot/template-library-wellbeing-survey-3.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.ChangeReadiness = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/template-library-change-readiness.svg"
+        : "illustrations/heart/spot/template-library-change-readiness.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.ChangeSuccess = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/template-library-change-success.svg"
+        : "illustrations/heart/spot/template-library-change-success.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.PerformanceDiagnostics = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/template-library-diagnostics.svg"
+        : "illustrations/heart/spot/template-library-performance-diagnostics.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.LeadingThroughCrisis = function (props) {
+    var theme = design_tokens_1.useTheme();
+    if (theme.themeKey === "zen") {
+        noZenIllustrationWarning("LeadingThroughCrisis");
+    }
+    return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/heart/spot/template-library-leading-through-crisis.svg" })));
+};
+exports.EmergencyResponse = function (props) {
+    var theme = design_tokens_1.useTheme();
+    if (theme.themeKey === "zen") {
+        noZenIllustrationWarning("EmergencyResponse");
+    }
+    return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/heart/spot/template-library-emergency-response.svg" })));
+};
+/**
+ * Template Library / Experience
+ */
+exports.CandidateSurvey = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/template-library-candidate-survey.svg"
+        : "illustrations/heart/spot/template-library-candidate-survey.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.CustomOnboardSurvey = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/template-library-custom-onboard-survey.svg"
+        : "illustrations/heart/spot/template-library-custom-onboard-survey.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.ExitSurvey = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/template-library-exit-survey.svg"
+        : "illustrations/heart/spot/template-library-exit-survey.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.InternSurvey = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/template-library-intern-survey.svg"
+        : "illustrations/heart/spot/template-library-intern-survey.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.PhasedWeek1OnboardSurvey = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/template-library-phased-week-1-onboard-survey.svg"
+        : "illustrations/heart/spot/template-library-phased-week-1-onboard-survey.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.PhasedWeek5OnboardSurvey = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/template-library-phased-week-5-onboard-survey.svg"
+        : "illustrations/heart/spot/template-library-phased-week-5-onboard-survey.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.SinglePointOnboardSurvey = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/template-library-single-point-onboard-survey.svg"
+        : "illustrations/heart/spot/template-library-single-point-onboard-survey.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.GeneralOnboardSurvey = function (props) {
+    var theme = design_tokens_1.useTheme();
+    if (theme.themeKey === "zen") {
+        noZenIllustrationWarning("GeneralOnboardSurvey");
+    }
+    return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/heart/spot/template-library-general-onboard-survey.svg" })));
+};
+exports.RemoteOnboardSurvey = function (props) {
+    var theme = design_tokens_1.useTheme();
+    if (theme.themeKey === "zen") {
+        noZenIllustrationWarning("GeneralOnboardSurvey");
+    }
+    return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/heart/spot/template-library-remote-onboard-survey.svg" })));
+};
+/**
+ * Template Library / Performance
+ */
+exports.Individual360 = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/template-library-individual-360.svg"
+        : "illustrations/heart/spot/template-library-individual-360.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.Leadership360 = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/template-library-leadership-360.svg"
+        : "illustrations/heart/spot/template-library-leadership-360.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.Manager360 = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/template-library-manager-360.svg"
+        : "illustrations/heart/spot/template-library-manager-360.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.TeamEffectiveness1 = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/template-library-team-effectiveness-1.svg"
+        : "illustrations/heart/spot/template-library-team-effectiveness-1.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.TeamEffectiveness2 = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/template-library-team-effectiveness-2.svg"
+        : "illustrations/heart/spot/template-library-team-effectiveness-2.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+/**
+ * Template Library / COVID-19
+ */
+exports.WellbeingSurvey = function (props) {
+    var theme = design_tokens_1.useTheme();
+    if (theme.themeKey === "zen") {
+        noZenIllustrationWarning("WellbeingSurvey");
+    }
+    return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/heart/spot/template-library-wellbeing-survey.svg" })));
+};
+exports.Response = function (props) {
+    var theme = design_tokens_1.useTheme();
+    if (theme.themeKey === "zen") {
+        noZenIllustrationWarning("Response");
+    }
+    return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/heart/spot/template-library-response.svg" })));
+};
+exports.RemoteWorkQSet = function (props) {
+    var theme = design_tokens_1.useTheme();
+    if (theme.themeKey === "zen") {
+        noZenIllustrationWarning("RemoteWorkQSet");
+    }
+    return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/heart/spot/template-library-remote-work-q-set.svg" })));
+};
+exports.ReturnToWorkplace = function (props) {
+    var theme = design_tokens_1.useTheme();
+    if (theme.themeKey === "zen") {
+        noZenIllustrationWarning("ReturnToWorkplace");
+    }
+    return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/heart/spot/template-library-return-to-workplace.svg" })));
+};
+exports.PulseSurvey = function (props) {
+    var theme = design_tokens_1.useTheme();
+    if (theme.themeKey === "zen") {
+        noZenIllustrationWarning("PulseSurvey");
+    }
+    return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/heart/spot/template-library-pulse-survey.svg" })));
+};
+/**
+ * New Account
+ */
+exports.AccountBasics = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/new-account-account-basics.svg"
+        : "illustrations/heart/spot/new-account-account-basics.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.CompanyDetails = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/new-account-company-details.svg"
+        : "illustrations/heart/spot/new-account-company-details.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.EmployeeData = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/new-account-employee-data.svg"
+        : "illustrations/heart/spot/new-account-employee-data.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.Gdpr = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/new-account-gdpr.svg"
+        : "illustrations/heart/spot/new-account-gdpr.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.Timezone = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/new-account-timezone.svg"
+        : "illustrations/heart/spot/new-account-timezone.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.AddUser = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/new-account-add-user.svg"
+        : "illustrations/heart/spot/new-account-add-user.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+/**
+ * Skills Coach (previously referred to as Manager Learning)
+ */
+exports.Strategy = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/manager-learning-strategy.svg"
+        : "illustrations/heart/spot/skills-coach-strategy.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.Resilience = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/manager-learning-resilience.svg"
+        : "illustrations/heart/spot/skills-coach-resilience.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.RemoteManager = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/manager-learning-remote-manager.svg"
+        : "illustrations/heart/spot/skills-coach-remote-manager.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.Productivity = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/manager-learning-productivity.svg"
+        : "illustrations/heart/spot/skills-coach-productivity.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.ManagerLearning = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/manager-learning-manager-learning.svg"
+        : "illustrations/heart/spot/skills-coach-manager-learning.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.Feedback = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/manager-learning-feedback.svg"
+        : "illustrations/heart/spot/skills-coach-feedback.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.Coaching = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/manager-learning-coaching.svg"
+        : "illustrations/heart/spot/skills-coach-coaching.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.OneOnOne = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/manager-learning-1-on-1.svg"
+        : "illustrations/heart/spot/skills-coach-1-on-1.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+/**
+ * Miscellaneous
+ */
+exports.ViewReports = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/miscellaneous-view-reports.svg"
+        : "illustrations/heart/spot/miscellaneous-view-reports.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.ReadArticle = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/miscellaneous-read-article.svg"
+        : "illustrations/heart/spot/miscellaneous-read-article.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.FastAction = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/miscellaneous-fast-action.svg"
+        : "illustrations/heart/spot/miscellaneous-fast-action.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.BaselineSurvey = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/miscellaneous-baseline-survey.svg"
+        : "illustrations/heart/spot/miscellaneous-baseline-survey.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.SpreadsheetTemplate = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/miscellaneous-spreadsheet-template.svg"
+        : "illustrations/heart/spot/miscellaneous-spreadsheet-template.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.AddImage = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/miscellaneous-add-image.svg"
+        : "illustrations/heart/spot/miscellaneous-add-image.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.MeetingVoices = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/miscellaneous-meeting-voices.svg"
+        : "illustrations/heart/spot/miscellaneous-meeting-voices.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.Workshop = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/miscellaneous-workshop.svg"
+        : "illustrations/heart/spot/miscellaneous-workshop.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.Video = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/miscellaneous-video.svg"
+        : "illustrations/heart/spot/miscellaneous-video.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.ReportSharing = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/miscellaneous-report-sharing.svg"
+        : "illustrations/heart/spot/miscellaneous-report-sharing.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.BlankSurvey = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/miscellaneous-blank-survey.svg"
+        : "illustrations/heart/spot/miscellaneous-blank-survey.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.TakeAim = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/miscellaneous-take-aim.svg"
+        : "illustrations/heart/spot/miscellaneous-take-aim.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.Action = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/miscellaneous-action.svg"
+        : "illustrations/heart/spot/miscellaneous-action.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.Training1 = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/miscellaneous-training-1.svg"
+        : "illustrations/heart/spot/miscellaneous-training-1.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.Training2 = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/miscellaneous-training-2.svg"
+        : "illustrations/heart/spot/miscellaneous-training-2.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.Training3 = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/miscellaneous-training-3.svg"
+        : "illustrations/heart/spot/miscellaneous-training-3.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.ShareReport = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/miscellaneous-share-report.svg"
+        : "illustrations/heart/spot/miscellaneous-share-report.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.Team = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/miscellaneous-team.svg"
+        : "illustrations/heart/spot/miscellaneous-team.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.ExecutiveReportSharing = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/miscellaneous-executive-report-sharing.svg"
+        : "illustrations/heart/spot/miscellaneous-executive-report-sharing.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.ManagerReportSharing = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/miscellaneous-manager-report-sharing.svg"
+        : "illustrations/heart/spot/miscellaneous-manager-report-sharing.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.LeaderReportSharing = function (props) {
+    var theme = design_tokens_1.useTheme();
+    var illustrationPath = theme.themeKey === "zen"
+        ? "illustrations/spot/miscellaneous-leader-report-sharing.svg"
+        : "illustrations/heart/spot/miscellaneous-leader-report-sharing.svg";
+    return React.createElement(Base_1.Base, __assign({}, props, { name: illustrationPath }));
+};
+exports.Alarm = function (props) {
+    var theme = design_tokens_1.useTheme();
+    if (theme.themeKey === "zen") {
+        noZenIllustrationWarning("Alarm");
+    }
+    return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/heart/spot/miscellaneous-alarm.svg" })));
+};
+exports.Fire = function (props) {
+    var theme = design_tokens_1.useTheme();
+    if (theme.themeKey === "zen") {
+        noZenIllustrationWarning("Fire");
+    }
+    return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/heart/spot/miscellaneous-fire.svg" })));
+};
+exports.Fireworks = function (props) {
+    var theme = design_tokens_1.useTheme();
+    if (theme.themeKey === "zen") {
+        noZenIllustrationWarning("Fireworks");
+    }
+    return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/heart/spot/miscellaneous-fireworks.svg" })));
+};
+exports.FullImport = function (props) {
+    var theme = design_tokens_1.useTheme();
+    if (theme.themeKey === "zen") {
+        noZenIllustrationWarning("FullImport");
+    }
+    return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/heart/spot/miscellaneous-full-import.svg" })));
+};
+exports.HrisImport = function (props) {
+    var theme = design_tokens_1.useTheme();
+    if (theme.themeKey === "zen") {
+        noZenIllustrationWarning("HrisImport");
+    }
+    return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/heart/spot/miscellaneous-hris-import.svg" })));
+};
+exports.PartialImport = function (props) {
+    var theme = design_tokens_1.useTheme();
+    if (theme.themeKey === "zen") {
+        noZenIllustrationWarning("PartialImport");
+    }
+    return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/heart/spot/miscellaneous-partial-import.svg" })));
+};
+exports.Starburst = function (props) {
+    var theme = design_tokens_1.useTheme();
+    if (theme.themeKey === "zen") {
+        noZenIllustrationWarning("Starburst");
+    }
+    return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/heart/spot/miscellaneous-starburst.svg" })));
+};
+exports.Stop = function (props) {
+    var theme = design_tokens_1.useTheme();
+    if (theme.themeKey === "zen") {
+        noZenIllustrationWarning("Stop");
+    }
+    return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/heart/spot/miscellaneous-stop.svg" })));
+};
+exports.TrafficCone = function (props) {
+    var theme = design_tokens_1.useTheme();
+    if (theme.themeKey === "zen") {
+        noZenIllustrationWarning("TrafficCone");
+    }
+    return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/heart/spot/miscellaneous-traffic-cone.svg" })));
+};
+exports.Trophy = function (props) {
+    var theme = design_tokens_1.useTheme();
+    if (theme.themeKey === "zen") {
+        noZenIllustrationWarning("Trophy");
+    }
+    return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/heart/spot/miscellaneous-trophy.svg" })));
+};
+exports.UnderConstruction = function (props) {
+    var theme = design_tokens_1.useTheme();
+    if (theme.themeKey === "zen") {
+        noZenIllustrationWarning("UnderConstruction");
+    }
+    return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/heart/spot/miscellaneous-under-construction.svg" })));
+};
+exports.ValueAdd = function (props) {
+    var theme = design_tokens_1.useTheme();
+    if (theme.themeKey === "zen") {
+        noZenIllustrationWarning("ValueAdd");
+    }
+    return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/heart/spot/miscellaneous-value-add.svg" })));
+};
+exports.Recommendation = function (props) {
+    var theme = design_tokens_1.useTheme();
+    if (theme.themeKey === "zen") {
+        noZenIllustrationWarning("Recommendation");
+    }
+    return (React.createElement(Base_1.Base, __assign({}, props, { name: "illustrations/heart/spot/miscellaneous-shield.svg" })));
+};
 //# sourceMappingURL=Spot.js.map

package.json

 {
   "name": "@kaizen/draft-illustration",
-  "version": "1.7.2",
+  "version": "1.8.0",
   "description": "The draft illustration component",
@@ -35,6 +35,6 @@ "scripts": {
   "dependencies": {
-    "@kaizen/design-tokens": "^2.8.2",
     "@kaizen/hosted-assets": "^1.1.0"
   },
   "devDependencies": {
+    "@kaizen/design-tokens": "^2.8.1",
     "elm-storybook": "cultureamp/elm-storybook#0.3.0",
@@ -44,5 +44,6 @@ "rimraf": "^3.0.2"
   "peerDependencies": {
+    "@kaizen/design-tokens": "^2.8.1",
     "react": "^16.9.0"
   },
-  "gitHead": "d21e83bae62382b758414d76f25afd226255e43c"
+  "gitHead": "7312172ac26e765ba1b5d8e88e96e4b5a39ed54c"
 }

New alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

104133

increased by59.88%

Lines of code

1105

increased by145.56%

Worsened metrics

Dev dependency count

3

increased by50%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• - Removed@kaizen/design-tokens@^2.8.2