@pingux/astro 1.42.0 → 2.0.0-alpha.1

package/lib/cjs/styles/forms/index.js

@@ -30,23 +30,29 @@ exports["default"] = void 0;
 
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
 
-var checkbox = _interopRequireWildcard(require("./checkbox"));
+var checkbox = _interopRequireWildcard(require("../../components/Checkbox/Checkbox.styles"));
 
-var _comboBox = _interopRequireDefault(require("./comboBox"));
+var _ColorField = _interopRequireDefault(require("../../components/ColorField/ColorField.styles"));
 
-var input = _interopRequireWildcard(require("./input"));
+var _ComboBox = _interopRequireDefault(require("../../components/ComboBox/ComboBox.styles"));
 
-var label = _interopRequireWildcard(require("./label"));
+var _FileInputField = _interopRequireDefault(require("../../components/FileInputField/FileInputField.styles"));
 
-var radio = _interopRequireWildcard(require("./radio"));
+var input = _interopRequireWildcard(require("../../components/Input/Input.styles"));
 
-var _search = _interopRequireDefault(require("./search"));
+var label = _interopRequireWildcard(require("../../components/Label/Label.styles"));
 
-var select = _interopRequireWildcard(require("./select"));
+var _NumberField = _interopRequireDefault(require("../../components/NumberField/NumberField.styles"));
 
-var switchable = _interopRequireWildcard(require("./switch"));
+var _Radio = _interopRequireDefault(require("../../components/Radio/Radio.styles"));
 
-var textarea = _interopRequireWildcard(require("./textarea"));
+var _Search = _interopRequireDefault(require("../../components/SearchField/Search.styles"));
+
+var select = _interopRequireWildcard(require("../../components/SelectField/Select.styles"));
+
+var switchable = _interopRequireWildcard(require("../../components/Switch/Switch.styles"));
+
+var _TextArea = _interopRequireDefault(require("../../components/TextArea/TextArea.styles"));
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
@@ -58,11 +64,17 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 // See ThemeUI docs on variants and themes for intended structure
 // Variants should be defined in the approprate file.
