| 1 | {"version":3,"sources":["ListAccordionGroup.tsx"],"names":["React","ListAccordionGroupContext","createContext","ListAccordionGroup","expandedId","expandedIdProp","onAccordionPress","children","setExpandedId","useState","undefined","onAccordionPressDefault","newExpandedId","currentExpandedId","displayName"],"mappings":"AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAsBA,OAAO,MAAMC,yBAAyB,gBACpCD,KAAK,CAACE,aAAN,CAAmD,IAAnD,CADK;AAGP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACA,MAAMC,kBAAkB,GAAG,QAId;AAAA,MAJe;AAC1BC,IAAAA,UAAU,EAAEC,cADc;AAE1BC,IAAAA,gBAF0B;AAG1BC,IAAAA;AAH0B,GAIf;AACX,QAAM,CAACH,UAAD,EAAaI,aAAb,IAA8BR,KAAK,CAACS,QAAN,CAElCC,SAFkC,CAApC;;AAIA,QAAMC,uBAAuB,GAAIC,aAAD,IAAoC;AAClEJ,IAAAA,aAAa,CAAEK,iBAAD,IACZA,iBAAiB,KAAKD,aAAtB,GAAsCF,SAAtC,GAAkDE,aADvC,CAAb;AAGD,GAJD;;AAMA,sBACE,oBAAC,yBAAD,CAA2B,QAA3B;AACE,IAAA,KAAK,EAAE;AACLR,MAAAA,UAAU,EAAEC,cAAc,IAAID,UADzB;AACqC;AAC1CE,MAAAA,gBAAgB,EAAEA,gBAAgB,IAAIK;AAFjC;AADT,KAMGJ,QANH,CADF;AAUD,CAzBD;;AA2BAJ,kBAAkB,CAACW,WAAnB,GAAiC,qBAAjC;AAEA,eAAeX,kBAAf","sourcesContent":["import * as React from 'react';\n\ntype Props = {\n /**\n * Function to execute on selection change.\n */\n onAccordionPress?: (expandedId: string | number) => void;\n /**\n * Id of the currently expanded list accordion\n */\n expandedId?: string | number;\n /**\n * React elements containing list accordions\n */\n children: React.ReactNode;\n};\n\nexport type ListAccordionGroupContextType = {\n expandedId: string | number | undefined;\n onAccordionPress: (expandedId: string | number) => void;\n} | null;\n\nexport const ListAccordionGroupContext =\n React.createContext<ListAccordionGroupContextType>(null);\n\n/**\n * List.AccordionGroup allows to control a group of List Accordions. `id` prop for List.Accordion is required in order for group to work.\n * List.AccordionGroup can be a controlled or uncontrolled component. The example shows the uncontrolled version.\n * At most one Accordion can be expanded at a given time.\n *\n * <div class=\"screenshots\">\n * <img class=\"medium\" src=\"screenshots/list-accordion-group.png\" />\n * </div>\n *\n * ## Usage\n * ```js\n * import * as React from 'react';\n * import { View, Text } from 'react-native';\n * import { List } from 'react-native-paper';\n *\n * const MyComponent = () => (\n * <List.AccordionGroup>\n * <List.Accordion title=\"Accordion 1\" id=\"1\">\n * <List.Item title=\"Item 1\" />\n * </List.Accordion>\n * <List.Accordion title=\"Accordion 2\" id=\"2\">\n * <List.Item title=\"Item 2\" />\n * </List.Accordion>\n * <View>\n * <Text>\n * List.Accordion can be wrapped because implementation uses React.Context.\n * </Text>\n * <List.Accordion title=\"Accordion 3\" id=\"3\">\n * <List.Item title=\"Item 3\" />\n * </List.Accordion>\n * </View>\n * </List.AccordionGroup>\n * );\n *\n * export default MyComponent;\n *```\n */\nconst ListAccordionGroup = ({\n expandedId: expandedIdProp,\n onAccordionPress,\n children,\n}: Props) => {\n const [expandedId, setExpandedId] = React.useState<\n string | number | undefined\n >(undefined);\n\n const onAccordionPressDefault = (newExpandedId: string | number) => {\n setExpandedId((currentExpandedId) =>\n currentExpandedId === newExpandedId ? undefined : newExpandedId\n );\n };\n\n return (\n <ListAccordionGroupContext.Provider\n value={{\n expandedId: expandedIdProp || expandedId, // component can be controlled or uncontrolled\n onAccordionPress: onAccordionPress || onAccordionPressDefault,\n }}\n >\n {children}\n </ListAccordionGroupContext.Provider>\n );\n};\n\nListAccordionGroup.displayName = 'List.AccordionGroup';\n\nexport default ListAccordionGroup;\n"]} |