@cypress-design/react-accordion 0.2.0 → 0.3.0

package/.turbo/turbo-build.log

@@ -0,0 +1,6 @@
+$ yarn build:module && yarn build:types
+$ rollup -c ./rollup.config.mjs
+
+./index.ts → ./dist/index.umd.js, ./dist/index.es.mjs...
+created ./dist/index.umd.js, ./dist/index.es.mjs in 28.3s
+$ tsc --project ./tsconfig.build.json

package/Accordion.tsx

@@ -52,7 +52,7 @@ export const Accordion: React.FC<
           {Icon && !iconEl && <Icon className={CssClasses.icon} />}
 
           {(Icon || iconEl) && separator && (
-            <span className={CssClasses.separator} aria-role="separator" />
+            <span className={CssClasses.separator} role="separator" />
           )}
           <span className="flex-grow pr-[16px]">
             <span

package/AccordionReact.cy.tsx

@@ -1,7 +1,7 @@
 /// <reference types="cypress" />
 
 import * as React from 'react'
-import { mount } from 'cypress/react'
+import { mount } from 'cypress/react18'
 import AccordionStory from './Accordion.rootstory'
 import assertions from '../assertions'
 import Accordion from './Accordion'

package/CHANGELOG.md

@@ -1,5 +1,23 @@
 # @cypress-design/react-accordion
 
