luna-one 3.1.593 → 3.1.594

package/dist/luna/components/Flyout/Flyout.stories.js

@@ -0,0 +1,216 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard")["default"];
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault")["default"];
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.FlyoutWithoutSearchOrLogIn = exports.FlyoutWithSignInAndSearch = exports.FlyoutWithSearchAndNoLogIn = exports.FlyoutSignedInNoImage = exports.FlyoutSignedInAndSearch = void 0;
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
+var _react = _interopRequireWildcard(require("react"));
+var _Flyout = _interopRequireDefault(require("./Flyout"));
+var _trimbleLogoReversed = _interopRequireDefault(require("../../../../images/trimble-logo-reversed.png"));
+var _addonActions = require("@storybook/addon-actions");
+var _reactRouterDom = require("react-router-dom");
+var _FlyoutDocumentation = _interopRequireDefault(require("./FlyoutDocumentation.mdx"));
+var searchPlaceholder = "Search all Trimble sites";
+var sectorFlyoutDeployed = true;
+var logo = {
+  url: _trimbleLogoReversed["default"],
+  altText: "Trimble Logo",
+  link: {
+    url: "/link"
+  }
+};
+var links = [{
+  url: "#",
+  text: "Trimble.com"
+}, {
+  url: "#",
+  text: "Our Industries"
+}, {
+  url: "#",
+  text: "Another link"
+}];
+var authenticatedLinks = [{
+  url: "#",
+  text: "Profile"
+}, {
+  url: "#",
+  text: "My Products"
+}, {
+  url: "#",
+  text: "Manage Accounts"
+}, {
+  url: "#",
+  text: "Support"
+}];
+var _default = {
+  component: _Flyout["default"],
+  title: "Utility Components/Sector Flyout",
+  parameters: {
+    docs: {
+      page: _FlyoutDocumentation["default"]
+    }
+  }
+};
+exports["default"] = _default;
+var FlyoutWithoutSearchOrLogIn = function FlyoutWithoutSearchOrLogIn() {
+  return /*#__PURE__*/_react["default"].createElement(_reactRouterDom.BrowserRouter, null, /*#__PURE__*/_react["default"].createElement(_Flyout["default"], {
+    logo: logo,
+    links: links,
+    Link: _reactRouterDom.NavLink,
+    searchPlaceholder: searchPlaceholder,
+    disableSearch: true,
+    close: (0, _addonActions.action)("close"),
+    searchSubmit: (0, _addonActions.action)("searching"),
+    sectorFlyoutDeployed: sectorFlyoutDeployed,
+    s: true
+  }));
+};
+exports.FlyoutWithoutSearchOrLogIn = FlyoutWithoutSearchOrLogIn;
+var FlyoutWithSearchAndNoLogIn = function FlyoutWithSearchAndNoLogIn() {
+  var _useState = (0, _react.useState)(false),
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    desktopSearchDeployed = _useState2[0],
+    setDesktopSearchDeployed = _useState2[1];
+  var _useState3 = (0, _react.useState)(false),
+    _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
+    globalSearch = _useState4[0],
+    setGlobalSearch = _useState4[1];
+  return /*#__PURE__*/_react["default"].createElement(_reactRouterDom.BrowserRouter, null, /*#__PURE__*/_react["default"].createElement(_Flyout["default"], {
+    logo: logo,
+    links: links,
+    Link: _reactRouterDom.NavLink,
+    searchPlaceholder: searchPlaceholder,
+    disableSearch: false,
+    close: (0, _addonActions.action)("close"),
+    searchSubmit: (0, _addonActions.action)("searching"),
+    desktopSearchDeployed: desktopSearchDeployed,
+    setDesktopSearchDeployed: setDesktopSearchDeployed,
+    closeHamburger: (0, _addonActions.action)("close"),
+    setGlobalSearch: setGlobalSearch,
+    globalSearch: globalSearch,
+    sectorFlyoutDeployed: sectorFlyoutDeployed
+  }));
+};
+exports.FlyoutWithSearchAndNoLogIn = FlyoutWithSearchAndNoLogIn;
+var FlyoutWithSignInAndSearch = function FlyoutWithSignInAndSearch() {
+  var _useState5 = (0, _react.useState)(false),
+    _useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
+    desktopSearchDeployed = _useState6[0],
+    setDesktopSearchDeployed = _useState6[1];
+  var _useState7 = (0, _react.useState)(false),
+    _useState8 = (0, _slicedToArray2["default"])(_useState7, 2),
+    globalSearch = _useState8[0],
+    setGlobalSearch = _useState8[1];
+  return /*#__PURE__*/_react["default"].createElement(_reactRouterDom.BrowserRouter, null, /*#__PURE__*/_react["default"].createElement(_Flyout["default"], {
+    logo: logo,
+    links: links,
+    Link: _reactRouterDom.NavLink,
+    searchPlaceholder: searchPlaceholder,
+    disableSearch: false,
+    close: (0, _addonActions.action)("close"),
+    searchSubmit: (0, _addonActions.action)("searching"),
+    desktopSearchDeployed: desktopSearchDeployed,
+    setDesktopSearchDeployed: setDesktopSearchDeployed,
+    closeHamburger: (0, _addonActions.action)("close"),
+    setGlobalSearch: setGlobalSearch,
+    globalSearch: globalSearch,
+    login: true,
+    signInBtnMethod: function signInBtnMethod() {
+      console.log("click");
+    },
+    authenticated: false,
+    authenticatedLinks: authenticatedLinks,
+    TIDdata: {
+      image: {
+        src: "https://fpoimg.com/500x500",
+        alt: "placeholder"
+      },
+      title: "My Company Inc",
+      fName: "Laura",
+      lName: "Shamus"
+    },
+    sectorFlyoutDeployed: sectorFlyoutDeployed
+  }));
+};
+exports.FlyoutWithSignInAndSearch = FlyoutWithSignInAndSearch;
+var FlyoutSignedInAndSearch = function FlyoutSignedInAndSearch() {
+  var _useState9 = (0, _react.useState)(false),
+    _useState10 = (0, _slicedToArray2["default"])(_useState9, 2),
+    desktopSearchDeployed = _useState10[0],
+    setDesktopSearchDeployed = _useState10[1];
+  var _useState11 = (0, _react.useState)(false),
+    _useState12 = (0, _slicedToArray2["default"])(_useState11, 2),
+    globalSearch = _useState12[0],
+    setGlobalSearch = _useState12[1];
+  return /*#__PURE__*/_react["default"].createElement(_reactRouterDom.BrowserRouter, null, /*#__PURE__*/_react["default"].createElement(_Flyout["default"], {
+    logo: logo,
+    links: links,
+    Link: _reactRouterDom.NavLink,
+    searchPlaceholder: searchPlaceholder,
+    disableSearch: false,
+    close: (0, _addonActions.action)("close"),
+    searchSubmit: (0, _addonActions.action)("searching"),
+    desktopSearchDeployed: desktopSearchDeployed,
+    setDesktopSearchDeployed: setDesktopSearchDeployed,
+    closeHamburger: (0, _addonActions.action)("close"),
+    setGlobalSearch: setGlobalSearch,
+    globalSearch: globalSearch,
+    login: true,
+    authenticated: true,
+    authenticatedLinks: authenticatedLinks,
+    sectorFlyoutDeployed: sectorFlyoutDeployed,
+    signOutBtnMethod: function signOutBtnMethod() {
+      console.log("click");
+    },
+    TIDdata: {
+      image: {
+        src: "https://fpoimg.com/500x500",
+        alt: "placeholder"
+      },
+      title: "My Company Inc",
+      fName: "Laura",
+      lName: "Shamus"
+    }
+  }));
+};
+exports.FlyoutSignedInAndSearch = FlyoutSignedInAndSearch;
+var FlyoutSignedInNoImage = function FlyoutSignedInNoImage() {
+  var _useState13 = (0, _react.useState)(false),
+    _useState14 = (0, _slicedToArray2["default"])(_useState13, 2),
+    desktopSearchDeployed = _useState14[0],
+    setDesktopSearchDeployed = _useState14[1];
+  var _useState15 = (0, _react.useState)(false),
+    _useState16 = (0, _slicedToArray2["default"])(_useState15, 2),
+    globalSearch = _useState16[0],
+    setGlobalSearch = _useState16[1];
+  return /*#__PURE__*/_react["default"].createElement(_reactRouterDom.BrowserRouter, null, /*#__PURE__*/_react["default"].createElement(_Flyout["default"], {
+    logo: logo,
+    links: links,
+    Link: _reactRouterDom.NavLink,
+    searchPlaceholder: searchPlaceholder,
+    disableSearch: false,
+    close: (0, _addonActions.action)("close"),
+    searchSubmit: (0, _addonActions.action)("searching"),
+    desktopSearchDeployed: desktopSearchDeployed,
+    setDesktopSearchDeployed: setDesktopSearchDeployed,
+    closeHamburger: (0, _addonActions.action)("close"),
+    setGlobalSearch: setGlobalSearch,
+    globalSearch: globalSearch,
+    login: true,
+    authenticated: true,
+    authenticatedLinks: authenticatedLinks,
+    sectorFlyoutDeployed: sectorFlyoutDeployed,
+    signOutBtnMethod: function signOutBtnMethod() {
+      console.log("click");
+    },
+    TIDdata: {
+      title: "My Company Inc",
+      fName: "Laura",
+      lName: "Shamus"
+    }
+  }));
+};
+exports.FlyoutSignedInNoImage = FlyoutSignedInNoImage;

