@rpg-engine/long-bow 0.5.95 → 0.5.96

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.ts CHANGED
@@ -40,6 +40,7 @@ export * from './components/Shortcuts/Shortcuts';
40
40
  export * from './components/SkillProgressBar';
41
41
  export * from './components/SkillsContainer';
42
42
  export * from './components/Spellbook/Spellbook';
43
+ export * from './components/Stepper';
43
44
  export * from './components/TextArea';
44
45
  export * from './components/TimeWidget/TimeWidget';
45
46
  export * from './components/TradingMenu/TradingMenu';
@@ -18962,6 +18962,69 @@ var SpellList = /*#__PURE__*/styled__default.div.withConfig({
18962
18962
  componentId: "sc-r02nfq-2"
18963
18963
  })(["width:100%;min-height:0;flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:1.5rem;margin-top:1rem;"]);
18964
18964
 
18965
+ var Stepper = function Stepper(_ref) {
18966
+ var _steps$currentStep;
18967
+ var steps = _ref.steps,
18968
+ finalCTAButton = _ref.finalCTAButton;
18969
+ var _useState = React.useState(0),
18970
+ currentStep = _useState[0],
18971
+ setCurrentStep = _useState[1];
18972
+ var currentComponent = (_steps$currentStep = steps[currentStep]) == null ? void 0 : _steps$currentStep.component;
18973
+ var totalSteps = steps.length;
18974
+ var onStepChange = function onStepChange(step) {
18975
+ setCurrentStep(step);
18976
+ };
18977
+ return React__default.createElement(StepperContainer, null, React__default.createElement(StepperTop, null, Array.from({
18978
+ length: totalSteps
18979
+ }, function (_, i) {
18980
+ return React__default.createElement(ProgressIndicator, {
18981
+ key: i,
18982
+ isActive: i <= currentStep
18983
+ });
18984
+ })), React__default.createElement(StepperBody, null, currentComponent), React__default.createElement(StepperFooter, null, currentStep > 0 && React__default.createElement(SelectArrow, {
18985
+ direction: "left",
18986
+ onPointerDown: function onPointerDown() {
18987
+ return onStepChange(Math.max(0, currentStep - 1));
18988
+ }
18989
+ }), currentStep < totalSteps - 1 && React__default.createElement(SelectArrow, {
18990
+ direction: "right",
18991
+ onPointerDown: function onPointerDown() {
18992
+ return onStepChange(Math.min(totalSteps - 1, currentStep + 1));
18993
+ }
18994
+ }), currentStep === totalSteps - 1 && finalCTAButton && React__default.createElement(Button, {
18995
+ buttonType: exports.ButtonTypes.RPGUIButton,
18996
+ onPointerDown: function onPointerDown() {
18997
+ return finalCTAButton.onClick;
18998
+ }
18999
+ }, finalCTAButton.label)));
19000
+ };
19001
+ var StepperContainer = /*#__PURE__*/styled__default.div.withConfig({
19002
+ displayName: "Stepper__StepperContainer",
19003
+ componentId: "sc-13obf1-0"
19004
+ })(["display:flex;flex-direction:column;height:100%;"]);
19005
+ var StepperTop = /*#__PURE__*/styled__default.div.withConfig({
19006
+ displayName: "Stepper__StepperTop",
19007
+ componentId: "sc-13obf1-1"
19008
+ })(["flex:1;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;"]);
19009
+ var StepperBody = /*#__PURE__*/styled__default.div.withConfig({
19010
+ displayName: "Stepper__StepperBody",
19011
+ componentId: "sc-13obf1-2"
19012
+ })(["flex:8;"]);
19013
+ var StepperFooter = /*#__PURE__*/styled__default.div.withConfig({
19014
+ displayName: "Stepper__StepperFooter",
19015
+ componentId: "sc-13obf1-3"
19016
+ })(["flex:1;display:flex;justify-content:flex-end;"]);
19017
+ var ProgressIndicator = /*#__PURE__*/styled__default.div.withConfig({
19018
+ displayName: "Stepper__ProgressIndicator",
19019
+ componentId: "sc-13obf1-4"
19020
+ })(["width:20px;height:20px;border-radius:50%;background-color:", ";margin:0 5px;transition:background-color 0.3s;opacity:", ";border:1px solid ", ";"], function (_ref2) {
19021
+ var isActive = _ref2.isActive;
19022
+ return isActive ? uiColors.orange : uiColors.lightGray;
19023
+ }, function (_ref3) {
19024
+ var isActive = _ref3.isActive;
19025
+ return isActive ? 1 : 0.25;
19026
+ }, uiColors.raisinBlack);
19027
+
18965
19028
  var TextArea = function TextArea(_ref) {
18966
19029
  var props = _extends({}, (_objectDestructuringEmpty(_ref), _ref));
18967
19030
  return React__default.createElement("textarea", Object.assign({}, props));
@@ -19448,6 +19511,7 @@ exports.SkillProgressBar = SkillProgressBar;
19448
19511
  exports.SkillsContainer = SkillsContainer;
19449
19512
  exports.Spellbook = Spellbook;
19450
19513
  exports.SpriteFromAtlas = SpriteFromAtlas;
19514
+ exports.Stepper = Stepper;
19451
19515
  exports.TextArea = TextArea;
19452
19516
  exports.TimeWidget = TimeWidget;
19453
19517
  exports.TradingMenu = TradingMenu;