+## 0.3.0
+
+### Minor Changes
+
+- [#178](https://github.com/cypress-io/cypress-design/pull/178) [`d0de778`](https://github.com/cypress-io/cypress-design/commit/d0de77843adb87d8f4804219c6dca8f45b15c650) Thanks [@elevatebart](https://github.com/elevatebart)! - deliver new docs and improved components
+
+### Patch Changes
+
+- Updated dependencies [[`18399c7`](https://github.com/cypress-io/cypress-design/commit/18399c72a52288c67af0935384430d4e4cd24251), [`d0de778`](https://github.com/cypress-io/cypress-design/commit/d0de77843adb87d8f4804219c6dca8f45b15c650)]:
+  - @cypress-design/react-icon@0.19.0
+  - @cypress-design/details-animation@0.1.0
+
+## 0.2.1
+
+### Patch Changes
+
+- [`c798320`](https://github.com/cypress-io/cypress-design/commit/c798320236ec41a43eb74be80f407781e980aaf0) Thanks [@elevatebart](https://github.com/elevatebart)! - fix the aria-role of accordion separator
+
 ## 0.2.0
 
 ### Minor Changes

package/ReadMe.md

@@ -4,7 +4,7 @@
 
 Collapsible component with a header and a body.
 
-## install
+## Install
 
 ```bash
 npm install @cypress-design/react-accordion
@@ -22,16 +22,20 @@ yarn add @cypress-design/react-accordion
 import Accordion from '@cypress-design/react-accordion'
 ```
 
-```tsx
-<Accordion
-  icon={IconActionQuestionMarkCircle}
-  title="Accordion Title"
-  description="Vestibulum id ligula porta felis euismod semper. Nulla... "
-  separator
-  open
-  fullWidthContent
->
-  Lorem ipsum, dolor sit amet consectetur adipisicing elit. Odio dolore omnis
-  nemo minus, sapiente magni ...
-</Accordion>
+```tsx live
+import { IconActionQuestionMarkCircle } from '@cypress-design/react-icon'
+
+export default () => (
+  <Accordion
+    icon={IconActionQuestionMarkCircle}
+    title="Accordion Title"
+    description="Vestibulum id ligula porta felis euismod semper. Nulla... "
+    separator
+    open
+    fullWidthContent
+  >
+    Lorem ipsum, dolor sit amet consectetur adipisicing elit. Odio dolore omnis
+    nemo minus, sapiente magni ...
+  </Accordion>
+)
 ```

package/dist/index.es.mjs

@@ -54,7 +54,7 @@ var CssClasses = {
     separator: 'w-[1px] h-[40px] bg-gray-100 mr-[16px]',
     chevron: 'flex-shrink-0 transition transform rotate-0 open:rotate-180',
     contentWrapper: 'border border-gray-100 rounded-b-md border-t-0',
-    content: 'px-[24px] py-[16px]'
+    content: 'px-[24px] py-[16px]',
 };
 
 /******************************************************************************
@@ -104,8 +104,8 @@ var compileReactIconProperties = function (_a) {
         }
         return newAttributes;
     }, {});
-    var componentProps = __assign({ width: size, height: size, viewBox: "0 0 " + size + " " + size, fill: 'none', dangerouslySetInnerHTML: {
-            __html: body
+    var componentProps = __assign({ width: size, height: size, viewBox: "0 0 ".concat(size, " ").concat(size), fill: 'none', dangerouslySetInnerHTML: {
+            __html: body,
         } }, filteredAttributes);
     if (attributes.className) {
         compiledClasses.push(attributes.className);
@@ -118,16 +118,17 @@ var compileReactIconProperties = function (_a) {
 var IconChevronDownSmall = function (props) {
     var _a = iconsRegistry.getComponentAttributes(__assign(__assign({}, props), { availableSizes: ["8", "16"] })), size = _a.sizeWithDefault, compiledClasses = _a.compiledClasses;
     var iconBodies = {
-        "8": "<path d=\"m1 2.5 3 3 3-3\" stroke=\"currentColor\" class=\"icon-dark\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>",
-        "16": "<path d=\"m4 6 4 4 4-4\" stroke=\"currentColor\" class=\"icon-dark\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>"
+        "8": "<path stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"m1 2.5 3 3 3-3\" class=\"icon-dark\"/>",
+        "16": "<path stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"m4 6 4 4 4-4\" class=\"icon-dark\"/>"
     };
     var body = iconBodies[size];
     if (!body) {
-        throw Error("Icon \"chevron-down-small\" is not available in size " + size);
+        throw Error("Icon \"chevron-down-small\" is not available in size ".concat(size));
     }
     return React.createElement('svg', compileReactIconProperties(__assign(__assign({}, props), { size: size, body: body, compiledClasses: compiledClasses })));
 };
 
+
 /* <windicss-keep class=""> */
 
 var Accordion = function (_a) {
@@ -144,7 +145,7 @@ var Accordion = function (_a) {
             React.createElement("span", { className: CssClasses.summaryDiv },
                 Boolean(iconEl) && React.createElement("span", { className: CssClasses.icon }, iconEl),
                 Icon && !iconEl && React.createElement(Icon, { className: CssClasses.icon }),
-                (Icon || iconEl) && separator && (React.createElement("span", { className: CssClasses.separator, "aria-role": "separator" })),
+                (Icon || iconEl) && separator && (React.createElement("span", { className: CssClasses.separator, role: "separator" })),
                 React.createElement("span", { className: "flex-grow pr-[16px]" },
                     React.createElement("span", { className: clsx(titleClassName !== null && titleClassName !== void 0 ? titleClassName : CssClasses.summaryTitleColor, CssClasses.summaryTitle) }, title),
                     description && (React.createElement("span", { className: clsx(CssClasses.summaryDescription, descriptionClassName !== null && descriptionClassName !== void 0 ? descriptionClassName : CssClasses.summaryDescriptionColor) }, description))),
@@ -153,6 +154,6 @@ var Accordion = function (_a) {
 };
 
 export { Accordion as default };
+//# sourceMappingURL=index.es.mjs.map
 
 /* <windicss-keep class="flex-grow pr-[16px] open:icon-dark-gray-500 details-none card open:rounded-b-none flex flex-row py-[12px] px-[24px] flex-nowrap items-center min-h-[63px] bg-white text-[18px] leading-[28px] font-medium text-indigo-500 block text-[14px] leading-[20px] font-normal text-gray-700 mr-[24px] flex-shrink-0 w-[1px] h-[40px] bg-gray-100 mr-[16px] transition transform rotate-0 open:rotate-180 border border-gray-100 rounded-b-md border-t-0 py-[16px]"> */
-//# sourceMappingURL=index.es.mjs.map