package/dist/luna/components/Flyout/FlyoutDocumentation.mdx

@@ -0,0 +1,60 @@
+#### Flyout
+
+###### Notes -
+
+This component is on the header nav bar on the far right side. It is only on the sector Header Nav and will be a drop down for the user to navigate back to the Trimble corporate site, other industries, etc.
+
+This component has the next internal sections:
+
+- Trimble Logo `<LunaLink />`: A logo as a link. (E.g. Link to homepage)
+- Links, list of `<LunaLink />`: List of different Trimble sites (E.g. Trimble corporate site, other industries, etc.)
+- Search Input - the eyeglass will link to open the same Search Component that is on NavBarTop
+
+###### Props -
+
+- `logo` **(required)** - object consisting of `url` and `altText` strings (for generating the logo image) in addition to a link object with a `url` string for generating the `href` property.
+- `links` - array of objects, each with a `url` and `text` strings.
+- `searchPlaceholder` - string for generating input search placeholder.
+- `disableSearch` - boolean that determines if the search input is displayed.
+- `close` **(required)** - method used to close the flyout component.
+- `searchSubmit` - method to find Trimble sites
+
+###### Example -
+
+```
+const searchPlaceholder = "Search All Trimble Sites";
+
+const logo = {
+  url: Logo,
+  altText: "Trimble Logo",
+  link: {
+    url: "/link",
+  },
+};
+
+const links = [
+  {url: "#", text: "Trimble.com"},
+  {url: "#", text: "Our Industries"},
+  {url: "#", text: "Another link"},
+];
+
+const handleCloseFlyout = () => {
+  // handleCloseFlyout implementation here
+}
+
+const handleSearchSubmit = () => {
+  // handleSearchSubmit implementation here
+}
+
+return (
+  <Flyout
+    logo={logo}
+    links={links}
+    searchPlaceholder={searchPlaceholder}
+    disableSearch={false}
+    close={handleCloseFlyout}
+    searchSubmit={handleSearchSubmit}
+  />
+)
+
+```