@pingux/astro 2.17.0-alpha.0 → 2.17.0-alpha.2

package/lib/cjs/types/index.d.ts

@@ -1,5 +1,6 @@
 export * from './box';
 export * from './icon';
+export * from './item';
 export * from './loader';
 export * from './popoverContainer';
 export * from './shared';

package/lib/cjs/types/index.js

@@ -1,6 +1,6 @@
 "use strict";
 
-var _context, _context2, _context3, _context4, _context5, _context6, _context7;
+var _context, _context2, _context3, _context4, _context5, _context6, _context7, _context8;
 var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
 var _forEachInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/for-each");
 var _Object$keys = require("@babel/runtime-corejs3/core-js-stable/object/keys");
@@ -29,8 +29,19 @@ _forEachInstanceProperty(_context2 = _Object$keys(_icon)).call(_context2, functi
     }
   });
 });
+var _item = require("./item");
+_forEachInstanceProperty(_context3 = _Object$keys(_item)).call(_context3, function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _item[key]) return;
+  _Object$defineProperty(exports, key, {
+    enumerable: true,
+    get: function get() {
+      return _item[key];
+    }
+  });
+});
 var _loader = require("./loader");
-_forEachInstanceProperty(_context3 = _Object$keys(_loader)).call(_context3, function (key) {
+_forEachInstanceProperty(_context4 = _Object$keys(_loader)).call(_context4, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _loader[key]) return;
   _Object$defineProperty(exports, key, {
@@ -41,7 +52,7 @@ _forEachInstanceProperty(_context3 = _Object$keys(_loader)).call(_context3, func
   });
 });
 var _popoverContainer = require("./popoverContainer");
-_forEachInstanceProperty(_context4 = _Object$keys(_popoverContainer)).call(_context4, function (key) {
+_forEachInstanceProperty(_context5 = _Object$keys(_popoverContainer)).call(_context5, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _popoverContainer[key]) return;
   _Object$defineProperty(exports, key, {
@@ -52,7 +63,7 @@ _forEachInstanceProperty(_context4 = _Object$keys(_popoverContainer)).call(_cont
   });
 });
 var _shared = require("./shared");
-_forEachInstanceProperty(_context5 = _Object$keys(_shared)).call(_context5, function (key) {
+_forEachInstanceProperty(_context6 = _Object$keys(_shared)).call(_context6, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _shared[key]) return;
   _Object$defineProperty(exports, key, {
@@ -63,7 +74,7 @@ _forEachInstanceProperty(_context5 = _Object$keys(_shared)).call(_context5, func
   });
 });
 var _tableCell = require("./tableCell");
-_forEachInstanceProperty(_context6 = _Object$keys(_tableCell)).call(_context6, function (key) {
+_forEachInstanceProperty(_context7 = _Object$keys(_tableCell)).call(_context7, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _tableCell[key]) return;
   _Object$defineProperty(exports, key, {
@@ -74,7 +85,7 @@ _forEachInstanceProperty(_context6 = _Object$keys(_tableCell)).call(_context6, f
   });
 });
 var _text = require("./text");
-_forEachInstanceProperty(_context7 = _Object$keys(_text)).call(_context7, function (key) {
+_forEachInstanceProperty(_context8 = _Object$keys(_text)).call(_context8, function (key) {
   if (key === "default" || key === "__esModule") return;
   if (key in exports && exports[key] === _text[key]) return;
   _Object$defineProperty(exports, key, {

package/lib/cjs/types/item.d.ts

@@ -0,0 +1,29 @@
+import { CSSProperties, ElementType } from 'react';
+import type { ItemProps } from '@react-types/shared';
+import { DOMAttributes, StyleProps } from './shared';
+export interface StylingProps extends DOMAttributes, StyleProps {
+    style?: CSSProperties | string;
+}
+declare module '@react-types/shared' {
+    interface ItemProps<T> extends StyleProps, DOMAttributes {
+        /** The rendered label for the item. */
+        label?: string;
+        /** Props for the accordion item content element. */
+        regionProps?: StylingProps;
+        /** Props for the accordion item content element. */
+        containerProps?: StylingProps;
+        /** Whether the item has a separator */
+        isSeparator?: boolean;
+        /** Whether the item is pressed */
+        isPressed?: boolean;
+        /** The HTML element type that will be used to render the item. */
+        elementType?: string | ElementType;
+        /** Indicates the status of item */
+        status?: 'default' | 'error' | 'success' | 'warning';
+        /** A URL to link to if elementType="a". */
+        href?: string;
+        /** Inline styling prop for item */
+        sx?: StylingProps;
+    }
+}
+export default ItemProps;

package/lib/cjs/types/item.js

@@ -0,0 +1,6 @@
+"use strict";
+
+var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
+_Object$defineProperty(exports, "__esModule", {
+  value: true
+});

package/lib/types/index.js

@@ -1,5 +1,6 @@
 export * from './box';
 export * from './icon';
+export * from './item';
 export * from './loader';
 export * from './popoverContainer';
 export * from './shared';

package/lib/types/item.js

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pingux/astro",
-  "version": "2.17.0-alpha.0",
+  "version": "2.17.0-alpha.2",
   "description": "React component library for Ping Identity's design system",
   "repository": {
     "type": "git",
@@ -75,6 +75,7 @@
     "@react-stately/list": "~3.4.1",
     "@react-stately/table": "~3.3.0",
     "@react-stately/virtualizer": "^3.2.1",
+    "@react-types/shared": "^3.20.0",
     "@storybook/addon-actions": "^7.1.0",
     "@storybook/api": "^7.1.0",
     "@storybook/components": "^7.1.0",

package/lib/cjs/recipes/RadioButtonsWithLinks.stories.js

@@ -1,133 +0,0 @@
-"use strict";
-
-var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
-var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
-var _Object$defineProperty = require("@babel/runtime-corejs3/core-js-stable/object/define-property");
-var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
-var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
-_Object$defineProperty(exports, "__esModule", {
-  value: true
-});
-exports["default"] = exports.Default = void 0;
-var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
-var _react = _interopRequireWildcard(require("react"));
-var _CloseIcon = _interopRequireDefault(require("@pingux/mdi-react/CloseIcon"));
-var _index = require("../index");
-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; }
-var _default = {
-  title: 'Recipes/Radio Buttons with Links'
-};
-exports["default"] = _default;
-var Default = function Default() {
-  var roles = [{
-    name: 'Client Application Developer'
-  }, {
-    name: 'Environment Admin',
-    isDisabled: true
-  }, {
-    name: 'Identity Data Admin',
-    isDisabled: true
-  }, {
-    name: 'Organization Admin'
-  }];
-  var titleSx = {
-    fontSize: 'md',
-    color: 'neutral.20',
-    fontWeight: 2
-  };
-  var subtitleSx = {
-    fontSize: 'md',
-    color: 'neutral.10'
-  };
-  var RadioFieldWithButton = function RadioFieldWithButton(_ref) {
-    var fieldName = _ref.fieldName,
-      isDisabled = _ref.isDisabled;
-    var _useState = (0, _react.useState)(false),
-      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-      isOpen = _useState2[0],
-      setIsOpen = _useState2[1];
-    return (0, _react2.jsx)(_index.Box, null, (0, _react2.jsx)(_index.Box, {
-      isRow: true,
-      alignItems: "center"
-    }, (0, _react2.jsx)(_index.RadioField, {
-      value: fieldName,
-      label: fieldName,
-      isDisabled: isDisabled
-    }), (0, _react2.jsx)(_index.Button, {
-      variant: "link",
-      mb: "xs",
-      ml: "md",
-      onPress: function onPress() {
-        return setIsOpen(function (prev) {
-          return !prev;
-        });
-      },
-      isDisabled: isDisabled
-    }, "".concat(isOpen ? 'Hide' : 'Show', " Permissions"))), isOpen && (0, _react2.jsx)(PermissionsList, {
-      onPress: function onPress() {
-        return setIsOpen(false);
-      }
-    }));
-  };
-  var PermissionsList = function PermissionsList(_ref2) {
-    var onPress = _ref2.onPress;
-    return (0, _react2.jsx)(_index.Box, {
-      p: "md",
-      bg: "neutral.95"
-    }, (0, _react2.jsx)(_index.Box, {
-      isRow: true,
-      justifyContent: "space-between",
-      mb: "sm"
-    }, (0, _react2.jsx)(_index.Text, {
-      sx: {
-        fontWeight: 2
-      }
-    }, "Permissions"), (0, _react2.jsx)(_index.IconButton, {
-      onPress: onPress,
-      "aria-label": "close"
-    }, (0, _react2.jsx)(_index.Icon, {
-      icon: _CloseIcon["default"],
-      size: "sm",
-      title: {
-        name: 'Close Icon'
-      }
-    }))), (0, _react2.jsx)(_index.Box, null, (0, _react2.jsx)(_index.Text, {
-      sx: titleSx,
-      mb: "xs"
-    }, "Resource"), (0, _react2.jsx)(_index.Text, {
-      sx: subtitleSx,
-      mb: "sm"
-    }, "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."), (0, _react2.jsx)(_index.Text, {
-      sx: titleSx,
-      mb: "xs"
-    }, "Push Credentials"), (0, _react2.jsx)(_index.Text, {
-      sx: subtitleSx,
-      mb: "sm"
-    }, "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod"), (0, _react2.jsx)(_index.Text, {
-      sx: titleSx,
-      mb: "xs"
-    }, "Organization"), (0, _react2.jsx)(_index.Text, {
-      sx: subtitleSx,
-      mb: "sm"
-    }, "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco"), (0, _react2.jsx)(_index.Text, {
-      sx: titleSx,
-      mb: "xs"
-    }, "Image"), (0, _react2.jsx)(_index.Text, {
-      sx: subtitleSx,
-      mb: "sm"
-    }, "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod")));
-  };
-  return (0, _react2.jsx)(_index.RadioGroupField, null, (0, _map["default"])(roles).call(roles, function (_ref3) {
-    var name = _ref3.name,
-      isDisabled = _ref3.isDisabled;
-    return (0, _react2.jsx)(RadioFieldWithButton, {
-      fieldName: name,
-      isDisabled: isDisabled,
-      key: name
-    });
-  }));
-};
-exports.Default = Default;

package/lib/recipes/RadioButtonsWithLinks.stories.js

@@ -1,118 +0,0 @@
-import _slicedToArray from "@babel/runtime-corejs3/helpers/esm/slicedToArray";
-import _mapInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/map";
-import React, { useState } from 'react';
-import CloseIcon from '@pingux/mdi-react/CloseIcon';
-import { Box, Button, Icon, IconButton, RadioField, RadioGroupField, Text } from '../index';
-import { jsx as ___EmotionJSX } from "@emotion/react";
-export default {
-  title: 'Recipes/Radio Buttons with Links'
-};
-export var Default = function Default() {
-  var roles = [{
-    name: 'Client Application Developer'
-  }, {
-    name: 'Environment Admin',
-    isDisabled: true
-  }, {
-    name: 'Identity Data Admin',
-    isDisabled: true
-  }, {
-    name: 'Organization Admin'
-  }];
-  var titleSx = {
-    fontSize: 'md',
-    color: 'neutral.20',
-    fontWeight: 2
-  };
-  var subtitleSx = {
-    fontSize: 'md',
-    color: 'neutral.10'
-  };
-  var RadioFieldWithButton = function RadioFieldWithButton(_ref) {
-    var fieldName = _ref.fieldName,
-      isDisabled = _ref.isDisabled;
-    var _useState = useState(false),
-      _useState2 = _slicedToArray(_useState, 2),
-      isOpen = _useState2[0],
-      setIsOpen = _useState2[1];
-    return ___EmotionJSX(Box, null, ___EmotionJSX(Box, {
-      isRow: true,
-      alignItems: "center"
-    }, ___EmotionJSX(RadioField, {
-      value: fieldName,
-      label: fieldName,
-      isDisabled: isDisabled
-    }), ___EmotionJSX(Button, {
-      variant: "link",
-      mb: "xs",
-      ml: "md",
-      onPress: function onPress() {
-        return setIsOpen(function (prev) {
-          return !prev;
-        });
-      },
-      isDisabled: isDisabled
-    }, "".concat(isOpen ? 'Hide' : 'Show', " Permissions"))), isOpen && ___EmotionJSX(PermissionsList, {
-      onPress: function onPress() {
-        return setIsOpen(false);
-      }
-    }));
-  };
-  var PermissionsList = function PermissionsList(_ref2) {
-    var onPress = _ref2.onPress;
-    return ___EmotionJSX(Box, {
-      p: "md",
-      bg: "neutral.95"
-    }, ___EmotionJSX(Box, {
-      isRow: true,
-      justifyContent: "space-between",
-      mb: "sm"
-    }, ___EmotionJSX(Text, {
-      sx: {
-        fontWeight: 2
-      }
-    }, "Permissions"), ___EmotionJSX(IconButton, {
-      onPress: onPress,
-      "aria-label": "close"
-    }, ___EmotionJSX(Icon, {
-      icon: CloseIcon,
-      size: "sm",
-      title: {
-        name: 'Close Icon'
-      }
-    }))), ___EmotionJSX(Box, null, ___EmotionJSX(Text, {
-      sx: titleSx,
-      mb: "xs"
-    }, "Resource"), ___EmotionJSX(Text, {
-      sx: subtitleSx,
-      mb: "sm"
-    }, "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."), ___EmotionJSX(Text, {
-      sx: titleSx,
-      mb: "xs"
-    }, "Push Credentials"), ___EmotionJSX(Text, {
-      sx: subtitleSx,
-      mb: "sm"
-    }, "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod"), ___EmotionJSX(Text, {
-      sx: titleSx,
-      mb: "xs"
-    }, "Organization"), ___EmotionJSX(Text, {
-      sx: subtitleSx,
-      mb: "sm"
-    }, "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco"), ___EmotionJSX(Text, {
-      sx: titleSx,
-      mb: "xs"
-    }, "Image"), ___EmotionJSX(Text, {
-      sx: subtitleSx,
-      mb: "sm"
-    }, "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod")));
-  };
-  return ___EmotionJSX(RadioGroupField, null, _mapInstanceProperty(roles).call(roles, function (_ref3) {
-    var name = _ref3.name,
-      isDisabled = _ref3.isDisabled;
-    return ___EmotionJSX(RadioFieldWithButton, {
-      fieldName: name,
-      isDisabled: isDisabled,
-      key: name
-    });
-  }));
-};