dropdowns-js 1.1.1 → 1.1.2

package/README.md

@@ -243,132 +243,6 @@ export default function MyComponent4() {
     );
 }
 ```  
-## 8. Multiple dropdown usage example
-```
-export default function MyComponent5() {
-    const [output, setOutput] = useState();
-     /* A dropdown whose collection data gets updated, must be given a key attribute, so as to update 
-        it (key) to cause re-render upon the update of collection data. */
-    const [dropdownKey2, setDropdownKey2] = useState(0);
-    const keyStep = .000001;
-
-    const { 
-        addCollection,
-        collectionExists,
-        updateCollection,
-        getSelected
-    } = useCollectionsContext();
-
-    const drivers = [
-        { fullName: "Thabo Mokoena", licenceCode: "B", id: "771217" },
-        { fullName: "Naledi Khumalo", licenceCode: "EB", id: "850412" },
-        { fullName: "Sipho Dlamini", licenceCode: "C1", id: "861802" },
-        { fullName: "Ayesha Patel", licenceCode: "B", id: "500101" },
-        { fullName: "Johan van der Merwe", licenceCode: "EC", id: "620401" },
-        { fullName: "Lerato Molefe", licenceCode: "A", id: "901012" },
-        { fullName: "Sibusiso Nkosi", licenceCode: "EC1", id: "910512" },
-        { fullName: "Michelle Adams", licenceCode: "B", id: "901012" },
-        { fullName: "Kagiso Tshepe", licenceCode: "C", id: "920115" },
-        { fullName: "Pieter Botha", licenceCode: "A1", id: "960401" },
-        { fullName: "Nomvula Zungu", licenceCode: "B", id: "0792346789" },
-        { fullName: "Riaan Pretorius", licenceCode: "EB", id: "0824567812" },
-        { fullName: "Mandla Sithole", licenceCode: "C1", id: "0735678910" },
-        { fullName: "Fatima Khan", licenceCode: "B", id: "0846789123" },
-        { fullName: "Tshepo Madiba", licenceCode: "EC1", id: "0817890234" },
-        { fullName: "Andre Nel", licenceCode: "A", id: "0728901345" },
-        { fullName: "Zanele Mthembu", licenceCode: "B", id: "0769012456" },
-        { fullName: "Imran Desai", licenceCode: "C", id: "0740123567" },
-        { fullName: "Charlene Jacobs", licenceCode: "EB", id: "0831234678" },
-        { fullName: "Vusi Hlongwane", licenceCode: "EC", id: "0712345789" }
-    ];
-
-    useEffect(()=> {
-        if (!collectionExists("DRIVING_CODES")) {
-            const drivingCodes = [
-                "A", "A1", "EC", "EC1", "C", "C1", "B", "EB"
-            ];
-            // Create DRIVING_CODES collection sorted in ascending order.
-            addCollection("DRIVING_CODES", // collection name
-                          drivingCodes, // collection data
-                          1, // maximum number of selections
-                          true, // primitive type data
-                          'asc'); // asc - sort order 
-        }
-        if (!collectionExists("DRIVERS")) {
-            // Create a drivers collection sorted in ascending order. Initially empty pending the selection of a driving code.
-
-            addCollection("DRIVERS",
-                            [], // empty
-                            5, // allow max 5 selections
-                            false, // object type data.
-                            'fullName asc'); 
-        }
-    }, []);
-
-    /**Respond when the user has chosen a driving licence code */
-    function drivingCodeSelected() {
-        // Obtain the selected driving codes.
-        const selectedDrivingCodes = getSelected("DRIVING_CODES");
-
-        // Create a string array of driving codes.
-        const strSelectedCodes = selectedDrivingCodes; // Expecting a size 1 array
-        const selectedCode = strSelectedCodes[0];
-
-        /*=========Update collection according to selected driving licence code=====*/
-        const updateData = drivers.filter(driver=> {
-            return selectedCode === driver.licenceCode;
-        });
-        updateCollection("DRIVERS", updateData);
-        /*============================================================================*/
-
-        // Force the re-render the drivers MultiselectionDropdownObj, since its data has been updated.
-        setDropdownKey2(dropdownKey2 + keyStep);
-    }
-
-    function driversSelected() {
-        const selectedDrivers = [...getSelected(collectionNames.DRIVERS)].map(driver => driver.fullName); // Array
-        setOutput(selectedDrivers.join(', ')); // List of selected drivers' names.
-    }
-
-    return (
-        <div className='container' style={{padding: '5px', backgroundColor: 'green'}}>
-            <h1>MultiSelectionDropdownObj Example</h1>
-            <p>Select an interest, and then your topic</p>
-            <div style={{padding: '2px', display: 'flex'}}> 
-                <label style={{width: '100px'}}>Lic. Codes</label>
-                <MultiSelectionDropdownObj label='Driving Licence Codes'
-                    collectionName={collectionNames.DRIVING_CODES}
-                    valueName='code'
-                    displayName='description'
-                    onItemsSelected={drivingCodeSelected}
-                    isDisabled={false}
-                    dropdownStyle={{color: '#000', backgroundColor: '#66ff66'}}
-                    buttonStyle={{color: '#fff', backgroundColor: '#008000'}} />
-            </div>
-
-            <div style={{padding: '2px', display: 'flex'}}> 
-                <label style={{width: '100px'}}>Drivers</label>
-                <MultiSelectionDropdownObj
-                    key={dropdownKey2}
-                    collectionName={collectionNames.DRIVERS}
-                    label='Drivers'
-                    valueName='id'
-                    displayName='fullName'
-                    onItemsSelected={driversSelected}
-                    dropdownStyle={{color: '#000', backgroundColor: '#66ff66'}}                     
-                    buttonStyle={{color: '#fff', backgroundColor: '#008000'}} />               
-            </div>
-
-            {output &&  
-              <div style={{ marginTop: '10px', padding: '5px' }}>
-                  {output}
-              </div>
-            }
-
-        </div>
-    );
-}
-```
 
 ## License
 MIT

package/package.json

@@ -3,7 +3,7 @@
   "author": "ITA",
   "description": "A React library providing customizable search dropdown components with single and multi-selection capabilities.",
   "private": false,
-  "version": "1.1.1",
+  "version": "1.1.2",
   "type": "module",
   "main": "./dist/dropdowns-js.cjs.js",
   "module": "./dist/dropdowns-js.es.js",