{"size": 768, "ext": "js", "max_stars_repo_path": "docs/src/pages/components/cdk-components/accordion/examples/alternative.js", "max_stars_repo_name": "gpfeifer/halstack-react", "max_stars_repo_stars_event_min_datetime": "2020-08-20T10:04:04.000Z", "max_stars_repo_stars_event_max_datetime": "2022-01-26T22:16:57.000Z", "max_issues_repo_path": "docs/src/pages/components/cdk-components/accordion/examples/alternative.js", "max_issues_repo_name": "gpfeifer/halstack-react", "max_issues_repo_issues_event_min_datetime": "2020-07-28T21:25:10.000Z", "max_issues_repo_issues_event_max_datetime": "2022-03-31T12:51:03.000Z", "max_forks_repo_path": "docs/src/pages/components/cdk-components/accordion/examples/alternative.js", "max_forks_repo_name": "gpfeifer/halstack-react", "max_forks_repo_forks_event_min_datetime": "2020-08-20T09:48:26.000Z", "max_forks_repo_forks_event_max_datetime": "2021-12-01T09:11:07.000Z"}
{"max_stars_count": 8, "max_issues_count": 346, "max_forks_count": 15, "avg_line_length": 21.9428571429, "max_line_length": 78, "alphanum_fraction": 0.6080729167}
import { DxcAccordion } from "@dxc-technology/halstack-react";
import { useState } from "react";

const code = `() => {
  const [isExpanded, changeIsExpanded] = useState(false);
  const onChange = newValue => {
    changeIsExpanded(newValue);
  };

  return (
    <div>
      <DxcAccordion
        label="Alternative Accordion"
        mode="alternative"
        isExpanded={isExpanded}
        onChange={onChange}
        margin="medium"
        padding="medium"
      >
        <div>
          Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse
          malesuada lacus ex, sit amet blandit leo lobortis eget.
        </div>
      </DxcAccordion>
    </div>
  );
}`;

const scope = {
  DxcAccordion,
  useState
};

export default { code, scope };