-var _default = _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, checkbox), {}, {
-  comboBox: _comboBox["default"]
-}, input), label), radio), select), textarea), {}, {
+var _default = _objectSpread(_objectSpread(_objectSpread(_objectSpread(_objectSpread({}, checkbox), {}, {
+  colorField: _ColorField["default"],
+  comboBox: _ComboBox["default"],
+  fileInputField: _FileInputField["default"]
+}, input), label), {}, {
+  numberField: _NumberField["default"],
+  radio: _Radio["default"]
+}, select), {}, {
+  textarea: _TextArea["default"],
   "switch": _objectSpread({}, switchable),
-  search: _search["default"]
+  search: _Search["default"]
 });
 
 exports["default"] = _default;

package/lib/cjs/styles/theme-ui/ThemeView.js

@@ -0,0 +1,27 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports["default"] = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _reactJsonTree = require("react-json-tree");
+
+var _theme = _interopRequireDefault(require("../theme"));
+
+var _react2 = require("@emotion/react");
+
+var _default = function _default() {
+  return (0, _react2.jsx)(_reactJsonTree.JSONTree, {
+    data: _theme["default"]
+  });
+};
+
+exports["default"] = _default;

package/lib/cjs/styles/theme.js

@@ -84,9 +84,9 @@ var _default = {
   forms: _forms["default"],
   text: _variants.text,
   images: _variants.images,
-  buttons: _objectSpread(_objectSpread({}, _variants.buttons), {}, {
-    bidirectionalIconButton: _variants.bidirectionalIconButton
-  }),
+  buttons: _variants.buttons,
+  badges: _variants.badges,
+  cards: _variants.cards,
   textColors: _text.textColors,
   links: _variants.links,
   variants: _variants.variants

package/lib/cjs/styles/themeOverrides/stories/AccordionGroup.chromatic.stories.js

@@ -0,0 +1,37 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports["default"] = exports.Default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _index = require("../../../index");
+
+var _withUiLibraryCss = _interopRequireDefault(require("../withUiLibraryCss"));
+
+var _react2 = require("@emotion/react");
+
+var _default = {
+  title: 'Chromatic Only AccordionGroup',
+  component: _index.AccordionGroup,
+  decorators: [_withUiLibraryCss["default"]]
+};
+exports["default"] = _default;
+
+var Default = function Default() {
+  return (0, _react2.jsx)(_index.AccordionGroup, null, (0, _react2.jsx)(_index.Item, {
+    key: "accordionKey",
+    textValue: "accordionKey",
+    label: "Accordion Label",
+    "data-id": "accordionItem"
+  }, (0, _react2.jsx)(_index.Text, null, "Render me!")));
+};
+
+exports.Default = Default;

package/lib/cjs/styles/themeOverrides/stories/Button.chromatic.stories.js

@@ -0,0 +1,72 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports["default"] = exports.Success = exports.Primary = exports.Link = exports.Inline = exports.Default = exports.Critical = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _index = require("../../../index");
+
+var _withUiLibraryCss = _interopRequireDefault(require("../withUiLibraryCss"));
+
+var _react2 = require("@emotion/react");
+
+var _default = {
+  title: 'Chromatic Only Button',
+  component: _index.Button,
+  decorators: [_withUiLibraryCss["default"]]
+};
+exports["default"] = _default;
+
+var Default = function Default() {
+  return (0, _react2.jsx)(_index.Button, null, "Button Text");
+};
+
+exports.Default = Default;
+
+var Critical = function Critical() {
+  return (0, _react2.jsx)(_index.Button, {
+    variant: "critical"
+  }, "Button Text");
+};
+
+exports.Critical = Critical;
+
+var Success = function Success() {
+  return (0, _react2.jsx)(_index.Button, {
+    variant: "success"
+  }, "Button Text");
+};
+
+exports.Success = Success;
+
+var Inline = function Inline() {
+  return (0, _react2.jsx)(_index.Button, {
+    variant: "inline"
+  }, "Button Text");
+};
+
+exports.Inline = Inline;
+
+var Primary = function Primary() {
+  return (0, _react2.jsx)(_index.Button, {
+    variant: "primary"
+  }, "Button Text");
+};
+
+exports.Primary = Primary;
+
+var Link = function Link() {
+  return (0, _react2.jsx)(_index.Button, {
+    variant: "link"
+  }, "Button Text");
+};
+
+exports.Link = Link;

package/lib/cjs/styles/themeOverrides/stories/EnvironmentBreadcrumb.chromatic.stories.js

@@ -0,0 +1,145 @@
+"use strict";
+
+var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
+
+var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
+
+var _Object$getOwnPropertySymbols = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-symbols");
+
+var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
+
+var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
+
+var _forEachInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
+
+var _Object$getOwnPropertyDescriptors = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptors");
+
+var _Object$defineProperties = require("@babel/runtime-corejs3/core-js-stable/object/define-properties");
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports["default"] = exports.Default = void 0;
+
+var _find = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/find"));
+
+var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
+
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/defineProperty"));
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _index = require("../../../index");
+
+var _withUiLibraryCss = _interopRequireDefault(require("../withUiLibraryCss"));
+
+var _react2 = require("@emotion/react");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = _Object$defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { _Object$defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function ownKeys(object, enumerableOnly) { var keys = _Object$keys(object); if (_Object$getOwnPropertySymbols) { var symbols = _Object$getOwnPropertySymbols(object); enumerableOnly && (symbols = _filterInstanceProperty(symbols).call(symbols, function (sym) { return _Object$getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var _context, _context2; var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? _forEachInstanceProperty(_context = ownKeys(Object(source), !0)).call(_context, function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : _Object$getOwnPropertyDescriptors ? _Object$defineProperties(target, _Object$getOwnPropertyDescriptors(source)) : _forEachInstanceProperty(_context2 = ownKeys(Object(source))).call(_context2, function (key) { _Object$defineProperty(target, key, _Object$getOwnPropertyDescriptor(source, key)); }); } return target; }
+
+var _default = {
+  title: 'Chromatic Only EnvironmentBreadcrumb',
+  component: _index.EnvironmentBreadcrumb,
+  decorators: [_withUiLibraryCss["default"]]
+};
+exports["default"] = _default;
+var defaultEnvironments = [{
+  name: 'Default'
+}, {
+  name: 'Kangaroo'
+}, {
+  name: 'Snake'
+}, {
+  name: 'Snail'
+}, {
+  name: 'Slug'
+}, {
+  name: 'Crow'
+}, {
+  name: 'Dog'
+}, {
+  name: 'Crab',
+  isSandbox: true
+}, {
+  name: 'Fish'
+}, {
+  name: 'Turtle'
+}, {
+  name: 'Mouse'
+}, {
+  name: 'Banana'
+}, {
+  name: 'Shark'
+}, {
+  name: 'Gorilla'
+}, {
+  name: 'Goat'
+}];
+
+var Default = function Default(args) {
+  var _useState = (0, _react.useState)({
+    name: 'Snail',
+    isSandbox: true
+  }),
+      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+      selectedEnvironment = _useState2[0],
+      setSelectedEnvironment = _useState2[1];
+
+  var envNode = (0, _react2.jsx)(_index.Box, {
+    isRow: true,
+    key: selectedEnvironment.name
+  }, (0, _react2.jsx)(_index.Text, {
+    color: "inherit"
+  }, selectedEnvironment.name), selectedEnvironment.isSandbox ? (0, _react2.jsx)(_index.Badge, {
+    label: "SANDBOX",
+    variant: "environmentBadge",
+    bg: "neutral.40"
+  }) : null);
+
+  var findEnvObj = function findEnvObj(envName) {
+    return (0, _find["default"])(defaultEnvironments).call(defaultEnvironments, function (_ref) {
+      var name = _ref.name;
+      return name === envName;
+    });
+  };
+
+  var handleSelectionChange = function handleSelectionChange(newEnvName) {
+    var envObj = findEnvObj(newEnvName);
+    setSelectedEnvironment(_objectSpread({}, envObj));
+  };
+
+  return (0, _react2.jsx)(_index.EnvironmentBreadcrumb, (0, _extends2["default"])({}, args, {
+    items: defaultEnvironments,
+    name: "Globochem",
+    selectedItem: envNode,
+    onSelectionChange: handleSelectionChange
+  }), function (_ref2) {
+    var name = _ref2.name,
+        isSandbox = _ref2.isSandbox;
+    return (0, _react2.jsx)(_index.Item, {
+      key: name,
+      textValue: name
+    }, name, isSandbox ? (0, _react2.jsx)(_index.Badge, {
+      label: "SANDBOX",
+      variant: "environmentBadge",
+      bg: "neutral.40"
+    }) : null);
+  });
+};
+
+exports.Default = Default;

package/lib/cjs/styles/themeOverrides/stories/IconButton.chromatic.stories.js

@@ -0,0 +1,49 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports["default"] = exports.Inverted = exports.Base = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _CreateIcon = _interopRequireDefault(require("mdi-react/CreateIcon"));
+
+var _index = require("../../../index");
+
+var _withUiLibraryCss = _interopRequireDefault(require("../withUiLibraryCss"));
+
+var _react2 = require("@emotion/react");
+
+var _default = {
+  title: 'Chromatic Only IconButton',
+  component: _index.IconButton,
+  decorators: [_withUiLibraryCss["default"]]
+};
+exports["default"] = _default;
+
+var Base = function Base() {
+  return (0, _react2.jsx)(_index.IconButton, {
+    "aria-label": "default icon button"
+  }, (0, _react2.jsx)(_index.Icon, {
+    icon: _CreateIcon["default"]
+  }));
+};
+
+exports.Base = Base;
+
+var Inverted = function Inverted() {
+  return (0, _react2.jsx)(_index.IconButton, {
+    "aria-label": "default icon button",
+    variant: "inverted"
+  }, (0, _react2.jsx)(_index.Icon, {
+    icon: _CreateIcon["default"]
+  }));
+};
+
+exports.Inverted = Inverted;

package/lib/cjs/styles/themeOverrides/stories/Label.chromatic.stories.js

@@ -0,0 +1,32 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports["default"] = exports.Default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _index = require("../../../index");
+
+var _withUiLibraryCss = _interopRequireDefault(require("../withUiLibraryCss"));
+
+var _react2 = require("@emotion/react");
+
+var _default = {
+  title: 'Chromatic Only Label',
+  component: _index.Label,
+  decorators: [_withUiLibraryCss["default"]]
+};
+exports["default"] = _default;
+
+var Default = function Default() {
+  return (0, _react2.jsx)(_index.Label, null, "This is a label");
+};
+
+exports.Default = Default;

package/lib/cjs/styles/themeOverrides/stories/Link.chromatic.stories.js

@@ -0,0 +1,34 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});
+
+exports["default"] = exports.Default = void 0;
+
+var _react = _interopRequireDefault(require("react"));
+
+var _index = require("../../../index");
+
+var _withUiLibraryCss = _interopRequireDefault(require("../withUiLibraryCss"));
+
+var _react2 = require("@emotion/react");
+
+var _default = {
+  title: 'Chromatic Only Link',
+  component: _index.Link,
+  decorators: [_withUiLibraryCss["default"]]
+};
+exports["default"] = _default;
+
+var Default = function Default() {
+  return (0, _react2.jsx)("div", null, (0, _react2.jsx)(_index.Link, {
+    href: "https://uilibrary.ping-eng.com"
+  }, "A link"), " to your favorite website.");
+};
+
+exports.Default = Default;