@sproutsocial/seeds-react-accordion 0.1.7 → 0.2.1

package/dist/esm/index.js

@@ -1,3 +1,99 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __commonJS = (cb, mod) => function __require() {
+  return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+
+// ../../node_modules/object-assign/index.js
+var require_object_assign = __commonJS({
+  "../../node_modules/object-assign/index.js"(exports, module) {
+    "use strict";
+    var getOwnPropertySymbols = Object.getOwnPropertySymbols;
+    var hasOwnProperty = Object.prototype.hasOwnProperty;
+    var propIsEnumerable = Object.prototype.propertyIsEnumerable;
+    function toObject(val) {
+      if (val === null || val === void 0) {
+        throw new TypeError("Object.assign cannot be called with null or undefined");
+      }
+      return Object(val);
+    }
+    function shouldUseNative() {
+      try {
+        if (!Object.assign) {
+          return false;
+        }
+        var test1 = new String("abc");
+        test1[5] = "de";
+        if (Object.getOwnPropertyNames(test1)[0] === "5") {
+          return false;
+        }
+        var test2 = {};
+        for (var i = 0; i < 10; i++) {
+          test2["_" + String.fromCharCode(i)] = i;
+        }
+        var order2 = Object.getOwnPropertyNames(test2).map(function(n) {
+          return test2[n];
+        });
+        if (order2.join("") !== "0123456789") {
+          return false;
+        }
+        var test3 = {};
+        "abcdefghijklmnopqrst".split("").forEach(function(letter) {
+          test3[letter] = letter;
+        });
+        if (Object.keys(Object.assign({}, test3)).join("") !== "abcdefghijklmnopqrst") {
+          return false;
+        }
+        return true;
+      } catch (err) {
+        return false;
+      }
+    }
+    module.exports = shouldUseNative() ? Object.assign : function(target, source) {
+      var from;
+      var to = toObject(target);
+      var symbols;
+      for (var s = 1; s < arguments.length; s++) {
+        from = Object(arguments[s]);
+        for (var key in from) {
+          if (hasOwnProperty.call(from, key)) {
+            to[key] = from[key];
+          }
+        }
+        if (getOwnPropertySymbols) {
+          symbols = getOwnPropertySymbols(from);
+          for (var i = 0; i < symbols.length; i++) {
+            if (propIsEnumerable.call(from, symbols[i])) {
+              to[symbols[i]] = from[symbols[i]];
+            }
+          }
+        }
+      }
+      return to;
+    };
+  }
+});
+
 // src/Accordion.tsx
 import React2, { createContext } from "react";
 import * as RadixAccordion from "@radix-ui/react-accordion";
@@ -70,8 +166,938 @@ var Accordion = ({
 import "@radix-ui/react-accordion";
 
 // src/styles.ts
-import styled, { css } from "styled-components";
+import styled, { css as css3 } from "styled-components";
 import * as RadixAccordion2 from "@radix-ui/react-accordion";
+
+// ../../node_modules/@styled-system/core/dist/index.esm.js
+var import_object_assign = __toESM(require_object_assign());
+var merge = function merge2(a, b) {
+  var result = (0, import_object_assign.default)({}, a, b);
+  for (var key in a) {
+    var _assign;
+    if (!a[key] || typeof b[key] !== "object") continue;
+    (0, import_object_assign.default)(result, (_assign = {}, _assign[key] = (0, import_object_assign.default)(a[key], b[key]), _assign));
+  }
+  return result;
+};
+var sort = function sort2(obj) {
+  var next = {};
+  Object.keys(obj).sort(function(a, b) {
+    return a.localeCompare(b, void 0, {
+      numeric: true,
+      sensitivity: "base"
+    });
+  }).forEach(function(key) {
+    next[key] = obj[key];
+  });
+  return next;
+};
+var defaults = {
+  breakpoints: [40, 52, 64].map(function(n) {
+    return n + "em";
+  })
+};
+var createMediaQuery = function createMediaQuery2(n) {
+  return "@media screen and (min-width: " + n + ")";
+};
+var getValue = function getValue2(n, scale) {
+  return get(scale, n, n);
+};
+var get = function get2(obj, key, def, p, undef) {
+  key = key && key.split ? key.split(".") : [key];
+  for (p = 0; p < key.length; p++) {
+    obj = obj ? obj[key[p]] : undef;
+  }
+  return obj === undef ? def : obj;
+};
+var createParser = function createParser2(config9) {
+  var cache = {};
+  var parse = function parse2(props) {
+    var styles = {};
+    var shouldSort = false;
+    var isCacheDisabled = props.theme && props.theme.disableStyledSystemCache;
+    for (var key in props) {
+      if (!config9[key]) continue;
+      var sx = config9[key];
+      var raw = props[key];
+      var scale = get(props.theme, sx.scale, sx.defaults);
+      if (typeof raw === "object") {
+        cache.breakpoints = !isCacheDisabled && cache.breakpoints || get(props.theme, "breakpoints", defaults.breakpoints);
+        if (Array.isArray(raw)) {
+          cache.media = !isCacheDisabled && cache.media || [null].concat(cache.breakpoints.map(createMediaQuery));
+          styles = merge(styles, parseResponsiveStyle(cache.media, sx, scale, raw, props));
+          continue;
+        }
+        if (raw !== null) {
+          styles = merge(styles, parseResponsiveObject(cache.breakpoints, sx, scale, raw, props));
+          shouldSort = true;
+        }
+        continue;
+      }
+      (0, import_object_assign.default)(styles, sx(raw, scale, props));
+    }
+    if (shouldSort) {
+      styles = sort(styles);
+    }
+    return styles;
+  };
+  parse.config = config9;
+  parse.propNames = Object.keys(config9);
+  parse.cache = cache;
+  var keys = Object.keys(config9).filter(function(k) {
+    return k !== "config";
+  });
+  if (keys.length > 1) {
+    keys.forEach(function(key) {
+      var _createParser;
+      parse[key] = createParser2((_createParser = {}, _createParser[key] = config9[key], _createParser));
+    });
+  }
+  return parse;
+};
+var parseResponsiveStyle = function parseResponsiveStyle2(mediaQueries, sx, scale, raw, _props) {
+  var styles = {};
+  raw.slice(0, mediaQueries.length).forEach(function(value, i) {
+    var media = mediaQueries[i];
+    var style = sx(value, scale, _props);
+    if (!media) {
+      (0, import_object_assign.default)(styles, style);
+    } else {
+      var _assign2;
+      (0, import_object_assign.default)(styles, (_assign2 = {}, _assign2[media] = (0, import_object_assign.default)({}, styles[media], style), _assign2));
+    }
+  });
+  return styles;
+};
+var parseResponsiveObject = function parseResponsiveObject2(breakpoints, sx, scale, raw, _props) {
+  var styles = {};
+  for (var key in raw) {
+    var breakpoint = breakpoints[key];
+    var value = raw[key];
+    var style = sx(value, scale, _props);
+    if (!breakpoint) {
+      (0, import_object_assign.default)(styles, style);
+    } else {
+      var _assign3;
+      var media = createMediaQuery(breakpoint);
+      (0, import_object_assign.default)(styles, (_assign3 = {}, _assign3[media] = (0, import_object_assign.default)({}, styles[media], style), _assign3));
+    }
+  }
+  return styles;
+};
+var createStyleFunction = function createStyleFunction2(_ref) {
+  var properties = _ref.properties, property = _ref.property, scale = _ref.scale, _ref$transform = _ref.transform, transform = _ref$transform === void 0 ? getValue : _ref$transform, defaultScale = _ref.defaultScale;
+  properties = properties || [property];
+  var sx = function sx2(value, scale2, _props) {
+    var result = {};
+    var n = transform(value, scale2, _props);
+    if (n === null) return;
+    properties.forEach(function(prop) {
+      result[prop] = n;
+    });
+    return result;
+  };
+  sx.scale = scale;
+  sx.defaults = defaultScale;
+  return sx;
+};
+var system = function system2(args) {
+  if (args === void 0) {
+    args = {};
+  }
+  var config9 = {};
+  Object.keys(args).forEach(function(key) {
+    var conf = args[key];
+    if (conf === true) {
+      config9[key] = createStyleFunction({
+        property: key,
+        scale: key
+      });
+      return;
+    }
+    if (typeof conf === "function") {
+      config9[key] = conf;
+      return;
+    }
+    config9[key] = createStyleFunction(conf);
+  });
+  var parser = createParser(config9);
+  return parser;
+};
+var compose = function compose2() {
+  var config9 = {};
+  for (var _len = arguments.length, parsers = new Array(_len), _key = 0; _key < _len; _key++) {
+    parsers[_key] = arguments[_key];
+  }
+  parsers.forEach(function(parser2) {
+    if (!parser2 || !parser2.config) return;
+    (0, import_object_assign.default)(config9, parser2.config);
+  });
+  var parser = createParser(config9);
+  return parser;
+};
+
+// ../../node_modules/@styled-system/layout/dist/index.esm.js
+var isNumber = function isNumber2(n) {
+  return typeof n === "number" && !isNaN(n);
+};
+var getWidth = function getWidth2(n, scale) {
+  return get(scale, n, !isNumber(n) || n > 1 ? n : n * 100 + "%");
+};
+var config = {
+  width: {
+    property: "width",
+    scale: "sizes",
+    transform: getWidth
+  },
+  height: {
+    property: "height",
+    scale: "sizes"
+  },
+  minWidth: {
+    property: "minWidth",
+    scale: "sizes"
+  },
+  minHeight: {
+    property: "minHeight",
+    scale: "sizes"
+  },
+  maxWidth: {
+    property: "maxWidth",
+    scale: "sizes"
+  },
+  maxHeight: {
+    property: "maxHeight",
+    scale: "sizes"
+  },
+  size: {
+    properties: ["width", "height"],
+    scale: "sizes"
+  },
+  overflow: true,
+  overflowX: true,
+  overflowY: true,
+  display: true,
+  verticalAlign: true
+};
+var layout = system(config);
+var index_esm_default = layout;
+
+// ../../node_modules/@styled-system/color/dist/index.esm.js
+var config2 = {
+  color: {
+    property: "color",
+    scale: "colors"
+  },
+  backgroundColor: {
+    property: "backgroundColor",
+    scale: "colors"
+  },
+  opacity: true
+};
+config2.bg = config2.backgroundColor;
+var color = system(config2);
+var index_esm_default2 = color;
+
+// ../../node_modules/@styled-system/typography/dist/index.esm.js
+var defaults2 = {
+  fontSizes: [12, 14, 16, 20, 24, 32, 48, 64, 72]
+};
+var config3 = {
+  fontFamily: {
+    property: "fontFamily",
+    scale: "fonts"
+  },
+  fontSize: {
+    property: "fontSize",
+    scale: "fontSizes",
+    defaultScale: defaults2.fontSizes
+  },
+  fontWeight: {
+    property: "fontWeight",
+    scale: "fontWeights"
+  },
+  lineHeight: {
+    property: "lineHeight",
+    scale: "lineHeights"
+  },
+  letterSpacing: {
+    property: "letterSpacing",
+    scale: "letterSpacings"
+  },
+  textAlign: true,
+  fontStyle: true
+};
+var typography = system(config3);
+var index_esm_default3 = typography;
+
+// ../../node_modules/@styled-system/flexbox/dist/index.esm.js
+var config4 = {
+  alignItems: true,
+  alignContent: true,
+  justifyItems: true,
+  justifyContent: true,
+  flexWrap: true,
+  flexDirection: true,
+  // item
+  flex: true,
+  flexGrow: true,
+  flexShrink: true,
+  flexBasis: true,
+  justifySelf: true,
+  alignSelf: true,
+  order: true
+};
+var flexbox = system(config4);
+var index_esm_default4 = flexbox;
+
+// ../../node_modules/@styled-system/grid/dist/index.esm.js
+var defaults3 = {
+  space: [0, 4, 8, 16, 32, 64, 128, 256, 512]
+};
+var config5 = {
+  gridGap: {
+    property: "gridGap",
+    scale: "space",
+    defaultScale: defaults3.space
+  },
+  gridColumnGap: {
+    property: "gridColumnGap",
+    scale: "space",
+    defaultScale: defaults3.space
+  },
+  gridRowGap: {
+    property: "gridRowGap",
+    scale: "space",
+    defaultScale: defaults3.space
+  },
+  gridColumn: true,
+  gridRow: true,
+  gridAutoFlow: true,
+  gridAutoColumns: true,
+  gridAutoRows: true,
+  gridTemplateColumns: true,
+  gridTemplateRows: true,
+  gridTemplateAreas: true,
+  gridArea: true
+};
+var grid = system(config5);
+var index_esm_default5 = grid;
+
+// ../../node_modules/@styled-system/border/dist/index.esm.js
+var config6 = {
+  border: {
+    property: "border",
+    scale: "borders"
+  },
+  borderWidth: {
+    property: "borderWidth",
+    scale: "borderWidths"
+  },
+  borderStyle: {
+    property: "borderStyle",
+    scale: "borderStyles"
+  },
+  borderColor: {
+    property: "borderColor",
+    scale: "colors"
+  },
+  borderRadius: {
+    property: "borderRadius",
+    scale: "radii"
+  },
+  borderTop: {
+    property: "borderTop",
+    scale: "borders"
+  },
+  borderTopLeftRadius: {
+    property: "borderTopLeftRadius",
+    scale: "radii"
+  },
+  borderTopRightRadius: {
+    property: "borderTopRightRadius",
+    scale: "radii"
+  },
+  borderRight: {
+    property: "borderRight",
+    scale: "borders"
+  },
+  borderBottom: {
+    property: "borderBottom",
+    scale: "borders"
+  },
+  borderBottomLeftRadius: {
+    property: "borderBottomLeftRadius",
+    scale: "radii"
+  },
+  borderBottomRightRadius: {
+    property: "borderBottomRightRadius",
+    scale: "radii"
+  },
+  borderLeft: {
+    property: "borderLeft",
+    scale: "borders"
+  },
+  borderX: {
+    properties: ["borderLeft", "borderRight"],
+    scale: "borders"
+  },
+  borderY: {
+    properties: ["borderTop", "borderBottom"],
+    scale: "borders"
+  }
+};
+config6.borderTopWidth = {
+  property: "borderTopWidth",
+  scale: "borderWidths"
+};
+config6.borderTopColor = {
+  property: "borderTopColor",
+  scale: "colors"
+};
+config6.borderTopStyle = {
+  property: "borderTopStyle",
+  scale: "borderStyles"
+};
+config6.borderTopLeftRadius = {
+  property: "borderTopLeftRadius",
+  scale: "radii"
+};
+config6.borderTopRightRadius = {
+  property: "borderTopRightRadius",
+  scale: "radii"
+};
+config6.borderBottomWidth = {
+  property: "borderBottomWidth",
+  scale: "borderWidths"
+};
+config6.borderBottomColor = {
+  property: "borderBottomColor",
+  scale: "colors"
+};
+config6.borderBottomStyle = {
+  property: "borderBottomStyle",
+  scale: "borderStyles"
+};
+config6.borderBottomLeftRadius = {
+  property: "borderBottomLeftRadius",
+  scale: "radii"
+};
+config6.borderBottomRightRadius = {
+  property: "borderBottomRightRadius",
+  scale: "radii"
+};
+config6.borderLeftWidth = {
+  property: "borderLeftWidth",
+  scale: "borderWidths"
+};
+config6.borderLeftColor = {
+  property: "borderLeftColor",
+  scale: "colors"
+};
+config6.borderLeftStyle = {
+  property: "borderLeftStyle",
+  scale: "borderStyles"
+};
+config6.borderRightWidth = {
+  property: "borderRightWidth",
+  scale: "borderWidths"
+};
+config6.borderRightColor = {
+  property: "borderRightColor",
+  scale: "colors"
+};
+config6.borderRightStyle = {
+  property: "borderRightStyle",
+  scale: "borderStyles"
+};
+var border = system(config6);
+var index_esm_default6 = border;
+
+// ../../node_modules/@styled-system/background/dist/index.esm.js
+var config7 = {
+  background: true,
+  backgroundImage: true,
+  backgroundSize: true,
+  backgroundPosition: true,
+  backgroundRepeat: true
+};
+config7.bgImage = config7.backgroundImage;
+config7.bgSize = config7.backgroundSize;
+config7.bgPosition = config7.backgroundPosition;
+config7.bgRepeat = config7.backgroundRepeat;
+var background = system(config7);
+var index_esm_default7 = background;
+
+// ../../node_modules/@styled-system/position/dist/index.esm.js
+var defaults4 = {
+  space: [0, 4, 8, 16, 32, 64, 128, 256, 512]
+};
+var config8 = {
+  position: true,
+  zIndex: {
+    property: "zIndex",
+    scale: "zIndices"
+  },
+  top: {
+    property: "top",
+    scale: "space",
+    defaultScale: defaults4.space
+  },
+  right: {
+    property: "right",
+    scale: "space",
+    defaultScale: defaults4.space
+  },
+  bottom: {
+    property: "bottom",
+    scale: "space",
+    defaultScale: defaults4.space
+  },
+  left: {
+    property: "left",
+    scale: "space",
+    defaultScale: defaults4.space
+  }
+};
+var position = system(config8);
+var index_esm_default8 = position;
+
+// ../../node_modules/@styled-system/space/dist/index.esm.js
+var defaults5 = {
+  space: [0, 4, 8, 16, 32, 64, 128, 256, 512]
+};
+var isNumber3 = function isNumber4(n) {
+  return typeof n === "number" && !isNaN(n);
+};
+var getMargin = function getMargin2(n, scale) {
+  if (!isNumber3(n)) {
+    return get(scale, n, n);
+  }
+  var isNegative = n < 0;
+  var absolute = Math.abs(n);
+  var value = get(scale, absolute, absolute);
+  if (!isNumber3(value)) {
+    return isNegative ? "-" + value : value;
+  }
+  return value * (isNegative ? -1 : 1);
+};
+var configs = {};
+configs.margin = {
+  margin: {
+    property: "margin",
+    scale: "space",
+    transform: getMargin,
+    defaultScale: defaults5.space
+  },
+  marginTop: {
+    property: "marginTop",
+    scale: "space",
+    transform: getMargin,
+    defaultScale: defaults5.space
+  },
+  marginRight: {
+    property: "marginRight",
+    scale: "space",
+    transform: getMargin,
+    defaultScale: defaults5.space
+  },
+  marginBottom: {
+    property: "marginBottom",
+    scale: "space",
+    transform: getMargin,
+    defaultScale: defaults5.space
+  },
+  marginLeft: {
+    property: "marginLeft",
+    scale: "space",
+    transform: getMargin,
+    defaultScale: defaults5.space
+  },
+  marginX: {
+    properties: ["marginLeft", "marginRight"],
+    scale: "space",
+    transform: getMargin,
+    defaultScale: defaults5.space
+  },
+  marginY: {
+    properties: ["marginTop", "marginBottom"],
+    scale: "space",
+    transform: getMargin,
+    defaultScale: defaults5.space
+  }
+};
+configs.margin.m = configs.margin.margin;
+configs.margin.mt = configs.margin.marginTop;
+configs.margin.mr = configs.margin.marginRight;
+configs.margin.mb = configs.margin.marginBottom;
+configs.margin.ml = configs.margin.marginLeft;
+configs.margin.mx = configs.margin.marginX;
+configs.margin.my = configs.margin.marginY;
+configs.padding = {
+  padding: {
+    property: "padding",
+    scale: "space",
+    defaultScale: defaults5.space
+  },
+  paddingTop: {
+    property: "paddingTop",
+    scale: "space",
+    defaultScale: defaults5.space
+  },
+  paddingRight: {
+    property: "paddingRight",
+    scale: "space",
+    defaultScale: defaults5.space
+  },
+  paddingBottom: {
+    property: "paddingBottom",
+    scale: "space",
+    defaultScale: defaults5.space
+  },
+  paddingLeft: {
+    property: "paddingLeft",
+    scale: "space",
+    defaultScale: defaults5.space
+  },
+  paddingX: {
+    properties: ["paddingLeft", "paddingRight"],
+    scale: "space",
+    defaultScale: defaults5.space
+  },
+  paddingY: {
+    properties: ["paddingTop", "paddingBottom"],
+    scale: "space",
+    defaultScale: defaults5.space
+  }
+};
+configs.padding.p = configs.padding.padding;
+configs.padding.pt = configs.padding.paddingTop;
+configs.padding.pr = configs.padding.paddingRight;
+configs.padding.pb = configs.padding.paddingBottom;
+configs.padding.pl = configs.padding.paddingLeft;
+configs.padding.px = configs.padding.paddingX;
+configs.padding.py = configs.padding.paddingY;
+var margin = system(configs.margin);
+var padding = system(configs.padding);
+var space = compose(margin, padding);
+
+// ../../node_modules/@styled-system/shadow/dist/index.esm.js
+var shadow = system({
+  boxShadow: {
+    property: "boxShadow",
+    scale: "shadows"
+  },
+  textShadow: {
+    property: "textShadow",
+    scale: "shadows"
+  }
+});
+
+// ../../node_modules/@styled-system/css/dist/index.esm.js
+function _extends() {
+  _extends = Object.assign || function(target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends.apply(this, arguments);
+}
+var get3 = function get4(obj, key, def, p, undef) {
+  key = key && key.split ? key.split(".") : [key];
+  for (p = 0; p < key.length; p++) {
+    obj = obj ? obj[key[p]] : undef;
+  }
+  return obj === undef ? def : obj;
+};
+var defaultBreakpoints = [40, 52, 64].map(function(n) {
+  return n + "em";
+});
+var defaultTheme = {
+  space: [0, 4, 8, 16, 32, 64, 128, 256, 512],
+  fontSizes: [12, 14, 16, 20, 24, 32, 48, 64, 72]
+};
+var aliases = {
+  bg: "backgroundColor",
+  m: "margin",
+  mt: "marginTop",
+  mr: "marginRight",
+  mb: "marginBottom",
+  ml: "marginLeft",
+  mx: "marginX",
+  my: "marginY",
+  p: "padding",
+  pt: "paddingTop",
+  pr: "paddingRight",
+  pb: "paddingBottom",
+  pl: "paddingLeft",
+  px: "paddingX",
+  py: "paddingY"
+};
+var multiples = {
+  marginX: ["marginLeft", "marginRight"],
+  marginY: ["marginTop", "marginBottom"],
+  paddingX: ["paddingLeft", "paddingRight"],
+  paddingY: ["paddingTop", "paddingBottom"],
+  size: ["width", "height"]
+};
+var scales = {
+  color: "colors",
+  backgroundColor: "colors",
+  borderColor: "colors",
+  margin: "space",
+  marginTop: "space",
+  marginRight: "space",
+  marginBottom: "space",
+  marginLeft: "space",
+  marginX: "space",
+  marginY: "space",
+  padding: "space",
+  paddingTop: "space",
+  paddingRight: "space",
+  paddingBottom: "space",
+  paddingLeft: "space",
+  paddingX: "space",
+  paddingY: "space",
+  top: "space",
+  right: "space",
+  bottom: "space",
+  left: "space",
+  gridGap: "space",
+  gridColumnGap: "space",
+  gridRowGap: "space",
+  gap: "space",
+  columnGap: "space",
+  rowGap: "space",
+  fontFamily: "fonts",
+  fontSize: "fontSizes",
+  fontWeight: "fontWeights",
+  lineHeight: "lineHeights",
+  letterSpacing: "letterSpacings",
+  border: "borders",
+  borderTop: "borders",
+  borderRight: "borders",
+  borderBottom: "borders",
+  borderLeft: "borders",
+  borderWidth: "borderWidths",
+  borderStyle: "borderStyles",
+  borderRadius: "radii",
+  borderTopRightRadius: "radii",
+  borderTopLeftRadius: "radii",
+  borderBottomRightRadius: "radii",
+  borderBottomLeftRadius: "radii",
+  borderTopWidth: "borderWidths",
+  borderTopColor: "colors",
+  borderTopStyle: "borderStyles",
+  borderBottomWidth: "borderWidths",
+  borderBottomColor: "colors",
+  borderBottomStyle: "borderStyles",
+  borderLeftWidth: "borderWidths",
+  borderLeftColor: "colors",
+  borderLeftStyle: "borderStyles",
+  borderRightWidth: "borderWidths",
+  borderRightColor: "colors",
+  borderRightStyle: "borderStyles",
+  outlineColor: "colors",
+  boxShadow: "shadows",
+  textShadow: "shadows",
+  zIndex: "zIndices",
+  width: "sizes",
+  minWidth: "sizes",
+  maxWidth: "sizes",
+  height: "sizes",
+  minHeight: "sizes",
+  maxHeight: "sizes",
+  flexBasis: "sizes",
+  size: "sizes",
+  // svg
+  fill: "colors",
+  stroke: "colors"
+};
+var positiveOrNegative = function positiveOrNegative2(scale, value) {
+  if (typeof value !== "number" || value >= 0) {
+    return get3(scale, value, value);
+  }
+  var absolute = Math.abs(value);
+  var n = get3(scale, absolute, absolute);
+  if (typeof n === "string") return "-" + n;
+  return n * -1;
+};
+var transforms = ["margin", "marginTop", "marginRight", "marginBottom", "marginLeft", "marginX", "marginY", "top", "bottom", "left", "right"].reduce(function(acc, curr) {
+  var _extends2;
+  return _extends({}, acc, (_extends2 = {}, _extends2[curr] = positiveOrNegative, _extends2));
+}, {});
+var responsive = function responsive2(styles) {
+  return function(theme) {
+    var next = {};
+    var breakpoints = get3(theme, "breakpoints", defaultBreakpoints);
+    var mediaQueries = [null].concat(breakpoints.map(function(n) {
+      return "@media screen and (min-width: " + n + ")";
+    }));
+    for (var key in styles) {
+      var value = typeof styles[key] === "function" ? styles[key](theme) : styles[key];
+      if (value == null) continue;
+      if (!Array.isArray(value)) {
+        next[key] = value;
+        continue;
+      }
+      for (var i = 0; i < value.slice(0, mediaQueries.length).length; i++) {
+        var media = mediaQueries[i];
+        if (!media) {
+          next[key] = value[i];
+          continue;
+        }
+        next[media] = next[media] || {};
+        if (value[i] == null) continue;
+        next[media][key] = value[i];
+      }
+    }
+    return next;
+  };
+};
+var css = function css2(args) {
+  return function(props) {
+    if (props === void 0) {
+      props = {};
+    }
+    var theme = _extends({}, defaultTheme, {}, props.theme || props);
+    var result = {};
+    var obj = typeof args === "function" ? args(theme) : args;
+    var styles = responsive(obj)(theme);
+    for (var key in styles) {
+      var x = styles[key];
+      var val = typeof x === "function" ? x(theme) : x;
+      if (key === "variant") {
+        var variant3 = css2(get3(theme, val))(theme);
+        result = _extends({}, result, {}, variant3);
+        continue;
+      }
+      if (val && typeof val === "object") {
+        result[key] = css2(val)(theme);
+        continue;
+      }
+      var prop = get3(aliases, key, key);
+      var scaleName = get3(scales, prop);
+      var scale = get3(theme, scaleName, get3(theme, prop, {}));
+      var transform = get3(transforms, prop, get3);
+      var value = transform(scale, val, val);
+      if (multiples[prop]) {
+        var dirs = multiples[prop];
+        for (var i = 0; i < dirs.length; i++) {
+          result[dirs[i]] = value;
+        }
+      } else {
+        result[prop] = value;
+      }
+    }
+    return result;
+  };
+};
+var index_esm_default9 = css;
+
+// ../../node_modules/@styled-system/variant/dist/index.esm.js
+var variant = function variant2(_ref) {
+  var _config;
+  var scale = _ref.scale, _ref$prop = _ref.prop, prop = _ref$prop === void 0 ? "variant" : _ref$prop, _ref$variants = _ref.variants, variants = _ref$variants === void 0 ? {} : _ref$variants, key = _ref.key;
+  var sx;
+  if (Object.keys(variants).length) {
+    sx = function sx2(value, scale2, props) {
+      return index_esm_default9(get(scale2, value, null))(props.theme);
+    };
+  } else {
+    sx = function sx2(value, scale2) {
+      return get(scale2, value, null);
+    };
+  }
+  sx.scale = scale || key;
+  sx.defaults = variants;
+  var config9 = (_config = {}, _config[prop] = sx, _config);
+  var parser = createParser(config9);
+  return parser;
+};
+var buttonStyle = variant({
+  key: "buttons"
+});
+var textStyle = variant({
+  key: "textStyles",
+  prop: "textStyle"
+});
+var colorStyle = variant({
+  key: "colorStyles",
+  prop: "colors"
+});
+
+// ../../node_modules/styled-system/dist/index.esm.js
+var width = index_esm_default.width;
+var height = index_esm_default.height;
+var minWidth = index_esm_default.minWidth;
+var minHeight = index_esm_default.minHeight;
+var maxWidth = index_esm_default.maxWidth;
+var maxHeight = index_esm_default.maxHeight;
+var size = index_esm_default.size;
+var verticalAlign = index_esm_default.verticalAlign;
+var display = index_esm_default.display;
+var overflow = index_esm_default.overflow;
+var overflowX = index_esm_default.overflowX;
+var overflowY = index_esm_default.overflowY;
+var opacity = index_esm_default2.opacity;
+var fontSize = index_esm_default3.fontSize;
+var fontFamily = index_esm_default3.fontFamily;
+var fontWeight = index_esm_default3.fontWeight;
+var lineHeight = index_esm_default3.lineHeight;
+var textAlign = index_esm_default3.textAlign;
+var fontStyle = index_esm_default3.fontStyle;
+var letterSpacing = index_esm_default3.letterSpacing;
+var alignItems = index_esm_default4.alignItems;
+var alignContent = index_esm_default4.alignContent;
+var justifyItems = index_esm_default4.justifyItems;
+var justifyContent = index_esm_default4.justifyContent;
+var flexWrap = index_esm_default4.flexWrap;
+var flexDirection = index_esm_default4.flexDirection;
+var flex = index_esm_default4.flex;
+var flexGrow = index_esm_default4.flexGrow;
+var flexShrink = index_esm_default4.flexShrink;
+var flexBasis = index_esm_default4.flexBasis;
+var justifySelf = index_esm_default4.justifySelf;
+var alignSelf = index_esm_default4.alignSelf;
+var order = index_esm_default4.order;
+var gridGap = index_esm_default5.gridGap;
+var gridColumnGap = index_esm_default5.gridColumnGap;
+var gridRowGap = index_esm_default5.gridRowGap;
+var gridColumn = index_esm_default5.gridColumn;
+var gridRow = index_esm_default5.gridRow;
+var gridAutoFlow = index_esm_default5.gridAutoFlow;
+var gridAutoColumns = index_esm_default5.gridAutoColumns;
+var gridAutoRows = index_esm_default5.gridAutoRows;
+var gridTemplateColumns = index_esm_default5.gridTemplateColumns;
+var gridTemplateRows = index_esm_default5.gridTemplateRows;
+var gridTemplateAreas = index_esm_default5.gridTemplateAreas;
+var gridArea = index_esm_default5.gridArea;
+var borderWidth = index_esm_default6.borderWidth;
+var borderStyle = index_esm_default6.borderStyle;
+var borderColor = index_esm_default6.borderColor;
+var borderTop = index_esm_default6.borderTop;
+var borderRight = index_esm_default6.borderRight;
+var borderBottom = index_esm_default6.borderBottom;
+var borderLeft = index_esm_default6.borderLeft;
+var borderRadius = index_esm_default6.borderRadius;
+var backgroundImage = index_esm_default7.backgroundImage;
+var backgroundSize = index_esm_default7.backgroundSize;
+var backgroundPosition = index_esm_default7.backgroundPosition;
+var backgroundRepeat = index_esm_default7.backgroundRepeat;
+var zIndex = index_esm_default8.zIndex;
+var top = index_esm_default8.top;
+var right = index_esm_default8.right;
+var bottom = index_esm_default8.bottom;
+var left = index_esm_default8.left;
+
+// src/styles.ts
 import {
   BORDER,
   COMMON,
@@ -80,7 +1106,7 @@ import {
   TYPOGRAPHY
 } from "@sproutsocial/seeds-react-system-props";
 var StyledAccordionItem = styled(RadixAccordion2.Item)``;
-var animations = css`
+var animations = css3`
   @keyframes slideDown {
     from {
       height: 0;
@@ -114,7 +1140,6 @@ var StyledRadixAccordionTrigger = styled(
   ${({ theme }) => theme.typography[200]};
 
   .triggerIcon {
-    color: ${({ theme }) => theme.colors.icon.base};
     transition: transform 300ms ease-in-out;
   }
 
@@ -172,10 +1197,10 @@ var ContentContainer = styled.div`
   color: ${({ theme }) => theme.colors.text.body};
   background: transparent;
   font-family: ${({ theme }) => theme.fontFamily};
-  ${({ theme }) => theme.typography[200]};
 
   &[data-styled="true"] {
     padding: ${({ theme }) => theme.space[400]};
+    ${({ theme }) => theme.typography[200]};
   }
 
   .accordion-item:last-child[data-state="open"] &[data-styled="true"],
@@ -185,6 +1210,7 @@ var ContentContainer = styled.div`
   }
 
   ${COMMON}
+  ${TYPOGRAPHY}
   ${BORDER}
 	${LAYOUT}
 	${FLEXBOX}
@@ -231,16 +1257,17 @@ var TriggerContainer = styled.div`
 `;
 var TitleStyles = styled.h4`
   margin: 0;
-  font-size: ${({ theme }) => theme.fontSizes[200]};
   font-weight: normal;
 
   &[data-styled="true"] {
+    font-size: ${({ theme }) => theme.fontSizes[200]};
     font-weight: ${({ theme }) => theme.fontWeights.semibold};
     color: ${({ theme }) => theme.colors.text.headline};
   }
 
   ${COMMON}
   ${TYPOGRAPHY}
+  ${fontSize}
 `;
 
 // src/AccordionItem.tsx
@@ -286,8 +1313,8 @@ var AccordionTrigger = ({
   const { triggerIcon, triggerPosition, styled: styled2 } = useContext2(AccordionContext);
   const validatedActions = relatedActions?.slice(0, MAX_RELATED_ACTIONS);
   const {
-    color,
-    padding,
+    color: color2,
+    padding: padding2,
     paddingBottom,
     paddingTop,
     paddingX,
@@ -301,15 +1328,16 @@ var AccordionTrigger = ({
     pl,
     px,
     py,
-    fontFamily,
-    fontStyle,
-    fontWeight,
-    lineHeight,
-    textAlign,
+    fontFamily: fontFamily2,
+    fontSize: fontSize2,
+    fontStyle: fontStyle2,
+    fontWeight: fontWeight2,
+    lineHeight: lineHeight2,
+    textAlign: textAlign2,
     ...triggerProps
   } = rest;
   const spacingProps = {
-    padding,
+    padding: padding2,
     paddingBottom,
     paddingTop,
     paddingX,
@@ -326,12 +1354,13 @@ var AccordionTrigger = ({
   };
   const typographyProps = Object.fromEntries(
     Object.entries({
-      color,
-      fontFamily,
-      fontStyle,
-      fontWeight,
-      lineHeight,
-      textAlign
+      color: color2,
+      fontFamily: fontFamily2,
+      fontSize: fontSize2,
+      fontStyle: fontStyle2,
+      fontWeight: fontWeight2,
+      lineHeight: lineHeight2,
+      textAlign: textAlign2
     }).filter(([_, value]) => value != null)
   );
   const renderedOverflowMenu = overflowMenu && /* @__PURE__ */ jsx4(
@@ -342,7 +1371,14 @@ var AccordionTrigger = ({
         {
           "aria-label": overflowMenu["aria-label"],
           appearance: "unstyled",
-          children: /* @__PURE__ */ jsx4(Icon2, { name: "ellipsis-horizontal-outline", "aria-hidden": "true" })
+          children: /* @__PURE__ */ jsx4(
+            Icon2,
+            {
+              name: "ellipsis-horizontal-outline",
+              "aria-hidden": "true",
+              color: color2
+            }
+          )
         }
       ),
       children: /* @__PURE__ */ jsx4(MenuContent, { children: /* @__PURE__ */ jsx4(MenuGroup, { id: "overflow-actions", children: overflowMenu.items.map((item, index) => {
@@ -353,10 +1389,19 @@ var AccordionTrigger = ({
             id: id || `overflow-item-${index}`,
             onClick,
             ...menuItemProps,
-            children: iconName ? /* @__PURE__ */ jsxs(Box, { display: "flex", alignItems: "center", gap: "300", children: [
-              /* @__PURE__ */ jsx4(Icon2, { name: iconName }),
-              children2
-            ] }) : children2
+            children: iconName ? /* @__PURE__ */ jsxs(
+              Box,
+              {
+                display: "flex",
+                alignItems: "center",
+                gap: "300",
+                color: color2,
+                children: [
+                  /* @__PURE__ */ jsx4(Icon2, { name: iconName, color: color2 }),
+                  children2
+                ]
+              }
+            ) : children2
           },
           id || `overflow-item-${index}`
         );
@@ -368,7 +1413,7 @@ var AccordionTrigger = ({
     {
       onClick: action.onClick,
       "aria-label": action["aria-label"],
-      children: /* @__PURE__ */ jsx4(Icon2, { name: action.iconName, "aria-hidden": "true" })
+      children: /* @__PURE__ */ jsx4(Icon2, { name: action.iconName, color: color2, "aria-hidden": "true" })
     },
     `${action.iconName}-${index}`
   )) });
@@ -400,4 +1445,13 @@ export {
   AccordionItem,
   AccordionTrigger
 };
+/*! Bundled license information:
+
+object-assign/index.js:
+  (*
+  object-assign
+  (c) Sindre Sorhus
+  @license MIT
+  *)
+*/
 //# sourceMappingURL=index.js.map